SlideShare une entreprise Scribd logo

Storyboarding for the web : Methodology and Tools

Powerpoint presentation of a workshop on "storyboarding for the web". Done on 2007 Oct. 30th by Eric DI POL and the "Designers Interactifs" (France)

1  sur  18
Télécharger pour lire hors ligne
WORKSHOP CONCEPTION DE STORYBOARDS Mardi 30 oct. 2007 © Eric DI POL - 2007
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Plan du workshop © Eric DI POL - 2007
1. Vocabulaire wireframe layout zoning détaillé blueprint maquette fonctionnelle prototype storyboard © Eric DI POL - 2007
> Surtout pour : - Définir le contenu de chaque écran, mais aussi la structure, le fonctionnement et les process liés à l’application, -  Faire valider au client les pages, leur contenu, leur structure et la navigation qui les lie entre-elles, -  Servir de base aux spécifications, -  Des tests utilisateur > Mais aussi pour : - Faciliter le travail des créatifs lors de la phase de production, - Anticiper d’éventuels développements lourds, … 2. Des wireframes : pourquoi faire ? © Eric DI POL - 2007
> En Agence : L’équipe projet : Ergonome, Concepteur,  Chef de Projet,  DA, Développeur… > Lors des tests utilisateurs : Un panel de l’audience finale (fonction du projet) > Chez le Client : Responsable e-Business, Communication, Marketing… Toute personne chargée de valider la partie fonctionnelle du projet. 3. Des wireframes : pour qui ? © Eric DI POL - 2007
4. Un storyboard, ce n’est pas… ZONE IDENTITE 2 ZONE IDENTITE 3 MENU Editorial Zone de PUSH Produit MENU Fonctionnel FOOTER CONTENU PRINCIPAL ZONE IDENTITE 1 LOGO Zone de PUSH : Actu /  Service /  Magasin Chemin de navigation …  un zoning Le zoning est l’étape qui précède la mise en place des storyboards / wireframes qui sont, eux, beaucoup plus précis. Zone de RECHERCHE © Eric DI POL - 2007

Recommandé

Project Management Introduction (1/5) for Gobelins students
Project Management Introduction (1/5) for Gobelins studentsProject Management Introduction (1/5) for Gobelins students
Project Management Introduction (1/5) for Gobelins studentsEric DI POL
 
Project Management Introduction (2/5) for Gobelins students
Project Management Introduction (2/5) for Gobelins studentsProject Management Introduction (2/5) for Gobelins students
Project Management Introduction (2/5) for Gobelins studentsEric DI POL
 
Project Management Introduction (4/5) for Gobelins students
Project Management Introduction (4/5) for Gobelins studentsProject Management Introduction (4/5) for Gobelins students
Project Management Introduction (4/5) for Gobelins studentsEric DI POL
 
Project Management Introduction (3/5) for Gobelins students
Project Management Introduction (3/5) for Gobelins studentsProject Management Introduction (3/5) for Gobelins students
Project Management Introduction (3/5) for Gobelins studentsEric DI POL
 
Formation gestion de projet - 04 - le cadrage
Formation gestion de projet - 04 - le cadrageFormation gestion de projet - 04 - le cadrage
Formation gestion de projet - 04 - le cadrageiafactory
 
Introduction à la gestion de projet
Introduction à la gestion de projetIntroduction à la gestion de projet
Introduction à la gestion de projetlaureno
 
La gestion de projet internet en 10 slides (+bonus)
La gestion de projet internet en 10 slides (+bonus)La gestion de projet internet en 10 slides (+bonus)
La gestion de projet internet en 10 slides (+bonus)Grégory Raby
 

Contenu connexe

Tendances

Mutuelle : Maitrise des délais de migration de systèmes d'information
Mutuelle : Maitrise des délais de migration de systèmes d'informationMutuelle : Maitrise des délais de migration de systèmes d'information
Mutuelle : Maitrise des délais de migration de systèmes d'informationDidier Maignan
 
