{"id":14643,"date":"2019-11-08T10:30:47","date_gmt":"2019-11-08T09:30:47","guid":{"rendered":"https:\/\/graphiste.com\/blog\/?p=14643"},"modified":"2025-08-19T17:15:34","modified_gmt":"2025-08-19T15:15:34","slug":"mobile-guide-ultime-reussir-designs","status":"publish","type":"post","link":"https:\/\/graphiste.com\/blog\/mobile-guide-ultime-reussir-designs\/","title":{"rendered":"Mobile\u00a0: le guide ultime pour r\u00e9ussir tous vos designs"},"content":{"rendered":"

Vous n\u2019\u00eates peut-\u00eatre pas sans savoir que depuis le 1er juillet 2019, tout nouveau site est g\u00e9r\u00e9 par l\u2019index mobile-first<\/a> de google.<\/p>\n

Qu\u2019est-ce que cela signifie ? Depuis l\u2019apparition des smartphones et du web mobile, on pensait \u00ab version standard et version mobile \u00bb. <\/em><\/p>\n

Aujourd\u2019hui, il faut penser \u00ab version standard = version mobile \u00bb<\/em>, le desktop \u00e9tant pass\u00e9 au second plan. A cet effet, voici quelques suggestions de design pour sites et applications mobiles que vous pourrez r\u00e9utiliser pour vos propres projets.<\/p>\n

 <\/p>\n

Les designs g\u00e9n\u00e9raux<\/h2>\n

Splash screen<\/h3>\n
\"gif
Cr\u00e9ation par Tubik<\/a><\/figcaption><\/figure>\n

Vous le savez tout autant que moi, la premi\u00e8re impression est capitale, dans le design tout comme dans la vie en g\u00e9n\u00e9ral. Lorsque l\u2019exp\u00e9rience utilisateur est agr\u00e9able d\u00e8s le d\u00e9but, vous avez plus de chances que votre projet soit populaire.<\/p>\n

Le Splash screen<\/strong> est la premi\u00e8re image que voient les utilisateurs au lancement de l\u2019application. G\u00e9n\u00e9ralement minimalistes, elles contiennent le nom de l\u2019application, son logo et parfois son slogan.<\/p>\n

Ne les n\u00e9gligez pas, elles sont la porte d\u2019entr\u00e9e<\/strong> vers une exp\u00e9rience utilisateur digne de ce nom.<\/p>\n

Ne le faites pas durer plus de 4-8 secondes si possible et ajoutez au besoin une barre de chargement pour que les impatients sachent lorsque l\u2019application sera pr\u00eate.<\/p><\/blockquote>\n

<\/h2>\n

Les tutoriels<\/h2>\n

Sur site web comme sur application, les tutoriels sont un moyen efficace de guider l\u2019utilisateur \u00e0 travers votre interface lors de sa premi\u00e8re utilisation pour qu\u2019il ne se sente pas perdu.<\/p>\n

\"\"
Cr\u00e9ation par Asaf sur Dribbble<\/a><\/figcaption><\/figure>\n

Particuli\u00e8rement utile pour les designs riches en informations, ils vous \u00e9viteront de voir certaines personnes abandonner l\u2019id\u00e9e de parcourir votre site\/app faute d\u2019explication sur que faire et comment le faire. Vous pouvez \u00e9ventuellement utiliser une mascotte<\/a> pour simuler une conversation\u2026<\/p>\n

Mais gardez vos textes courts, utiles et lisibles.<\/p>\n

Accueil<\/h3>\n

La page d\u2019accueil<\/a> (Home en anglais) est un aspect crucial de votre design, puisque c\u2019est certainement l\u2019endroit o\u00f9 se retrouvera le plus souvent votre utilisateur.<\/p>\n

\"\"
Cr\u00e9ation par Codest sur Dribbble<\/a><\/figcaption><\/figure>\n

Elle sera diff\u00e9rente pour une application ou un site :<\/p>\n