Journée numerique11

http://www.flickr.com/photos/gregoirecliquet/5603411030/Laurent Neyssensas / L’Ecole de design Nantes Atlantique / READi design lab Journée Numérique à La Roche sur Yon Interaction_interactivité_interface : plasticité des supports_utilisateurs Jeudi 20 Octobre 2011 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Laurent Neyssensas http://laurentneyssensas.lecolededesign.com/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

READI/DesignLabRecherche Expérimentales Appliquées en Design d’Interactivité http://www.flickr.com/photos/loneyss/5546547889/sizes/l/in/set-72157626191918529/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Sommaire1. Introduction 3. Paradigmes 2.0- design ? - NUI- interactivité ?- livre VS numérique 4 Entrée(s) Sortie(s)2. Paradigmes 5. Réalités- manipulation directe - Augmentée- WIMP - Virtuelle- GUI - Mixte- Interface 6. Conclusion_Discussion RePro3D / Tachi Lab IVRCTokyo 2010 . Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Design ? http://www.flickr.com/photos/loneyss/4068910451/* Une activité intégrable dans un processus projet qui a pour objectif de produire de la valeur ajoutée : Usages / Technologie / Identité* Il a pour finalité d’étendre la gamme, renforcer la marque ou faciliter l’innovation* Qualité globale perçue d’un produit ou d’un service est déterminée par le design « Un dessin à dessein » Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Interactivité ? nf.INFORM. « Qualité d’un logiciel dont l’exécution prend constamment en compte les informations fournies par l’utilisateur.» « Degré de satisfaction atteint par l’usager dans l’interaction vécue avec une machine » (interaction design / interactive design) Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Livre VS Numérique « le monde imprimé [n’était] plus sufﬁsant pour exprimer nos connaissances » Janet MurrayUniversum - C. Flammarion, Holzschnitt, Paris 1888, Kolorit : Heikenwaelder Hugo, Wien 1998 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Livre VS NumériqueBooK:La révolution Technologique Introducing The Book Livre de poche Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Paradigmes IHM Windows / Icons / Menus / Pointing Devices A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Paradigmes Windows / Icons / Menus / Pointing Devices A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

ParadigmesLa manipulation directe (Ben Schneiderman - 1982)Les objets ont une représentation permanente (métaphore des icônes)Les actions physiques directes remplacent la saisie de commandes textuellesLe résultat des actions sur les objets est immédiatement visibleLes opérations sont rapides, incrémentables et réversibles A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Paradigmes What yous see is what you get ! A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Interface ? Interface? Permettre le dialogue entre deux systèmes Interface nf. (mot anglais) Limite commune à deux systèmes, deux entités permettant des échanges entre ceux-ci. Elle permet dans le cas de l’informatique de favoriser le dialogue (l’interaction) entre les machines et les humains par la stimulation des sens par des périphériques appropriés. Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Interface ?Interface UtilisateurPermet lʼinteraction avec un ordinateur. Nécessité dʼun langage commun.Dispositifs de contrôle physiquesGraphical User InterfacesVoice User InterfacesGestuelle A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Interface ?Interface UtilisateurGUI : Graphical User Interface A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Exemples d’interfaces Microsoft Surface A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Exemples d’interfaces Microsoft Surface Table tactile : démonstrateur Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Innovation dans les interfacesLes apports de la SFMinority Report A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Minority Report Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Innovation dans les interfaces John Underkoﬄer at TED’s conference A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas hQp://www.ted.com/talks/john_underkoﬄer_drive_3d_data_with_a_gesture.html F.Michel - L. Neyssensas - C.Thiery

Langages et paradigmes futurs2. INTERFACES & INTERACTIONS Tactile & Interfaces Tangibles Faire communiquer des objets réels et des interfaces virtuelles Reactable A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 hQp://fr.wikipedia.org/wiki/Reactable Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Langages et paradigmes futurs2. INTERFACES & INTERACTIONS Interfaces gestuelles naturelles Un langage corporel pour manipuler les éléments virtuels Sixthsense A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas hQp://www.pranavmistry.com/projects/sixthsense/images/full/sixthsense04.jpg F.Michel - L. Neyssensas - C.Thiery

Langages et paradigmes futursInterfaces gestuelles physiquesLe problème du feedback Sixthsense A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas hQp://www.pranavmistry.com/projects/sixthsense/images/full/sixthsense04.jpg F.Michel - L. Neyssensas - C.Thiery

UX & bêta perpétuelleUX : Expérience utilisateur A1‐ ATELIER DESIGN D’INTERACTIVITE 2011‐2012 Nintendo Wii Commercial Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas F.Michel - L. Neyssensas - C.Thiery

Interfaces tangibles “leARn” / Victor Manselon Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Interfaces tangibles Immersive Rail shooter / David Arenou 2010 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Réalité Virtuelle http://www.flickr.com/photos/loneyss/3187497169/sizes/l/in/set-72157612394649393/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Réalité Virtuelle  VR4D “Virtual Reality For Design” / project (2010) http://www.flickr.com/photos/loneyss/5187428975/sizes/l/in/set-72157625294610619 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Réalité Augmentée L’information est partout ! Photographie de Frantz Lazorne Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Réalité Augmentée Une nouvelle ère de jeux ! http://www.layar.com Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Réalité Mixte Une nouvelle ère de jeux ! http://rogiken.org/vr/english.html Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Une interaction en temps réelRéalité Mixte entre objets réels_virtuels”Know How Augmented” / François Ballon 2011 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Paradigme 2.0 R_V.A.M Reality-Virtuality continuum according to Milgram, Takemura, Utsumi and Kishino (1994) Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Paradigme 2.0 Espace & Temps Street Museum (London) Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Paradigme 2.0 Sentir & Comprende ”Stepping Garden” / P. Thebault / 2006 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

