CS260. UI Toolkits. Björn Hartmann University of California, Berkeley EECS, Computer Science Division Fall 2010
|
|
- Hortense Paul
- 5 years ago
- Views:
Transcription
1 CS260 UI Toolkits Björn Hartmann University of California, Berkeley EECS, Computer Science Division Fall 2010
2 In the beginning cryptonomicon.com/beginning.html
3 The Xerox Alto (1973)
4 Event-Driven UIs Old model (e.g., UNIX shell, DOS) Interaction controlled by system, user queried for input when needed by system Event-Driven Interfaces (e.g., GUIs) Interaction controlled by user System waits for user actions and then reacts More complicated programming and architecture
5 Console program pseudo-code Do some work Prompt user for input Wait for user input Process user input Do some more work Exit
6 Console program // Java Example: Console console = System.console(); String name = console.readline( Your name: ); System.out.println("You have entered : " + name);
7 Minimal interactive program Do until a quit command: { " wait for user input " process it " (optionally) update display }
8 Minimal interactive program Do until a quit command: { " wait for user input " switch (input-cmd) {!! case insert: do-insert( )!! case delete: do-delete( )!! case backspace: " (optionally) update display }
9 Minimal interactive program Can t use this (global) approach for window systems, because the result of a user command depends on the active window (and the active component within that window). Too many possible combinations of input x target window.
10 Widgets Encapsulation and organization of interactive controls Class hierarchy encapsulating widgets Top-level Component class Implements basic bounds management, and event processing Drawn using underlying 2D graphics library Input event processing and handling Typically mouse and keyboard events Bounds management (damage/redraw) Only redraw areas in need of updating
11 W. Newman Light Handle 1967/68 11
12
13 Interface Builder - Library
14 Toolkit Example: Java Swing GUI toolkit with a widget set and an API 7
15 Declarative Layout (WPF) <StackPanel> <Label>Enter Text:</Label> <TextBox TextWrapping="Wrap > </TextBox> <StackPanel Orientation="Horizontal" HorizontalAlignment="Right"> <Button>Ok</Button> <Button>Cancel</Button> </StackPanel> </StackPanel>
16 User Interface Builders 8
17 Event Dispatch Apple, Cocoa Event-Handling Guide
18 Event Dispatch Loop Event Queue Queue of input events Mouse moved (t 0,x,y) Event Loop (runs in dedicated thread) Remove next event from queue Determine event type Find proper component(s) Invoke callbacks on components Repeat, or wait until event arrives Component Invoked callback method Update application state Request repaint, if needed
19 Cocoa Event Dispatch Loop 1) Events from input devices enter here 3) Main loop processes one event per iteration 2) Event is added to FIFO event queue Apple, Cocoa Event-Handling Guide
20 Event Dispatch: Targeting Label TextArea Buttons
21 Event Dispatch Window Panel Event Queue Mouse moved (t 0,x,y) Mouse pressed (t 1,x,y,1) Mouse dragged (t 2,x,y,1) Key typed (t 3, F1 ) (queues and dispatches incoming events in a dedicated thread) Label TextArea Panel /* callback for TextArea */ public void mousemoved(e) { // process mouse moved event } Button Button
22 Mouse/Touch vs. Keyboard Events Mouse Events are (usually) routed to the top-most (in z- order) visible component underneath the cursor using hit testing. Exception: captured mouse events after beginning interaction Keyboard events are (usually) routed to the component that has key focus. Exceptions: keys that change focus, accelerator keys
23 Success of Tools Window Managers, User Interface Toolkits, and Interface Builders are ubiquitous Most software built using them Are based on many years of HCI research: Brad A. Myers. A Brief History of Human Computer Interaction Technology. ACM interactions. Vol. 5, no. 2, March, pp
24 Why Tools? The quality of the interfaces will be higher. Why? Rapid prototyping. Easier to incorporate changes motivated by evaluation. Re-use affords investment in high quality tools. Consistency of interface design. Enable collaboration among specialists. 12
25 Why Tools? The UI will be easier to create and maintain. Why? Less code to write due to component re-use. Better modularization, separation of concerns Tools may abstract complex systems or algorithms. Easier to port an application to different hardware or software environments if device dependencies are isolated in the user interface tool. 13
26 What should tools do? Help design the interface given a specification of the tasks. Help implement the interface given a design. Help evaluate the interface after it is designed. Create easy-to-use interfaces. Allow the designer to rapidly investigate different designs. Allow non-programmers to create user interfaces. Provide portability across different machines and devices. Be easy to use themselves. 14
27 Tools might do: Provide sets of standard UI components Guide the implementation Help with screen layout and graphic design. Validate user inputs Handle user errors Handle aborting and undoing of operations Provide help and prompts Deal with field scrolling and editing Insulate the application from all device dependencies Allow the end user to customize the interface. 15
28 Application Types What application domains are deserving of specialized toolkit support? 16
29 Application Types Word processors Drawing programs (CAD/CAM) Painting programs Mail readers Spreadsheets Programming environments / code editors WWW browsers Interactive games Visualizations Automated-teller machines (ATM) Virtual Reality Multi-media Video Animation Controlling machinery 17
30 DiamondSpin Toolkit Toolkit for tabletop UIs (Shen, Vernier, Forlines, Ringel, CHI 04) 18
31 19
32 Tabletop UI Needs Multi-user support Identity-aware widgets Multiple menus Public and personal spaces Resolving conflicting actions Arbitrary orientation of UI elements Techniques to control orientation and layout Rotation sensitive components 20
33 istuff Toolkit Physical UI components for ubiquitous computing environments (multiple users, devices, and applications) [Ballagas, Ringel, Stone, Borchers], CHI 03 21
34 istuff Design istuff components Device + proxy ( smarts are in the proxy) PatchPanel Translate between istuff events and applicationspecific events Run-time retargetable events Address dimension mismatches 22
35 23
36 Discussion of Themes Address the useful & important aspects of UIs Narrower tools have been more successful than ones that try to do everything Do one thing well Threshold / Ceiling Research systems often aim for high ceiling Successful systems often seem to instead aim for a low threshold Impossible to have both? 24
37 Threshold & Ceiling Programming in C Visual Basic Director (v6) Difficulty of Use MFC Click and Create C Programming Lingo xcmds HyperCard C Programming HyperTalk Basic Goal Sophistication of what can be created 25
38 Discussion of Themes, cont. Path of Least Resistance Tools should guide implementers into better user interfaces Goal for the future: do this more? Predictability Programmers do not seem willing to release control Especially when system may do sub-optimal things Moving Targets Long stability of Macintosh Desktop paradigm has enabled maturing of tools 26
39 Evaluating User Interface Tools An API is a user interface where programmers are the users Should you evaluate toolkit as you would a UI? Factors Expressiveness (Ceiling) Development Rate (of skilled user) Learning Rate (to become skilled) Performance Portability 27
40 Class Deployment (In collaboration with Leapfrog)
41 41
42 42
43 43
44 44
45
46 The Future of Interface Tools Supporting Prototyping Collaboration Evaluation of interfaces built with tools of tools themselves how to prototype, test, iterate? Emerging interface styles, such as mobile recognition-based UIs (speech, pens, vision) multiple devices 28
47 Summary Toolkits provide reusable interface components to simplify UI development Toolkit trap: it s tempting to only make UIs that the toolkit makes easy, instead of making what s best for a specific app Toolkit types: WIMP (Garnet, Swing, Motif, etc) Specialty (Phidgets, istuff, Papier-Mache, DiamondSpin, GroupKit, Peripheral Displays Toolkit, etc) 30
48 Toolkit features may not matter... Arduino: no smart components programmed in C Wildly successful with amateurs & artists. Why? 48
Software Tools. Scott Klemmer Autumn 2009
stanford hci group http://cs147.stanford.edu Software Tools Scott Klemmer Autumn 2009 It accomplishes an important task (for better and for worse) You don t have to make it yourself, and it abstracts a
More informationUI Toolkits. HCID 520 User Interface Software & Technology
UI Toolkits HCID 520 User Interface Software & Technology http://www.cryptonomicon.com/beginning.html Xerox Alto 1973 Evolution of User Interfaces Command Line (UNIX shell, DOS prompt) Interaction driven
More informationUI Toolkits. HCID 520 User Interface Software & Technology
UI Toolkits HCID 520 User Interface Software & Technology http://www.cryptonomicon.com/beginning.html Xerox Alto 1973 Evolution of User Interfaces Command Line (UNIX shell, DOS prompt) Interaction driven
More informationSoftware Tools. Scott Klemmer. stanford hci group / cs147. tas: Marcello Bastea-Forte, Joel Brandt, Neil Patel, Leslie Wu, Mike Cammarano
stanford hci group / cs147 Software Tools Scott Klemmer tas: Marcello Bastea-Forte, Joel Brandt, Neil Patel, Leslie Wu, Mike Cammarano 04 December 2007 http://cs147.stanford.edu Developers are People
More informationBerkeley. CS160: User Interface Design. Video Puppetry: SIGGRAPH Asia Widgets, Events, MVC 02/29/12 2/29/12
CS160: User Interface Design Widgets, Events, MVC 02/29/12 Berkeley UNIVERSITY OF CALIFORNIA Video Puppetry: SIGGRAPH Asia 2008 Authors: Connelly Barnes, David E. Jacobs, Jason Sanders, Dan B Goldman,
More informationEvent Driven UIs and Model-View-Controller
Event Driven UIs and Model-View-Controller CS160: User Interfaces John Canny Includes slides based on those of James Landay & Jeffrey Heer Reminder Archos 5 hardware available in class this Weds one per
More informationUI Toolkits. HCID 520 User Interface Software & Technology
UI Toolkits HCID 520 User Interface Software & Technology http://www.cryptonomicon.com/beginning.html Xerox Alto 1973 Evolution of User Interfaces Command Line (UNIX shell, DOS prompt) Interaction driven
More informationFall UI Design and Implementation 1
Fall 2005 6.831 UI Design and Implementation 1 1 Suggested by Daniel Swanton Fall 2005 6.831 UI Design and Implementation 2 2 Suggested by Robert Kwok Fall 2005 6.831 UI Design and Implementation 3 3 Input
More informationOrganization of User Interface Software
Organization of User Interface Software Administration Questions about assignments due and assignments assigned 2 What we will talk about Ways to organize UI code Different models of user interfaces as
More informationEvent Dispatch. Interactor Tree Lightweight vs. Heavyweight Positional Dispatch Focus Dispatch. 2.4 Event Dispatch 1
Event Dispatch Interactor Tree Lightweight vs. Heavyweight Positional Dispatch Focus Dispatch 2.4 Event Dispatch 1 Event Architecture A pipeline: - Capture and Queue low-level hardware events - Dispatch
More informationUser Interface Toolkits
User Interface Toolkits Mike Bostock - May 25, 2009 Past, Present, and Future of User Interface Software Tools, Brad Myers, Scott E. Hudson, Randy Pausch, ACM Transactions on Computer-Human Interaction,
More informationEvent Dispatch. Interactor Tree Lightweight vs. Heavyweight Positional Dispatch Focus Dispatch. Event Architecture. A pipeline: Event Capture
Event Dispatch Interactor Tree Lightweight vs. Heavyweight Positional Dispatch Focus Dispatch 2.4 Event Dispatch 1 Event Architecture A pipeline: - Capture and Queue low-level hardware events - Dispatch
More informationEvent Dispatch. Dispatching events to windows and widgets.
Event Dispatch Dispatching events to windows and widgets. Review: Event Architecture 2 Event capture, processing and dispatch. Event Capture Hardware events (interrupts) Event Dispatch Software events
More informationUI Software Organization
UI Software Organization The user interface From previous class: Generally want to think of the UI as only one component of the system Deals with the user Separate from the functional core (AKA, the app
More informationWindows and Events. created originally by Brian Bailey
Windows and Events created originally by Brian Bailey Announcements Review next time Midterm next Friday UI Architecture Applications UI Builders and Runtimes Frameworks Toolkits Windowing System Operating
More informationGraphical User Interfaces (GUIs)
CMSC 132: Object-Oriented Programming II Graphical User Interfaces (GUIs) Department of Computer Science University of Maryland, College Park Model-View-Controller (MVC) Model for GUI programming (Xerox
More informationHuman-Computer Interaction. Chapter 2. What is HCI?
Human-Computer Interaction Chapter 2 What is HCI? Overview 2.1 The Human 2.2 The Computer 2.3 The Interaction Models of Interaction Interaction Styles Elements of the WIMP Interface HCI 2.3.1 Models of
More informationCS 4300 Computer Graphics
CS 4300 Computer Graphics Prof. Harriet Fell Fall 2011 Lecture 8 September 22, 2011 GUIs GUIs in modern operating systems cross-platform GUI frameworks common GUI widgets event-driven programming Model-View-Controller
More informationstanford hci group / cs376 UI Software Tools Scott Klemmer 14 October research topics in human-computer interaction
stanford hci group / cs376 UI Software Tools Scott Klemmer 14 October 2004 research topics in human-computer interaction http://cs376.stanford.edu cs547 tomorrow: Scott Snibbe Body, Space, and Cinema 2
More informationUser Interaction. User Interaction. Input devices. Input devices. Input devices GUIs and GUI design Event-driven programming 3D interaction
User Interaction User Interaction Input devices GUIs and GUI design Event-driven programming 3D interaction CS 465 lecture 19 2003 Steve Marschner 1 2003 Steve Marschner 2 Input devices Input devices Discrete
More informationMOBILE COMPUTING 1/20/18. How many of you. CSE 40814/60814 Spring have implemented a command-line user interface?
MOBILE COMPUTING CSE 40814/60814 Spring 2018 How many of you have implemented a command-line user interface? How many of you have implemented a graphical user interface? HTML/CSS Java Swing.NET Framework
More informationPage 1. Human-computer interaction. Lecture 2: Design & Implementation. Building user interfaces. Users and limitations
Human-computer interaction Lecture 2: Design & Implementation Human-computer interaction is a discipline concerned with the design, implementation, and evaluation of interactive systems for human use and
More informationWe will talk about Alt-Tab from the usability perspective. Think about: - Is it learnable? - Is it efficient? - What about errors and safety?
1 This lecture s candidate for the Hall of Fame & Shame is the Alt-Tab window switching interface in Microsoft Windows. This interface has been copied by a number of desktop systems, including KDE, Gnome,
More information(Incomplete) History of GUIs
CMSC 433 Programming Language Technologies and Paradigms Spring 2004 Graphical User Interfaces April 20, 2004 (Incomplete) History of GUIs 1973: Xerox Alto 3-button mouse, bit-mapped display, windows 1981:
More informationGraphical User Interface (GUI)
Graphical User Interface (GUI) An example of Inheritance and Sub-Typing 1 Java GUI Portability Problem Java loves the idea that your code produces the same results on any machine The underlying hardware
More informationUser Interface Design
User Interface Design & Development Lecture 07 Direct Manipulation João Pedro Sousa SWE 632 George Mason University today direct manipulation window UIs support for operations mouse, pen, eye tracking,
More informationLow fidelity: omits details High fidelity: more like finished product. Breadth: % of features covered. Depth: degree of functionality
Fall 2005 6.831 UI Design and Implementation 1 Fall 2005 6.831 UI Design and Implementation 2 Paper prototypes Computer prototypes Wizard of Oz prototypes Get feedback earlier, cheaper Experiment with
More information8/30/15 MOBILE COMPUTING. CSE 40814/60814 Fall How many of you. have implemented a command-line user interface?
MOBILE COMPUTING CSE 40814/60814 Fall 2015 How many of you have implemented a command-line user interface? 1 How many of you have implemented a graphical user interface? HTML/CSS Java Swing.NET Framework
More informationCMSC434. Introduction to Human-Computer Interaction. Week 10 Lecture 16 Mar 29, 2016 Engineering Interfaces II. Jon
CMSC434 Introduction to Human-Computer Interaction Week 10 Lecture 16 Mar 29, 2016 Engineering Interfaces II Jon Froehlich @jonfroehlich Human Computer Interaction Laboratory COMPUTER SCIENCE UNIVERSITY
More informationGraphical User Interface (GUI)
Graphical User Interface (GUI) An example of Inheritance and Sub-Typing 1 Java GUI Portability Problem Java loves the idea that your code produces the same results on any machine The underlying hardware
More informationNADAR SARASWATHI COLLEGE OF ENGINEERING & TECHNOLOGY
NADAR SARASWATHI COLLEGE OF ENGINEERING & TECHNOLOGY DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING EIGHTH SEMESTER QUESTION BANK CS6008 -HUMAN COMPUTER INTERACTION UNIT I FOUNDATIONS OF HCI The Human:
More informationReview. Designing Interactive Systems II. Review. Base Window System. Apps UITK BWS GEL. 4-Layer Model Graphics and Event Library BWS GEL
Window Manager Base Window System Graphics & Event Library Hardware more abstract, application-/user- Applications User Interface Toolkit Review Designing Interactive Systems II 4-Layer Model Graphics
More informationSeng310 Lecture 8. Prototyping
Seng310 Lecture 8. Prototyping Course announcements Deadlines Individual assignment (extended) deadline: today (June 7) 8:00 am by email User testing summary for paper prototype testing- Thursday June
More informationWidget Toolkits CS MVC
Widget Toolkits 1 CS349 -- MVC Widget toolkits Also called widget libraries or GUI toolkits or GUI APIs Software bundled with a window manager, operating system, development language, hardware platform
More informationWidgets. Widgets Widget Toolkits. 2.3 Widgets 1
Widgets Widgets Widget Toolkits 2.3 Widgets 1 User Interface Widget Widget is a generic name for parts of an interface that have their own behavior: buttons, drop-down menus, spinners, file dialog boxes,
More informationPrototyping. Readings: Dix et al: Chapter 5.8 Marc Rettig: Prototyping for tiny fingers, Communications of the ACM, April 1994.
Prototyping Readings: Dix et al: Chapter 5.8 Marc Rettig: Prototyping for tiny fingers, Communications of the ACM, April 1994. 1 What is prototyping? producing cheaper, less accurate renditions of your
More informationWidgets. Widgets Widget Toolkits. User Interface Widget
Widgets Widgets Widget Toolkits 2.3 Widgets 1 User Interface Widget Widget is a generic name for parts of an interface that have their own behavior: buttons, drop-down menus, spinners, file dialog boxes,
More informationCS6008-HUMAN COMPUTER INTERACTION Question Bank
CS6008-HUMAN COMPUTER INTERACTION Question Bank UNIT I FOUNDATIONS OF HCI PART A 1. What is HCI? 2. Who is involved in HCI. 3. What are the 5 major senses? 4. List the parts of human Eye. 5. What is meant
More informationPage 1. Human-computer interaction. Lecture 1b: Design & Implementation. Building user interfaces. Mental & implementation models
Human-computer interaction Lecture 1b: Design & Implementation Human-computer interaction is a discipline concerned with the design, implementation, and evaluation of interactive systems for human use
More informationutablesdk: Enabling Rapid Prototyping of Window-based Applications on Interactive Tabletop
utablesdk: Enabling Rapid Prototyping of -based Applications on Interactive Tabletop Chenjun Wu, Yongqiang Qin Computer Science Department Tsinghua University Beijing, China + 86 010 6279 7003p802 {anwingwu,
More informationCSE 510: Advanced Topics in HCI
CSE 510: Advanced Topics in HCI Interface Toolkits James Fogarty Daniel Epstein Tuesday/Thursday 10:30 to 12:00 CSE 403 Tools and Interfaces Why Interface Tools? Case Study of Model-View-Controller Case
More informationChapter 6: Interfaces and interactions
Chapter 6: Interfaces and interactions Overview Introduce the notion of a paradigm Provide an overview of the many different interface paradigms highlight the main design and research issues for each Consider
More informationInteraction Style Categories. COSC 3461 User Interfaces. What is a Command-line Interface? Command-line Interfaces
COSC User Interfaces Module 2 Interaction Styles What is a Command-line Interface? An interface where the user types commands in direct response to a prompt Examples Operating systems MS-DOS Unix Applications
More informationWidget. Widget is a generic name for parts of an interface that have their own behaviour. e.g., buttons, progress bars, sliders, drop-down
Widgets Jeff Avery Widget Widget is a generic name for parts of an interface that have their own behaviour. e.g., buttons, progress bars, sliders, drop-down menus, spinners, file dialog boxes, etc are
More informationWhat is interaction? communication user system. communication between the user and the system
What is interaction? communication user system communication between the user and the system 2 terms of interaction The purpose of interactive system is to help user in accomplishing goals from some domain.
More informationLecture 6. Design (3) CENG 412-Human Factors in Engineering May
Lecture 6. Design (3) CENG 412-Human Factors in Engineering May 28 2009 1 Outline Prototyping techniques: - Paper prototype - Computer prototype - Wizard of Oz Reading: Wickens pp. 50-57 Marc Rettig: Prototyping
More informationInput: Interaction Techniques
Input: Interaction Techniques Administration Questions about homework? 2 Interaction techniques A method for carrying out a specific interactive task Example: enter a number in a range could use (simulated)
More informationFramework. Set of cooperating classes/interfaces. Example: Swing package is framework for problem domain of GUI programming
Frameworks 1 Framework Set of cooperating classes/interfaces Structure essential mechanisms of a problem domain Programmer can extend framework classes, creating new functionality Example: Swing package
More informationCS 116x Winter 2015 Craig S. Kaplan. Module 03 Graphical User Interfaces. Topics
CS 116x Winter 2015 Craig S. Kaplan Module 03 Graphical User Interfaces Topics The model-view-controller paradigm Direct manipulation User interface toolkits Building interfaces with ControlP5 Readings
More informationGUI Implementation Support
GUI Implementation Support Learning Objectives: Why GUIs? What is a GUI? Why is implementation support needed? What kinds of implementation support are available? Basic concepts in OO GUI toolkit & app
More informationJava Swing Introduction
Course Name: Advanced Java Lecture 18 Topics to be covered Java Swing Introduction What is Java Swing? Part of the Java Foundation Classes (JFC) Provides a rich set of GUI components Used to create a Java
More informationDesigning Interactive Systems II
Designing Interactive Systems II Computer Science Graduate Program SS 2011 Prof. Dr. Jan Borchers Media Computing Group RWTH Aachen University http://hci.rwth-aachen.de/dis2 Jan Borchers 1 1 Review From
More informationTcl/Tk lecture. What is the Wish Interpreter? CIS 410/510 User Interface Programming
Tcl/Tk lecture CIS 410/510 User Interface Programming Tool Command Language TCL Scripting language for developing & using GUIs Allows generic programming variables, loops, procedures Embeddable into an
More informationThe 60-Minute Guide to Development Tools for IBM Lotus Domino, IBM WebSphere Portal, and IBM Workplace Applications
The 60-Minute Guide to Development Tools for IBM Lotus Domino, IBM WebSphere Portal, and IBM Workplace Stuart Duguid Portal & Workplace Specialist TechWorks, IBM Asia-Pacific Overview / Scope The aim of
More informationOur Hall of Fame or Shame candidate for today is the command ribbon, which was introduced in Microsoft Office The ribbon is a radically
1 Our Hall of Fame or Shame candidate for today is the command ribbon, which was introduced in Microsoft Office 2007. The ribbon is a radically different user interface for Office, merging the menubar
More informationObjectives. Object-Oriented Analysis and Design with the Unified Process 2
Objectives Understand the differences between user interfaces and system interfaces Explain why the user interface is the system to the users Discuss the importance of the three principles of user-centered
More informationLecture 9: UI Software Architecture. Fall UI Design and Implementation 1
Lecture 9: UI Software Architecture Fall 2003 6.893 UI Design and Implementation 1 UI Hall of Fame or Shame? Source: Interface Hall of Shame Fall 2003 6.893 UI Design and Implementation 2 Today s hall
More informationIntroduction to GUIs. Principles of Software Construction: Objects, Design, and Concurrency. Jonathan Aldrich and Charlie Garrod Fall 2014
Introduction to GUIs Principles of Software Construction: Objects, Design, and Concurrency Jonathan Aldrich and Charlie Garrod Fall 2014 Slides copyright 2014 by Jonathan Aldrich, Charlie Garrod, Christian
More informationC SCI The X Window System Stewart Weiss
The X Window System The X Window System is a networking and display protocol which provides windowing on bitmapped displays. X provides the basic framework for building GUI environments, such as drawing
More informationHuman-Computer Interaction IS4300
Human-Computer Interaction IS4300 1 Quiz 3 1 I5 due next class Your mission in this exercise is to implement a very simple Java painting applet. The applet must support the following functions: Draw curves,
More informationChapter 2: Operating-System Structures
Chapter 2: Operating-System Structures Chapter 2: Operating-System Structures Operating System Services User Operating System Interface System Calls Types of System Calls System Programs Operating System
More informationAutomatic layout Constraints Model-based UI. Declarative programming. Procedural programming. Saying what you want. Saying how to achieve it
Topics L1: usability L2: user-centered design, user & task analysis L3: MVC, observer, view hierarchy L4: component, stroke & pixel models, redraw, doublebuffering L5: perception, cognition, motor, memory,
More informationCS123. Programming Your Personal Robot. Part 2: Event Driven Behavior
CS123 Programming Your Personal Robot Part 2: Event Driven Behavior You Survived! Smooth Sailing Topics 2.1 Event Driven Programming Programming Paradigms and Paradigm Shift Event Driven Programming Concept
More informationHuman-Computer Interaction Design Studio
stanford hci group / cs247 Design Human-Computer Interaction Design Studio Evaluate Prototype 6February 2012 http://cs247.stanford.edu Getting it right the first time is hard Need to make quick turns around
More informationDesigning RIA Accessibility: A Yahoo UI (YUI) Menu Case Study
Designing RIA Accessibility: A Yahoo UI (YUI) Menu Case Study Doug Geoffray & Todd Kloots 1 Capacity Building Institute Seattle, Washington 2006.11.30 What s Happening? 2 3 Web 1.0 vs. Web 2.0 Rich Internet
More informationOperating-System Structures
Recap Chapter 2: Operating-System Structures Presented By: Dr. El-Sayed M. El-Alfy Note: Most of the slides are compiled from the textbook and its complementary resources From: OS by Tanenbaum, 2008 March
More informationOriginal GUIs. IntroGUI 1
Original GUIs IntroGUI 1 current GUIs IntroGUI 2 Why GUIs? IntroGUI 3 Computer Graphics technology enabled GUIs and computer gaming. GUI's were 1985 breakout computer technology. Without a GUI there would
More informationchapter 3 the interaction
chapter 3 the interaction ergonomics physical aspects of interfaces industrial interfaces Ergonomics Study of the physical characteristics of interaction Also known as human factors but this can also be
More informationHeavyweight with platform-specific widgets. AWT applications were limited to commonfunctionality that existed on all platforms.
Java GUI Windows Events Drawing 1 Java GUI Toolkits Toolkit AWT Description Heavyweight with platform-specific widgets. AWT applications were limited to commonfunctionality that existed on all platforms.
More informationGUI in C++ PV264 Advanced Programming in C++ Nikola Beneš Jan Mrázek Vladimír Štill. Faculty of Informatics, Masaryk University.
GUI in C++ PV264 Advanced Programming in C++ Nikola Beneš Jan Mrázek Vladimír Štill Faculty of Informatics, Masaryk University Spring 2017 PV264: GUI in C++ Spring 2017 1 / 23 Organisation Lectures this
More informationMerits of QT for developing Imaging Applications UI
White Paper Merits of QT for developing Imaging Applications UI Amitkumar Sharma January 08, 2008 Trianz 2008 White Paper Page 1 Table of Contents 1.0 Executive Summary. ------------------------------------------------------------------------------------------------------------
More informationIconStickers: Converting Computer Icons into Real Paper Icons
Human-Computer Interaction, Ergonomics and Uer Interfaces, Volume 1 (HCI International 99) pp. 271-275, ISBN 0-8058-3391-9, Lawrence Erlbaum Associates, Publishers, Aug 22-26, 1999. IconStickers: Converting
More informationCOMP6700/2140 GUI and Event Driven Programming
COMP6700/2140 GUI and Event Driven Programming Alexei B Khorev and Josh Milthorpe Research School of Computer Science, ANU April 2017 Alexei B Khorev and Josh Milthorpe (RSCS, ANU) COMP6700/2140 GUI and
More informationInput (part 2: input models)
Input (part 2: input models) Dealing with diversity Saw lots of diversity in devices actual details of devices (e.g., device drivers) is a real pain how do we deal with the diversity? Need a model (abstraction)
More informationGUI Program Organization. Sequential vs. Event-driven Programming. Sequential Programming. Outline
Sequential vs. Event-driven Programming Reacting to the user GUI Program Organization Let s digress briefly to examine the organization of our GUI programs We ll do this in stages, by examining three example
More informationChapter 5. Software Tools
Chapter 5 Software Tools 1 Introduction The demands of modern life require user-interface architects to build reliable, standard, safe, inexpensive, effective, and widely acceptable user interfaces on
More informationTYPES OF INTERACTORS Prasun Dewan Department of Computer Science University of North Carolina at Chapel Hill
TYPES OF INTERACTORS Prasun Dewan Department of Computer Science University of North Carolina at Chapel Hill dewan@cs.unc.edu Code available at: https://github.com/pdewan/colabteaching PRE-REQUISITES Model-
More informationPage 1. Ideas to windows. Lecture 7: Prototyping & Evaluation. Levels of prototyping. Progressive refinement
Ideas to windows Lecture 7: Prototyping & Evaluation How do we go from ideas to windows? Prototyping... rapid initial development, sketching & testing many designs to determine the best (few?) to continue
More informationModel-view-controller View hierarchy Observer
-view-controller hierarchy Fall 2004 6831 UI Design and Implementation 1 Fall 2004 6831 UI Design and Implementation 2!"# Separation of responsibilities : application state Maintains application state
More informationDesigning accessible applications
ᅠ Designing accessible applications Samuel Thibault Slides & stuff on http://brl.thefreecat.org/ http://liberte0.org/ 1 Gnuplot Color blindness: 8% male, 0.5% female 4 Gnuplot 5!! Color blindness: 8% male,
More informationChapter 6: Interfaces and interactions
Chapter 6: Interfaces and interactions Overview Introduce the notion of a paradigm Provide an overview of the many different kinds of interfaces highlight the main design and research issues for each of
More informationEvent-based Programming
Window-based programming Roger Crawfis Most modern desktop systems are window-based. What location do I use to set this pixel? Non-window based environment Window based environment Window-based GUI s are
More informationUniversal Communication Component on Symbian Series60 Platform
Universal Communication Component on Symbian Series60 Platform Róbert Kereskényi, Bertalan Forstner, Hassan Charaf Department of Automation and Applied Informatics Budapest University of Technology and
More informationArtOfTest Inc. Automation Design Canvas 2.0 Beta Quick-Start Guide
Automation Design Canvas 2.0 Beta Quick-Start Guide Contents Creating and Running Your First Test... 3 Adding Quick Verification Steps... 10 Creating Advanced Test Verifications... 13 Creating a Data Driven
More informationHuman Computer Interaction Lecture 08 [ Implementation Support ] Implementation support
Human Computer Interaction Lecture 08 [ Implementation Support ] Imran Ihsan Assistant Professor www.imranihsan.com aucs.imranihsan.com HCI08 - Implementation Support 1 Implementation support programming
More informationCut, Paste, Drag-and-Drop. Benefits, data formats, and Java implementation
Cut, Paste, Drag-and-Drop Benefits, data formats, and Java implementation Direct Manipulation Principles There is a visible and continuous representation of the domain objects and their actions. Consequently,
More informationBeyond CSE143. What s Left To Do? Templates. Using Templates. A Template Class. A Problem with Reusing Code CSE 143
What s Left To Do? Beyond CSE143 Templates Modern Software Development Windows and Java 143 Wrapup Beyond the C++ covered in this course Many topics, many more details of topics we did cover Main omission:
More informationFall UI Design and Implementation 1
Fall 2004 6.831 UI Design and Implementation 1 1 Source: UI Hall of Shame Fall 2004 6.831 UI Design and Implementation 2 Our Hall of Shame candidate for the day is this interface for choose how a list
More informationSYSPRO s Fluid Interface Design
SYSPRO s Fluid Interface Design Introduction The world of computer-user interaction has come a long way since the beginning of the Graphical User Interface, but still most application interfaces are not
More informationThe MUI (Micro User Interface) facility
The MUI (Micro User Interface) facility Prerequisites An understanding of event-driven programming and some experience using the simple events and callbacks from the GLUT toolkit in OpenGL, and some review
More informationInput part 3: Interaction Techniques
Input part 3: Interaction Techniques Interaction techniques A method for carrying out a specific interactive task Example: enter a number in a range could use (simulated) slider (simulated) knob type in
More informationChapter 2. Operating-System Structures
Chapter 2 Operating-System Structures 2.1 Chapter 2: Operating-System Structures Operating System Services User Operating System Interface System Calls Types of System Calls System Programs Operating System
More informationC# Forms and Events. Evolution of GUIs. Macintosh VT Datavetenskap, Karlstads universitet 1
C# Forms and Events VT 2009 Evolution of GUIs Until 1984, console-style user interfaces were standard Mostly dumb terminals as VT100 and CICS Windows command prompt is a holdover In 1984, Apple produced
More informationPOAD Book: Chapter 4: Design Patterns as Components Chapter 5: Visual Design Models
POAD Book: Chapter 4: Design Patterns as Components Chapter 5: Visual Design Models Instructor: Dr. Hany H. Ammar Dept. of Computer Science and Electrical Engineering, WVU Outline Chapter 4: Design Patterns
More informationCS415 Human Computer Interaction
CS415 Human Computer Interaction Lecture 7 Implementation and Testing Tools for HCIs October 4, 2015 Sam Siewert Coming Up Quiz on Wednesday for Part II Chapters 5,6,7,8,9 Review Next Week on Monday, 10/12
More informationGUI Basics and Windowing Systems
GUI Basics and Windowing Systems Using X Windows as a case study 1 2 Evolution of GUIs Xero Star (1981) Developed at Xerox PARC Not commercially successful. Apple Macintosh (1984) Inspired by Xerox PARC
More informationSBD:Interaction Design
analysis of stakeholders, field studies ANALYZE Problem scenarios claims about current practice SBD:Interaction Design metaphors, information technology, HCI theory, guidelines DESIGN Activity scenarios
More informationLecture 8: Rapid Prototyping. CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.
Lecture 8: Rapid Prototyping CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University. 1 GUI Prototyping What is prototyping? rapid initial development, sketching & testing many designs to
More informationEvent-driven Programming: GUIs
Dr. Sarah Abraham University of Texas at Austin Computer Science Department Event-driven Programming: GUIs Elements of Graphics CS324e Spring 2018 Event-driven Programming Programming model where code
More informationimplementation support
Implementation support chapter 8 implementation support programming tools levels of services for programmers windowing systems core support for separate and simultaneous usersystem activity programming
More information