Behance Twitter LinkedIn Facebook
Page d'accueil Portefeuille Contact

Conception d'un site web et construction d'un prototype pour un photographe indépendant

Résumé de l'étude de cas

On m'a présenté un logo (une ouverture de caméra en forme de symbole féminin), quelques images pour la galerie et une courte bio pour travailler. Le client avait les demandes suivantes :
  • Le design doit être à la fois audacieux et simple.
  • La page d'accueil doit se démarquer et être différente.
  • La galerie d'images doit être conventionnelle et facile à utiliser.

Solutions

Conception visuelle

Conception de sites web pour les appareils mobiles

Conception de sites web pour les ordinateurs de bureau et portables

Prototype pour les appareils mobiles

Prototype pour les appareils de bureau et portables

Détails du projet

Conception de la page d'accueil

L'idée derrière un œil féminin était de transmettre le concept de ce que fait un artiste : voir le monde à travers la lentille de sa propre expérience de vie, façonnée par ses vues et parfois obscurcie par ses propres idées préconçues si vous voulez, et le partager avec nous de la manière dont il le voit. Ils capturent quelque chose qui compte pour eux et certains d'entre eux peuvent également trouver un écho chez nous.
Comme Dorothy est une féministe convaincue, j'ai décidé de mettre son logo en forme de symbole féminin dans la pupille d'une femme. J'ai décoloré la peau et j'ai laissé l'iris de l'œil garder sa couleur d'origine. J'ai pensé qu'il serait assez cool de transformer l'ouverture du logo en un lien qui, d'un clic, ouvrirait sa lentille et amènerait le spectateur à la galerie d'images, en d'autres termes, transférerait le spectateur dans le monde de l'artiste. Malheureusement, cet effet ne fonctionne que hors ligne, en raison d'un bug dans la fonction de partage en ligne d'Adobe XD, mais la séquence de prototypes ci-dessous peut aider à visualiser la transition.
J'ai choisi une police de caractères arrondie et assez pointue pour l'énoncé de la mission. La page d'accueil s'est avérée être assez audacieuse, tout en étant féminine, et c'est ce que Dorothy voulait.

Un imac montrant la page d'accueil sur l'écran
Écrans de téléphone et d'ipad montrant la page d'accueil et la galerie du design web d'un photographe

Conception pour les appareils mobiles

L'orientation du portrait ne permettait pas à l'image de l'œil de prendre tout l'espace de l'écran, alors je l'ai placé au centre de l'écran avec l'énoncé de mission en bas et le menu en haut.
La galerie est très simple et minimaliste et il y a une cohérence dans sa conception et sa mise en page sur toutes les tailles d'écran avec des flèches de navigation très fines et un fond noir.

Les prototypes

J'ai créé deux prototypes distincts: un pour les appareils à orientation paysage et un autre pour les appareils à orientation portrait (généralement des appareils mobiles). Tous deux utilisent la transition temporelle pour obtenir l'effet de l'ouverture de l'objectif de l'appareil photo au centre de l'œil. À l'origine, j'ai utilisé 7 tableaux pour rendre la transition plus fluide, mais Adobe XD ne pouvait pas traiter ce nombre de transitions temporelles et a gelé, si bien que j'ai réduit le nombre de tableaux à quatre (trois sur un mobile). Mais pour l'instant, il ne fonctionne que hors ligne et l'équipe d'Adobe essaie de résoudre le problème.
Le mouvement de balayage est appliqué pour naviguer dans la galerie sur les appareils mobiles.

Capture d'écran d'un prototype d'appareil à orientation paysage Capture d'écran d'un prototype d'appareil à orientation portrait