Conception d'un produit et d'un concept pour une application mobile

De l'idée au prototype interactif

Sécurité

App mobile

Startup

Gros plan sur le bras cassé d'un utilisateur de l'application de signalement d'incidents.
CLIENTGreenlight
LOCATIONLondon
TEAMChercheur, UX designer, architecte système, UI designer, chef de projet.
PROJECT WEBSITE

Sam venait de terminer sa thèse de doctorat sur les procédures de sécurité et le signalement des incidents sur le lieu de travail. Les informations qu'elle a recueillies ont fait germer l'idée d'une start-up qui faciliterait le signalement des incidents. Elle souhaitait créer un prototype qui traduise ses idées en une véritable application mobile.

Elle a apprécié notre expertise en matière d'exploitation des résultats de la recherche universitaire. Nous étions ravis de travailler avec une jeune fondatrice brillante qui avait fait ses devoirs. Il n'a pas fallu longtemps avant que nous ne donnions le coup d'envoi du projet de conception du prototype pour faire décoller sa start-up.

NOS CONTRIBUTIONS

Stratégie de produit

Architecture de l'information

Design UX

Wireframing

Prototypage interactif

Design UI

L'image de marque

Tests auprès des utilisateurs

Conception d'une application sur l'image d'un centre logistique.

Transformer une thèse de doctorat en réflexion UX

Sam a partagé avec nous sa thèse de doctorat, ainsi qu'un ensemble d'articles de recherche, une présentation et un chapitre de livre. Nous avons résumé et organisé les idées pertinentes pour la conception du prototype. Nous avons créé une banque d'idées, ainsi qu'une liste de contrôle de ce qui ferait du prototype un très bon outil de signalement des incidents sur le lieu de travail.

Articles académiques utilisés dans la conception du prototype de l'application.

UNE ARCHITECTURE LOGIQUE DE L'INFORMATION

Au cours de la semaine 1, nous nous sommes concentrés sur la création d'une architecture de l'information dans laquelle les parcours des utilisateurs sont aussi simples que possible. Cependant, nous avons dû prévoir une grande flexibilité car les formulaires d'incidents diffèrent selon le type d'incident. Nous avons exploré 3 concepts d'architecture. Il était agréable d'engager la conversation avec Sam, d'expliquer les avantages et les inconvénients et d'intégrer son point de vue.

Diagramme du parcours dans le prototype de l'application avec les commentaires à gauche.

Soutenir la stratégie produit

Il s'agit de la première start-up de Sam et de sa première expérience dans la création d'un produit numérique. Pendant que les concepteurs travaillaient sur la conception du prototype, nous avons organisé quelques séances distinctes pour définir la stratégie globale du produit. Nous avons partagé avec elle des exemples d'expériences passées et l'avons aidée à comprendre les options qui s'offrent à elle pour le développement, le financement, les partenariats avec les premiers utilisateurs et la manière d'organiser la sortie du produit.

Quotes

Tout d'abord, permettez-moi de vous dire que le fait de voir ce projet prendre vie pour la première fois a été pour moi la chose la plus cool qui soit. Merci beaucoup pour votre travail et pour tout ce que vous avez fait pour le façonner. 

Image du client de l'agence de design.
Samantha GruskinFondateur @GREENLIGHT
Bureau intérieur lors d'une réunion de stratégie produit.

L'application prend forme

Les semaines 2 et 3 ont été intenses. Nous avons réalisé trois itérations de wireframes, en ajoutant à chaque fois des détails de conception. Tout d'abord, nous avons réfléchi à la manière de créer un design pour le formulaire qui puisse s'adapter aux rapports courts et complexes. Ensuite, nous avons conçu une image fil de fer de fidélité moyenne de l'ensemble du processus et, lors de la dernière étape, nous avons capturé les détails les plus fins. À chaque étape, nous avons impliqué Sam, en lui expliquant la façon dont nous concevions le projet et en recueillant ses commentaires. Les commentaires de Sam étaient pertinents et elle s'est approprié la vision de l'application du début à la fin.

Le wireframe d'une application se présente sous la forme d'un diagramme montrant le cheminement de l'utilisateur.

Une démonstration convaincante pour l'investisseur

Au cours de la semaine 4, nous avons effectué des tests auprès des utilisateurs. Nous avons tiré quelques leçons précieuses et avons dû adapter le parcours de l'utilisateur, ainsi que d'autres ajustements dans le formulaire de rapport. Une fois les maquettes terminées, nous avons assemblé le prototype final.

Au cours de la cinquième semaine, nous avons travaillé sur l'interprétation de l'UI, en montrant à quoi l'application pourrait ressembler à l'aide d'un design graphique. Nous avons utilisé le design graphique UI assemblée et créé une démonstration pour les investisseurs.

Quatre captures d'écran de la conception graphique de l'application lors de la démonstration aux investisseurs.
Éléments de design

Prototype livré en 4 semaines

En quatre semaines, nous avons transformé l'enthousiasme et les idées théoriques de Sam en une véritable application qui plaît aux utilisateurs. Le fait qu'elle ait été bien préparée nous a permis de nous concentrer sur les solutions de conception et d'avoir des conversations productives après chaque itération de conception.

Nous avons travaillé en étroite collaboration avec elle pour tirer le meilleur parti de son budget limité. En effectuant ne serait-ce qu'un peu de tests auprès des utilisateurs, nous avons considérablement amélioré la conception. Lors de la démonstration aux investisseurs, nous nous sommes attachés à montrer ce que les investisseurs recherchent : un produit qui apporte une valeur ajoutée et la capacité de l'équipe à le mettre en œuvre.

RÉSULTATS

Prototype interactif réalisé en 4 semaines

Entièrement documenté pour le développement

Démonstration de l'investisseur créée en 1 semaine

Deux déploiements d'interface utilisateur pour l'idéation de la marque