Human Impact of UI Design Paradigms

1
Human Impact of UI Design Paradigms

• (PART 1 Overview)
• Robert Ritchey and Ruben Campos

2
Purpose/Goal

• Analyse the impact that different GUI designs
  have on both users and software developers

3
Strategy

• show the history of user interfaces
• discuss different types of User Interfaces
• how they are different
• how they are used
• how they are implemented

4
Presentation Schedule

• First session Intro
• History
• Modern User Interfaces
• Second Session - demos/analysis of different
  types
• Impacts on User Behaviour patterns
• Impacts on Software Design/Architecture
• Third Session Comparative Analysis

5
Definition of UI

• For our purpose, user interface means graphical
  user interface.
• types that we will be discussing aredesktop,
  web, kiosk and mobile

6
History of UI

• Batch punch cards
• Text Based
• GUI based
• Internet Driven

7
Batch and Text

• Text
• Punch cards

8
Graphical User Interface

• Apple
• BeOS
• Xerox Star
• Windows

9
Modern Interfaces

• Apples Aqua
• Windows XP
• CDE -- Sun Solaris
• KDE
• Gnome

10
Timelines

• History of GUI
• UI development
• Computer History

11
Modern UI Technologies

• Most modern UI technologies are graphic centric
• Graphical User Interface (GUI) is the most
  prevalent UI Style today
• A GUI attempts to mimic real world human-object
  interactions
• A GUI can be found in a variety of computers
  and/or devices

12
Devices that use GUI

• PC/Laptop
• Kiosk
• ATM
• Mobile
• Home Appliances
• Vehicles

13
Some Modern GUI Categories

• Desktop Application
• Web Browser Application
• Mobile Application
• Kiosk Application

14
Desktop Application

• Definition Software that runs within the
  context of an Operating Systems Window
  Environment.
• Attributes
• Highly Dependent on Operating System
• Note Even Java needs an OS specific Runtime
  Environment
• Access to local OS/Hardware Resources
• Runs within OS Window System
• Microsoft Windows
• Unix-Based X Windows
• Stand-Alone or Client/Server

15
Desktop GUI Characteristics

• Inherits OS Window Functionality
• Mimics Human/Object Interaction
• Icons to Identify Object
• Actions on Objects
• Point, Choose, Hold, Move, Activate objects
• Rich UI Components
• Elaborate Toolbars
• Icons represent typical Application functions
• Custom toolbars
• Comprehensive Menu system
• General Menu
• Context Sensitive Menu
• Floating UI Components

16
Example Desktop GUI

• Windows Explorer

Window
General Menu
Toolbar
Context Sensitive Menu
Icons mimic real objects
17
Typical User Actions on Desktop UI

• Mouse
• Click to Select object
• Double Click to cause initiate certain behavior
  on an object
• Hold Mouse Button to create an object handle for
  drag and dropping
• Keyboard
• Alt, Ctl, Shift, and Function keys to create
  commands
• Remnants of Legacy Command-Driven User Interfaces
• Used as shortcuts to Menu Items

18
Web Browser Application

• Definition Software that runs within the
  context of a Web Browser.
• Attributes
• Distributed Application
• Limited Access to Local OS Resources
• Access to Server Resources
• Runs within Browser

19
Web Browser App GUI Characteristics

• Easy consolidation of dispersed UI objects
• Browser paradigm is hyperlink centric
• Clickable icons/text
• Actions on Objects more limited
• Holding and Moving objects more challenging
• Simulate some Desktop Application GUI behavior
  via AJAX, or plugins such as Flash UI Components
• Form Component is key to processing data
• Simple Toolbars
• Simple Menu Systems
• Limited mobility of UI Components

20
Example Web Brower Application GUI

• Yahoo Home Page
• Typical Web Browser Application GUI objects

URL
Forms
Simple Menus
21
Typical User Actions on Web Browser App UI

• Mouse
• Hyperlink Navigation
• Button Click for Form Submission
• Rare Double Clicks
• Rare drag and dropping
• Keyboard
• Mostly used for data entry
• Command Keys are seldom used because a Web
  Browser App UI is more mouse driven
• Further away from Legacy Command-Driven User
  Interfaces

22
Kiosk Application

• Definition Software that typically runs in a
  public setting for either informational or
  commercial purpose
• Attributes
• Comprised of a Touch Sensitive Terminal
• Can run locally or over the Internet

23
Kiosk GUI Characteristics

• Typically uses touch screen as input device
• Advance kiosks can also include trackballs and
  keyboards
• Lower rate of user errors since input devices are
  simple and options are limited
• Features are not as rich as Desktop or Web
  Browser GUIs

24
Example Kiosk GUI

• Typical Touch screen GUI

25
Typical User Actions on Kiosk UI

• Touch Screen Navigation
• TrackBall/Mouse
• Simple Clicking
• Double Clicks unlikely
• Drag and Drop unlikely
• Keyboard
• Mostly used for entering simple search criteria

26
Mobile Application

• Definition Software that runs on mobile device
  that ranges from device control software to full
  blown OS software
• Attributes
• Hardware Constraints
• Multi-tasking is difficult
• Limited space for input devices
• Capable of running Distributed Applications

27
Mobile Application GUI Characteristics

• Simple GUI Design
• Simple Menu for quick navigation
• Discourage mass data entry
• Discourage multi-tasking

28
Example Mobile Application GUI

• Mobile Windows

Limited Screen Space
Limited Input Keys
29
Typical User Actions on Mobile App GUI

• Navigation is driven by number keys
• Type-Ahead text fields are utilized to minimize
  typing
• Quick Tasks are typical rather than full blown
  projects

30
Observations

• Human behavior has impacted GUI Design
• GUI Design and growing number of GUI devices
  impact Human Behavior
• Correlation between different GUI designs and
  Human behavior has implications

31
Future Sessions

• Implications/Impact that different GUI Designs
  have on humans namely
• Users
• Software Engineers/Architects
• Future UI Technologies and their potential human
  impact
• Ubiquitous paradigm?