• Save
Support_Cours 2 Master Pranet Université Rennes 2
Upcoming SlideShare
Loading in...5
×
 

Support_Cours 2 Master Pranet Université Rennes 2

on

  • 771 views

Support de cours #2 Master PRANET Université Rennes 2

Support de cours #2 Master PRANET Université Rennes 2

Statistics

Views

Total Views
771
Views on SlideShare
771
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Support_Cours 2 Master Pranet Université Rennes 2 Support_Cours 2 Master Pranet Université Rennes 2 Presentation Transcript

    • DESIGN DE SERVICESLaurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Origine du design de services3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Origine du design de services3. DESIGN DE SERVICES " Quand deux cafés se situent lun à coté de lautre et vendent exactement le même café au même prix, le design de services est ce qui vous incite à franchir lune des deux portes. 31 Volts Design Service " Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Intérêts du design de services3. DESIGN DE SERVICES Approche globale entre les différents secteurs de l’industrie Affinage des usages Innovation à différentes échelles : micro Projets & macro transversaux et organisation verticale Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services Bornes Navigo Attoma Design3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services Hipmunk Service de gestion de trajets3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services Bornes Navigo Attoma Design3. DESIGN DE SERVICES App  Store A1-­‐  ATELIER  DESIGN  D’INTERACTIVITE  2011-­‐2012 h&p://www.flickr.com/photos/crisFano_be&a/2909483129 F.Michel - L. Neyssensas - C.Thiery Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services Digitick Billeterie dématérialisée3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exemples de designs de services Google Wallet Mobile + Porte monnaie3. DESIGN DE SERVICES Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Anticipation & Prospection3. DESIGN DE SERVICES Orienter des Anticipation secteurs de des usages l’industrie Positionnement stratégique Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Partie 3 : Cycle de vie d’un projet Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Partie 2 : Cycle de vie d’un projetSommaire1. INTRODUCTION- Place du designer- Cadrer un projet2. CYCLE D’UN PROJET DESIGN- Définition & problématique- Recherche- Exploration- Realisation3. OUTILS- txt4. INNOVATION & CREATIVITÉ- txtBILAN Lifecycle h&p://fr.wikipedia.org/wiki/Fichier:Frog_lifecycle.jpg Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Acteurs d’un projets1. INTRODUCTION Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Place du Designer1. INTRODUCTION Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Cadrer un projet1. INTRODUCTION Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Titre Les étapes dun projet de design2. CYCLE D’UN PROJET DESIGN Implémentation Problématique Recherche Exploration Réalisation Développement & mise en ligne Architecture de Définition du projet Analyse de Production des Développement linformation, & objectifs l’existant (stats, etc.) contenus éditoriaux back-end scénarios dusage Observation des Cahier des charges, Design de linterface Déclinaison des attentes et usages Recettage, tests brief graphique principaux gabarits des utilisateurs Raffinement des Développement Recueil des besoins pistes de travail front-end Contexte : technologie, contraintes, culture de l’entreprise, parties prenantes Benoît Drouillat, architecte de linformation, www.drouillat.com Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Définition & problématique From Scratch2. CYCLE D’UN PROJET DESIGN Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Définition & problématique Projet Client2. CYCLE D’UN PROJET DESIGN Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Exploration2. CYCLE D’UN PROJET DESIGN Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Réalisation2. CYCLE D’UN PROJET DESIGN Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Réalisation Front end2. CYCLE D’UN PROJET DESIGN www.createlier.org Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Réalisation Back end2. CYCLE D’UN PROJET DESIGN www.createlier.org Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Réalisation Déclinaisons2. CYCLE D’UN PROJET DESIGN h&p://precious-­‐forever.com/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Réalisation Déclinaisons2. CYCLE D’UN PROJET DESIGN Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Réalisation La plasticité des interfaces est leur capacité à s’adapter à leur contexte dans le respect de leur utilisabilité.Plasticité des interfaces Utilisateur Plate-Forme IHM Environnement Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Finalisation Tests / Recettage / LivraisonCYCLE D’UN PROJET DESIGN Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Veille créativeOUTILS h&p://www.netvibes.com/lecolededesign#veille_design Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Le carnet de notesOUTILS Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Le planningOUTILSDoth&p://www.flickr.com/photos/13124525@N00/134228354 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Le wireframing2. OUTILS h&p://bit.ly/qpfdBY Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Le wireframing (exemple)l’interface finie“ahead” / C. Faydi et M. Denié / 2010 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Hiérarchisation des fonctionsLe wireframing (exemple) Séquence de navigationdessin Définition des interacteurs Mise en forme des contenus“ahead” / C. Faydi et M. Denié / 2010 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Eléments nécessaires à la réalisation de l’interface graphiqueLe wireframing (exemple) Wireframe (gabarits)Production Mockup (maquette graphique) / Layout Préconisations et Spécifications techniques“Subatech” / S. Mouton et A. Milien / 2010 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Wireframing (Pencil)Outils Langages (xHTML, CSS, Javascript, Php, MySql)Production Logiciels (Bloc notes !, Adobe DreamWeaver… Filezilla) Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • OutilsProduction Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Outils http://littlebigdetails.com/Production Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Outils http://verifyapp.com/Production Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Innovation ? Descendante2. INNOVATION & CREATIVITÉ« You cant just ask customers what they want and then try togive that to them. By the time you get it built, theyll wantsomething new. »Steve Jobs 2005 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Innovation ? Ascendante2. INNOVATION & CREATIVITÉ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Innovation ? De rupture2. INNOVATION & CREATIVITÉ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Créativité ? Entonnoir2. INNOVATION & CREATIVITÉ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Créativité ? Itérative2. INNOVATION & CREATIVITÉh&p://www.flickr.com/photos/ario/2284113847 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • I/O Partie 4 : Entrées / Sortieskorean_tupperwareh&p://www.flickr.com/photos/regarde/456378850 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Partie 1 : Introduction.http://www.intel.com/pressroom/innovation/archive.htm Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Partie 1 : IntroductionSommaire 1. PRINCIPE DENTREES SORTIES 2. INTERACTEURS PHYSIQUES 3. TRANSMISSION DE DONNEES ET GEOLOCALISATION 4. DETECTIONS VIDEO (computer vision) 5. EVOLUTIONS.http://www.intel.com/pressroom/innovation/archive.htm Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties On appelle Entrées-Sorties les échanges dinformations entre le processeur et les périphériques qui lui sont associés. De la sorte, le système peut1. Principes réagir à des modifications de son environnement, voire le contrôler. Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Les capteurs logiques traduisent 2 états (ouvert/fermé)Entrées Sorties Les capteurs analogiques traduisent une infinité d’états. Interrupteurs : 1 « bouton » = 1 action (on/off…)Interacteur Physique ( à contact ) Variateurs : Potentiomètres = variation de l’effet de l’action (linéaires/rotatifs) h&p://www.flickr.com/photos/loneyss/5724111291/in/set-­‐72157626729246032 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Les capteurs permettent de récupérer, à des fins de traitement, les informations relatives à la situation courante d’un utilisateur et de2. Interacteur Physique ( sans Contact ) l’environnement. “ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties On trouvera sur le site « Interfaces-z » une liste exhaustive de capteurs http://www.interface-z.com/produits/index.htm2. Interacteur Physique ( sans Contact ) Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Les transmissions de données sans fil permettent non seulement la circulation de l’information mais également la localisation de3. Transmission de données et géolocalisation l’utilisateur en temps réelhttp://www.flickr.com/photos/twicepix/3173645095/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Les transmissions sont quantifiées par : leur portée: distance maximale de réception par rapport à l’émetteur (en mètres)3. Transmission de données et géolocalisation leur débit : quantité d’information qui peut être transportée ( bit/secondes ) Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Le Wi Fi est une technologie basée sur la norme IEEE 802.11 qui concerne la mise en place de réseaux informatiques internes sans fils qui est devenue un moyen d’accès à haut débit. 3. Le Wi Fiw.flickr.com/photos/brendangates/299362817/in/photostream/lightbox/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Technologie radio courte distance conçue par Ericsson en 1994 destiné à simplifier les connexions entre les appareils électroniques (7 esclaves «actifs».3. BlueTooth http://www.flickr.com/photos/rickyromero/3744838397/in/photostream/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Le standard Bluetooth se décompose en différentes normes permettant d’obtenir des débits de 1 à 100 mW (Milliwatt) soit des portée entre quelques mètres et une centaine .T 3. BlueToothhttp://www.flickr.com/photos/yourdon/2681728522/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Un Personal Area Network ou Body Area Network désigne la mise en réseau d’équipements nomades embarqués sur son3. BlueTooth(PAN) corps (mobile / oreillette, casques, capteurs physiologiques…) http://www.athena-gatech.org/research/BIOMEDICAL/ index.html#Antenna%20Body%20Area%20Networks Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • méthode de mémorisation et de récupération par ondes radio des données Entrées Sorties stockées dans des « radio-étiquettes » (« RFID tag » ou «  RFID transponder). Les tags sont collés ou incorporés dans des objets (étiquette électronique de Radio Frequency Identification type « code barre »), produits (cartes d’accès, de transport, de paiement…)http://izationlabs.com/2009/12/22/a-body-mod-most-curious/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées SortiesR.F.I.D Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties donne en temps réel la localisation géographique d’un utilisateur. A noter : Le GPS ne fonctionne qu’en extérieur !! (nécessite 4 Global Positionning System satellites) / Précision de 10 à 20 mètres et de 5 à 3 mètres (DGPS)http://www.flickr.com/photos/olibac/2415284302/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées SortiesRécapitulatif Transmission de données et géolac Nokia Sports Tracker (beta) GPS : N’importe où sur la planète… mais en extérieur ! WiFi / GPRS : Triangulation par rapport à plusieurs bornes Bluetooth : Proximité de l’émetteur fr/) RFID : Par contact ou rapproché Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties “The Catalogue ” / Chris Oakley / 2004 VidéoCybersurveillance Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Analyse et d’interprétation en temps réel d’une image captée par une simpleEntrées Sorties « Webcam ». Cette technologie très abordable ouvre la voie à de nombreusesDétection Vidéo / Computer Vision applications de « Tracking » et d’identification telles que celles employées en RA Webcam Logitech Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Il existe des « bibliothèques » de composants logiciels qui permettent de détecter une forme (ici une main) et de suivre ses déplacements en temps réel.Détection et Trackinghttp://en.wikipedia.org/wiki/OpenCV Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Ils permettent d’inscrire dans l’espace physique des informations numériques consultables via tous types de caméras (Mobiles). Quick Response Code Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Quick Response Code Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Ils permettent de capter la position d’un objet dans l’espace mais aussi sonEntrées Sorties orientation (x,y et z). Aujourd’hui les AR Markers disparaissent au profit de symboles plus simples, d’images photographiques ou encore grâce à la seule Augmented Reality Markers géolocalisation & inclinaison (mobiles). Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties « Controller-less » Kinnect par Microsoft Détection de 4 joueurs, Reconnaissance faciale & vocale…Evolution Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Entrées Sorties Envisager les opportunités et les possibilités techniques en amont du projet. Proposer des principes, schéma technique…Conclusionhttp://www.flickr.com/photos/tornad3/5193474102/in/photostream/ Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • # Architecture / Schéma de navigation# Ergonomie# Fonctionnalité# Graphisme# Bilan UXEye  Tracking  h&p://www.gazehawk.com/blog/wp-­‐content/uploads/2011/08/applecomparison.png PDF A3 Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Création d’une partie galerie photo (Front End et Back End) intégré dans un site institutionnel Réalisation d’une proposition d’interface graphique Wireframe (gabarits) Mockup (maquette graphique) / Layout Préconisations et Spécifications techniques Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012
    • Ce support est un «mash-up» issu de collaborations et production avec : Grégoire Cliquet (lecolededesign.com - READi) Florent Michel (lecolededesign.com - READi) Clément Thiery (lecolededesign.com - anthitheses.com)Illustration : http://www.flickr.com/photos/loneyss/sets/72157609816817388/with/3667502087/ (sauf indication contraire) Laurent Neyssensas Master Communication- PRANET : «Internet et design» Février 2012