Case study
Application mobile, IOS.
Projet fictif, conception (ux & ui design) d’une application mobile. Cette application de jeu propose à des utilisateurs de découvrir une ville via à un système de gamification : collection de cartes, de collections, les utilisateurs débloquent des niveaux, explorent et évoluent ainsi dans la ville.
Étapes 📎
- Définition du parcours utilisateur, UX Design
- Conception des écrans principaux sur Figma.
- UI Design (charte graphique, nouvelle typographie, Design System, etc.
![app use case ios ux ui elise bouet design](https://elisebouet.com/wp-content/uploads/2024/07/app-use-case-ios-ux-ui-elise-bouet-design.png)
Contexte.
Processus
Il y quelques temps de cela, dans le cadre d’une éventuelle mission freelance, on m’avait demandé de réaliser un case study : concevoir des maquettes haute-fidélité des écrans clefs d’une application de gaming sur ios.
Le user flow était simple : un utilisateur collecte des cartes, des collections de cartes, il peut les consulter et ainsi suivre ce qu’il lui reste à débloquer pour avancer dans le jeu.
![app cas study ui design elise bouet](https://elisebouet.com/wp-content/uploads/2024/07/app-cas-study-ui-design-elise-bouet.png)
Création
J’ai conservé le parcours utilisateur (UX) mais j’ai repris & modifié l’identifié visuelle de ce projet (UI) afin de me permettre plus de liberté sur certains aspects (illustrations, charte graphique, assets etc.) et ainsi avoir un projet qui correspond davantage à ce sur quoi j’ai l’habitude de travailler.
👉 Article : l’importance des case studies en tant que designer
![app case study ux ui elise bouet](https://elisebouet.com/wp-content/uploads/2024/07/app-case-study-ux-ui-elise-bouet.png)
![landing page app ios dark mode](https://elisebouet.com/wp-content/uploads/2024/07/landing-page-app-ios-dark-mode.png)
![landing app ios white mode](https://elisebouet.com/wp-content/uploads/2024/07/landing-app-ios-white-mode.png)
![cards](https://elisebouet.com/wp-content/uploads/2024/07/cards.png)
![card details](https://elisebouet.com/wp-content/uploads/2024/07/card-details-1.png)
![card unlocked](https://elisebouet.com/wp-content/uploads/2024/07/card-unlocked.png)
![cards unlocked](https://elisebouet.com/wp-content/uploads/2024/07/cards-unlocked.png)
![collections feed](https://elisebouet.com/wp-content/uploads/2024/07/collections-feed.png)
![collection cards](https://elisebouet.com/wp-content/uploads/2024/07/collection-cards.png)