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/DesignLab
Recherche 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
Sommaire




1. 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 suffisant
                                                         pour exprimer nos connaissances »
                                                                                               Janet Murray




Universum - 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érique




BooK: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
Paradigmes




La 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 textuelles
Le résultat des actions sur les objets est immédiatement visible
Les 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 Utilisateur
Permet lʼinteraction avec un ordinateur. Nécessité dʼun langage commun.

Dispositifs de contrôle physiques
Graphical User Interfaces
Voice User Interfaces
Gestuelle


                                                                                                                               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 Utilisateur
GUI : 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 interfaces




Les apports de la SF
Minority 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
Underkoffler
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_underkoffler_drive_3d_data_with_a_gesture.html                                                                                     F.Michel - L. Neyssensas - C.Thiery
Langages et paradigmes futurs
2. 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 futurs
2. 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 futurs




Interfaces gestuelles physiques
Le 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étuelle




UX : 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éel
Ré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.flickr.com/photos/regarde/456378850
Entrées Sorties   On appelle Entrées-Sorties les échanges d'informations entre le processeur et les
                  périphériques qui lui sont associés. De la sorte, le système peut réagir à des
1. Principes      modifications 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 fins 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é à simplifier les connexions entre les appareils électroniques (7
                                                                              esclaves «actifs».
  3. Blue Tooth




http://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 IDentification 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.D




http://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 IDentification 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.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 bornes
3.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 (frais
4. 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ʼespace

Entrées Sorties   mais aussi son 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
                  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 son
heure 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 destination
finale 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 compagnie
de transports.




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

Neyssensas
S’éditer
Appli




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

Neyssensas
Editer
Appli




        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
image


humain


 lieu    texte                                                                      média


                                                                    machine

         flux
         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 Thiery




http://www.lecolededesign.com
http://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

  • 1.
    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
  • 2.
    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
  • 3.
    READI/DesignLab Recherche Expérimentales Appliquéesen 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
  • 4.
    Sommaire 1. 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
  • 5.
    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
  • 6.
    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
  • 7.
    Livre VS Numérique « le monde imprimé [n’était] plus suffisant pour exprimer nos connaissances » Janet Murray Universum - 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
  • 8.
    Livre VS Numérique BooK:Laré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
  • 9.
    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
  • 10.
    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
  • 11.
  • 12.
    Paradigmes La 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 textuelles Le résultat des actions sur les objets est immédiatement visible Les 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
  • 13.
    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
  • 14.
    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
  • 15.
    Interface ? Interface Utilisateur Permetlʼinteraction avec un ordinateur. Nécessité dʼun langage commun. Dispositifs de contrôle physiques Graphical User Interfaces Voice User Interfaces Gestuelle 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
  • 16.
    Interface ? Interface Utilisateur GUI: 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
  • 17.
    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
  • 18.
    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
  • 19.
    Innovation dans lesinterfaces Les apports de la SF Minority 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
  • 20.
    Innovation dans lesinterfaces John
Underkoffler
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_underkoffler_drive_3d_data_with_a_gesture.html F.Michel - L. Neyssensas - C.Thiery
  • 21.
    Langages et paradigmesfuturs 2. 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
  • 22.
    Langages et paradigmesfuturs 2. 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
  • 23.
    Langages et paradigmesfuturs Interfaces gestuelles physiques Le 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
  • 24.
    UX & bêtaperpétuelle UX : 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
  • 25.
    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
  • 26.
    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
  • 27.
    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
  • 28.
    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
  • 29.
    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
  • 30.
    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
  • 31.
    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
  • 32.
    Une interaction entemps réel Ré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
  • 33.
    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
  • 34.
    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
  • 35.
    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
  • 36.
    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.flickr.com/photos/regarde/456378850
  • 37.
    Entrées Sorties On appelle Entrées-Sorties les échanges d'informations entre le processeur et les périphériques qui lui sont associés. De la sorte, le système peut réagir à des 1. Principes modifications 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
  • 38.
    Entrées Sorties Les capteurs permettent de récupérer, à des fins 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
  • 39.
    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. Blue Tooth http://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
  • 40.
    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
  • 41.
    Radio Frequency IDentificationest 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.D http://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
  • 42.
    Radio Frequency IDentificationest 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.D Interac(on_interac(vité_interface:
plas(cité
des
supports_u(lisateurs/
IUT
La
Roche
sur
Yon/20
Octobre
2011
/Laurent

Neyssensas
  • 43.
    Entrées Sorties GPS : Nʼimporte où sur la planète… mais en extérieur ! WiFi / GPRS : Triangulation par rapport à plusieurs bornes 3.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
  • 44.
    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
  • 45.
    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 (frais 4. 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
  • 46.
    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
  • 47.
    Les Augmented RealityMarkers permettent de capter la position dʼun objet dans lʼespace Entrées Sorties mais aussi son 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 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
  • 48.
    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 son heure 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 destination finale 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 compagnie de transports. Interac(on_interac(vité_interface:
plas(cité
des
supports_u(lisateurs/
IUT
La
Roche
sur
Yon/20
Octobre
2011
/Laurent

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

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

Neyssensas
  • 51.
    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
  • 52.
    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
  • 53.
    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
  • 54.
    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
  • 55.
    image humain lieu texte média machine flux Interac(on_interac(vité_interface:
plas(cité
des
supports_u(lisateurs/
IUT
La
Roche
sur
Yon/20
Octobre
2011
/Laurent

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

Neyssensas

Notes de l'éditeur

  • #2 \n
  • #3 Enseignant et Responsable Veille Design Interactivité\n\n* A1: Dossier Perso, Culture Image et Recherche Documentaire \n* A2 : Veille et Positionnement projet\n* A3 : Atelier Veille et Suivi de projet\n* Missions Projet VR4D, Readi\n
  • #4  Tangible Interfaces\n Virtual Reality\n Visualizing and Sharing Knowledge\n
  • #5 Objectifs : parler Livre et multisupport je ne vais donc pas parler de livre car mes compétences en ce domaine sont faibles un lecteur .Mais plutot traiter le livre comme contenu d’information et tenter de vous dresser un panorama des changements actuels .Ils sont de plusieurs ordre \nTechnologique Théorique (paradigme d’interaction) et d’usage tout cela est bien entendu lié Il s’agir donc de partager avec vous différents ingrédients qu’il est selon moi nécessaire de connaitre pour envisager les défis futurs dans le métier de l’édition.\nJe vais vous demander un effort de grand écart de tenter de sortir du livre et de penser contenu. Il s’agit d’un propos de designer (Digital Media. )\ndes nouvelles façon d’interagir avec des contenus en ligne et des enjeux de ces nouvelles modalités d’interactions ? Comment le designer aborde t -il la plasticité des interfaces ? Quels peuvent être les changements en terme de scénarisation et de production dans les pratiques et les métiers l’édition ?\n
  • #6 \n
  • #7 \n
  • #8 Un malentendu qui à peur de l’autre \nLes débats furent marqués par le conflit opposant technophiles et technophobes . Sasn doute le côté iconoclaste des littéraires, le texte seul. L’illustration es t la perversion de la lecture \n 25 % de la population ne lit pas ? Avant même de s’interroger sur les bienfaits ou les méfaits de la technologie, d’autres questions, plus urgentes, semblent donc se poser.\nIllustration de \nUn paradigme est une représentation du monde, une manière de voir les choses, un modèle cohérent de vision du monde qui repose sur une base définie (matrice disciplinaire, modèle théorique ou courant de pensée). C'est une forme de rail de la pensée dont les lois ne doivent pas être confondues avec celles d'un autre paradigme et qui, le cas échéant, peuvent aussi faire obstacle à l’introduction de nouvelles solutions mieux adaptées.\n
  • #9 Un vieux fond jugement techno reflexe conservatisme la peur comme l’adhésion fascination \n
  • #10 Acronyme anglais pour « Windows, Icons, Menus and Pointing device », (fenêtres, icônes, menus et dispositif de pointage), le paradigme WIMP présente des bases fonctionnelles d'une interface graphique informatique.\nCe type d'interface, inventé à la fin des années 1970, et répandu dans les années 1980, est présent dès les années 1990 sur quasiment tous les types de systèmes d'exploitation, rendant l'apprentissage de la bureautique très aisé.\n\nSouris : Douglas Engelbart 1968\nTrackball (ici intégré à une souris)\nTrackPad : Ordinateurs portables\nJog Shuttle (mobiles)\nJoystick (jeux)\nTablette Graphique : Infographie\n\n
  • #11 Souris : Douglas Engelbart 1968\nTrackball (ici intégré à une souris)\nTrackPad : Ordinateurs portables\nJog Shuttle (mobiles)\nJoystick (jeux)\nTablette Graphique : Infographie\n\n\n\n
  • #12 un périphérique de pointage peux être détournée soit de son usage ici l’analyse d’image peut être aussi un pilotage ou on le verra plustard dans le principe du hack kinnect\nlien ver ananlyse lecture IPAD\n
  • #13 CLI Ligne de commandes VS Graphical User Interface GUI\n La manipulation directe repose sur 2 métaphores :\n - La métaphore de la description\n - La métaphore du monde réel\n\n
  • #14 What You See… Is What You Get !!\n\n\n\n
  • #15 Avant de parler d’interfaces numériques, qu’est ce qu’une interface, son sens premier?\n\n
  • #16 Définition de l’interface utilisateur : \nLimite commune à deux systèmes, deux entités permettant des échanges entre eux. \nElle favorise le dialogue (l’interaction) entre les machines et les humains \npar la stimulation des sens via des périphériques appropriés : \n\nAssociés aux 4 sens suivants : \nLe toucher : Dispositif de pointage : clavier, souris, stylet, écran tactile\n La vue : GUI, ou Graphical User Interface via une affichage écran\nL’ouïe : VUI, ou Voice User Interface via des commandes vocales\nLa gestuelle : Analyse des mouvements du corps, du visage\n\n\n\n\n\n\n\n
  • #17 Les éléments : Concept , Fonctionnalités , Architecture, Contenu, Interactions, Graphisme\nLe designer ne fait pas de joli ou de gratuit. Il teste plusieurs options avant d’aboutir à une solution finalisée. C’est la méthode de conception en entonnoir. \n\nLa but est de créer un environnement cohérent en adéquation avec les fonctionnalités proposées.\nUne interface réussie est avant tout une interface bien conçue en amont. \n\n\n\n\n\n\n\n\n
  • #18 Microsoft Surface\nParadigme d’éléments pouvant être manipulés et déplacés.\nOublier la dimension Portrait / Paysage, l’interface doit être flexible.\n\n\n\n\n\n\n\n\n
  • #19 Microsoft Surface\nParadigme d’éléments pouvant être manipulés et déplacés.\nOublier la dimension Portrait / Paysage, l’interface doit être flexible.\n\nvideo Tony\nhttp://www.remanences.org/mindflow/\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
  • #20 La semaine dernière, nous avons parlé d’innovation ascendante et descendante.\n\nLa science fiction est également un vecteur d’innovation\n\n\n\n\n\n\n\n\n\n
  • #21 10 Février 2010\n\n\n\n\n\n\n\n\n\n
  • #22 La Reactable (ReacTable) est un instrument de musique électro-acoustique, créé à l'université Pompeu Fabra de Barcelone, Espagne. Björk l'utilise en concert pour sa tournée Volta 20071. Il s'apparente aux ondes Martenot.\n\nMicrosoft Surface a déjà proposé des scénarios d’exploration de contenus mobiles sur une table connectée. \n\n
  • #23 Le projet SixthSense (« sixième sens »), parfois dénommé WUW pour Wear ur world, est un projet d'ordinateur ubiquitaire et dématérialisé.\n\nCe projet est en cours de développement au MIT par Steve Mann, Pranav Mistry et Pattie Maes au MIT Media Lab et a été présenté en 2001. Ce projet était intitulé à l'origine Synthetic Synesthesia of the Sixth Sense\n\nIl s'agit d'un système logiciel et d'interfaces permettant de transformer des objets de l'environnement quotidien en des éléments d'un ordinateur semi-dématérialisé, qu'on emporte avec soi ; de nombreux objets deviennent supports possibles d'information ou d'interaction.\n\n
  • #24 La wiimote, connue car en avance sur son temps.\n\nAvantage : préhension de l’objet\nDésavantage, comme toutes les interfaces gestuelles ou tactiles : absence de feedback et donc, de ressenti physique de l’expérience\n
  • #25 Qualifier le résultat et le ressenti de l'utilisateur lors d'une manipulation d'un objet fonctionnel ou d'une interface homme-machine via une interface utilisateur de manière heuristique par un ensemble de facteurs. Un mix entre le plaisir ressenti et l’efficacité du médium.\n\n
  • #26 du GUI to NUI la position et la gestuelle comme mode d’interaction\nla disparition des interface graphiques et l’intelligenc embarqué dans les objets\ndes interfaces naturelles pour faciliter la collaboration \nLe DIY et la production individuellle\n
  • #27 Tangible Interfaces & Mixed Reality : \nA step toward digital augmented environments\n
  • #28 Well VR Brough a lot of innovation as accelerometer, gravitometer (wiimote) or infraRed (kinect)…\nJaron Lanier in 1985 for “computer-simulated environments”\n Virtual Reality (VR) aims by using special devices to simulate physical presence :stereoscopic display, haptic feedbacks, IR tracking…\nHuman into the Computer\n
  • #29 Well VR Brough a lot of innovation as accelerometer, gravitometer (wiimote) or infraRed (kinect)…\n
  • #30  Thomas Caudell & David Mizellin 1990 to overlap digital information in real time above the real world\n Augmented Reality acts as a filter between real space and human to enrich their experiences\n\n
  • #31 Pratique pour localiser un service avoir une information supplémaentaire (contexte etc)\ncréer une nouvelle expérience (gamification ?)\n\n
  • #32  KOBITO / Virtual Brownies (Society for the Study of Robotics / 2004)\n demo (video)\n
  • #33  Paul Milgram and Fumio Kishino in 1994 defined mixed reality as the merging of real and virtual worlds to produce new environments and visualisations where physical and digital objects co-exist and interact in real time\n Mixed Reality enables users to interact physically with augmented art\n
  • #34 2. New paradigm in computing: VR / AR / MR ?\nVarious Realitie(S) related to their relationships with the “real” (perceived) environment\n New paradigms in computing // Keyboard + Mouse + Screen = Obsolete !\n\nFrom Direct Manipulation (B. Schneiderman / 1982) to Natural User Interaction\n Follow the state of child’s evolution :\nMouse to Point and Click / Multi-Touch Surfaces / Tangible & Gesture interactions (manipulating & moving)\n Find new metaphors to describe gesture and natural interactions (implying the body)\n
  • #35  Virtual Reality : Generates spaces & objects (simulation / past-present-future)\n Augmented Reality : Enriches existing spaces & objects (extra information / past-present-future)\n Computers which are based on time to calculate are able to generate space (Time Generate Spaces)\n Time Shifted + Augmented Spaces = “another” reality / new means of expression (art)\n
  • #36  Virtual Reality : Reinforce the feeling of being immerged into a virtual space (sens + emotions) by extending implied senses : Proprioception / Kinesthetic…\n Augmented Reality : How do I perceive that an environment, an object is augmented ?\n It’s often much more interesting to observe people’s reactions more than the disposal in itself !!\n\nHow users know that they can interact, “anyware” ? \n Affordance ? (Don. Norman) // How to these new Devices / Objects / Spaces will explain us their functioning ?\n New ways to design meaningful and usable “augmented” objects and spaces (tangible interfaces)\nThe cyberspace is too large to fit into my screen… so…\n Expand it into the real World !\n\nBut… Would it be large enough ?\n
  • #37 Vidéo\n
  • #38 Dans un système à base d'un processeur, d'un microprocesseur, d'un microcontrôleur ou d'un automate, on appelle Entrées-Sorties les échanges d'informations entre le processeur et les périphériques qui lui sont associés. De la sorte, le système peut réagir à des modifications de son environnement, voire le contrôler.Elles sont parfois désignées par l'acronyme I/O, issu de l'anglais Input/Output.\n\n
  • #39 \nVidéo\n
  • #40 Le nom Bluetooth est directement inspiré du roi danois Harald Ier surnommé Harald Blåtand (« homme à la dent bleue »), \nconnu pour avoir réussi à unifier les États du Danemark, de Norvège et de Suède. Le logo de Bluetooth, est d'ailleurs inspiré des initiales en alphabet runique du Futhark récent de Harald Blåtand :  (Hagall) (ᚼ) et  (Bjarkan) (ᛒ).\n\nBlue tootth\nRFID\nWifi\n
  • #41 A noter : Le protocole « ZigBee » (moins chère et plus simple) http://fr.wikipedia.org/wiki/Zigbee\n
  • #42 A noter : Voir l’ensemble des spécifications (http://fr.wikipedia.org/wiki/Radio-identification)\n
  • #43 A voir : « RFID : dix applications en images (ZDNet.fr) »\nhttp://www.zdnet.fr/galerie-image/0,50018840,39391772,00.htm?xtor=EPR-100 \n
  • #44 (cf. Projet « BlueEyes » http://www.blueeyes.fr/)\n\n
  • #45 A voir : Open CV (Wiki) / http://opencv.willowgarage.com/wiki/\nProjet « SqTouch » Création Interactive de Pierre Le Bever (i2) / Tracking couleur et mix sonore.\n
  • #46 A tester : Générateur de QRCode Kaywa : http://qrcode.kaywa.com/\n
  • #47 A tester : Générateur de QRCode Jaxo-Systemes : http://www.jaxo-systems.com/barshow/ \nA voir : « Bocode » (Ramesh Raskar / MIT) / http://web.media.mit.edu/~ankit/bokode/\n
  • #48 Vidéo : « Ceci n’est pas une boîte de Chocapic » http://www.youtube.com/watch?v=p3QgigeSE1s / 2010\n\nVidéo : http://www.metroparisiphone.com/ 2010\n\nA voir : Projets de Frantz Lasorne, Nicolas Guyon, David Arenou…\n
  • #49 \n
  • #50 méalnge de ses information de celle des autres dans un rapport à l’édition\n
  • #51 méalnge de ses information de celle des autres dans un rapport à l’édition\n
  • #52 \n
  • #53 \n
  • #54 \n
  • #55 http://www.youtube.com/watch?v=h74x9O3EtIo\n
  • #56 \n
  • #57 \n