visual design - lmu medieninformatik · visual design of physical interfaces for nfc/rfid-based...
TRANSCRIPT
![Page 1: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/1.jpg)
Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction
Alina Hang
Diploma Thesis Supervisors: Alexander Wiethoff und Gregor Broll Responsible Professor: Prof. Dr. Heinrich Hußmann
![Page 2: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/2.jpg)
Motivation & Goals
Alina Hang – 09.02.2010 2
Images taken from the SmartTouch project: www.smarttouch.org
• design of physical interfaces for their discovery
• representation of NFC-tags as visual elements
• visualization of the functionalitites of NFC-tags
• guidance cues to support the interaction workflow
![Page 3: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/3.jpg)
Outline
• Low-fidelity Prototypes and Preliminary Results
• High-fidelity Prototypes
• Final User Study and Results
• Conclusion
• Design Recommendations
Alina Hang – 09.02.2010 3
![Page 4: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/4.jpg)
Phases of Interaction
Alina Hang – 09.02.2010 4
![Page 5: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/5.jpg)
Adhesive Symbols
Alina Hang – 09.02.2010 * based on T. Arnall ** based on Nokia. Copyright Nokia. 5
![Page 6: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/6.jpg)
Top 3 Adhesive Symbols
Adhesive Symbols: • symbols that create awareness for NFC
Alina Hang – 09.02.2010 6
keep the design simple with a clear structure use existing symbols to facilitate recognition combine visual components with textual components
![Page 7: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/7.jpg)
High-fidelity prototypes I
Alina Hang – 09.02.2010 7
![Page 8: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/8.jpg)
Top 4 Explanatory Symbols
Explanatory Symbols: • symbols that explain the interaction
Alina Hang – 09.02.2010 8
important components should be visualized supported by dynamic components
![Page 9: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/9.jpg)
High-fidelity Prototypes II
Alina Hang – 09.02.2010 9
![Page 10: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/10.jpg)
Final User Study
3 Scenarios with 1 Task each: • interactive advertisement • interactive door sign
• interactive catalogue
Demographic Information: • 21 subjects (aged between 19-30 years)
• 6 subjects had prior experience with NFC
• 15 subjects did not
Alina Hang – 09.02.2010 10
![Page 11: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/11.jpg)
+ aesthetically appealing
+ simple, clear, trustworthy + simple interaction with one
touch
+ remaining interaction on mobile device
- too less information
+ quick selection
- low benefit - time for orientation needed
- overloaded, confusing, complicated
- too many attention shifts
Results: Advertisement
Alina Hang – 09.02.2010 11
![Page 12: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/12.jpg)
- not intuitive and overloaded
- time for orientation needed - order of selection unclear - save and delete unnecessary
Results: Office
Alina Hang – 09.02.2010 12
+ clear and nice
+ one NFC-tag + further selection on mobile
device
+ simple, fast and convenient interaction
- too less information
![Page 13: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/13.jpg)
Results: Catalogue I
Alina Hang – 09.02.2010 13
![Page 14: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/14.jpg)
Results: Catalogue II
Alina Hang – 09.02.2010 14
![Page 15: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/15.jpg)
Conclusions
• NFC-tags should be used in moderation
• interaction should be started on the physical user interface
• further interaction design dependent on application
• overview of available functions should be provided
• concretizing input should be done on the mobile device.
Alina Hang – 09.02.2010 15
![Page 16: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/16.jpg)
Design Recommendations
Design recommendations for overall designs: • Keep its characteristics. • Less is more.
• Overview the functions.
• Provide a start-tag. • Create closure.
• Take advantage of the mobile device.
Future Work • further means to create awareness • design of mobile interface for NFC-based mobile Interaction
Alina Hang – 09.02.2010 16
![Page 17: Visual Design - LMU Medieninformatik · Visual Design of Physical Interfaces for NFC/RFID-based Mobile Interaction Alina Hang Diploma Thesis Supervisors: Alexander Wiethoff und Gregor](https://reader033.vdocuments.us/reader033/viewer/2022052805/6059c3ef6c1c01271246446b/html5/thumbnails/17.jpg)
Thank You!
Questions?
Alina Hang – 09.02.2010 17