UI Challenge

UX / UI  · Depuis Décembre 2019

Afin d’améliorer mes compétences UI & UX, je me suis lancée en Décembre 2019 dans le Daily UI Challenge. Le concept est simple, « Devenir un meilleur designer en 100 jours ». Chaque jour je reçois un thème et après c’est à moi d’innover, créer et m’amuser afin de prototyper l’interface qui me semble la plus adéquate.

Je participe à ce challenge lors de mes temps libres, il m’est donc difficile de suivre le rythme imposé d’une création par jour, au vu de la charge de travail que cela peut représenter. Toutes mes réalisations sont disponibles sur mon compte Dribbble.

[Daily UI 001]

Sign Up Page

Pour commencer le challenge, le but était de créer une page d’inscription que ce soit pour une application mobile ou un site web. J’ai fait le choix de partir sur le site web et d’utiliser comme identité SeaLab, un marque fictive, créée lors d’un projet vidéo scolaire. 

SeaLab est une marque qui se positionne comme leader dans la vente chaussures faites à partir de matériaux recyclés et notamment de plastique, afin de protéger les océans ainsi que la faune & flore sous-marine.

Cette page d’inscription aurait pour vocation d’être utilisée lors de la création d’un compte sur le site internet de la marque.

[Daily UI 002]

Credit Card Checkout

Le second challenge consistait à designer le parcours de payement d’un utilisateur lors d’un achat. Pour cela, j’ai créé une application d’achat de vêtements en ligne sur laquelle on peut ajouter sa carte bancaire puis la sauvegarder pour des futurs achats, payer avec la carte de son choix puis recevoir une confirmation de commande une fois l’achat effectué.

[Daily UI 003]

Landing Page

Pour ce troisième challenge, je suis partie sur une landing page pour une nouvelle application de messagerie entre amis.

Tous les visuels et éléments graphiques ont été crées directement sur Adobe XD.

[Daily UI 004]

Calculator Application

Pour ce challenge, j’ai utilisé une nouvelle tendance design du moment : le Neumorphisme.  Mais qu’est-ce que le neumorphisme ? C’est une technique de conception d’interface de skeuomorphisme, combiné à du Flat Design, permettant de rendre les éléments d’interface utilisateur plus doux et plus lisibles.

L’objectif de cette utilisation réside à attirer davantage l’attention de l’utilisateur sur l’effet des ombres appliquées à une forme, donnant cette sensation de surface en relief.

[Daily UI 005]

Launch Icon

Inspirée du Daily Challenge 003, j’ai choisi de reprendre le logo fait lors de ce challenge afin de créer une véritable identité à ce projet. 

L’application a maintenant un nom ainsi que deux variantes de launch icon.

[Daily UI 006]

User Profil

Une application de vente de fleurs, c’est ce que j’ai imaginé pour ce sixième DailyUi Challenge. J’avoue ne pas avoir été très inspirée au départ, c’est pourquoi j’ai créé deux écrans supplémentaires, afin de me donner du contexte et des idées. 

J’ai également animé sur Adobe XD, grâce à de l’animation automatique, les plans de travail & composants afin de montrer la transitions entre les différents écrans et notamment entre les deux premiers, lors du click sur une plante afin d’afficher le détail.

[Daily UI 007]

Setting Page

Pour ce challenge, j’ai choisi de créer la page de Setting d’une application web qui serait présente sur un back office par exemple.

Si j’ai choisi de travailler sur un back office c’est parce que je suis travail aujourd’hui dans une agence de développement web & mobile, spécialisée pour répondre à des problématiques métiers et cela passe très souvent par la création d’un BO.

Malheureusement, pendant mes années d’étude nous avons très peu appris à comprendre le fonctionnement de ce genre de site et le but de ce challenge était pour moi de développer mes compétences pour ce genre de site & de design.

[Daily UI 008]

404 Error Page

Une page d’erreur 404, on se dit rien de plus simple ! Pour cette création, j’ai opté pour un design simple, qui va à l’essentiel, tout en y apportant quelques touches de dynamisme grâce à des éléments graphiques.

Afin de compliquer un peu ce challenge, j’ai également mis à disposition de ma publication Dribbble, mon fichier Xd  qui est en libre téléchargement.

[Daily UI 009]

Music Player

Inspirée par l’application mobile Spotify, j’ai créé un design de lecteur de musique. J’ai fait le choix de partir sur des éléments arrondis, dont un lecteur circulaire, avec la possibilité de changer le timer d’une chanson. 

La  liste d’attente est également disponible sous la forme d’un slide up, depuis l’écran de lecture, car de mon côté, c’est l’une des fonctionnalités que je ne trouve jamais sur les applications de musique mais qui est pourtant essentielle.

Et pour conclure

Restez connecté car nous sommes seulement au tout début de ce challenge, beaucoup de choses sont à venir !