Outils et techniques innovantes pour un design de qualitĂŠ de vos plateformes web www.lotincorp.biz
www.lotincorp.biz
Bonsoir et bienvenue Ă tous !
Je suis Henri Lotin, graphiste multimédia diplômé de la Graphic Design School d’Australie.
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
Je vis à Douala, au Cameroun, et je suis le directeur de création et le co-fondateur de Lotin Corp.
www.lotincorp.biz
Outils et techniques innovantes pour un design de qualitĂŠ de vos plateformes web
www.lotincorp.biz
1. Qui est le web designer ?
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.
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.
À 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.
www.lotincorp.biz
La conception d’un design web tient compte des contraintes spécifiques du web en termes d’utilisabilité et d’accessibilité.
www.lotincorp.biz
Les grands concepts
www.lotincorp.biz
UtilisabilitĂŠ web
L’utilisabilité, usabilité ou encore aptitude à l’utilisation est définie par la norme ISO 9241-11 comme :
C’est une notion proche de celle d’affordance, ou même d’ergonomie qui est cependant plus large.
www.lotincorp.biz
« 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é »
Les critères de l’utilisabilité sont :
• 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.
www.lotincorp.biz
• l’efficacité : le produit permet à ses utilisateurs d’atteindre le résultat prévu.
www.lotincorp.biz
AccessibilitĂŠ web
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.
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.
www.lotincorp.biz
2. L’interface graphique
www.lotincorp.biz
2.1. Qu’est-ce qu’une interface ?
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.
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 (usercentred design) :
• Intuitive et facile à utiliser
• 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
www.lotincorp.biz
• Logique avec des options évidentes pour la navigation et les opérations
www.lotincorp.biz
2.2. Les buts de l’interface utilisateur
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).
www.lotincorp.biz
L’objectif principal de l’IUG est de fournir des outils conviviaux (user-friendly) qui permettent aux utilisateurs :
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 :
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.
www.lotincorp.biz
La navigation
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.
www.lotincorp.biz
L’étiquetage
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).
www.lotincorp.biz
L’orientation
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.
www.lotincorp.biz
Le contrôle
www.lotincorp.biz
2.3. Don’t Make Me Think!
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.
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.
www.lotincorp.biz
Ce dont nous avons besoin de nous rappeler est que les designers ne sont pas des utilisateurs typiques.
Avec autant d’options disponibles sur le web, la chose fondamentale pour les concepteurs web est de garder les utilisateurs contents.
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.
www.lotincorp.biz
Les utilisateurs mécontents ne resteront pas sur un site web, et ne seront pas enclins à y retourner.
Don’t Make Me Think de l’expert en utilisabilité Steve Krug. Ce livre est une lecture essentielle pour tous les concepteurs web.
www.lotincorp.biz
L’un des meilleurs livre et le plus facile à lire sur la conception d’IUG axée sur l’utilisateur (usercentred GUI design) est :
www.lotincorp.biz
3. Les solutions e-commerce
www.lotincorp.biz
3.1. Magento
www.lotincorp.biz
3.2. Woocommerce
www.lotincorp.biz
3.3. Demandware
www.lotincorp.biz
3.4. Wix.com
www.lotincorp.biz
Merci !