A brief history of desktop software GUI visual design. Prepared for my talk at Shenkar College of Engineering & Design, Nov. 2010 www.meetgooya.com

1. Hello.
I’m Guy.
meetgooya.com
stupidapp@gmail.com
Guy Haviv meetgooya.com @stupidapp

2. Guy Haviv meetgooya.com @stupidapp
GUI / OS History
Brief

3. Guy Haviv meetgooya.com @stupidapp
What kinds of interactive things
do we design / build?
Types of apps

4. Guy Haviv meetgooya.com @stupidapp
- In-Browser vs. On-Desktop
- Web interfaces have little commonality
- Desktop interface have more commonality
Web vs. Desktop:
a superficial look on

5. Guy Haviv meetgooya.com @stupidapp
What is an
Operating System?

6. Guy Haviv meetgooya.com @stupidapp
Stuff that operates the hardware
+ means to write more software
Operating System

7. Guy Haviv meetgooya.com @stupidapp
Low level stuff + UI Libraries
Means for building
more software?

8. Guy Haviv meetgooya.com @stupidapp
Buttons, Menus, Check Boxes,
Pointers, Radio Buttons, Lists,
File Lists, etc.
UI Libraries?

9. Guy Haviv meetgooya.com @stupidapp
an OS ships with it’s own
frameworks.
Windows + Dot Net
Mac OS X + Cocoa
Coupling♥

10. Guy Haviv meetgooya.com @stupidapp
UI is culture.

11. Guy Haviv meetgooya.com @stupidapp
like any other type
of design, it has a
rich history.

12. Guy Haviv meetgooya.com @stupidapp
Let’s go
through some of
this history.

13. Guy Haviv meetgooya.com @stupidapp
MS DOS

15. Guy Haviv meetgooya.com @stupidapp
Every app UI was
built from scratch.

27. Guy Haviv meetgooya.com @stupidapp
WIMP.
windows, icons, menus, pointer

28. Guy Haviv meetgooya.com @stupidapp
XEROX PARC

29. Guy Haviv meetgooya.com @stupidapp
these guys invented WYSIWYG
+ modern software
development + most of the GUI
elements we know today.
XEROX PARC

30. Alto
1974

31. Guy Haviv meetgooya.com @stupidapp
Apple
Lisa > Macintosh (System1..9)

32. Guy Haviv meetgooya.com @stupidapp
Video
(did I remember to connect the speakers?)

35. System 1

36. System 4.2
Looks
Familiar?

37. System 7.5.3

38. System 7.5.3

39. System 7.5.3

40. System 8

41. System 8

42. System 9

43. System 9

44. System 9

45. (we’ll get back to Apple soon.)

46. Guy Haviv meetgooya.com @stupidapp
Microsoft
Windows 1, 2, 3.11, 95, 98

47. Win1

48. Win2

49. Win3.11

50. Win3.11

51. Win3.11

52. Win95

53. Win95

54. Win95

55. Win95

56. Win95

57. Win95

58. Win95

59. Win98

60. Win98

61. Win98

62. Win98

63. Win Me

64. Win Me

65. Win 2000

66. Win 2000

67. Win XP

68. Win XP

69. Win XP

70. Guy Haviv meetgooya.com @stupidapp
Meanwhile...
Unix, Linux, IRIX

71. Guy Haviv meetgooya.com @stupidapp
Unix
Low level system + X Windows

72. Guy Haviv meetgooya.com @stupidapp
Unix
X Windows =
Minimal Definitions

73. Guy Haviv meetgooya.com @stupidapp
Unix
X Windows =
Each system is different

74. Guy Haviv meetgooya.com @stupidapp
CDE
multiple Unix companies join
together to define a desktop
standard.

76. CDE

77. Guy Haviv meetgooya.com @stupidapp
Linux
Open source Unix + X Windows

78. Guy Haviv meetgooya.com @stupidapp
Linux
X Windows again.
Multiple UI Libraries + Desktops

79. Guy Haviv meetgooya.com @stupidapp
Linux
Gimp > Gtk > Gnome

80. Gimp

83. Gnome 2.0 on RedHat

84. Gnome 2.0 on RedHat

89. Guy Haviv meetgooya.com @stupidapp
Linux
QT > KDE
QT is now owned by Nokia.

90. KDE 1

91. KDE 3

92. KDE 3

93. KDE 3

94. KDE 3

95. KDE 3

96. Guy Haviv meetgooya.com @stupidapp
Linux
What happens when you
mix a Gtk app with a KDE
Desktop?
hint: Copy & Paste doesn’t work.

99. Guy Haviv meetgooya.com @stupidapp
IRIX
from SGI: Silicon Graphics

100. KDE 3

101. KDE 3

102. Guy Haviv meetgooya.com @stupidapp
BeOS
“SGI for the rest of us”

104. KDE 3

105. KDE 3

108. Guy Haviv meetgooya.com @stupidapp
NeXT
Steve’s other company.

113. Guy Haviv meetgooya.com @stupidapp
QNX
One Floppy OS.
QNX is now owned by RIM - makers of Blackberry.
It powers the PlayBook.

118. Guy Haviv meetgooya.com @stupidapp
Apple
Apple Buys NeXT > Mac OS X
back to:

119. Guy Haviv meetgooya.com @stupidapp
Apple
Mac OS X
Unix + Aqua XWindows

120. Guy Haviv meetgooya.com @stupidapp
Apple
Jaguar

124. Guy Haviv meetgooya.com @stupidapp
Apple
Panther

128. Guy Haviv meetgooya.com @stupidapp
Apple
Tiger

131. Guy Haviv meetgooya.com @stupidapp
Apple
Leopard

134. Guy Haviv meetgooya.com @stupidapp
Name roundup
DOS
Mac OS Classic (System 1..9)
Linux: Gnome, Kde, Gtk, QT
BeOS
QNX
Windows
NeXTSTEP
Mac OS X

135. Guy Haviv meetgooya.com @stupidapp
So unlike the Web,
Desktop software brings about
a new term: Good Citizen

136. Guy Haviv meetgooya.com @stupidapp
Good Citizen?

137. Guy Haviv meetgooya.com @stupidapp
An interface
should match the
target platform.

144. Guy Haviv meetgooya.com @stupidapp
But that’s a topic
for another day.

145. Guy Haviv meetgooya.com @stupidapp
thank you.
Slides available on:
http://tinyurl.com/gooya-ui
Almost all screenshots were taken from
www.guidebookgallery.org