Tutorial from JBoye Aarhus 2012. Covers: Introduction to mobile & touch Identifying mobile-friendly tasks A look at smartphones and UI/UX Mobile wire-framing exercise Tablets as a "form factor" Tablet debate exercise

1. Dan Lewis – The Judge Group - USA

2. My name is: Dan Lewis
I am from: Philadelphia, Pennsylvania -
USA
I work for: The Judge Group, Inc.
As the: Leader of the Mobility Solutions
Consulting Practice
For my job I: Eat, sleep, and breath
mobility
I used to: Build intranets, web, and
database stuff

3. Have you noticed?

4. Image Credits: Ed Yourdon

5. Image Credits: Amazon

6. Image Credits: Google

7. What has this technology done?

8. • Retail
Consumer •
•
Social Media
Gaming
• Entertainment
• Commerce
Business •
•
Partner Interaction
Legal / Regulatory
• Healthcare
• Automation
Employee •
•
Connectivity
Desktop Replacement
• Productivity

9. PC Mobile
•Software •App
•Server •Cloud

10. So we give our users remote access to our apps, big deal…

12. Image Credits: Apple & Google

13. So what else is new…

14. Accelerometer
Camera
GPS
Gyroscope
Microphone
Near Field Communication
WiFi
Custom Sensors

15. Name Phone Email
Social
Calendar Contacts
Media

16. Exercise #1

17.  Each group should come up with 3 mobile &
touch friendly tasks
 Each group will present their tasks at the end

18.  Enabling a customer to document and file an
automotive insurance claim
 Giving a customer the ability to deposit a
check to their bank account with their device
 Providing a way for field sales staff to
document their customer interactions
 Enable employees access to their payroll and
PTO information on the go

19. The Questions Yes? No?
Will a person have value and be able to do this on the go?
Can the task be performed “offline”?
Can performing the task leverage the device’s sensors?
Does the task interact with existing content on the device?
Can the task be performed with simple user responses?
Does the task work well when touch is a user response mechanism?

20. Break

21. This isn’t like designing for 960PX width anymore…

22. Image Credits: Samsung

23.  Phablets
Image Credits: HTC, LG, & Samsung

24. Image Credits: Apple, HTC, Samsung

25.  Back buttons
 Front-facing cameras
 Network connectivity
 Resolutions
 Platforms
Android Resolution Fragmentation
Image Credits: OpenSignalMaps via NBCNews.com

26. Image Credits: Luke Wroblewski

27. Image Credits: Luke Wroblewski

28. The existing UI/UX patterns for PCs are not going to work here…

29. The Tap vs. Application
The Click Navigation
Content Offline
Prioritization Access

30. The Official UI/UX Guides
 Android: User Interface Guidelines
 iOS: iOS Human Interface Guidelines
 Windows: User Experience Design Guidelines

31. Exercise #2

32.  Develop Wireframes for a task from the first
exercise
 Use Paper / Markers / Cards
OR
 A wire-framing tool like Balsamiq
 Present your wireframe to the group

33. Break

34. What makes tablets a unique design consideration?

35. Charlie Caper & Erik Rosales – MIPIM 2012
Thanks: Martin White – Intranet Focus Ltd

36.  Touch interface
 Sensors
 Weight
 Overall dimensions

37.  7-10” screens
 Keyboards and pointing devices
 Simpler OSs
Image Credits: Popular Science

38. What about….
 Application Developers
 Graphic Editors
 Content Managers
 Video Editors

39. Dude… do I
have Wi-Fi
here?
Image Credits: Phil Ingram

40. Increased Portability
Decreased Cost
Increased/Decreased Usefulness?
Image Credits: The Guardian

41. Exercise #3

42.  YES – Tablet is it’s own distinct form factor
NO – Tablet is not it’s own distinct form factor
_________________________________________
 Each side will develop a 2 minute argument
for/against. 1 person will present it.
 The other side will get a 1 minute rebuttal by a
different person in the group

43. Dan Lewis
Principal Mobility Consultant
The Judge Group
www.judge.com
dlewis@judge.com
@DanTheITMan
linkedin.com/in/dantheitman