Talk sur la Gestion de projet informatique
Talk sur la Gestion de projet informatiqueTalk sur la Gestion de projet informatique
Talk sur la Gestion de projet informatiqueKader KANE
 
Projet les fondamentaux - version 2014
Projet les fondamentaux -  version 2014Projet les fondamentaux -  version 2014
Projet les fondamentaux - version 2014Rémi Bachelet
 
Cours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les FondamentauxCours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les FondamentauxRémi Bachelet
 
Le couple MOA-MOE dans le projet informatique
Le couple MOA-MOE dans le projet informatique Le couple MOA-MOE dans le projet informatique
Le couple MOA-MOE dans le projet informatique Moez SAAIDIA
 
Gestion de projet #2 : méthodes
Gestion de projet #2 : méthodesGestion de projet #2 : méthodes
Gestion de projet #2 : méthodesJean Michel
 
Webinar - Gestion de projet
Webinar - Gestion de projetWebinar - Gestion de projet
Webinar - Gestion de projetappvizer.fr
 
Lexique du management de projet
Lexique du management de projetLexique du management de projet
Lexique du management de projetMichel Estève
 
Formation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe DornbuschFormation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe DornbuschEchecs et Stratégie
 
Gestion de Projets
Gestion de Projets Gestion de Projets
Gestion de Projets Said Sadik
 
Gp 08 La Finalisation Du Projet
Gp 08   La Finalisation Du ProjetGp 08   La Finalisation Du Projet
Gp 08 La Finalisation Du ProjetClaude Michaud
 
Outils d'organisation de Projet
Outils d'organisation de ProjetOutils d'organisation de Projet
Outils d'organisation de ProjetRémi Bachelet
 
Gestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatiqueGestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatiqueJihed Kaouech
 
Conduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & OutilsConduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & Outilsstephanie vincent
 

Tendances (20)

Mutuelle : Maitrise des délais de migration de systèmes d'information
Mutuelle : Maitrise des délais de migration de systèmes d'informationMutuelle : Maitrise des délais de migration de systèmes d'information
Mutuelle : Maitrise des délais de migration de systèmes d'information
 
Talk sur la Gestion de projet informatique
Talk sur la Gestion de projet informatiqueTalk sur la Gestion de projet informatique
Talk sur la Gestion de projet informatique
 
Projet les fondamentaux - version 2014
Projet les fondamentaux -  version 2014Projet les fondamentaux -  version 2014
Projet les fondamentaux - version 2014
 
Cours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les FondamentauxCours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les Fondamentaux
 
Le couple MOA-MOE dans le projet informatique
Le couple MOA-MOE dans le projet informatique Le couple MOA-MOE dans le projet informatique
Le couple MOA-MOE dans le projet informatique
 
Formation Gestion de projet
Formation Gestion de projetFormation Gestion de projet
Formation Gestion de projet
 
Gestion de projet #2 : méthodes
Gestion de projet #2 : méthodesGestion de projet #2 : méthodes
Gestion de projet #2 : méthodes
 
Initiation à la gestion de projet
Initiation à la gestion de projetInitiation à la gestion de projet
Initiation à la gestion de projet
 
Webinar - Gestion de projet
Webinar - Gestion de projetWebinar - Gestion de projet
Webinar - Gestion de projet
 
Lexique du management de projet
Lexique du management de projetLexique du management de projet
Lexique du management de projet
 
Gestion de projet web
Gestion de projet webGestion de projet web
Gestion de projet web
 
Formation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe DornbuschFormation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe Dornbusch
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
Gestion de Projets
Gestion de Projets Gestion de Projets
Gestion de Projets
 
Gp 08 La Finalisation Du Projet
Gp 08   La Finalisation Du ProjetGp 08   La Finalisation Du Projet
Gp 08 La Finalisation Du Projet
 
Outils d'organisation de Projet
Outils d'organisation de ProjetOutils d'organisation de Projet
Outils d'organisation de Projet
 
