Nicolas Gut

vendredi 21 décembre 2018

Créer un Design System en 5 étapes

IHM UI UX – # # # # # # # # #

Si vous ne savez pas ce qu’est un design system, Usabilis en propose une définition complète et pertinente :

Les définitions du Design system englobent souvent les mots bibliothèque (library), lignes directrices (guidelines), styleguide et langage visuel (visual language). En fait, le Design system comprend tous ces aspects. Le Design system regroupe ce que nous appelions auparavant la charte ergonomique et la charte graphique. C’est une bibliothèque de référence et un guide pour designer et développer une application métier, un site e-commerce ou toute autre forme de produit ou service digital. Les équipes techniques et design peuvent ainsi piocher des composants prêts à être utilisés et écrits dans un langage commun. Le contenu du Design system dépend de l’identité de l’entreprise et de son écosystème digital. Toutefois, les éléments suivants y figurent généralement :
– Composants UI et patterns
– Principes visuels autour de la typographie
– Palettes des couleurs et règles associées
– Iconographie et imagerie
– Grilles pour structurer les éléments, espaces, etc. (Grid layout)
– Principes de communication de la marque (langage, ton…)
– Éléments réutilisables de l’interface utilisateur (UI)

Maintenant que la notion est claire, comment créer son design system ?
En 5 étapes, avec, de préférence, un outil comme Sketch.
1. Passer en revue son site ou son application et faire une liste d’éléments
2. Organiser en pages
3. Créer des styles de calques et des styles typographiques
4. Créer les symboles et les composants
5. Mettre à jour continuellement le design system

Trouver les détails sur Beyond 360

mercredi 24 janvier 2018

What is the International Space Station’s Wifi SSID?

Culture – # # # # # # # #

Voilà un fil de question-réponses assez amusant. Autant l’idée de la question que de certaines réponses très pertinentes à l’humour indispensable dans ce genre de situation. J’en profite pour vous inviter à la lecture de la dernière bande dessinée de Enki Bilal, Bug – tome 1 qui est une pure merveille.

Lire What is the International Space Station’s Wifi SSID?

mardi 7 juin 2016

La puissance du web : WebGL et three.js

IHM UI UX – # # # # # # #

Fini la nostalgie du flash et de ses animations. Il serait tant d’en faire le deuil et pour vous aider, la puissance permise par WebGL et three.js va donner un grand coup fouet à la création web multimédia.

However I hate to admit it, the era of this rich multimedia platform has come to an end. Flash is finally dead. But fear not! As often happens when one door closes, another opens, and Flash is slowly being replaced by a fresher, more vigorous successor. Technologies like WebGL, and accompanying JavaScript libraries like Three.js are rapidly growing—enabling developers to build Flash-like projects, without the accompanying security issues.

Découvrir three.js et WebGL

Lire l’article How WebGL is reinventing Flash’s legacy