UX et UI design

Nos UX et UI designeurs conçoivent des expériences utilisateur intuitives, adaptées aux besoins réels des utilisateurs et des interfaces graphiques uniques, qui reflètent l’identité graphique de votre marque.

Des sites intuitifs, agréables, au service de vos utilisateurs

L'UX design est l'expérience utilisateur d'un site. De son côté, l'UI design désigne l'apparence de son interface, son design. Ces disciplines complémentaires visent à concevoir des produits numériques simples et agréables à utiliser, et qui répondent aux besoins réels des utilisateurs. Véritables outils d'acquisition, l'UX et l'UI design s'intéressent aux motivations sous-jacentes des visiteurs de votre site afin de les inciter à interagir avec le contenu, à visiter plus de pages, pour in fine vous permettre de les convertir et les fidéliser.

S'intéresser à vos utilisateurs, la clé d'une expérience utilisateur réussie

L’expérience utilisateur est la façon dont l’utilisateur va vivre son interaction avec votre site, votre marque. Pour créer cette expérience, nous analysons le besoin de l'usager pour créer votre produit. Et non l'inverse.

Photo représentant un schéma des personas pour l'expérience utilisateur d'un site internet

Les 4 étapes de la conception UX design

Notre méthodologie en 4 étapes permet de concevoir une expérience web adaptée à vos différents profils d’audience. Basé sur la co-construction et l’échange, nous vous intégrons, vous et vos utilisateurs, dans tout le processus.

Cette étape permet de s'immerger dans votre projet, d’analyser votre environnement et d'identifier vos enjeux. C'est une étape importante pour comprendre correctement votre besoin.

  • L'atelier de lancement
    Cet atelier doit permettre de discuter avec vous de votre besoin et de vos attentes. C’est l’occasion pour notre équipe de plonger dans votre projet, de comprendre vos enjeux et d'arbitrer sur l'enchainement des ateliers si besoin.
  • L'audit de l'expérience utilisateur
    L’audit UX a pour objectif de déterminer les forces et les faiblesses de votre site Internet en matière d'UX et d'ergonomie, dans le cas d'un projet de refonte. Nous examinons chaque gabarit de page de votre site à l'aide de critères ergonomiques issus de la doctrine UX (critères ergonomiques pour l'évaluation d'interfaces utilisateurs de Bastien et Scapin, 1993). En examinant votre site, nous pouvons identifier les points à améliorer pour proposer des solutions concrètes et efficaces à vos utilisateurs.
  • Le benchmark UX
    Le benchmark UX permet de s’inspirer, d’analyser les sites concurrents pour analyser leurs forces et faiblesses, soulever les bonnes pratiques / idées et les éléments à ne surtout pas reproduire. La présentation du benchmark permet également de mesurer vos attentes et celles de vos utilisateurs (il est même préférable de confronter votre benchmark au nôtre).

Durant cette phase, nous nous concentrons sur vos utilisateurs pour comprendre qui ils sont. Vous les connaissez sûrement, mais notre équipe, non. Nous réfléchissons ensemble pour cerner leurs besoins, leurs attentes et concevoir des parcours adaptés.

  • La recherche utilisateur
    Pour connaître l’avis de vos utilisateurs sur votre projet, quoi de mieux que de les rencontrer ? La phase de recherche utilisateurs permet de comprendre et d'analyser qui sont vos utilisateurs.
  • Les personas
    Nous devons étudier et définir ensemble le profil de vos utilisateurs, comprendre leurs attentes vis à vis de votre projet. Pour cela, nous construisons avec vous des fiches personas représentatives de vos utilisateurs.
  • Les parcours utilisateurs
    Avec les personas nous connaissons maintenant vos utilisateurs, il reste à définir leur navigation et parcours sur votre futur site. Nous construisons ensemble les différents parcours pour chaque cible, chaque objectif et l’arborescence du site lors d’ateliers. 

C'est le moment d'opérer la conception des écrans. Durant cette phase de co-création nous construisons ensemble le squelette et les gabarits (wireframes) de vos futures pages lors d'ateliers appelés "Design Studio".

  • Les maquettes ergonomiques
    Aussi appelées wireframes, elles sont le “squelette” de votre futur site. Ce sont des maquettes en noir et blanc qui permettent de représenter les différents gabarits de pages et leurs composants. C’est l’étape préliminaire au déploiement de design qui permet d’imaginer tous les gabarits de pages.
  • Le design studio
    Le Design Studio est un atelier de conception collaborative et participative qui permet de générer rapidement des solutions de conception à une problématique de design. L’atelier est basé sur un cycle itératif alternant création de concepts, présentation des solutions et critiques constructives.

