Faire Mieux Avec Peu - Webcom 2009 Anastasia Simitsis, w.illi.am

Faites mieux avec peuOptimisation ergonomique

Simplicité

SOURCE : http://www.stuffthathappens.com

{ Simplicité vs. Expérience }

Le Web, où en sommes-nous ?Plus ergonomique ?

« Simplicity is boring. We want richness and depth in our lives. Moreover, the world and our activities are inherently complex, so the tools we use must match that complexity. Simplicity is not the answer. We don't want confusion, perplexity, and confusion. »

- Don Norman 2008

Avec l’explosion destechnologies riches à la 2.0*,a-t-on des sites webplus ergonomiques ?

The characteristics of Web 2.0 are :

Rich user experience, user participation, dynamic content, metadata, web standards and scalability. Further characteristics, such as openness, freedom and collective intelligence by way of user participation, can also be viewed as essential attributes of Web 2.0.

- Wikipedia

NON pas nécessairement!

Ce n’est pas la technologie en soi qui détermine la facilité d’utilisation.

«Usability matters, it matters a lot. But it only matters if underneath the surface, you’ve got a product that actually works well and is meeting real user needs (usefulness)…if you don’t have a fundamentally strong product, then your users are going to have no reason to keep coming back to using your site or product time and time again… »

- Jen Fitzpatrick, Engineering Director of User Experience, Google

Pour un contexte d’utilisation, des utilisateurs et des buts spécifiques….

Efficacité (atteindre son but) Efficience (atteindre son but avec le minimum d’efforts, en un minimum de temps) Satisfaction (ressenti global, composantes liées aux deux précédentes et à l’utilité…)

(ISO 9241-11,1998)

Quelques définitions…

Utilité UtilisabilitéERGONOMIE

Synonymes(convivialité, facilité d’utilisation)

Les 5 « E » de l’expérience utilisateur

1. EfficaceLe degré d’exhaustivité et de précision dans l’accomplissement de la tâche ou dans la réalisation des objectifs.

2. EfficientLa rapidité avec laquelle la tâche peut être accomplie.

3. Évitant les erreursL’efficacité du produit à éviter les erreurs et à aider l’utilisateur à dépasser celles qui surviennent.

4. Enfantin à maîtriserLa capacité de répondre à la fois à l’orientation de départ et à l’apprentissage continu pendant toute la durée de vie de l’utilisation.

5. EngageantLa capacité de l’interface à pousser l’utilisateur à interagir, le degré de plaisir et de satisfaction dans l’utilisation.

SOURCE : http://www.wqusability.com/articles/getting-started-fr.html

Équilibre de chaque dimension ?

Expérience utilisateur

Efficace

Efficient

EngageantÉvitant les

erreurs

Enfantin à maîtriser

Expérience utilisateur

Efficace

Efficient

Engageant

Évitant les

erreurs

Enfantin à maîtriser

Plaisir à utiliser vs. efficience ?

iPhone - 50 % plus lent…

Lequel est préféré ?

Les utilisateurs préfèreraient le plaisir à l’efficience pour les tâches de courte durée et peu fréquentes…

SOURCE : http://www.poetpainter.com

Un grand constat !

ABONDANCE…

SURCHARGE

Comment faire simple dans un contexte complexe?Est-ce important ?

Surinformation

Trop de choix

Fonctionnalités avancées

Plateformes variées

« Investissez 10% en utilisabilité et gagnez 83% »

- Jacob Nielsen, janvier 2008

Usability ROI

<100% 1 - 299% 3 - 499% 500+%

ROI Percentage

SOURCE : Usability and User Experience Survey Report 2007; E-consultancy/Bunnyfoot

45 % of respondents reported an ROI of 300% or more from usability

85 % of respondents reported an ROI of 100% or more from usability

Toujours selon la même étude…

The top 3 benefits of investment in usability are:

improved perceptions of brand

increased conversion rates

greater customer loyalty and retention

Faire mieux avec peu

3 règles à suivre dans uncontexte économique difficileet même quand il ne l’est pas ;)

Les opinions…

Règle # 1

Prenez des décisions basées sur des donnéesutilisateurs…et non des opinions

Identifiez + Mesurez + Observez

vos utilisateurs

Vous n’êtes pas l’utilisateur ;)

Règle # 1Identifiez + Mesurez + Observez vos utilisateurs

