3. Guillaume ABEL
UX Team leader
Yannick BONNIEUX
Senior UX Designer
3
@ Ekino
Guillaume ABEL
UX Team leader
@MoreThanScreens
Yannick BONNIEUX
Senior UX Designer
@yannickbonnieux
3
@ Ekino
4. 02 Pourquoi des Guidelines ?
04 Vue d'ensemble des UI
06 Les interactions de base
01 Notre vision de l'UX
03 Les principes de design
05 Les Styles
07 Les bibliothèques
Sommaire
5. Notre vision du design
d'expérience utilisateur
01
02 Pourquoi des Guidelines ? → 03 Les principes de design → 04 Vue d'ensemble des UI → 05 Les styles → 06 Les interactions de base → 07 Les bibliothèques
6. Comprendre les attentes non formulées des
utilisateurs
Faciliter les échanges entre les différents acteurs
(Développeur, Graphiste, Client, Décideur, Marketeur)
Concevoir, tester, améliorer, re-tester, etc.
6
7. Pourquoi utiliser des
Guidelines
03 Les principes de design → 04 Vue d'ensemble des UI → 05 Les styles → 06 Les interactions de base → 07 Les bibliothèques
02
8. Une interface consistante et uniforme
Éviter les problèmes fréquents
Créer une expérience positive
8
9. Perdre les utilisateurs
Être critiqué
Perdre de l’argent
9
10. Parlez avec vos utilisateurs
Testez, testez et testez encore !
Faites-vous assister par un designer
10
11. Les principes de design
pour Tizen
03
04 Vue d'ensemble des UI → 05 Les styles → 06 Les interactions de base → 07 Les bibliothèques
12. Favoriser le Contenu
Focaliser l'Attention
Laisser le Contrôle
12
36. La couleur dominante est un blanc ivoire pour une impression de confort
Winset color
36
37. Le texte principal utilise du texte en
noir à épaisseur maigre, tandis que le
sous texte utilise le texte gris à
épaisseur grasse.
Typos disponibles sur tizen.org
37
38. Pour chaque bouton, des statuts
différents (normal, appuyez sur et
inactif)
38
39. Ne pas mettre en cause l’utilisateur
39
Ton positif et bref
Éviter Préférer
Impossible de terminer la requête La requête ne peut aboutir
Erreur réseau Réseau indisponible
Démarrage de la synchronisation Synchronisation …
Le calendrier n’est pas accessible Calendrier indisponible
Éviter Préférer
Vous avez atteint le nombre maximum de dossiers Nombre max de dossiers atteints
Vous devez sélectionner pour ajouter une recette Ajouter recette
41. 30
Tizen supporte les interactions suivantes
Interaction Description
Touch Pour exécuter la fonction immédiatement au toucher
Tap Pour sélectionner un élément ou exécuter des fonctions
Double Tap Pour revenir au niveau de la vue par défaut en zoomant
Long Tap Pour ouvrir contexte spécifique menu des options. Dans l'écran d'accueil, pour passer en
mode édition
Swipe Pour faire défiler une liste ou d'articles. Aussi, à l'horizontale utilisée pour exécuter menu
rapide
Drag and drop Pour toucher, tenir, faire glisser un objet à l'endroit désiré en libérant un doigt.
Pinch Zoom in/out Pincez OPEN / CLOSE pour agrandir /
41
42. 2 modes d’affichages supportés par Tizen : Portrait et paysage
Portrait et vue paysage Portrait et vue paysage avec un “split screen”
42