Webdesign 5 min pour combattre 5 idées reçues

Transcription

1 1 Webdesign

2 2 Idée reçue numéro 1 # "Je dois rendre visible mes messages clefs sans devoir scroller "

3 3 Idée reçue numéro 1 # Je dois rendre visible Fin de la tendance à tout placer au dessus de mes la messages ligne de flottaison clefs sans devoir scroller

4 4 Idée reçue numéro 1 # Je dois rendre visible Fin des sliders en Home Page mes messages clefs Le taux de clics du 2e slide d un carrousel < à 2% sans devoir scroller

5 5 Le webdesign mise sur les sites en scroll et «one page» Influencé par les réseaux sociaux, le mobile et sa navigation tactile, le scroll s est développé sur un grand nombre de sites web. Home page très épurée Mise en avant d une photo ou d une vidéo Mise en avant d un seul message clef à la fois

6 Exemple de site monopage en scroll

7 7 Idée reçue numéro 2 # "Je dois définir la taille moyenne des écrans de ma cible"

8 8 Idée reçue numéro 2 # "Je dois définir la taille Fin des sites qui se contiennent dans une résolution définie moyenne des écrans de ma cible"

9 9 Développement des sites en responsive design pour une adaptation à tous les terminaux de manière plus simple et à moindre coût (comparé au développement de plusieurs applications) Le responsive design consiste à développer un site qui s adapte à l outil avec lequel il est lu.

10 10 Idée reçue numéro 3 # «Toutes les informations sur ma société doivent se trouver en texte sur la home page"

11 11 Moins de blabla, ON SE TAIT? Oui et Non! On essaye d en dire moins pour ménager le lecteur et lui donner l information essentielle qu il recherche. On en dit tout autant mais en mettant en scène son discours pour qu il soit plus digeste et attractif : moins de texte, place à l image, aux pictogrammes, aux illustrations, aux démonstrations, aux vidéos, à la datavisu

12 12 De plus en plus de sites avec un background en image

13 13 De plus en plus de sites avec une large image en background Le site de Sagmeister & Walsh dispose d images aléatoires. Le menu figure directement sur les images.

14 14 Le contenu peut être simplifié par des pictogrammes de la datavisualisation

15 15 Idée reçue numéro 4 # «Je choisis une typo simple pour le web compatible sur tous les navigateurs"

16 16 LA TYPO, PLUS QUE DES LETTRES Au grand bonheur des designers, les fonts de toutes sortes deviennent compatibles avec les navigateurs. Google Chrome et Firefox ont toujours cherché des solutions pour améliorer le rendu visuel et l'apparition de ces nouvelles typographies.

17 17 La typo, bien plus que des lettres : un rendu visuel plein de sens Les fonts permettent d ajouter un côté plus unique aux créations, d exprimer sa personnalité de marque, son positionnement, un message ou des valeurs.

18 18 La typo, bien plus que des lettres : un rendu visuel plein de sens

19 19 Idée reçue numéro 5 # "Je travaille les représentations graphiques le plus proche possible de la réalité pour donner plus facilement des repères à l utilisateur"

20 20 Idée reçue numéro 5 # "Je travaille les représentations graphiques le plus proche possible de la réalité moyenne pour donner des écrans plus facilement de ma cible" des repères à l utilisateur" "Je dois définir la taille Fin du Skeuomorphisme, place au flat design mais avec un léger retour en arrière avec le material design

21 21 SKEUOMORPHISME VS FLAT DESIGN

22 22 PLACE AU FLAT DESIGN, ENCORE EN 2014 ios6 ios7

23 23 EN 2015, PLACE AU MATERIAL DESIGN

24 24 Le material design en vidéo

25 25 Quizz: Skeuomorphisme, flat ou material design?

26 26 Quizz: Skeuomorphisme, flat ou material design?

27 27 Quizz: Skeuomorphisme, flat ou material design?

28 28 Quizz: Skeuomorphisme, flat ou material design? Flat Design Material Design

29 Merci de votre attention N hésitez pas à nous contacter Cécile Lorenzini Directrice marché Luxembourg clorenzini@vanksen.com L équipe Webdesgin Vanksen