Introduction gestion de projet
Introduction gestion de projetIntroduction gestion de projet
Introduction gestion de projet
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
Gestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatiqueGestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatique
 
Conduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & OutilsConduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & Outils
 

En vedette

Management de Projet International
Management de Projet InternationalManagement de Projet International
Management de Projet InternationalRiana Andrieux
 
Accompagnement des enseignants à la construction d'un projet
Accompagnement des enseignants à la construction d'un projetAccompagnement des enseignants à la construction d'un projet
Accompagnement des enseignants à la construction d'un projetChristophe Batier
 
User centered problem solving
User centered problem solvingUser centered problem solving
User centered problem solvingMartín Hoare
 
Stocks - Biloba
Stocks - BilobaStocks - Biloba
Stocks - BilobaLokoa
 
Protype and test
Protype and testProtype and test
Protype and testroystonf
 
Tounes Sourcing Consulting 2014
Tounes Sourcing Consulting 2014Tounes Sourcing Consulting 2014
Tounes Sourcing Consulting 2014Badreddine Naouar
 
Why Prototypes Matter: From User Experience to Design Thinking
Why Prototypes Matter: From User Experience to Design ThinkingWhy Prototypes Matter: From User Experience to Design Thinking
Why Prototypes Matter: From User Experience to Design ThinkingGENinnovate
 
TWS 2014 – Testing paper prototypes
TWS 2014 – Testing paper prototypesTWS 2014 – Testing paper prototypes
TWS 2014 – Testing paper prototypesValeria Gasik
 
Prix et stock - Optimizze - ERP - V16
Prix et stock - Optimizze - ERP - V16Prix et stock - Optimizze - ERP - V16
Prix et stock - Optimizze - ERP - V16Optimizze
 
CocoaHeads Toulouse - so!use - Faites vos propres tests utilisateurs
CocoaHeads Toulouse - so!use - Faites vos propres tests utilisateursCocoaHeads Toulouse - so!use - Faites vos propres tests utilisateurs
CocoaHeads Toulouse - so!use - Faites vos propres tests utilisateursCocoaHeads France
 
Prototyping and Testing solutions for Kev!
Prototyping and Testing solutions for Kev!Prototyping and Testing solutions for Kev!
Prototyping and Testing solutions for Kev!Martín Hoare
 
Maquettes IHM - Présentation USE AGE - 20-02-2014
Maquettes IHM - Présentation USE AGE - 20-02-2014Maquettes IHM - Présentation USE AGE - 20-02-2014
Maquettes IHM - Présentation USE AGE - 20-02-2014Use Age
 
Première étude sur le testing en France
Première étude sur le testing en FrancePremière étude sur le testing en France
Première étude sur le testing en FranceRomain Creteur
 
Multi-Device Prototypes
Multi-Device PrototypesMulti-Device Prototypes
Multi-Device PrototypesDoug Gapinski
 
Tests Dinterface SWT
Tests Dinterface SWTTests Dinterface SWT
Tests Dinterface SWTEric Le Merdy
 

En vedette (20)

Management de Projet International
Management de Projet InternationalManagement de Projet International
Management de Projet International
 
Accompagnement des enseignants à la construction d'un projet
Accompagnement des enseignants à la construction d'un projetAccompagnement des enseignants à la construction d'un projet
Accompagnement des enseignants à la construction d'un projet
 
User centered problem solving
User centered problem solvingUser centered problem solving
User centered problem solving
 
Stocks - Biloba
Stocks - BilobaStocks - Biloba
Stocks - Biloba
 
Protype and test
Protype and testProtype and test
Protype and test
 
Tounes Sourcing Consulting 2014
Tounes Sourcing Consulting 2014Tounes Sourcing Consulting 2014
Tounes Sourcing Consulting 2014
 
Why Prototypes Matter: From User Experience to Design Thinking
Why Prototypes Matter: From User Experience to Design ThinkingWhy Prototypes Matter: From User Experience to Design Thinking
Why Prototypes Matter: From User Experience to Design Thinking
 
