Atelier Webdesign : flat design + responsive design
ERROR
00:00
00:00

TUTO Atelier Webdesign : flat design + responsive design

Julien Pons
14,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Formez-vous au Flat Design. C'est la grande tendance graphique du moment. Après une décennie, ou presque, de dégradés et d'ombre portée, le web se met à l'heure de la simplicité. Et de la lisibilité, ce qui n'est pas un luxe.
Ce tuto Webdesign avec Photoshop va vous apprendre à créer une maquette de site web de toutes pièces, en suivant ce style graphique. Un logo sera réalisé dans Illustrator, ainsi qu'une mini-charte graphique pour décliner tout le site en fonction d'une règle visuelle simple et efficace ! Laissez-vous guider :)
Imaginez un site Responsive !
Les périphériques connectés sont aujourd'hui nombreux. Il y a plus d'internautes sur mobile que sur client desktop (ordinateur de bureau, ou portable). Il faut donc prendre en compte cette donnée lors de la création de la maquette de votre site, afin d'optimiser la mise en page en fonction de chaque périphérique. Vous verrez dans ce tuto la méthode pour créer une maquette de site responsive web design.
Ce tuto de 3H vous expliquera les techniques de pros pour créer un design web de toutes pièces dans Photoshop : création d'en-tête, boutons, bas de page... Il est truffé de techniques, astuces et raccourcis pour améliorer votre productivité :

  • Comment ranger efficacement son PSD
  • Comment passer d'un design à l'autre en un clic ?
  • Comment exporter toutes les pages d'un site d'un coup à l'aide des compositions de calques
  • et bien plus encore

De plus, le fichier source PSD avec tous les calques est fourni ! Vous pourrez vous entraîner et comparer votre résultat avec celui du formateur. À l’issue de la formation, un exercice vous est proposé.

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Mise en place
Leçon 2
Fin du design de la homepage
Leçon 3
Homepage version smartphone
Leçon 4
Page d'intérieur
Leçon 5
Exo pratique : version tablette

Plan détaillé du cours

Leçon 1Mise en place
31m46s
Leçon 2Fin du design de la homepage
49m36s
Leçon 3Homepage version smartphone
36m03s
Leçon 4Page d'intérieur
49m57s
Leçon 5Exo pratique : version tablette
14m39s

Aperçus

Avis des apprenants

Détail des avis
452
Apprenants
11
Commentaires
4,8/5
Note moyenne
5/5
10
4/5
1
3/5
1
2/5
0
1/5
0
Levieuxt
Levieuxt
Publié le 04/05/2020
Tuto très intéressant et très utile !
Julien Hanel
Julien Hanel
Publié le 22/04/2020
Efficace, bon formateur
Samih Bounouar
Samih Bounouar
Publié le 01/07/2016
Je sais que ça a déjà été expliqué dans les commentaires, mais très instructif et pro, c'est une bonne vidéo.

Vos questions sur le cours

Avec quelle version de logiciel ce tuto est-il compatible ?

Photoshop CC, Photoshop CS5, Photoshop CS6

Bonjour, est-ce qu'à la fin de ce tuto nous avons créé un site web qui fonctionne ? Lien actifs, navigation de page en page, possibilité d'intégrer des photos, des vidéos ? Ou l'utilisation de Photoshop c'est juste pour la création du design ? Faut-il ensuite utiliser Dreamweaver pour finaliser le site ?

Bonjour, Ce tuto n'aborde que le design du site dans Photoshop, afin de comprendre comment créer un site qui s'adapte sur tous les supports. La partie intégration (html5, css, js) n'est pas traitée.

Quel est le niveau requis pour suivre ce tuto ?

débutant

Attendez ! 🤗

Accédez à plus de 1330 tutos gratuits

Notre politique de protection des données