Do you know about WIMP? The Natural or Organic Interface? Zooming Interface? And what the heck is the Intelligent UI? Where are all these interfaces coming from. What about the Gesture, Haptics, Pen based and touch and even multi touch interfaces? In this session learn from the Author of Digital Design Essentials: 100 ways to Design better Desktop, Web and Mobile Interfaces, the intriguing story of the Digital Interface. How the digital Interface started from Command line to WIMP Interface to GUI and now became the most debated topic in the design industry, Skeumorphic Design or Modern UI. See how, with the revolution of devices digital interface took turn to Natural, Touch and Organic User Interfaces. See how User Interface has evolved in last twenty years. See how the current trends in touch screens, text to speech and AI are molding the mere fabric of the User Interface and how the user adoption still is the key to a successful User Interface Design. http://theinnovationenterprise.com/summits/digital-design-sanfran-2013/event_activities/5129

1. DIGITAL WEB & DESIGN INNOVATION SUMMIT
SAN FRANCISCO, CA , SEPT 20, 2013
Evolution of
User Interface
Raj Lal
Nokia Inc.
@iRajLal

2. 10+ years in S/W Design
Author
• Digital Design Essentials:
100 Ways to design better
desktop, Web & mobile UI
(DesignUserInterface.com )
About Me

3. 50 Years
Journey Back in Time

4. What is a User Interface?
Software: application, website, or mobile app
User Interface is the
body of a software

5. Software
User
Interface
Function
Data

6. UI answers 3 ‘HOW’ questions
• How it looks like (VISUAL)
• How it is understood (COGNITIVE)
• How it works (INTERACT)

7. User Interface Journey
Desktop
Web
Mobile

8. 1962
First User Interface

9. 1st Computer Game Spacewar

10. Steve Russell

11. VISUAL
intriguing
COGINITIVE
4 commands
- spin left
- spin right
- thrust
- fire
INTERACT
Keyboard

12. 1964
The Mouse

13. The Mouse

14. Douglas Engelbart

15. 1978
Command Line Interface

16. VisiCalc (The first ever spreadsheet)

17. Bob Frankston & Dan Bricklin invented spreadsheet

18. 1983
WIMP / GUI – Apple Lisa

19. 1st personal computer to use GUI

20. WIMP to GUI
W = Windows
I = Icons
M = Menus
P = Pointer

21. Steve Jobs with Lisa
“We're prepared to
live with Lisa for
the next ten years.”

22. 1995
UI Frameworks

23. Visual Studio

24. Photo Editor

25. 2003
Widgets

26. Konfabulator

28. 2011+
Advanced User Interfaces

29. Zooming User Interface

30. Direct Manipulation

31. 3D Interface

32. Skeuomorphic Interface

33. Modern /Metro UI

34. 1990
World Wide Web

35. Tim Berners-Lee invented Web

36. Static Web

37. Dynamic Web - Online Store

38. 1997
Blog

39. Wordpress Themes

40. 2004
Web 2.0

42. 2005
Ajax

43. Ajax

44. 2012
HTML5 – 1st Working Draft

45. HTML5 – Adaptive User Interface

46. HTML5 – CSS3

47. 1991
Mobile Touch Interface

48. Pen based Interface

49. Pen Based Interface

50. 2003
Touchscreen Interface - FingerWorks

51. Multi Touch Interface

52. Gesture based Interface

53. User Interface Evolution Map
1962
1964
1978
1983
1991
1995
1997
2003
2004
2011
2012

54. This is Not the End
Now this is not the end. It is not even the
beginning of the end. But it is, perhaps, the
end of the beginning.
- Winston Churchill

55. Thank You
DesignUserInterface.com
Raj Lal
Nokia Inc.
@iRajLal
DIGITAL WEB & DESIGN INNOVATION SUMMIT
SAN FRANCISCO, CA , SEPT 20, 2013