Save 37% off PRO during our Black Friday Sale! »

Outils et techniques innovantes pour un design de qualité de vos plateformes web

C5b0163b5fed63f459d6fcb2d3138298?s=47 Henri Lotin
April 14, 2015

Outils et techniques innovantes pour un design de qualité de vos plateformes web

Les enjeux d'un design de qualité pour une plateforme e-commerce. Les principes de base sur l'utilisabilité et l'accessibilité, ainsi que les caractéristiques d'une bonne interface web sont abordés dans cette présentation à l'Afrikebiz 2015 !

C5b0163b5fed63f459d6fcb2d3138298?s=128

Henri Lotin

April 14, 2015
Tweet

Transcript

  1. Outils et techniques innovantes pour un design de qualité de

    vos plateformes web www.lotincorp.biz
  2. Bonsoir et bienvenue à tous ! www.lotincorp.biz

  3. Je suis Henri Lotin, graphiste multimédia diplômé de la Graphic

    Design School d’Australie. Je vis à Douala, au Cameroun, et je suis le directeur de création et le co-fondateur de Lotin Corp. Depuis Octobre 2014, je suis le fondateur de Lotin Corp. Academy, où j’enseigne l’introduction à la communication visuelle, le design web et interactif et les logiciels de PAO. www.lotincorp.biz
  4. www.lotincorp.biz Outils et techniques innovantes pour un design de qualité

    de vos plateformes web
  5. www.lotincorp.biz 1. Qui est le web designer ?

  6. www.lotincorp.biz Le web designer (ou designer d’interfaces web) est chargé

    de concevoir et de réaliser le design d’une interface web : son métier ne se résume pas à la conception graphique seule car il s’attache avant tout à la formalisation des interactions des pages du site web. Il faut savoir avant tout qu’un designer web moderne doit être à même d’avoir des talents en graphisme et être capable d’intégrer une interface en HTML5 et CSS3.
  7. www.lotincorp.biz La conception d’un design web tient compte des contraintes

    spécifiques du web en termes d’utilisabilité et d’accessibilité. À partir de la demande du client, il fait une traduction artistique globale, en rapport avec le contenu du site. Les priorités du webdesigner sont : le respect du cahier des charges du client et la séduction des futurs utilisateurs du site web.
  8. www.lotincorp.biz Les grands concepts

  9. www.lotincorp.biz Utilisabilité web

  10. www.lotincorp.biz L’utilisabilité, usabilité ou encore aptitude à l’utilisation est définie

    par la norme ISO 9241-11 comme : « le degré selon lequel un produit peut être utilisé, par des utilisateurs identifiés, pour atteindre des buts définis avec efficacité, efficience et satisfaction, dans un contexte d’utilisation spécifié » C’est une notion proche de celle d’affordance, ou même d’ergonomie qui est cependant plus large.
  11. www.lotincorp.biz Les critères de l’utilisabilité sont : • l’efficacité :

    le produit permet à ses utilisateurs d’atteindre le résultat prévu. • l’efficience : atteint le résultat avec un effort moindre ou requiert un temps minimal. • la satisfaction : confort et évaluation subjective de l’interaction pour l’utilisateur.
  12. www.lotincorp.biz Accessibilité web

  13. www.lotincorp.biz L’accessibilité du web est la problématique de l’accès aux

    services et contenus en ligne non seulement pour les handicapés et les seniors, mais aussi de manière plus générale pour tous les utilisateurs qui ne disposent pas du confort offert par un ordinateur de bureau situé dans une pièce tranquille.
  14. www.lotincorp.biz En effet son application concerne également les utilisateurs «

    normaux » placés dans des situations moins confortables comme avec un téléphone mobile, une tablette… ou placés en situation particulière de bruit, de dimension d’affichage, etc.
  15. www.lotincorp.biz 2. L’interface graphique

  16. www.lotincorp.biz 2.1. Qu’est-ce qu’une interface ?

  17. www.lotincorp.biz Une page web est une interface. Toutes les formes

    de media interactifs reposent sur une IUG (Interface Utilisateur Graphique) pour permettre à l’utilisateur d’interagir avec le système.
  18. www.lotincorp.biz Une IUG est comme un appareil de traduction (interprétation)

    qui nous permet de parler et d’interagir avec des machines ou des systèmes. La conception d’IUG qui atteint ce but avec succès repose sur les principes de la conception axée sur l’utilisateur (user- centred design) :
  19. www.lotincorp.biz • Intuitive et facile à utiliser • Logique avec

    des options évidentes pour la navigation et les opérations • Pourvue d’une hiérarchie visuelle claire qui fournit une plateforme contextuelle pour le contenu • Fait usage d’indicateurs visuels et des conventions web standards • Esthétiquement plaisante et signifiante
  20. www.lotincorp.biz 2.2. Les buts de l’interface utilisateur

  21. www.lotincorp.biz L’objectif principal de l’IUG est de fournir des outils

    conviviaux (user-friendly) qui permettent aux utilisateurs : d’accéder facilement au système d’information, et de fournir un retour d’information (feed-back) utile aux utilisateurs tout au long du processus, (comme indiquer à quel endroit dans le système ils se trouvent et où aller par la suite pour plus d’informations ou de produits dans le site).
  22. www.lotincorp.biz Pour s’assurer que l’IUG est conviviale, les éléments suivant

    doivent faire l’objet d’une conception minutieuse et d’une attention particulière :
  23. www.lotincorp.biz La navigation Les outils dont se serviront les utilisateurs

    pour se déplacer et localiser les pages, l’information ou les produits dans le site. La navigation doit être cohérente à travers tout le site.
  24. www.lotincorp.biz L’étiquetage Les mots utilisés pour les éléments de navigation

    comme les boutons. Un bon étiquetage crée une navigation claire, intuitive et fournit une expérience utilisateur positive.
  25. www.lotincorp.biz L’orientation Les outils et les indicateurs qui aident les

    utilisateurs à s’orienter à l’intérieur du site et trouver aisément leur chemin, comme le fil d’ariane (breadcrumbs).
  26. www.lotincorp.biz Le contrôle Les utilisateurs aiment le contrôle. Les sites

    web réussis fournissent autant de contrôle que possible, au lieu de s’en emparer ou essayer de forcer les utilisateurs de réaliser une opération d’une manière unique.
  27. www.lotincorp.biz 2.3. Don’t Make Me Think!

  28. www.lotincorp.biz Je ne veux pas réfléchir ! La chose la

    plus surprenante pour les designers est de savoir que les utilisateurs n’aiment pas réfléchir. Ce dont nous avons besoin de nous rappeler est que les designers ne sont pas des utilisateurs typiques. Les utilisateurs aiment le choix stupide ; plus simple et plus facile c’est d’exécuter des actions sur un site web ou de trouver ce qu’ils cherchent, plus positive est leur expérience, et plus ils sont enclins à « aimer » le site web.
  29. www.lotincorp.biz Avec autant d’options disponibles sur le web, la chose

    fondamentale pour les concepteurs web est de garder les utilisateurs contents. Les utilisateurs mécontents ne resteront pas sur un site web, et ne seront pas enclins à y retourner. Les sites web ne sont pas comme des films ; un site web ne peut se reposer uniquement sur les effets spéciaux ! Il devrait y avoir du sens et de la pertinence sans trop de distraction ou d’irritation pour le rendre utile.
  30. www.lotincorp.biz L’un des meilleurs livre et le plus facile à

    lire sur la conception d’IUG axée sur l’utilisateur (user- centred GUI design) est : Don’t Make Me Think de l’expert en utilisabilité Steve Krug. Ce livre est une lecture essentielle pour tous les concepteurs web.
  31. www.lotincorp.biz 3. Les solutions e-commerce

  32. None
  33. www.lotincorp.biz 3.1. Magento

  34. None
  35. www.lotincorp.biz 3.2. Woocommerce

  36. None
  37. www.lotincorp.biz 3.3. Demandware

  38. None
  39. www.lotincorp.biz 3.4. Wix.com

  40. None
  41. www.lotincorp.biz Merci !