Dans ce tutoriel Photoshop en vidéo, nous allons apprendre à créer un template Photoshop avec un background vidéo axé produit. Nous mettrons en avant une marque, un accessoire… (ici la chaussure sera pris pour thème dans ce tutoriel) en simulant l’intégration d’une video en arrière plan.

Ce template Photoshop de page sera conçu de façon méthodique afin de faciliter son intégration à l’aide du framework de Twitter Bootstrap lors d’un prochain tutoriel où nous apprendrons à traiter la video et ses formats grâce au html5.

template site background video html5

Programme du tuto template avec un background vidéo

  • Créer, marger et repérer un gabarit de page
  • Créer une barre de navigation avec intégration d’un logo et d’un menu
  • Mettre en situation un background vidéo avec superposition d’un texte
  • Créer un ghost button
  • Mettre en avant une phrase d’accroche
  • Simuler les meilleures ventes du mois avec ajout d’une photo et d’une description
  • Mettre en situation les widgets des réseaux sociaux Facebook et Twitter
  • Créer un footer (pied de page minimaliste)

Ce tutoriel est destiné aux débutants et peut être suivi à partir de la version CS6 de Photoshop.