TWS 2014 – Testing paper prototypes
TWS 2014 – Testing paper prototypesTWS 2014 – Testing paper prototypes
TWS 2014 – Testing paper prototypes
 
Prototypes & test
Prototypes & testPrototypes & test
Prototypes & test
 
Protype and test
Protype and testProtype and test
Protype and test
 
Prix et stock - Optimizze - ERP - V16
Prix et stock - Optimizze - ERP - V16Prix et stock - Optimizze - ERP - V16
Prix et stock - Optimizze - ERP - V16
 
CocoaHeads Toulouse - so!use - Faites vos propres tests utilisateurs
CocoaHeads Toulouse - so!use - Faites vos propres tests utilisateursCocoaHeads Toulouse - so!use - Faites vos propres tests utilisateurs
CocoaHeads Toulouse - so!use - Faites vos propres tests utilisateurs
 
20080429 Epaper Update Lite
20080429 Epaper Update Lite20080429 Epaper Update Lite
20080429 Epaper Update Lite
 
50 ideas for Kev
50 ideas for Kev 50 ideas for Kev
50 ideas for Kev
 
Prototyping and Testing solutions for Kev!
Prototyping and Testing solutions for Kev!Prototyping and Testing solutions for Kev!
Prototyping and Testing solutions for Kev!
 
Maquettes IHM - Présentation USE AGE - 20-02-2014
Maquettes IHM - Présentation USE AGE - 20-02-2014Maquettes IHM - Présentation USE AGE - 20-02-2014
Maquettes IHM - Présentation USE AGE - 20-02-2014
 
Maquettes & Prototypes
Maquettes & PrototypesMaquettes & Prototypes
Maquettes & Prototypes
 
Première étude sur le testing en France
Première étude sur le testing en FrancePremière étude sur le testing en France
Première étude sur le testing en France
 
Multi-Device Prototypes
Multi-Device PrototypesMulti-Device Prototypes
Multi-Device Prototypes
 
Tests Dinterface SWT
Tests Dinterface SWTTests Dinterface SWT
Tests Dinterface SWT
 

Similaire à Storyboarding for the web : Methodology and Tools

Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019
Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019
Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019Oeil de Coach
 
Introduction Gestion Projet web
Introduction Gestion Projet webIntroduction Gestion Projet web
Introduction Gestion Projet webguest6d3f53
 
MultiTouch SNCF - REX Steria et I-Breed
MultiTouch SNCF - REX Steria et I-BreedMultiTouch SNCF - REX Steria et I-Breed
MultiTouch SNCF - REX Steria et I-BreedSteria
 
introduction à la gestion de projet
introduction à la gestion de projetintroduction à la gestion de projet
introduction à la gestion de projetlaureno
 
Webdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsWebdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsOlivier Dommange
 
Kinect en moins de 10 Minutes
Kinect en moins de 10 MinutesKinect en moins de 10 Minutes
Kinect en moins de 10 MinutesMicrosoft
 
Retour d'expérience sur la conception et la construction d'une application ME...
Retour d'expérience sur la conception et la construction d'une application ME...Retour d'expérience sur la conception et la construction d'une application ME...
Retour d'expérience sur la conception et la construction d'une application ME...Microsoft Technet France
 
Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013Julien LE THUAUT
 
Design systems : Bench et reco sur les outils
Design systems : Bench et reco sur les outilsDesign systems : Bench et reco sur les outils
Design systems : Bench et reco sur les outilsIdean France
 
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?Idean France
 
Graphisme et ergonomie des projets… horribles - Kiwi Party 2014
Graphisme et ergonomie des projets… horribles - Kiwi Party 2014Graphisme et ergonomie des projets… horribles - Kiwi Party 2014
Graphisme et ergonomie des projets… horribles - Kiwi Party 2014Actency
 
Conf EXALT TLD - ChatGPT impact Design
Conf EXALT TLD - ChatGPT impact DesignConf EXALT TLD - ChatGPT impact Design
Conf EXALT TLD - ChatGPT impact DesignTanguyLeDuff1
 
