SlideShare una empresa de Scribd logo
1 de 34
Descargar para leer sin conexión
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




UNIVERSAL UI
GERÄTEÜBERGREIFENDES INTERAKTIONSDESIGN




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
IICO 2011                          BERLIN
Welcome to the APP-Economy         17.05.2011




           „It's all about people and changing their minds.“




                                                         Steve Jobs 2007




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




UNIVERSAL USER INTERFACE




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




UNIVERSAL USER INTERFACE
                                                  WEB-INTERFACE


                                                                         WIDGET APPLICATION
 FACEBOOK APPLICATION




                                                                              MULTITOUCH DEVICE
  GAME CONSOLE                                     ARTE CREATIVE




                                                                          DESKTOP APPLICATION

                             INTERNET TV
                                                         MOBILE DEVICE
SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                                        4
Quelle: www.loewe.de
WEBINALE 2011                        BERLIN
Universal User Interfaces            31. Mai 2011




SCREEN EVOLUTION - HEUTE > MORGEN




                        Display Interface                Goggle Interface



SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                      12
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




GOGGLE INTERFACE




                                                         Goggle Interface
                                                         2D Mixed Reality Mode

SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                           13
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




GOGGLE INTERFACE




                                                         Goggle Interface
                                                         2D Mixed Reality Mode

SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                           14
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




                               Multitouch Computing




           Microsoft Surface                             iPad / iPhone    Xbox 360 Kinect




                                      Natürliche Gesten zur Interaktion




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
fbmedia hd_a                       DIEBURG
Von Web zu App                     20. Mai 2011




GESTEN
NATÜRLICHE, GELERNTE, SPEZIALGESTEN




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   16
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




FORMALE ASPEKTE




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   17
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




FORMALE ASPEKTE




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   18
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




FORMALE ASPEKTE




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   19
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




GESTEN




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   20
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
KEMPERTRAUTMANN                    HAMBURG
APP Workshop                       26 November 2010




MOBILE BETRIEBSSYSTEME




 Apple - iOS 4.2    Google - Android 2.1   Blackberry - Storm 1.0   HP - Symbian 9.2   Microsoft - WP7 1.0   Samsung Bada




SENSORY-MINDS GMBH 2010                                                                                                     22
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




GESTURES




 Single-touch:                                                                  Multi-touch:
 Tap                        Double Tap            Pan    Flick   Touch and hold Pinch and Stretch



 Common                                                                                  Less common
 Natural                                                                                       Enabled




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                                               23
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




                      WIE WERDEN DIESE GESTEN GENANNT?




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   24
WEBINALE 2011                         BERLIN
Universal User Interfaces             31. Mai 2011




GESTEN - BEZEICHNUNGEN APPLE



                              Flick                      Tap
                 Wegschnipsen                            Antippen




          Swipe or Drag                                  Pinch open
                            Bewegen                      Ausbreiten




                Double-Tap                               Pinch close
                   Doppeltippen                          Kneifen




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                 25
WEBINALE 2011                         BERLIN
Universal User Interfaces             31. Mai 2011




GESTEN - BEZEICHNUNGEN WP7



                              Flick                      Tap
                 Wegschnipsen                            Antippen




                              Pan                        Stretch
                            Bewegen                      Ausbreiten




                Double-Tap                               Pinch
                   Doppeltippen                          Kneifen




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                26
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




GESTEN - BEZEICHNUNGEN




                                                     Touch and Hold
                                                    Berühren und Halten




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011                    27
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




DER GRÖSSTE WANDEL IN DER GESTALTUNG

Von der Gestaltung des
visuellen Aussehens
zur Gestaltung des
visuellen Verhaltens.


SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011   28
WEBINALE 2011                       BERLIN
Universal User Interfaces           31. Mai 2011




                            GRAPHICAL-USER-INTERFACE-DESIGN
                              Die Gestaltung von grafischen Objekten steht im Mittelpunkt




                                                                                  Interaction

                                                                                     Navigation
                 Interface Design
                                                                                       Verhalten
                    Brand Design                   LOOK           FEEL
                                                                                       Dialogue
                 Corporate Design
                                                                                     Multimedia

                                                                                   Usability




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
WEBINALE 2011                       BERLIN
Universal User Interfaces           31. Mai 2011




                             NATURAL-USER-INTERFACE-DESIGN
                                    Die Gestaltung von Verhalten steht im Mittelpunkt




                                                                                   Interaction

                                                                                        Orientation
                 Interface Design
                                                                                           Verhalten
                    Brand Design                   LOOK            FEEL
                                                                                          Dialogue
                 Corporate Design
                                                                                        Multimedia

                                                                                    Usability




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




                                                         NUI Guideline 01

                            Reduktion auf das Wesentliche!




                                                  Kontext-sensitive Funktionen

SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




VISUELLES VERHALTEN




SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
SES ASTRA              LUXEMBOURG
Envisioning Workshop   June 4th, 2010




                              Natural User Interface Design
WEBINALE 2011                      BERLIN
Universal User Interfaces          31. Mai 2011




DANKE FÜR IHRE AUFMERKSAMKEIT
ZEIT FÜR IHRE FRAGEN UND ANTWORTEN




SENSORY-MINDS GMBH
                                                                                  de:bug #152
PROFESSOR WOLFGANG HENSELER                                                       Natural User Interface Design
Managing Creative Director

                                                         Follow us on:
Ludwigstrasse 12
63067 Offenbach am Main                                     http://www.twitter.com/sensoryminds
                                                            http://www.vimeo.com/sensoryminds
T +49. 69. 847 789 913
                                                            http://www.flickr.com/people/sensoryminds
M +49. 173. 702 6197
E w.henseler@sensory-minds.com                              http://www.facebook.com/sensoryminds



SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011

Más contenido relacionado

Destacado

PräSentation Zu Datenbanken
PräSentation Zu DatenbankenPräSentation Zu Datenbanken
PräSentation Zu Datenbanken
Goetheschule
 
Top 5 Javascript Frameworks for Web and Mobile App Development
Top 5 Javascript Frameworks for Web and Mobile App DevelopmentTop 5 Javascript Frameworks for Web and Mobile App Development
Top 5 Javascript Frameworks for Web and Mobile App Development
Ajeet Singh
 
User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15
koolkampus
 
User interface design: definitions, processes and principles
User interface design: definitions, processes and principlesUser interface design: definitions, processes and principles
User interface design: definitions, processes and principles
David Little
 

Destacado (20)

Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
Offlinefähige Browseranwendungen: Progressive Web-Apps mit Angular 2
 
Graphical User Interface
Graphical User Interface Graphical User Interface
Graphical User Interface
 
Interface Design – Best Practices
Interface Design – Best PracticesInterface Design – Best Practices
Interface Design – Best Practices
 
Managing AGRI Knowledge Diffusion in Rural India
Managing AGRI Knowledge Diffusion in Rural IndiaManaging AGRI Knowledge Diffusion in Rural India
Managing AGRI Knowledge Diffusion in Rural India
 
PräSentation Zu Datenbanken
PräSentation Zu DatenbankenPräSentation Zu Datenbanken
PräSentation Zu Datenbanken
 
Top 5 Javascript Frameworks for Web and Mobile App Development
Top 5 Javascript Frameworks for Web and Mobile App DevelopmentTop 5 Javascript Frameworks for Web and Mobile App Development
Top 5 Javascript Frameworks for Web and Mobile App Development
 
Pavone Project Management Was Ist Neu 9.5
Pavone Project Management Was Ist Neu 9.5Pavone Project Management Was Ist Neu 9.5
Pavone Project Management Was Ist Neu 9.5
 
Caso Plantas de Celulosa, Rio Uruguay, CIJ
Caso Plantas de Celulosa, Rio Uruguay, CIJCaso Plantas de Celulosa, Rio Uruguay, CIJ
Caso Plantas de Celulosa, Rio Uruguay, CIJ
 
Progressive web apps with Angular 2
Progressive web apps with Angular 2Progressive web apps with Angular 2
Progressive web apps with Angular 2
 