I/O Entrées /Sorties korean_tupperware Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas hQp://www.ﬂickr.com/photos/regarde/456378850

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 peut réagir à des1. Principes modiﬁcations de son environnement, voire le contrôler. Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties Les capteurs permettent de récupérer, à des ﬁns de traitement, les informations relatives à la situation courante dʼun utilisateur et de lʼenvironnement.2. Interacteur Physique ( sans Contact ) “ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties Technologie radio courte distance conçue par Ericsson en 1994 destiné à simpliﬁer les connexions entre les appareils électroniques (7 esclaves «actifs». 3. Blue Toothhttp://www.flickr.com/photos/rickyromero/3744838397/in/photostream/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties Un Personal Aera Network ou Body Aera Network désigne la mise en réseau dʼéquipements nomades embarqué sur son corps (mobile/3. Blue Tooth (P.A.N) oreillette, casque, capteur physiologique...) http://www.athena-gatech.org/research/BIOMEDICAL/index.html#Antenna%20Body%20Area%20Networks Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Radio Frequency IDentiﬁcation est une méthode de mémorisation et de récupération par ondes radio des Entrées Sorties données 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 type « code barre »), produits (cartes dʼaccès, de transport, de paiement…) et même implantées dans des organismes vivants… 3.R.F.I.Dhttp://izationlabs.com/2009/12/22/a-body-mod-most-curious/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Radio Frequency IDentiﬁcation est une méthode de mémorisation et de récupération par ondes radio desEntrées Sorties données 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 type « code barre »), produits (cartes dʼaccès, de transport, de paiement…) et même implantées dans des organismes vivants…3.R.F.I.D Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties GPS : Nʼimporte où sur la planète… mais en extérieur ! WiFi / GPRS : Triangulation par rapport à plusieurs bornes3.Récapitulatif Bluetooth : Proximité de lʼémetteur RFID : Par contact ou rapproché Nokia Sports Tracker (beta) Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

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.4. Détection Video (Computer Vision) http://en.wikipedia.org/wiki/OpenCV Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties Les Quick Response Code permettent dʼinscrire dans lʼespace physique des informations numériques consultables via tous types de caméras (Mobiles). Lʼavantage de cette technologie est sa simplicité de mise en œuvre et son coût très abordable (frais4. QR Code dʼimpression dʼun QR Code). http://www.flickr.com/photos/loneyss/5046386633/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties Les Quick Response Code peuvent également être colorés ou peuvent intégrer des images leur conférant un aspect graphique plus attrayant.4. QR Code http://www.flickr.com/photos/loneyss/4070782245 Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Les Augmented Reality Markers permettent de capter la position dʼun objet dans lʼespaceEntrées Sorties mais aussi son orientation (x,y et z). Aujourdʼhui les AR Markers disparaissent au proﬁt de symboles plus simples, dʼimages photographiques ou encore grâce à la seule géolocalisation & inclinaison (mobiles).4. AR Markers http://www.flickr.com/photos/snoogward/3473507242/sizes/l/in/photostream/ Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Entrées Sorties Envisager les opportunités et les possibilités techniques en amont du projet. 5. Conclusion(s) Proposer des principes, schéma technique…M. Martin doit se rendre à un rendez-vous, il envisage de s’y rendre à pied lorsque le système l’informe qu’à ce rythme il sera en retard ; M.Martin pourrait alors envisager de courir… mais le système, détectant via les capteurs physiologiques de M. Martin que celui-ci ressent déjàdes signes de fatigue, et l’en déconseille fortement… en outre, une marche soutenue n’aurait que peu d’influence sur l’estimation de sonheure d’arrivée.Le système l’avise alors qu’il peut prendre le bus 41, l’arrêt le plus proche ne se trouvant qu’à une centaine de mètres dans une rue voisine.Même si le prochain bus ne passera à cet arrêt que dans une dizaine de minutes, celui-ci pourra le déposer à proximité de sa destinationfinale avant l’heure prévue ; enfin le coût du trajet fera l’objet d’une transaction directe entre la banque de M. Martin et celle de la compagniede transports. Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

S’éditerAppli Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

EditerAppli Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Concept The Future of the Book by IDEO Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Livre Interactif The Fantastic Flying Book by MonnBot Studio Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Livre Augmenté Augmented reality - VFX Breakdown by Soryn Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Livre jeu The Night Of the Living Dead Pixels by Les éditions Volumiques Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

imagehumain lieu texte média machine ﬂux Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Cette présentation est une proposition basée sur différents cours et supports réalisés en collaboration avec : Grégoire Cliquet Florent Michel Clément Thieryhttp://www.lecolededesign.comhttp://readi.lecolededesign.com Interac(on_interac(vité_interface: plas(cité des supports_u(lisateurs/ IUT La Roche sur Yon/20 Octobre 2011 /Laurent  Neyssensas

Journée numerique11

by Laurent Neyssensas on Oct 24, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

1 Embed 25

Statistics

Journée numerique11 — Presentation Transcript