Réussir la réalisation de son MVP ou son PoC
Réussir la réalisation de son MVP ou son PoCRéussir la réalisation de son MVP ou son PoC
Réussir la réalisation de son MVP ou son PoCOwlie
 
WygDay 2010 - session plénière
WygDay 2010 - session plénièreWygDay 2010 - session plénière
WygDay 2010 - session plénièreWygwam
 
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Mohammed JAITI
 

Similaire à Storyboarding for the web : Methodology and Tools (20)

Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019
Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019
Mieux rediger-les-user-stories-bonnes-pratiques-oeildecoach 2019
 
Introduction Gestion Projet web
Introduction Gestion Projet webIntroduction Gestion Projet web
Introduction Gestion Projet web
 
Interactivite@ledna
Interactivite@lednaInteractivite@ledna
Interactivite@ledna
 
MultiTouch SNCF - REX Steria et I-Breed
MultiTouch SNCF - REX Steria et I-BreedMultiTouch SNCF - REX Steria et I-Breed
MultiTouch SNCF - REX Steria et I-Breed
 
introduction à la gestion de projet
introduction à la gestion de projetintroduction à la gestion de projet
introduction à la gestion de projet
 
Webdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsWebdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outils
 
Kinect en moins de 10 Minutes
Kinect en moins de 10 MinutesKinect en moins de 10 Minutes
Kinect en moins de 10 Minutes
 
FOF Spécial Webinaire.pdf
FOF Spécial Webinaire.pdfFOF Spécial Webinaire.pdf
FOF Spécial Webinaire.pdf
 
Retour d'expérience sur la conception et la construction d'une application ME...
Retour d'expérience sur la conception et la construction d'une application ME...Retour d'expérience sur la conception et la construction d'une application ME...
Retour d'expérience sur la conception et la construction d'une application ME...
 
Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013
 
Design systems : Bench et reco sur les outils
Design systems : Bench et reco sur les outilsDesign systems : Bench et reco sur les outils
Design systems : Bench et reco sur les outils
 
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
 
Graphisme et ergonomie des projets… horribles - Kiwi Party 2014
Graphisme et ergonomie des projets… horribles - Kiwi Party 2014Graphisme et ergonomie des projets… horribles - Kiwi Party 2014
Graphisme et ergonomie des projets… horribles - Kiwi Party 2014
 
Conf EXALT TLD - ChatGPT impact Design
Conf EXALT TLD - ChatGPT impact DesignConf EXALT TLD - ChatGPT impact Design
Conf EXALT TLD - ChatGPT impact Design
 
Batir Un Site Web 2011
Batir Un Site  Web 2011Batir Un Site  Web 2011
Batir Un Site Web 2011
 
WygDay 2010
WygDay 2010WygDay 2010
WygDay 2010
 
Réussir la réalisation de son MVP ou son PoC
Réussir la réalisation de son MVP ou son PoCRéussir la réalisation de son MVP ou son PoC
Réussir la réalisation de son MVP ou son PoC
 
WygDay 2010 - session plénière
WygDay 2010 - session plénièreWygDay 2010 - session plénière
WygDay 2010 - session plénière
 
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
 
Nlle présentation
Nlle présentationNlle présentation
Nlle présentation
 

