Design of Graphical User Interfaces

Size: px

Start display at page:

Download "Design of Graphical User Interfaces"

Eleanore Conley
6 years ago
Views:

1 Design of Graphical User Interfaces Graduate School Course IT 2 Prof. Astrid Beck 1 1

2 Contact information Mail: WWW: Office: F1.353 Level 3a. Office Hours: Tues 13pm-15pm or by appointment 2 2

3 The user interface Users often judge a system by its interface rather than its functionality A poorly designed interface can cause a user to make fatal errors Poor user interface design is the reason why so many software systems are not used effectively or never used at all 3 3

4 Usability Extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use. ISO effectiveness: Accuracy and completeness with which users achieve specified goals. efficiency: Resources expended in relation to the accuracy and completeness with which users achieve goals. satisfaction: Freedom from discomfort, and positive attitudes towards the use of the product. context of use: Users, tasks, equipment (hardware, software and materials), and the physical and social environments in which a product is used. 4

5 Topics Introduction and motivation Programming GUIs with Java Swing Basic techniques: typo, design, colour Usability User centered design Lab 1 Java MVC Lab 2 Internet project 5 5

6 6 6

7 Introduction History of graphical user interfaces A software user interface is simply a way to allow you to use your operating system or application program. Software user interfaces have changed over time. Example web relaunch Carl Zeiss 7 7

History 1 1945: Memex, Vannevar Bush As you may think Hypertext Consider a future device.

8 History : Memex, Vannevar Bush As you may think Hypertext Consider a future device... in which an individual stores all his books, records, and communications, and which is mechanized so that it may be consulted with exceeding speed and flexibility. It is an enlarged intimate supplement to his memory. 1963: Sketchpad, Dissertation Ivan E. Sutherland The first Interactive computer graphics MIT 8 8

History 2 1965: Douglas Engelbart s most famous invention is the computer mouse, developed in the 1960s, but not used commercially until the 1980s 1974: Vint Cerf (known to some as the "father of the

9 History : Douglas Engelbart s most famous invention is the computer mouse, developed in the 1960s, but not used commercially until the 1980s 1974: Vint Cerf (known to some as the "father of the Internet"), along with Bob Kahn, wrote a new protocol, TCP (Transmission Control Protocol) 1981: Xerox Star, PARC bitmapped screens, windows, a mouse-driven interface, and icons 9 9

History 3 1979: Alan Kay was one of the key members at Xerox to develop prototypes of networked workstations using the progr. language Smalltalk. These inventions were later commercialized by Apple.

10 History : Alan Kay was one of the key members at Xerox to develop prototypes of networked workstations using the progr. language Smalltalk. These inventions were later commercialized by Apple. 1983: Apple Lisa Macintosh 1984: MIT starts to develop X X Windows is the standard graphical interface on Unix operating systems, and is available for most other modern operating systems. X provides the basic framework for a GUI environment: drawing and moving windows on the screen and interacting with a mouse and keyboard 10 10

11 Window systems WIMP - Windows, Icons, Menus and Pointing device Direct manipulation 11 11

History 3 1981: Microsoft MS-DOS 1981: Sun Microsystems Java platform 1985: Atari, Amiga, Commodore: affordable windows systems 1985: Microsoft releases Windows 1.

12 History : Microsoft MS-DOS 1981: Sun Microsystems Java platform 1985: Atari, Amiga, Commodore: affordable windows systems 1985: Microsoft releases Windows 1.0 and is initially sold for $ : FhG Institute Erlangen, Germany the Fraunhofer Institut was granted a patent for MPEG Audio Layer III (MP3) 1990: Microsofts Windows 3.x later: Windows95/NT 12 12

History 4 1990: Tim Berners-Lee: Hypertext Transfer Protocol (HTTP) 1993: Marc Andreesen: Mosaic browser 130 websites exists online 1994: Netscape 1995: Internet Explorer 1.

13 History : Tim Berners-Lee: Hypertext Transfer Protocol (HTTP) 1993: Marc Andreesen: Mosaic browser 130 websites exists online 1994: Netscape 1995: Internet Explorer : Sun launches Java programming language 1996: Google 2001 Windows XP 13 References Internet Pioneers Windows Products and Technologies History Apple history History of the Internet ry_internet.html 13

14 Requirements for design of user interfaces Requirements for design of user interfaces increase with more experienced users Users are accustomed to graphical user interfaces and multimedia Software must be usable, fun and useful for learning This results in high demands on the programming process Example Carl Zeiss

15 15 15

16 16 16

17 17 17

18 18 18

19 19 19

20 20 20

21 21 21

22 22 22

23 23 23

History of Ubicomp. Page 1. Agenda. Why study history? Paradigms. Shwetak Patel. Review history of Ubicomp

History of Ubicomp. Page 1. Agenda. Why study history? Paradigms. Shwetak Patel. Review history of Ubicomp CSE 599U Advanced Topics in Ubicomp History of Ubicomp Shwetak Patel Computer Science & Engineering Electrical Engineering Agenda Review history of Ubicomp Review the history of Human-Computer Interaction