![\"Produits](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/Produits-Braun-Dieter-Ram-vs-Produit-Apple-Jonathan-Ive.png\")
Voyez-vous m\u00eame \u00e0 quel point certains des produits du designer en chef d\u2019Apple, Jonathan Ive, ressemblent \u00e0 ceux de Ram.<\/p>\n
Mais revenons \u00e0 ce qui nous int\u00e9resse\u00a0: les 10 commandements de Dieter Ram. M\u00eame s\u2019ils ont \u00e9t\u00e9 \u00e9crits dans les ann\u00e9es 70, ils n\u2019ont pas pris une ride.<\/p>\n
Pour vous faire une id\u00e9e du monsieur, voici un extrait d\u2019un de ses discours les plus populaires\u00a0:<\/p>\n
\u00ab\u00a0Mesdames et Messieurs, <\/i>le design est un sujet tr\u00e8s populaire aujourd’hui<\/i><\/b>. Ce n’est pas \u00e9tonnant car, face \u00e0 la concurrence croissante, <\/i>le design est souvent le seul \u00e9l\u00e9ment de diff\u00e9renciation du produit qui soit r\u00e9ellement perceptible par l’acheteur<\/i><\/b>.<\/i><\/p>\n
Je suis convaincu qu’<\/i>un design bien pens\u00e9 est d\u00e9terminant pour la qualit\u00e9 d’un produit<\/i><\/b>. Un produit mal con\u00e7u est non seulement plus laid qu’un produit bien con\u00e7u, mais il a aussi moins de valeur et d’utilit\u00e9. Pire encore, il peut \u00eatre intrusif.<\/i><\/p>\n
….<\/i><\/p>\n
Je suis convaincu que les gens s’int\u00e9ressent \u00e0 ce que nous faisons chez Vitsoe car nos produits sont utiles\u202f; <\/i>je pense qu’ils appr\u00e9cient \u00e9galement l’esth\u00e9tique qui en d\u00e9coule<\/i><\/b>. Ces qualit\u00e9s sont le r\u00e9sultat d’une r\u00e9solution progressive et intelligente des probl\u00e8mes.<\/i><\/p>\n
<\/p>\n
La fonctionnalit\u00e9 doit \u00eatre au centre d’une bonne conception<\/i><\/b>. Un produit doit \u00eatre fonctionnel en soi, mais il doit aussi fonctionner dans le cadre d’un syst\u00e8me plus large : la maison. Le syst\u00e8me d’\u00e9tag\u00e8res universelles 606 de Vitsoe doit son succ\u00e8s \u00e0 sa grande fonctionnalit\u00e9 et \u00e0 sa capacit\u00e9 \u00e0 s’adapter \u00e0 n’importe quel environnement <\/i>\u00bb<\/p>\n
Si vous voulez lire son discours complet, voici une retranscription compl\u00e8te en anglais<\/a>.<\/p>\n Ce discours peut sembler tout droit sorti de la bouche d\u2019un ux designer ou d\u2019un concepteur web lors d\u2019une Keynote sur l\u2019ergonomie ou le responsive design d\u2019une application mobile, et pourtant\u00a0!<\/p>\n Essayez de deviner de quand ce discours date ?<\/p>\n \u2026<\/p>\n Vous avez dit au d\u00e9but des ann\u00e9es 2000\u202f? M\u00eame pas.<\/p>\n Il date de 1976, soit de presque 50 ans. De plus, il ne parlait ni de graphisme d\u2019un projet web, ni de design d\u2019interface, mais plut\u00f4t d\u2019appareils \u00e9lectrom\u00e9nagers et de meubles.<\/p>\n L\u2019auriez-vous su si nous ne vous l\u2019avions pas dit\u00a0?<\/p>\n Sans plus tarder, attaquons-nous aux 10 principes d\u2019un bon design selon Ram et voyons comment l\u2019appliquer aux interfaces de vos logiciels.<\/p>\n Chers concepteurs et conceptrices d\u2019interfaces web, voici les 10 caract\u00e9ristiques d\u2019un bon design selon le designer allemand Dieter Ram\u00a0:<\/p>\n D\u00e9taillons-les un peu plus.<\/p>\n Innover rien que par le design de son produit, le r\u00eave de plus d\u2019un directeur artistique.<\/p>\n Et certains y arrivent.<\/p>\n C\u2019est ce qu\u2019a fait la plateforme de blogging medium<\/a>. En soi, elle ne propose aucune fonctionnalit\u00e9 suppl\u00e9mentaire par rapport \u00e0 ses concurrents.<\/p>\n En tant qu\u2019auteur, vous pouvez cr\u00e9er des textes, les publier et les partager.<\/p>\n Vous pouvez aussi le faire sur d\u2019autres plateformes de gestion de contenu et CMS. LinkedIn Pulse, LiveJournal, Webnode ou encore Blogger de Google, etc.<\/p>\n D\u2019ailleurs, certaines d\u2019entre elles vous offrent plus de possibilit\u00e9s de partager vos cr\u00e9ations avec votre r\u00e9seau (coucou LinkedIn).<\/p>\n Alors, pourquoi Medium est autant pris\u00e9 par les \u00e9crivains anglo-saxons\u202f? \u00c0 cause d\u2019une seule diff\u00e9rence : son design d\u2019interaction.<\/p>\n Oui oui, vous avez bien lu. La plateforme de blogging lanc\u00e9e en 2012 fait de l\u2019ombre aux mastodontes comme Facebook ou WordPress uniquement gr\u00e2ce \u00e0 son design. Voici quelques-uns de ses atouts\u00a0:<\/p>\n Tout ceci contribue \u00e0 am\u00e9liorer la qualit\u00e9 de l\u2019exp\u00e9rience utilisateur des producteurs de contenus et autres utilisateurs du site.<\/p>\n Pour en revenir \u00e0 Dieter Ram, il entend par innovation le fait qu\u2019il est th\u00e9oriquement impossible d\u2019\u00e9puiser les possibilit\u00e9s de design. La cause \u00e9tant que le d\u00e9veloppement technologique continuera d\u2019offrir de nouvelles mani\u00e8res de concevoir un produit.<\/p>\n Selon Ram, un bon design met l\u2019accent sur l\u2019utilit\u00e9 d\u2019un produit tout en n\u00e9gligeant ce qui pourrait l\u2019affaiblir.<\/p>\n Pour que le design de vos pages fasse mouche, votre consommateur doit le valider selon au moins trois crit\u00e8res\u00a0:<\/p>\n Rien que le design rat\u00e9 d\u2019une page peut pousser un internaute \u00e0 d\u00e9tester votre logiciel ou votre application. Le pire \u00e9tant que si vous lui demandez pourquoi il n\u2019aime pas votre service, il sera incapable de vous r\u00e9pondre.<\/p>\n Bon, en nous relisant, dis comme ceci, \u00e7a a l\u2019air assez abstrait, alors voici un exemple de design qui ne valide pas ce principe\u00a0:<\/p>\n Cette animation est un concept d\u00e9velopp\u00e9 par l\u2019UX UI designer Vladyslav Tyzun et disponible sur sa page Dribbble.<\/a><\/p>\n Il s\u2019agit d\u2019un concept d\u2019email de r\u00e9ception d\u2019une transaction PayPal.<\/p>\n Est-ce que ce concept est beau\u00a0? Oui.<\/p>\n Est-ce qu\u2019il est utile\u00a0? Oui.<\/p>\n Est-ce qu\u2019il est fonctionnel\u00a0? Non, pas tout \u00e0 fait.<\/p>\n En effet, si vous chronom\u00e9trez l\u2019animation, vous verrez qu\u2019elle s\u2019ex\u00e9cute en 3.5 secondes. Pour une transaction, \u00e7a peut passer, mais imaginez le vendeur qui doit en voir 1000 par jour.<\/p>\n Alors, comment r\u00e9ussir \u00e0 cr\u00e9er un design utile\u00a0? Pour cela, vous devez d\u2019abord d\u00e9finir le cahier des charges de votre future application<\/a>.<\/p>\n Ok, \u00e7a a l\u2019air basique.<\/p>\n C\u2019est la partie \u00ab\u00a0artiste\u00a0\u00bb des designers qui s\u2019exprime ici. Mais vous serez surpris de toutes les fois o\u00f9 des d\u00e9veloppeurs web ont confondu la beaut\u00e9 avec autre chose.<\/p>\n En voici un top 10 qui va vous piquer les yeux<\/a>.<\/p>\n Par cons\u00e9quent, quelles que soient vos contraintes, faites toujours un site \u00e9l\u00e9gant.<\/p>\n Et pour \u00eatre s\u00fbr de ne pas faire de faux-pas, il existe un secret connu de tous les d\u00e9veloppeurs et webdesigner\u00a0: les interfaces minimalistes.<\/p>\n D\u2019ailleurs, voici un guide complet sur la cr\u00e9ation d\u2019interfaces et de pages web minimalistes<\/a>. En le lisant, vous apprendrez comment ma\u00eetriser et appliquer le \u00ab\u00a0Less is more\u00a0\u00bb sans cr\u00e9er des oc\u00e9ans de vides dans vos design web.<\/p>\n Lorsqu\u2019un internaute ou un mobinaute ouvre votre application, il doit comprendre clairement ce qu\u2019il doit faire.<\/p>\n Hors de question qu\u2019ils suivent un tutoriel pour comprendre comment utiliser votre app. Et si c\u2019est le cas, soyez s\u00fbr que votre taux de d\u00e9sinstallation va bondir en fl\u00e8che sur les magasins d\u2019application.<\/p>\n Encore une fois, m\u00eame si \u00e7a semble basique, plus d\u2019un web-designer ont rat\u00e9 cet exercice. \u00c0 l\u2019instar de celui qui a con\u00e7u les interfaces du site web de l\u2019\u00e9cole d\u2019art de Yale<\/a>.<\/p>\n Honn\u00eatement, combien de secondes vous ont-ils fallu pour comprendre l\u2019objectif et l\u2019int\u00e9r\u00eat du site\u00a0? Sans parler des couleurs fortement contrast\u00e9es.<\/p>\n Bonus : assurez-vous que l\u2019ergonomie de vos interfaces soit irr\u00e9prochable.<\/p>\n Ce qui nous conduit au point suivant.<\/p>\n Le minimalisme.<\/p>\n Que vous soyez designer, d\u00e9veloppeur, ou de n\u2019importe quels autres m\u00e9tiers du web, vous en avez sans doute d\u00e9j\u00e0 entendu parler plusieurs fois.<\/p>\n La raison est simple\u00a0: c\u2019est un design discret et qui n\u2019attire pas l\u2019\u0153il sur lui-m\u00eame (ce qui n\u2019est pas le cas de l\u2019exemple plus haut, non\u00a0?) ).<\/p>\n En r\u00e9alit\u00e9, pour que votre design soit efficace et r\u00e9ussi, votre utilisateur ne doit m\u00eame pas se rendre compte de son existence. Ni des efforts que vous avez d\u00e9ploy\u00e9s pour arriver \u00e0 ce r\u00e9sultat.<\/p>\n Tout doit lui sembler naturel, comme une \u00e9vidence (alors que vous et moi savons que \u00e7a ne l\u2019est pas).<\/p>\n Il n\u2019y a rien de plus \u00e9nervant que les interfaces qui tentent de vous manipuler.<\/p>\n Sceptique\u00a0? Souvenez-vous de votre r\u00e9action \u00e0 chaque fois que vous tombez sur la page d\u2019un logiciel qui vous promet une p\u00e9riode d\u2019essai gratuite. Pour qu\u2019ensuite, d\u00e8s que vous cliquez sur \u00ab\u00a0t\u00e9l\u00e9charger\u00a0\u00bb ou \u00ab\u00a0s\u2019inscrire\u00a0\u00bb, il vous redirige vers un paywall ou sur sa page de pricing.<\/p>\n Typiquement, le site web ou l\u2019application qui vous fait \u00e7a a \u00e9t\u00e9 con\u00e7u pour vous tromper. Et sans surprise, vous avez tourn\u00e9 vos talons num\u00e9riques et lui avez claqu\u00e9 la porte.<\/p>\n 25 ans avant l\u2019av\u00e8nement de la bulle des dots.com, Dieter Ram mettait d\u00e9j\u00e0 l\u2019accent sur ce point\u00a0: un design ne doit pas promettre l\u2019impossible aux utilisateurs finaux.<\/p>\n Il avait beau parler de design de mobilier et de machine d\u2019\u00e9lectrom\u00e9nager, \u00e7a fait toujours mouche.<\/p>\n Vous souvenez-vous du skeuomorphisme\u00a0? Cette tendance graphique qui consiste \u00e0 calquer le design ou le logo d\u2019une application sur son \u00e9quivalent r\u00e9el\u00a0?<\/p>\n Jusqu\u2019\u00e0 iOS 6, c\u2019\u00e9tait la grande mode du d\u00e9veloppement d\u2019applications mobiles. Bon nombre de d\u00e9veloppeurs iOS et Android tentaient de reproduire la texture des mat\u00e9riaux \u00ab\u00a0physiques\u00a0\u00bb\u00a0: bois, cuir, marbre, etc.<\/p>\n Ensuite, en 2012, une nouvelle tendance a \u00e9merg\u00e9e avec le syst\u00e8me d\u2019exploitation Windows 8\u00a0: le flat design.<\/p>\n Exit les d\u00e9tails, les ombres, les contours, les reliefs, les formes non-g\u00e9om\u00e9triques. Tout devait \u00eatre simplifi\u00e9, carr\u00e9 ou rectangulaire, et surtout aplati.<\/p>\n Deux ans plus tard, changement de cap\u00a0: le flat design fait place au Material design lanc\u00e9 par Google en 2014.<\/p>\n Tous les \u00e9l\u00e9ments graphiques doivent maintenant avoir un aspect \u00ab\u00a0papier\u00a0\u00bb en plus d\u2019\u00eatre minimaliste.<\/p>\n Ensuite, il y a eu l\u2019extr\u00eame oppos\u00e9 quelques ann\u00e9es plus tard\u00a0: le maximalisme.<\/p>\n Exit la recherche du vide, du \u00ab\u00a0less is more\u00a0\u00bb et des surfaces blanches. La doctrine, c’est \u00ab\u00a0Plus c\u2019est Plus\u00a0\u00bb, quitte \u00e0 piquer les yeux et sacrifier l\u2019esth\u00e9tique.<\/p>\n Bon, vous voyez o\u00f9 l\u2019on veut en venir\u00a0: les tendances graphiques changent constamment\u00a0!<\/p>\n Si vous ancrez toute votre UI design dans l\u2019une d\u2019entre elles, vous risquez d\u2019\u00eatre catalogu\u00e9 comme has-been en moins de trois ans<\/b>.<\/p>\n Vous serez alors oblig\u00e9 de sortir la CB pour faire une co\u00fbteuse et longue refonte graphique de votre site web et de vos applications mobiles.<\/p>\n Ce qui nous am\u00e8ne une fois de plus \u00e0 Dieter Ram\u00a0: concevez des interfaces durables et qui ne suivent aucune mode.<\/b><\/p>\n Pour ajouter une couche, et parce que nous parlons de webdesign et de d\u00e9veloppement d\u2019applications mobiles, ce principe a une contrainte en plus\u00a0: vos interfaces doivent pouvoir \u00eatre facilement adapt\u00e9 aux nouveaux p\u00e9riph\u00e9riques ainsi qu\u2019aux nouvelles dimensions d\u2019\u00e9cran des mobiles et tablettes<\/b>.<\/p>\n Si vous avez d\u00e9j\u00e0 particip\u00e9 \u00e0 un workshop collaboratif sur Figma avec des professionnels du webdesign, vous avez probablement remarqu\u00e9 un fait int\u00e9ressant\u00a0: ils discutent souvent longtemps, avec passion, sur la position du moindre bouton et pop-up.<\/p>\n En effet, le cerveau humain per\u00e7oit m\u00eame des d\u00e9tails infimes. Et parfois, il peut les interpr\u00e9ter de mani\u00e8re n\u00e9gative.<\/p>\n Raison pour laquelle Dieter Ram recommande de ne rien laisser au hasard. Il ajoute m\u00eame que la pr\u00e9cision et le soin du d\u00e9tail montre du respect envers l\u2019utilisateur.<\/p>\n Avez-vous d\u00e9j\u00e0 entendu parler de l\u2019\u00e9co-conception et de l\u2019informatique verte\u00a0?<\/p>\n Il s\u2019agit d\u2019un courant de pens\u00e9e qui vise \u00e0 minimiser les ressources consomm\u00e9es par les sites web\u00a0 \u2014 temps de calcul et consommation \u00e9lectrique – lorsqu\u2019un internaute navigue dessus.<\/p>\n Pour l\u2019utilisateur final, un site web \u00e9co-con\u00e7u a plusieurs avantages :<\/p>\n C\u00f4t\u00e9 d\u00e9veloppeur, un site web utilisant du green-code est beaucoup plus facile \u00e0 maintenir et \u00e0 faire \u00e9voluer. Cerise sur le g\u00e2teau : vous pouvez m\u00eame obtenir des labels \u00e9cologiques rien qu\u2019en basculant dans l\u2019informatique verte.<\/p>\nLes 10 principes d\u2019un bon design selon Dieter Ram<\/h2>\n
\n
1 \u2013 Un bon design est innovant<\/h3>\n
\n
2 \u2013 Le design doit rendre le produit utile<\/h3>\n
\n
![\"Concept](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/Concept-de-transaction-PayPal-par-Vladyslav-Tyzun.gif\")
3 \u2013 Un bon design est beau<\/h3>\n
4- Un bon design rend le produit compr\u00e9hensible<\/h3>\n
![\"Page](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/Page-daccueil-de-lecole-dart-de-Yale-1024x506.png\")
5 \u2013 Un bon design doit \u00eatre discret<\/h3>\n
6 \u2013 Un bon design doit \u00eatre honn\u00eate sur les capacit\u00e9s de votre produit<\/h3>\n
7 \u2013 Un bon design r\u00e9siste aux tendances et \u00e0 la mode<\/h3>\n
![\"Un](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/Icone-dune-application-de-patisserie-en-skeuomorphisme-par-Creative-Dash.jpg\")
![\"Screenshot](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/capture-decran-de-lapplication-localiser-mes-amis-dApple.jpg\")
![\"Page](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/Interface-flat-design-de-Windows-8.jpg\")
![\"page](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/page-daccueil-de-Tumblr-en-material-design-1024x534.jpg\")
![\"interface](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/interface-UI-maximaliste.png\")
![\"interface](\"https:\/\/poyesis.fr\/blogs\/wp-content\/uploads\/2023\/10\/interface-UI-maximaliste-2-1024x593.png\")
8 \u2013 Un bon design ne laisse rien au hasard<\/h3>\n
9 \u2013 Un bon design est \u00e9cologique<\/h3>\n
\n