« Don’t fix it if it ain’t broken »Une refonte complète est rarement la solution…

La règle du 80/20 s’applique.En évaluant et ajustant les éléments sur le chemin des tâches critiques, vous réglez 80% des problèmes…

Permet de concentrer vos énergies et $$$ là où l’impact sera le plus grand pour

vos utilisateurs et votre entreprise.

4 principales techniquesIdentifiez + Mesurez + Observez vos utilisateurs

Qualitatif

Quantitatif

Comportements(Ce que font les gens)

Buts et attitudes(Ce que disent les gens)

Entrevues Tests utilisateurs

Sondages auprèsd’utilisateurs

Statistiques du site(Web Analytique)

Sur placeSalle de tests

À distance

Combien de tests utilisateurs ?

SOURCE : http://www.useit.com

Règle # 2

Priorisez + Maquettez

Selon les niveaux de satisfaction

Obligatoires(besoins implicites)

Proportionnelles(besoins exprimés)

Attractives(besoins latents)Enchantement

Déception

Trèsbien

Avec le temps…SOURCE : Modèle Kano

Satisfaction utilisateur

Degré fonctionnelPeu fonctionnelou pas offert

Diagramme d’affinitésPermet de classer et d'organiser des informations obtenues par brainstorm, groupes de discussion, sondages (client, écoute des employés, satisfaction de la clientèle ou autres), tests utilisateurs, etc.

Permet de rassembler les différents membres de l’équipe pour dresser un tableau complet et arriver à un consensus.

Boîte à outils

Tri de cartes

Papier, post-it, crayons – Gratuit

WebSort – 79$US pour une étude http://websort.net

Optimal Sort – Gratuit pour 10

participants, 30 cartes par projethttp://www.optimalsort.com

Tri de carte fermé Optimal Sort

Boîte à outils

Maquettage, prototypage

Papier, post-it, crayons – Gratuit

Balsamiq – Gratuit en ligne ou 79$US http://www.balsamiq.com/

Pencil Project– Gratuit http://www.evolus.vn/Pencil/

Axure - http://www.axure.com/

Maquette basse fidélité réalisée en 2-3 min. avec Balsamiq

Maquette haute fidélité avec Pencil Project

Concept

Prototype

Site en ligne

Coût d’un changement….

1xConception

6xDéveloppement

100xEn ligne

Ne réinventez pas la roue. Apprenez de vos compétiteurs…et faites-mieux ;)

Faites des tests utilisateurs sur les site de vos concurrents.

Référez-vous aux guidelines et patterns de conception.

Guidelines

For reduced completion times & familiar data input:

top aligned

SOURCE : http://www.lukew.com/resources/articles/WebForms_LukeW.pdf

Guidelines

For unfamiliar, or advanced data entry:

left aligned

Guidelines

When vertical screen space is a constraint:

right aligned

Boîte à outils

Patrons de conception(« design patterns »)attention, utiliser avec précaution…

Yahoo Design Libraryhttp://developer.yahoo.com/ypatterns/

Weliehttp://www.welie.com/

UI Patternshttp://ui-patterns.com/

95% of web users do not read80% of your content!

doesn’t mean that your content isn’t important,it means it’s more important

SOURCE : http://www.mindseyewebdesign.net/blog/

SOURCE : Steve Krug, Don't Make Me Think!: A Common Sense Approach to Web Usability

SOURCE : http://www.neoinsight.com/newsletter/0903.html#0903get-there-mode

« It doesn't matter how many times I have to click, as long as each click is a mindless, unambiguous choice »

- Steve Krug, Author Don’t Make me think

Règle # 3

Optimisez , optimisez, optimisezvotre contenu

Contenu = texte, hyperliens, boutons et images

TEXTE doit être :

Dans un langage simple et familier pour l’usager (attention aux noms de marques !)

Aéré : grossissez vos polices, laissez du blanc et éliminez les éléments superflus !

Facilement balayable : titres, sous-titres et hyperliens en un clin d’œil !

Concis : En général, diviser la quantité de mots par 2 !

« Every sentence, every phrase, every word has to fight for its life »

- Crawford Kilian, Writting for the Web 3.0

Mettre de l’avant les bénéfices plutôt que les fonctionnalités de votre service ou produit

Supporté par des illustrations, graphiques, tableaux…PARLANTS!

Dépourvu d’erreurs et à jour

Ouf…

Oui, la vie est Bell ;)

