Bundle : Créer un site Internet avec bandeau vidéo
-21% de réduction
Voici la première partie d’un tuto en vidéo consacré à la création d’un template de page Web avec intégration d’une vidéo en arrière plan.
Cette 1ère partie dédiée à la création d’un template de site Internet avec Photoshop, sera l’occasion de vous apprendre à être méthodique dans la façon de travailler, de vous organiser, afin d’intégrer au mieux ce template en HTML à l’aide du Framework de Twitter Bootstrap lors de la 2ème partie de ce tutoriel.
Le cours aura pour thème la chaussure afin de mettre en valeur un produit, une marque, un accessoire à travers une vidéo qui se jouera automatiquement en arrière plan de votre site Internet.
Au programme de ce tuto Webdesign sous Photoshop, nous allons apprendre à :
- Installer une police (font)
- Créer un gabarit de page
- Créer des repères et marges
- Ranger ses calques dans des dossiers
- Créer facilement un logo avec du texte
- Créer un menu
- Simuler l’intégration d’une vidéo en background avec un texte superposé
- Créer un ghost button
- Mettre une phrase d’accroche en avant
- Intégrer des fiches produits avec photo et description
- Créer une sidebar et simuler les widgets de Facebook (likebox) et de Twitter (last tweet)
- Créer un footer (pied de page)
Ce tuto Photoshop webdesign peut-être suivi à partir de la version CS6 de Photoshop et est destiné à un public débutant. Pour plus d’informations concernant cette formation Photoshop, je vous invite à regarder l’extrait vidéo. Le résultat final de ce cours en html vous sera dévoilé.
Bon tuto à tous.
Table des matières de cette formation Photoshop (durée : 1h01m)
-
- Installation des fonts 00:02:15
- Création de la barre, du logo et du menu 00:14:33
- Simulation de la vidéo en arrière plan 00:13:28
- Mise en avant d'une accroche 00:05:48
- Création des fiches produits avec photo et description 00:07:22
- Création de la sidebar et widget Facebook & Twitter 00:12:15
- Création du footer et fin 00:05:33
- Fichiers sourcestélécharger
- Certificat
Formateur : Damien Gallez
-
Tuto simple et clair, mais vraiment trop basique je trouve... Il manque énormément d'informations, notamment les notions autour des règles à respecter pour faciliter l'intégration des maquettes pour un développeur. C'est pourquoi je retire 1 étoile car sinon pour le niveau débutant c'est clairement expliqué.
-
Simple, efficace et clair ! Très bonne formation.Merci
-
Toujours aussi convivial et pédagogue. Que du bon. Comme toujours ;)
-
Avec quelle version de logiciel ce tuto est-il compatible ?Photoshop CS6
-
Quel est le niveau requis pour suivre ce tuto ?débutant
-
Est-ce que l'intégration HTML est abordée dans ce tuto ?
Non. Il s'agit d'un tuto axé webdesign seulement. La partie intégration en HTLM et CSS est proposée dans une seconde partie.
-
Que contient le fichier source ?
Le fichier PSD final ainsi que les éléments utilisés lors de ce tuto.
-
Bonjour Damien,
l'intégration est elle en Responsive Design ?Bonjour, oui à l'aide du framework de bootstrap :) -
Bonjour,
Quelle est la suite de ce tuto?Intégration html vidéo etc....
MerciBonjour, la suite sera disponible prochainement. Nous avons un planning assez chargé en ce moment qui nous oblige à mettre en pause l'enregistrement de tuto. On fait au plus vite !
note moyenne
avis laissés