Présentation
Présentation
Présentation
Problématique
Les site web dont vous vous occupez est compliqué à utiliser
L’interface n’est pas attrayante , parfois même confuse
Que vous passez trop de temps sur la partie interface
UX design
L'UX et l'UI design sont deux axes très différents mais extrêmement
complémentaires. Tandis que l'UX design va être axé sur toute la réflexion d'une
interface, l'UI va s'approprier la charte graphique et les recherche UX pour créer
l'apparence d'une interface.
L’UX intervient en amont de l’UI et du développement même de l’application
UX et UI Design
Dans le processus de création d’un projet Web, L’UX designer commence à travailler bien
avant le reste de l’équipe. 5 étapes doivent être respectées :
Définition d’une stratégie : c’est là que débute la réflexion sur les utilisateurs, ce qu’ils
recherchent, pourquoi ils se rendent sur votre site ou votre application.
Liste des besoins : et surtout définition de ce qu’il est possible de faire ou non.
Définition de la structure : on prépare les plans et on essaie de se mettre à la place de
l’utilisateur.
Création des premiers schémas : c’est ici que le dessin des wireframes intervient en esquisse.
Création du visuel : c’est à ce moment-là que l’UI designer commence son travail pour
harmoniser les décisions prises par l’UX designer avec un côté plus technologique que son
partenaire.
Bien que parfois confondus, la répartition des tâches entre UX designer et UI designer est
relativement nette. L’UI doit toutefois tenir compte de certains aspects de l’UX dans son travail
L’interface web avec UI Design
Un style graphique c'est la direction artistique que va prendre l'UI designer pour
réaliser ses interfaces. Ce style va définir l'apparence des traits, des boutons, des
ombres, des arrondis et bien d'autres choses !
Pour choisir le style graphique, il faut, en amont étudier la charte graphique du
client pour reprendre le style déjà instauré. Et, s'il n'en a pas, il faut en trouver un !
Exemple de style graphique
FLAT DESIGN
Pour créer des formes simples, épurées, sans ombres. Le flat design va à l'essentiel
Exemple de style graphique
NEOMORPHISME
Permet un jeu d'ombre sur les
éléments. La couleur de l'élément et du
fond sont souvent les mêmes.
Exemple de style graphique
LINE DESIGN
Tout faire avec une seule ligne. C'est à
la fois simple et minimaliste et permet
de ne pas surcharger l'écran
Exemple de style graphique
ISOMETRE
Technique qui mélange la simplicité
du flat design et la profondeur de la 3D
selon une grille dépourvue de lignes de
convergences.
Exemple de style graphique
SKEUOMORHISME
Le skeuomorphisme, en design
digital, consiste à imiter l'apparence
d'un objet réel lors de la conception
d'un objet virtuel. Cette technique
permet à l'utilisateur de comprendre
l'action à effectuer face à l'UI