#02 Deezer V3 : Zoning & Ergonomie

Suite du billet Deezer V3 : 1ère partie, Brainstorming.
Avant d’aborder la partie zoning et maquette conceptuelle de cette V3, un petit rappel sur Deezer :

  • 237 000 artistes
  • 25 webradios thématiques
  • 4.5 Millions de titres
  • 29 Millions de playlists
  • 11 Millions de Deezernautes

Ce petit rappel permet de comprendre l’importance des usages qu’ont les utilisateurs sur une telle plateforme. Le risque de modifier leurs habitudes est à prendre en considération lors de la conception.

Pour nous aider à recueillir et définir nos besoins, nous nous sommes posés de nombreuses questions… du type :

  • Pourquoi ? Quel est notre objectif ?
  • Quoi ? Quelles sont nos actuelles et futures contraintes ?
  • Qui ou pour qui ? Qui utilise notre produit actuel ? Qui en bénéficie ? Qui de la Deezer Team va être en charge de telles ou telles fonctionnalités ?
  • Comment ? Comment l’équipe va réaliser le produit ? Quelles méthodologie et ressources nécessaires allons-nous mettre en place ? Quels choix technologiques allons nous choisir ?

Architecture et structure du site

omnigraffle_logo

Beaucoup de croquis et de schémas ont été gribouillés, dessinés et notés sur des cahiers, calepins ou feuilles pour finir sous Fireworks ou OmniGraffle.

Pour le squelette du site, nous avons utilisé OmniGraffle, logiciel de la suite OmniGroup utilisable seulement sous Mac. OmniGraffle est agréable d’utilisation et permet de faire ou de modifier rapidement des diagrammes et organigrammes. Lorsque nous avons revu l’architecture du site, nous avons essayé d’être le plus transversale possible entre les différentes fonctionnalités existantes et nouvelles.

architecture_deezer

Wireframe ou maquette conceptuelle

fireworks_logo
Pour concevoir les wireframes, nous avons utilisé Fireworks, logiciel assez méconnu des designers de la Suite Créative d’Adobe mais tellement pratique et facile d’usage surtout si le designer est habitué aux produits d’Adobe. Fireworks permet de générer des maquettes interactives simulant une navigation de page en page. Vous trouverez ci-dessous quelques maquettes de zoning et voir ainsi l’évolution avant de vous montrer les maquettes de webdesign dans un futur billet.

La suite au prochain épisode…

Prototypage de site avec Fireworks – émission Chips&Tips

Tv Adobe avec Thibault Imbert & Stéphane Baril : http://tv.adobe.com/fr/

Billets déjà parus et à venir :

  1. 1/ Brainstorming (Janvier 2009)
  2. 2/ Zoning + Maquettes conceptuelles (Janvier – Février 2009)
  3. 3/ Webdesign + Ateliers avec la Deezer Team (Février 2009)
  4. 4/ Modifications suite aux ateliers + Développement / Intégration web (Mars – Avril)
  5. 5 / Lancement de la bêta privée + retours utilisateurs (Juin 2009)
  6. 6/ Migration de la v2 à la v3 jusqu’à la fin juillet 2009