Il est toujours préférable d'évaluer les choix faits lors de la conception pour éviter de corriger le site pendant le développement ou après la mise en production. C'est pourquoi nous proposons une phase de test des wireframes ou maquettes de votre futur site auprès de vos utilisateurs.

  • Le tests utilisateurs
    Ces tests permettent d’évaluer si les choix faits sont efficaces et correspondent aux attentes des utilisateurs. Nous pouvons ajuster les maquettes avant le développement du site.

De l’expérience utilisateur
à l’interface utilisateur

Une fois le travail d'UX design terminé, vous obtenez un site facile, agréable à utiliser, et répondant aux attentes de vos utilisateurs. Reste alors à réaliser le design de l’interface de votre projet web, c'est la phase d’UI design. Nos designers s'appliquent alors à créer un produit esthétique, basé sur l'univers graphique de votre marque.

Photo représentant la page d'accueil figma avec les projets en cours

Les 4 étapes de la conception UI design

Cette étape permet d'étudier le marché concurrentiel, les tendances et d'identifier les idées à conserver, à développer. C'est lors de cette phase que nous réalisons audits et benchmarks.

  • L'audit UI
    L’audit UI a pour objectif de déterminer les forces et les faiblesses des interfaces qui composent le site internet, lors d'un projet de refonte. En examinant le site internet selon une grille de 5 critères, nous pouvons identifier les améliorations possibles et proposer des solutions pour offrir aux utilisateurs une expérience unique dans le respect de l'univers de marque.
  • Le benchmark UI
    Le benchmark UI ou benchmark graphique consiste à analyser les interfaces des applications ou sites concurrentiels. Il permet de connaitre les tendances du marché et d’identifier les éléments qui démarqueront votre site internet.

Cette phase permet de définir conjointement la direction artistique pour véhiculer au mieux votre image et vos valeurs. Nous travaillons des pistes d'intentions puis validons l'ensemble à travers un échantillon représentatif de la direction artistique.

  • L'atelier de définition de la direction artistique
    Cet atelier nous permet de définir à vos côtés la direction artistique qu’il faudra privilégier pour véhiculer votre image et vos valeurs. Ce moment d’échange décide des codes et éléments graphiques de votre charte graphique à intégrer sur les futures interfaces.
  • Les pistes d’intentions : artboards
    Notre équipe d’UI designers conçoit les premières esquisses des futures maquettes. Les pistes d'intention représentent la phase "prudente" de notre méthodologie. Nous vous soumettons nos premières idées à travers quelques maquettes.
  • La production d'un échantillon de pages représentatives de la direction artistique
    La production d’un échantillon de pages représentatives est la dernière étape pour s’assurer du bon déploiement de la direction artistique sur un lot restreint de maquettes.

La direction artistique validée, nous pouvons déployer. Le déploiement s'effectue sur l'ensemble des parcours à prototyper mais également au travers d'un design system complet, qui tient compte des contraintes de mobilité.

  • Maquettage responsive des parcours UI
    Nous déployons les maquettes UI des gabarits des parcours restants. Les maquettes sont réalisées par ordre de parcours utilisateur et de manière totalement dynamique. 
  • Design system
    C’est l’étape finale. Le système de design liste et définit toutes les spécifications graphiques des interfaces : palette de couleurs, règles typographiques, système d’espacement, grille et colonnes, composants responsives, gabarits de structures… Ces éléments sont soigneusement rangés et triés selon l’approche “atomic design”.

Pour aller plus loin, nous proposons d'enrichir la direction artistique d'illustrations que nous pourrons animer par la suite.

  • Illustrations
    Pour agrémenter l'iconographie, les illustrations sont le compromis idéal. Elles permettent d'illustrer les propos, d'apporter de la chaleur aux contenus et de véhiculer les valeurs de votre marque. Le travail d'illustration que nous proposons est réalisée sur-mesure en tenant compte de toutes les spécifications de la direction artistique.
  • Animation d'illustration (motion design)
    Pour donner vie à votre projet et rendre les interfaces plus attractives, l'animation d'illustrations (motion UI design) permet d'enrichir les parcours. Chaque illustration bénéficie d'un traitement adapté afin de la rendre animée et vivante. Nous étudions chaque scenario en fonction des objectifs UI et des spécificités de l'illustration.

Vous avez un projet ?
Parlons-en !