BOUTONS et HYPERLIENS

Maximiser l’affordance « vous pouvez me cliquer »o Un bouton doit avoir l’air d’un bouton !

o Prenez attention…

Forme Couleur Libellé Localisation dans l’interface

Les hyperliens doivent être explicites (descriptifs)o Bannissez les liens « cliquez ici »

o Privilégiez le souligné

Où est Charlie le bouton ?

Où est le bouton acheter ?

SOURCE : http://www.lukew.com/resources/articles/PSactions.asp

À lire !

Avant de conclure…

Qui est responsable de l’expérience utilisateur ?

CHAQUE INDIVIDU de votre organisationqui participe de près ou de loin au maintien et à l’évolution de votre site

Gestionnaires de produits, ingénieurs

Ergonomes, architectes de l’information, directeur UX

Designers, directeur artistique

Développeurs, analystes de la qualité

Auteurs, éditeurs, traducteurs du contenu

Service à la clientèle

Membres de la direction

Google user experience

The Google User Experience team aims to create

designs that are useful, fast, simple, engaging,

innovative, universal, profitable, beautiful,

trustworthy, and personable. Achieving a harmonious

balance of these ten principles is a constant challenge.

A product that gets the balance right is "Googley" –

and will satisfy and delight people all over the world.

SOURCE : http://www.google.com/corporate/ux.html

Avec l’optimisation ergonomique….

C’est possible de faire mieux avec peu !

1- Identifiez + mesurez + observez

2 - Priorisez + maquettez* (guidelines, patterns)

3 - Optimisez vos contenus*

* Testez encore!

Bonne expérience utilisateur ;)

Merci !

Faire Mieux Avec Peu - Webcom 2009 Anastasia Simitsis, w.illi.am

Technology

Transcript of Faire Mieux Avec Peu - Webcom 2009 Anastasia Simitsis, w.illi.am

Webcom Montréal, piste #openGouv

Comenius 1.1 Partenariats scolaires Italia Italia España España Grèce Grèce Orateur : Lazaridou Anastasia reunion dans Sciacca, l'Italie Sujet: Les différentes.

Avant d’aller dans les médias sociaux, mon site Web est-il à la hauteur? - Federation des CEGEPS, Humberto Valencia, w.illi.am

KaissA’ctusjeanclaudemoingt.typepad.com/files/kaissactus-n1.pdf · 2013-05-15 · « KAISSA, un programme de séminaires professionnels de haut niveau» Anastasia Denissova, KAISSA

Webcom nathalie berger-panel_ux-mobile_utilisabilite-design_17nov2010

Une valeur ajoutéedocuments.worldbank.org/curated/en/650351468350158293/... · 2016-07-12 · Sara Gann Anastasia Gekis Stella Gonzales Alison Harwood Peggy Henderson Brigid Holleran

Webcom Montréal 2013

Entreprise 2.0, un apperçu - by Matyas Gabor, w.illi.am/ - Young President Organisation YPO Conference

Realiser le numérique - Webcom Montréal 2011

Lutte contre la discrimination dans lenseignement Anastasia DEMAGOS.

Anastasia CAUDE Ingénieure en agronomie en 5ème année

Web social : Les 7 jours de la création, par Matyas Gabor, w.illi.am

NOS « PEOPLE AWARDS - Mantra Contentmantracontent.com/sitecontent/newsletters/nomad/our_way_04/pdf/our... · Findus Italie . Anastasia Esposito, Lorenzo Belletti, Matteo Romanò,

Parcours de lecture Sur les personnagesDans le roman de guy de MaupassantUne vie Fait par Sima Gharabaghi et Anastasia Shapovalova.

Webcom 2010 performez dans les nuages avez google apps

Entreprise 2.0 - by Matyas Gabor, w.illi.am/ pour Loto Québec

Commerce électronique : tactiques avancées (par Simon Éthier | Webcom Montréal 2010)

Optimisation Des Avant d’aller dans les médias sociaux, mon site Web est-il à la hauteur? - Federation des CEGEPS, Humberto Valencia, w.illi.am/Sites Web

RP dans l'Entreprise 2.0 - by Matyas Gabor, w.illi.am/ - Canadian Institute

brirsa.files.wordpress.com · Web view2020. 4. 19. · Anastasia SEMENOFF Created Date: 04/19/2020 09:46:00 Last modified by: Anastasia SEMENOFF ...