Séquence 5 : D un site web à un système multi- supports Module 1 : Principes généraux de la méthode de Garrett



Documents pareils
GUIDE D UTILISATION DU TABLEAU BLANC INTERACTIF EBEAM EDGE

Les creative commons. Journée d information organisée par l ADBS le 17 décembre Julie TOMAS, Juriste TIC AEC, agence des initiatives numériques

Formation PROFIS Installation. Module 1 : Plateforme générale. PROFIS Installation I Plateforme générale I MKT E2 CM I

Conception Création Site. Web CAHIER DES CHARGES CREATION DE SITE WEB

Créer un compte personnel ou professionnel Facebook

2 Moodle Guide 2c : banque de questions et activité Test. Version du service

Partage en ligne 2.0

Parlez-vous chinois? Allumer l appareil. Commencer. Le premier écran de l application

ENDNOTE WEB POWERED BY THOMSON REUTERS WEB OF KNOWLEDGE SM

Badge «Vie personnelle et Digital»

+33 (0) Sarl ISB Altipolis2 av. Du Général Barbot Briancon - France

Service On Line : Gestion des Incidents

Création de site internet

DU CAHIER DES CHARGES GUIDE D UTILISATION SITE WEB

M1105 Web Design Analyse Sectorielle Sites de grands musées

Microsoft Live Messenger

Je travaille mon image! Diffuser ses photos sur le web Mardi 14 avril 2015

Transférer des dossiers sur un disque amovible Votre support de formation

pas à pas prise en main du logiciel Le Cloud d Orange - Transfert de fichiers sur PC et MAC Le Cloud

Business Talk IP Centrex. guide. web utilisateur. pour. les services standards

Comment évaluer et améliorer l'efficacité de mon site web? Croissance assurée. 8 mai Michel D Urso

Enregistrement de votre Géorando Maxi Liberté

Importer des images sur la bibliothèque de contenus multimédia librement réutilisable de Wikimédia Commons

AnaXagora LMS v3.0. Guide d utilisation

DPI AGENCE DESIGN ET PROJECTION DE VOTRE IMAGE CAHIER DES CHARGES POUR SITE INTERNET MANON THERRIEN JENNIFER LEMARIER

Cahier des charges modèle

Savoir utiliser les services de l ENT Outils personnels SOMMAIRE

Paramétrage des navigateurs


Bibliothèque PARTAGER ET STOCKER ATELIER DES FICHIERS

Storebox User Guide. Swisscom (Suisse) SA

MANUEL UTILISATEUR : RECETTES TABLE DES MATIERES PIE : PRESTATIONS INTERNES ET EXTERNES

Créer et gérer une newsletter Comment créer et faire vivre une lettre d information au sein de votre entreprise?

Optimisation des s pour les supports mobiles. Améliorez vos taux de clics sans augmenter votre charge de travail.

Créer une application de livre interactif pour tablette avec Indesign CS6 et Adobe Digital Publishing Suite

Guide Utilisateur ArkadinAnywhere

CATALOGUE DE FORMATION POLE RESSOURCES NUMERIQUES

Dans la série. présentés par le site FRAMASOFT

Géographie CM2. Guide pédagogique. Ressources vidéoprojetables & 14 animations interactives. Jacques Arnaud Nicole Darcy Daniel Le Gal

SE RENDRE VISIBLE EN 2015?

Plateforme AnaXagora. Guide d utilisation

Mai Médiathèque «Les Trésors de Tolente»

Point 3.7. Publier des contenus dans un portail e-sidoc. Janvier 2013 Documentation détaillée V 2.2

Recherche d information textuelle

Présentation de la plateforme WINDCHILL. Invitation à rejoindre la plateforme

Qu est ce qu une bibliothèque?

Les pré-requis pour créer un.ave pour Android

F0RMAT I0N BUREAUTIQUE

UN SITE WEB RESPONSIVE EN UNE HEURE?

SpringerLink La Connaissance est importante. Choisissez SpringerLink.

