Gegenüberstellung von Desktop, iPhone und iPad unter dem Aspekt der Benutzerführung und Interface.

1. Desktop vs Mobile 1 Mobile. Design. Create. Namics. C. Medvesek 10-2010

2. Wieso Mobil? Mobile. Szenarien. Nutzer. 2 Mobile. Create. Basics. 10-2010

3. Mobile User Szenarien UrgedNow BoredNow RepetitiveNow Mouse vs Gestures 3 Mobile. Create. Basics. 10-2010

4. Mousevs Touch Interaction. Desktop. Touch. 4 Mobile. Create. Basics. 10-2010

5. Multi. Touch. Gestures. 5 Mouse vs Touch Mobile. Create. Basics. 10-2010

6. Standards. Touch. Gestures. Mouse vs Touch 6 Pressed (Tap’n’hold) Tap Pinch Swipe Spread Double-Tap Rotate Mobile. Create. Basics. 10-2010

7. Standards. Touch. Mouse. Mouse vs Touch 7 Mobile. Create. Basics. 10-2010

8. Standard. Touch. Actions. Mouse vs Touch 8 Mobile. Create. Basics. 10-2010

9. Kein Mouse-Over oder Hover Gestalte und teste zunächst für ein Touch Interface und füge anschliessend als Zugabe Hover- oder Tooltip-Effekte hinzu. 9 Mobile. Create. Basics. 10-2010

10. Kein Focus oder auswählen von Objekten Ein Tap öffnet immer ein Objekt, daher kann man keinen Focus / Highlight darauf legen, um anschliessend dieses Objekt mit einer Aktion zu verändern. 10 Mobile. Create. Basics. 10-2010

11. Kein Focus oder auswählen von Objekten Mouse vs Touch 11 Mobile. Create. Basics. 10-2010

12. Alternativ: Checkbox oder Objektmenü Mouse vs Touch 12 Mobile. Create. Basics. 10-2010

13. Keine Bedienelemente wenn eine direkte Manipulation möglich ist. Insbesondere bei Karten oder Bilddarstellungen kann auf Bedienelemente wie Zoom oder Bewegen verzichtet werden, das dies direkt über Touch-Gestures möglich ist. 13 Mobile. Create. Basics. 10-2010

14. Direkte Manipulation nutzen Mouse vs Touch 14 Mobile. Create. Basics. 10-2010

15. Grössere Bedienelemente Um ungewollte Aktionen zu vermeiden benötigen Touch-Geräte auf Grund der Fingereingabe grössere Berührflächen. 15 Mobile. Create. Basics. 10-2010

16. Optimale Touch-Bereiche GemässiPhone HI Guidelines gilt: Breite 29 Pixel (58 Pixel Retina Display) Höhe 44 Pixel (88 Pixel Retina Display) Entspricht ca. 9mm Mouse vs Touch 16 Mobile. Create. Basics. 10-2010

17. iPadvsiPhone Interaction. Desktop. Touch. 17 Mobile. Create. Basics. 10-2010

18. Sozial. Privat. Offen. iPhone und iPad unterscheiden sich im Gebrauch und den Situationen in denen sie eingesetzt werden. 18 Mobile. Create. Basics. 10-2010

19. Persönliche Einschätzung Mouse vs Touch 19 iPhone iPad Privat Öffentlich Mobile. Create. Basics. 10-2010

20. Bedienung. Rechts. Links. iPhone und iPad unterscheiden sich in der Bedienung und Handhabung. Das iPhone kann mit nur einer Hand bedient und gehalten werden. Das iPad muss dazu abgestellt oder mit der zweiten Hand gehalten werden. 20 Mobile. Create. Basics. 10-2010

21. Bedienbare Zonen mit einer Hand Mouse vs Touch 21 Linke Hand Rechte Hand hoch quer Mobile. Create. Basics. 10-2010

22. Bedienbare Zonen mit beiden Händen Mouse vs Touch 22 quer Mobile. Create. Basics. 10-2010

23. Fazit Touch. Interface. Basics. 23 Mobile. Create. Basics. 10-2010

24. Meldung. Status. Sichtbarkeit. Wichtige Infos und Meldungen gehören nach oben, wo sie nicht von der Hand bedeckt werden. Fazit 24 Mobile. Create. Basics. 10-2010

25. Berühren. Finger. Aktionen. Zeige deutlich die bedienbaren Elemente und wo sie zu berühren sind Fazit 25 Mobile. Create. Basics. 10-2010

26. Vergrössern. Bewegen. Ändern. Berücksichtige physikalischen Gesetze bei direkten Manipulationen Fazit 26 Mobile. Create. Basics. 10-2010

27. Ort. Anzeigen. Optionen. Zeige zusätzliche Infos oder Optionen in der Nähe des Fingers Fazit 27 Mobile. Create. Basics. 10-2010

28. Informationen. Flach. Vermeide Pop-Up-Fenster für zusätzliche Informationen Fazit 28 Mobile. Create. Basics. 10-2010

29. Scrollen. Wischen. Blättern. Nutze vertikales und horizontales Scrollen Fazit 10-2010 Mobile. Create. Basics. 29 GleicherInhalt ÄhnlicherInhalt

30. claus.medvesek@namics.com © Namics 30 Mobile. Create. Basics. 10-2010