Storyboarding for the web : Methodology and Tools

  • 1. WORKSHOP CONCEPTION DE STORYBOARDS Mardi 30 oct. 2007 © Eric DI POL - 2007
  • 2.
  • 3. 1. Vocabulaire wireframe layout zoning détaillé blueprint maquette fonctionnelle prototype storyboard © Eric DI POL - 2007
  • 4. > Surtout pour : - Définir le contenu de chaque écran, mais aussi la structure, le fonctionnement et les process liés à l’application, - Faire valider au client les pages, leur contenu, leur structure et la navigation qui les lie entre-elles, - Servir de base aux spécifications, - Des tests utilisateur > Mais aussi pour : - Faciliter le travail des créatifs lors de la phase de production, - Anticiper d’éventuels développements lourds, … 2. Des wireframes : pourquoi faire ? © Eric DI POL - 2007
  • 5. > En Agence : L’équipe projet : Ergonome, Concepteur, Chef de Projet, DA, Développeur… > Lors des tests utilisateurs : Un panel de l’audience finale (fonction du projet) > Chez le Client : Responsable e-Business, Communication, Marketing… Toute personne chargée de valider la partie fonctionnelle du projet. 3. Des wireframes : pour qui ? © Eric DI POL - 2007
  • 6. 4. Un storyboard, ce n’est pas… ZONE IDENTITE 2 ZONE IDENTITE 3 MENU Editorial Zone de PUSH Produit MENU Fonctionnel FOOTER CONTENU PRINCIPAL ZONE IDENTITE 1 LOGO Zone de PUSH : Actu / Service / Magasin Chemin de navigation … un zoning Le zoning est l’étape qui précède la mise en place des storyboards / wireframes qui sont, eux, beaucoup plus précis. Zone de RECHERCHE © Eric DI POL - 2007
  • 7. 4. Un storyboard, ce n’est pas… … une maquette Dans le storyboard, on s’attache principalement au contenu Présent sur la page, à l’aspect Fonctionnel et ergonomique. L’aspect graphique doit être « évacué », « ce n’est pas ce que j’ai validé, ce bouton n’était pas placé ici… » © Eric DI POL - 2007
  • 8.
  • 9.
  • 10.
  • 11. 8. Les outils : comparatif * Outils online © Eric DI POL - 2007 NOTE FINALE Adapté au print Adapté à l’écran Prise en main / Utilisation Interactivité Export HTML Prototypage rapide Création de wireframe 12/20 8/20 9/20 12/20 11/20 /20 14/20 15/20 16/20 ** ** *** * * **** **** **** ** ** * **** **** *** **** **** *** *** * * ** **** ** ** * ** ** **** *** ** *** **** * * * **** ** ** **** **** ** * * ** ** **** *** *** *** * * *** ** *** **** **** Gliffy * Acrobat Photoshop Illustrator Dream weaver Flash Omni graffle PowerPoint Visio Axure
  • 12. 8. Les outils online : Gliffy © Eric DI POL - 2007
  • 13.
  • 14. 8. Les autres outils : démos Démos de : MS-Powerpoint MS-Visio Axure RP Pro © Eric DI POL - 2007
  • 15. Blogs Biblio 9. Blogs / Biblio / Downloads www.boxandarrows.com www.guuui.com www.uie.com/brainsparks www.digital-web.com www.uxmatters.com « Communicating Design » (Dan M. Brown – 2006) « Effective prototyping for software makers » (J. Arnowitz, M. Arent & N. Berger – 2007) « Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces » (C. Snyder – 2007) © Eric DI POL - 2007
  • 16. 9. Blogs / Biblio / Downloads Pour Omnigraffle : - URL GreyHot : - Garrett Dimon : - IA Institute Pour Visio : - Web prototyping tool - Wireframe stencil 2003 (Garrett Dimon) - IA Institute Pour Powerpoint : - IA Institute (dont le wireframe de F. Cavazza) http://urlgreyhot.com/personal/resources/omnigraffle_wireframe_palette http://v1.garrettdimon.com/resources/templates-stencils-for-visio-monigraffle http://www.iainstitute.org/en/learn/tools.php Downloads http://www.iainstitute.org/en/learn/tools.php http://www.iainstitute.org/en/learn/tools.php http://www.guuui.com/downloads/GUUUI%20Web%20Prototyping%20Tool%203.zip http://v1.garrettdimon.com/files/resources/ia_tools/Visio_2003.zip © Eric DI POL - 2007
  • 17.
  • 18. MERCI ! Plus d’infos : http://www.superfiction.net/blog © Eric DI POL - 2007