Datenbindung und Performance in Angular 2
Datenbindung und Performance in Angular 2Datenbindung und Performance in Angular 2
Datenbindung und Performance in Angular 2
 
Ludica
LudicaLudica
Ludica
 
Google Plus für Business
Google Plus für BusinessGoogle Plus für Business
Google Plus für Business
 
Kalsel
KalselKalsel
Kalsel
 
Intro to AutoCAD 2016 2D | 03 - user interface
Intro to AutoCAD 2016  2D | 03 - user interfaceIntro to AutoCAD 2016  2D | 03 - user interface
Intro to AutoCAD 2016 2D | 03 - user interface
 
User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15
 
Graphical User Interface (Gui)
Graphical User Interface (Gui)Graphical User Interface (Gui)
Graphical User Interface (Gui)
 
Recognizing ego states (Transactional analysis / TA is an integrative approac...
Recognizing ego states (Transactional analysis / TA is an integrative approac...Recognizing ego states (Transactional analysis / TA is an integrative approac...
Recognizing ego states (Transactional analysis / TA is an integrative approac...
 
User interface design: definitions, processes and principles
User interface design: definitions, processes and principlesUser interface design: definitions, processes and principles
User interface design: definitions, processes and principles
 
User Interface Design
User Interface DesignUser Interface Design
User Interface Design
 
Lecture 7 Software Engineering and Design User Interface Design
Lecture 7 Software Engineering and Design User Interface Design Lecture 7 Software Engineering and Design User Interface Design
Lecture 7 Software Engineering and Design User Interface Design
 

Similar a Universal UI - Geräteübergreifendes Interaktionsdesign

Industry-forum 2011 eCATALOGsolutions AHP
Industry-forum 2011 eCATALOGsolutions AHPIndustry-forum 2011 eCATALOGsolutions AHP
Industry-forum 2011 eCATALOGsolutions AHP
CADENAS
 

Similar a Universal UI - Geräteübergreifendes Interaktionsdesign (8)

P8 Hofherr - Social Media Symposium
P8 Hofherr - Social Media SymposiumP8 Hofherr - Social Media Symposium
P8 Hofherr - Social Media Symposium
 
Industry-forum 2011 eCATALOGsolutions AHP
Industry-forum 2011 eCATALOGsolutions AHPIndustry-forum 2011 eCATALOGsolutions AHP
Industry-forum 2011 eCATALOGsolutions AHP
 
Mobile Applikationen: LeasePlan Mobil
Mobile Applikationen: LeasePlan MobilMobile Applikationen: LeasePlan Mobil
Mobile Applikationen: LeasePlan Mobil
 
Itbetw appsfactory trommen
Itbetw appsfactory trommenItbetw appsfactory trommen
Itbetw appsfactory trommen
 
Anforderungen an das Touchscreen-Design
Anforderungen an das Touchscreen-DesignAnforderungen an das Touchscreen-Design
Anforderungen an das Touchscreen-Design
 
ostfalia thiesing
ostfalia thiesingostfalia thiesing
ostfalia thiesing
 
Moderne Kundenansprache mit Mobile Experience!
Moderne Kundenansprache mit Mobile Experience!Moderne Kundenansprache mit Mobile Experience!
Moderne Kundenansprache mit Mobile Experience!
 
„Context is King and Device is Queen!“ in der mobilen Markenkommunikation
„Context is King and Device is Queen!“ in der mobilen Markenkommunikation„Context is King and Device is Queen!“ in der mobilen Markenkommunikation
„Context is King and Device is Queen!“ in der mobilen Markenkommunikation
 

Universal UI - Geräteübergreifendes Interaktionsdesign

  • 1. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 UNIVERSAL UI GERÄTEÜBERGREIFENDES INTERAKTIONSDESIGN SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 2. IICO 2011 BERLIN Welcome to the APP-Economy 17.05.2011 „It's all about people and changing their minds.“ Steve Jobs 2007 SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 3. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 UNIVERSAL USER INTERFACE SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 4. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 UNIVERSAL USER INTERFACE WEB-INTERFACE WIDGET APPLICATION FACEBOOK APPLICATION MULTITOUCH DEVICE GAME CONSOLE ARTE CREATIVE DESKTOP APPLICATION INTERNET TV MOBILE DEVICE SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 4
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 SCREEN EVOLUTION - HEUTE > MORGEN Display Interface Goggle Interface SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 12
  • 13. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GOGGLE INTERFACE Goggle Interface 2D Mixed Reality Mode SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 13
  • 14. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GOGGLE INTERFACE Goggle Interface 2D Mixed Reality Mode SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 14
  • 15. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 Multitouch Computing Microsoft Surface iPad / iPhone Xbox 360 Kinect Natürliche Gesten zur Interaktion SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 16. fbmedia hd_a DIEBURG Von Web zu App 20. Mai 2011 GESTEN NATÜRLICHE, GELERNTE, SPEZIALGESTEN SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 16
  • 17. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 FORMALE ASPEKTE SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 17
  • 18. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 FORMALE ASPEKTE SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 18
  • 19. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 FORMALE ASPEKTE SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 19
  • 20. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GESTEN SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 20
  • 21. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 22. KEMPERTRAUTMANN HAMBURG APP Workshop 26 November 2010 MOBILE BETRIEBSSYSTEME Apple - iOS 4.2 Google - Android 2.1 Blackberry - Storm 1.0 HP - Symbian 9.2 Microsoft - WP7 1.0 Samsung Bada SENSORY-MINDS GMBH 2010 22
  • 23. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GESTURES Single-touch: Multi-touch: Tap Double Tap Pan Flick Touch and hold Pinch and Stretch Common Less common Natural Enabled SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 23
  • 24. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 WIE WERDEN DIESE GESTEN GENANNT? SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 24
  • 25. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GESTEN - BEZEICHNUNGEN APPLE Flick Tap Wegschnipsen Antippen Swipe or Drag Pinch open Bewegen Ausbreiten Double-Tap Pinch close Doppeltippen Kneifen SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 25
  • 26. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GESTEN - BEZEICHNUNGEN WP7 Flick Tap Wegschnipsen Antippen Pan Stretch Bewegen Ausbreiten Double-Tap Pinch Doppeltippen Kneifen SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 26
  • 27. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GESTEN - BEZEICHNUNGEN Touch and Hold Berühren und Halten SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 27
  • 28. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 DER GRÖSSTE WANDEL IN DER GESTALTUNG Von der Gestaltung des visuellen Aussehens zur Gestaltung des visuellen Verhaltens. SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011 28
  • 29. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 GRAPHICAL-USER-INTERFACE-DESIGN Die Gestaltung von grafischen Objekten steht im Mittelpunkt Interaction Navigation Interface Design Verhalten Brand Design LOOK FEEL Dialogue Corporate Design Multimedia Usability SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 30. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 NATURAL-USER-INTERFACE-DESIGN Die Gestaltung von Verhalten steht im Mittelpunkt Interaction Orientation Interface Design Verhalten Brand Design LOOK FEEL Dialogue Corporate Design Multimedia Usability SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 31. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 NUI Guideline 01 Reduktion auf das Wesentliche! Kontext-sensitive Funktionen SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 32. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 VISUELLES VERHALTEN SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011
  • 33. SES ASTRA LUXEMBOURG Envisioning Workshop June 4th, 2010 Natural User Interface Design
  • 34. WEBINALE 2011 BERLIN Universal User Interfaces 31. Mai 2011 DANKE FÜR IHRE AUFMERKSAMKEIT ZEIT FÜR IHRE FRAGEN UND ANTWORTEN SENSORY-MINDS GMBH de:bug #152 PROFESSOR WOLFGANG HENSELER Natural User Interface Design Managing Creative Director Follow us on: Ludwigstrasse 12 63067 Offenbach am Main http://www.twitter.com/sensoryminds http://www.vimeo.com/sensoryminds T +49. 69. 847 789 913 http://www.flickr.com/people/sensoryminds M +49. 173. 702 6197 E w.henseler@sensory-minds.com http://www.facebook.com/sensoryminds SENSORY-MINDS GMBH // PROFESSOR WOLFGANG HENSELER 2011