Cookonly

Webdesign d'un site e-commerce en responsive

Réalisé en agence

Site responsive AnneB

Choix graphiques

 

Ce site e-commerce spécialisé dans la vente de produits frais est destiné au grand public.

Ce secteur étant très concurrentiel, le webdesign devait avoir une identité visuelle forte et une ergonomie adaptée. La charte réalisée se compose de couleurs acidulées, fraiches et dynamiques et d’une police bien identifiable.

 

Pictos_Food_AnneB

L'iconographie au service de l'UI.

Souhaitant montrer la simplicité d’utilisation de ce nouveau service, j’ai choisi de mettre l’accent sur l’iconographie, quelle soit sous forme de photos, d’illustrations ou de pictogrammes.

 

Photographies

Les photos ont ici un rôle important, que ce soit pour présenter les produits ; pour dynamiser le contenu ou tout simplement pour permettre aux visiteurs une identification. J’ai donc particulièrement réfléchi pour les mettre à l’honneur en proposant, par exemple sur la page d’accueil, une ergonomie inspirée du style métro, permettant de créer une interface moderne et conviviale.

 

Pictogrammes

Les pictos, sélectionnés avec soin, améliorent l’expérience utilisateur en aidant à l’identification d’une catégorie de produits. Accompagnés d’éléments illustratifs, ils permettent ainsi d’égayer le site et d’accentuer l’identité de la marque.

 


Iconographie 
Design du planning/repas - AnneB

Réflexion ergonomique

La particularité de ce site est de proposer la possibilité de créer un semainier de recettes et de commander les produits associés. Ce dispositif a nécessité une réflexion importante en ergonomie et la réalisation de nombreux zonings tout en tenant compte des contraintes liées au responsive.

La partie semainier a été particulièrement complexe à traiter de par sa quantité d’informations à afficher. Le site offre à l’utilisateur la possibilité de moduler son semainier selon ses besoins. J’ai donc choisi d’employer des pictos pour simplifier la mise en page, aider à la hiérarchisation des éléments et à la compréhension des actions disponibles. Des bulles informatives apparaissent au survol pour guider l’utilisateur et le rassurer sur l’action qu’il souhaite entreprendre.

Webdesign
  • Webdesign institutionnel
  • Webdesign e-commerce
  • Webdesign éditorial/portail
  • Site vitrine
  • Site évènementiel
  • Newsletter
  • Jeux concours
  • Habillage
Campagne & Promotion
  • Habillage
  • Site évènementiel
  • Newsletter
  • Jeux concours
  • Carte de voeux
  • Affiches
print
  • Identité visuelle (logo,charte graphique)
  • Affiches
  • Packaging
Illustration
  • Stickers
  • Tableaux

Anne-b : Conception, ergonomie, wireframe, personas, création graphique, direction artistique de projets web, identité visuelle, charte graphique.

© 2024 - anne-b.fr - Anne Berland : Product designer - Directeur artistique - UX designer - UI designer - webdesigner