TUTORIEL Pearltrees 26/02/2015

OFFRE DE SERVICES. MultiMediaCom Cabinet Conseil en Webmarketing POUR LA CONCEPTION ET DIFFUSION DE VOS CAMPAGNES ING ET VOS NEWSLETTERS

moobee mail vous ouvre les portes de l ing

Fiche n 1 : Téléverser une ressource dans la plateforme

Dopez votre site Joomla! Les meilleures extensions pour les versions 2.5 et 3.0

On trouvera sur le site du CCDMD un exemple d album construit avec Cantare. (

Comment sauvegarder ses documents

Contrôle parental NOTE AUX PARENTS. Vita avant d autoriser votre enfant à jouer. Régler le contrôle parental sur le système PlayStation

Installation et prise en main d UBUNTU

Présentation - Tableau de bord du CA Carrefour informationnel et documentaire des Laurentides

Comment créer un site web Proxy gratuitement!

REPUBLIQUE ALGERIENNE DEMOCRATIQUE ET POPULAIRE MINISTERE DE LA CULTURE. «Constantine, capitale de la culture islamique 2015»

Antidote et vos logiciels

Samsung Auto Backup Guide de démarrage rapide

Création d'un site WEB pour enseignant : Formation offerte par le Récit national en formation professionnelle

Illustrations concrètes : cross selling et up-selling. Illustrations concrètes : la relation client - le social et l ing

Mon aide mémoire traitement de texte (Microsoft Word)

CAHIER DES CHARGES pour création graphique de Site internet.

Direction des technologies de l information GUIDE D UTILISATION PAPERCUT À L INTENTION DES ÉTUDIANTS

LES RESEAUX SOCIAUX MARDI 25 FEVRIER 2014

Comment enfin réussir à gérer son courrier électronique! Jean-Michel Mermet - juin 2015

Dévéloppement de Sites Web

PRÉPARER UN EDIT-A-THON

INF 9013 Les TIC et l apprentissage en milieu de travail

Installation FollowMe Q server

SOMMAIRE. Comment se connecter?

Forge. Présentation ( )

Synchroniser le son et la vidéo dans Lightworks

Cahier des charges pour la création du site sous DRUPAL

Les utilisations pédagogiques du Tableau Numérique Interactif (TNI) dans l enseignement d Économie-Gestion :

MON 1ER JEU-CONCOURS SUR FACEBOOK

Depuis 2000, la société est reconnue pour son professionnalisme et la qualité de ses services.

OPPassessment Guide d utilisateur

STRUCTURE DE L ORDINATEUR

Utiliser SQL Server 2008 R2 Reporting Services comme source de donne es pour Microsoft Excel

B&C PRIVATE ROOM GUIDE D UTILISATION. B&C COLLECTION // BE INSPIRED //

Stratégies opérationnelles d APPS-CRM pour smartphones et tablettes

Comment accéder à d Internet Explorer

Mise en route et support Envision 10 SQL server (Avril 2015) A l'intention de l'administrateur SQL Server et de l administrateur Envision

GUIDE D UTILISATION DE LA PLATEFORME DE L UNIVERSITE DE BOURGOGNE POUR L ENSEIGNEMENT EN LIGNE ( PLUBEL )

Manuels numériques et bibliothèque Didier Guide pratique

I - Pour créer un site web

SCOOP IT. Isabelle Vayssié Collège St Geours de Maremne. Crédit images scoop it

PerSal Manuel d installation

Communication et suivi des problèmes via le Helpdesk NKCN

ITNETWORK PORTFOLIO ITNETWORK. 45, rue de Domremy Paris Tel : contact@itnetwork.fr

Commencer avec Allplan Exchange. Nemetschek Allplan Systems GmbH, Munich. All rights reserved. Enregistrement

NUMÉRIQUE VALLÉE. Atelier n 2 : avis clients et e-réputation. Les ateliers numériques de l Office de Tourisme. Mardi 03 mars 2015

Rapport de stage. Création d un site web. Stage du 20/01/2013 au 21/02/2013

Transcription:

Séquence 5 : D un site web à un système multi- supports Module 1 : Principes généraux de la méthode de Garrett 1

Tous les sites web ne nous laissent pas la même impression de facilité d utilisation, de qualité des contenus ou de beauté dans le graphisme. Ces différents éléments vont jouer énormément sur notre envie de continuer à utiliser un site. La méthode de Garrett a pour objectif de construire cette fidélisation en maximisant le sentiment de satisfaction et l expérience utilisateur. 2

La méthode est structurée selon 5 étapes. A chaque étape la méthode propose des outils qui permettent de définir quelles sont les fonctionnalités à proposer et comment organiser l information. C est une méthode centrée utilisateur, c est- à- dire qu à chacune des 5 étapes, le concepteur doit s interroger sur les préférences des utilisateurs de manière à garantir que le produit conçu rencontre bien son public. 3

A chaque étape des méthodes différentes sont utilisées pour concevoir les fonctions opérationnelles et informationnelles. La surface correspond à tout ce qui est perceptible - les images, les textes, les vidéos, la musique - mais aussi à tout ce qui peut être touché, cliqué, activé dans une interaction. L'ossature correspond à l'organisation des éléments d information et d interaction. Par exemple pour présenter des informations de type images, on peut utiliser un défilement d image ou un mur d images. La structure correspond à l organisation des données en particulier les parcours de navigation possibles ou les modes d accès à l information. Elle n est pas visible directement à la consultation. Le cadrage correspond à la définition de la spécificité du site, son originalité et les types d utilisations envisagées. La stratégie correspond aux objectifs du site, c est- à- dire ce à quoi il est censé servir et à qui il est destiné. C est aussi à ce niveau que l on définit comment mesurer que les objectifs sont remplis. 4

La méthode de Garrett utilise ces étapes en commençant par la plus abstraite pour aller vers la plus concrète. Ainsi Garrett recommande de réaliser la stratégie, puis le cadrage, la structure, l ossature et de terminer par la surface. 5

Il suggère de superposer la fin d une étape avec le début de la suivante. Cette période de recouvrement permet de modifier certains des choix initiaux de conception de manière à avoir une proposition cohérente. 6

Crédits D2 D2 D2 D3 D3 D3 http://commons.wikimedia.org/wiki/file%3anarniaweb_site_screenshot.png http://upload.wikimedia.org/wikipedia/commons/5/59/narniaweb_site_screenshot.png Par David Hollander (www.narniaweb.com) [FAL], via Wikimedia Commons http://commons.wikimedia.org/wiki/file%3adecember_2008_web_site_- _Flickr_- _Knight_Foundation.jpg http://upload.wikimedia.org/wikipedia/commons/3/3a/december_2008_web_site_- _Flickr_- _Knight_Foundation.jpg Par Knight Foundation (December 2008 Web Site) [CC BY- SA 2.0 (http://creativecommons.org/licenses/by- sa/2.0)], via Wikimedia Commons http://shapebootstrap.net/preview/?id=439 «Düb» par Richard Bartz Travail personnel. Sous licence Domaine public via Wikimedia Commons - http://commons.wikimedia.org/wiki/file:d%c3%bcb.jpg#/media/file:d%c3%bcb.jpg «Crystal Project Download manager» par Everaldo Coelho (YellowIcon) All Crystal icons were posted by the author as LGPL on kde- look. Sous licence LGPL via Wikimedia Commons - http://commons.wikimedia.org/wiki/file:crystal_project_download_manager.png#/media/file:crystal_project_d ownload_manager.png «Farm- Fresh client account template» par FatCow Web Hosting http://www.fatcow.com/free- icons/. Sous licence CC BY 3.0 us via Wikimedia Commons - http://commons.wikimedia.org/wiki/file:farm- Fresh_client_account_template.png#/media/File:Farm- Fresh_client_account_template.png D1 Image du livre de JJ Garett «Elements of User Experience,The: User- Centered Design for the Web and Beyond» 7