Class Meeting 8 November 1, 2005

Slides:



Advertisements
Similar presentations
Chapter 12 cognitive models.
Advertisements

Human Computer Interaction CSC User System Interface CSC Class Meeting 6 October 2, 2012.
Certificate in Digital Applications – Level 02 Website Design and Creation.
LAYOUT OF PAGE ELEMENTS September 28 th, PATTERNS Common ways to use the Layout Elements of Visual Hierarchy, Visual Flow, Grouping and Alignment,
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Chapter 7 Using Advanced Cascading Style Sheets HTML5 & CSS 7 th Edition.
Chapter 6: NavigationCopyright © 2004 by Prentice Hall User-Centered Website Development: A Human- Computer Interaction Approach.
Midterm Exam Review IS 485, Professor Matt Thatcher.
Day 9 Navigation Heuristic evaluation. Objectives  Look at some simple rules on navigation  Introduction to Heuristic Evaluation.
Multimedia Authoring - Chapter 6 - Part I1 Multimedia Authoring Using Various Tools - Part I: ToolBook M.Dastbaz Designing Interactive Multimedia Systems.
CSC USI Class Meeting 9 November 2, 2010 Election Day.
Mid-Term Exam Review IS 485, Professor Matt Thatcher.
Business Definition Analysis & Design Phase. Development Team Smit Shah (System Analyst, Web Developer) Harsha Balagere (Web Designer) Abdullah Alsubaiei.
 Introduction  Interface Design Failures  Design Failure explained  Interaction Techniques  Conclusion.
Expression Web 2 Concepts and Techniques Expression Web Design Feature Web Design Basics.
Problemsolving 2 Problem Solving: Designing a website solution Identifying how a solution will function Taking into account the technical constraints a.
Chapter Objectives Discuss the relationship between page length, content placement, and usability Complete Step 4: Specify the website’s navigation system.
Web Design, 3 rd Edition 4 Planning a Successful Web Site: Part 2.
Chapter 5 Models and theories 1. Cognitive modeling If we can build a model of how a user works, then we can predict how s/he will interact with the interface.
Web Design, 4 th Edition 4 Planning a Successful Web Site: Part 2.
 What is a wireframe?  What features are important?  Which wireframe tools might you want to try?
An Interactive Multimedia Database of U.S. Courthouses 1 CourtsWeb, is a website that evaluates and documents recent federal courthouses. It is a decision.
Guidelines and Prototypes CS774 Human Computer Interaction Spring 2004.
Human Factors in Web Design Mohsen Asgari. Contents WWW & Human Factors Relationship Human and Computer Interaction HCI & WWW Information Presentation.
Website Development Instructor: Brad Atkinson. Planning Save valuable time Create mock-up drawing Provide useful content.
Chapter 6: NavigationCopyright © 2004 by Prentice Hall 6. Navigation Design Site-level navigation: making it easy for the user to get around the site Page-level.
Human Computer Interaction CSC User System Interface CSC Class Meeting 7 October 9, 2012.
USING WORDPRESS TO CREATE A WEBSITE (RATHER THAN A BLOG) STEP-BY-STEP INSTRUCTIONS.
CSC USI Class Meeting 10 November 9, 2010.
CSC USI Class Meeting 6 October 5, Outline for Evening One-minute assessment Research project issues Table creation revisited Augmenting.
CSC USI Meeting 8 October 26, Designing the Perfect Phone™ Meet as design teams this evening Interim design report due by 9:00 p.m. EDT.
CSC USI Class Meeting 9 October 31, 2007.
CSC USI Class Meeting 4 September 13, 2006.
Web Site Development - Process of planning and creating a website.
1 CS 490JL Midterm Review Midterm in-class Tuesday, October 26 With thanks to Wai-Ling Ho-Ching.
Interface Evaluation Models and techniques GOMS analysis Keystroke Level Model Cognitive dimensions of notation Hierarchy of design principles Task analysis.
Unit 14 - Task 3 Webpage Design. Lesson: eportfolio Class: 13d Date: 21 st Jan Starter pageguide/badpgguide.html.
Web Accessibility. Why accessibility? "The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect."
Getting an account with WordPress.com
Managing the content of web pages
Chapter 2: The Visual Studio .NET Development Environment
Midterm in-class Tuesday, Nov 6
A Guide to Using Wikispaces
Image by MIT OpenCourseWare Troughput (bps) Error rate (%) Mouse Trackball Joystick Touchpad.
Task Analysis CSCI 4800/6800 Feb 27, 2003.
School of Business Administration
D.Y.O. Web The new and easy way to create and maintain your own professional dynamic website.
Project Objectives Lay out Web pages Create layers
Avraham Leff James T. Rayfield IBM T.J. Watson Research Center
CSC420 Page Layout.
Web Development A Visual-Spatial Approach
CHAPTER 8 Multimedia Authoring Tools
Graphic Design A career in art.
Web Design and Development
Chapter 2 Adding Web Pages, Links, and Images
Informatics 121 Software Design I
Class Meeting 5 February 10, 2009
CSc4730/6730 Scientific Visualization
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Website Planning EIT, Author Gay Robertson, 2018.
Model based design Cognitive (user) models
IENE Intercultural Education of Nurses and medical staff in Europe
Cognitive models linguistic physical and device architectural
Human Computer Interaction
Chapter 12 cognitive models.
ETSI TC MTS TDL SC meeting Reports
CSC USI Class Meeting 6 October 3, 2007.
Chapter 12 cognitive models.
Is TeacherWeb Performance Centered?
Presentation transcript:

Class Meeting 8 November 1, 2005 CSC 8570 -- USI Class Meeting 8 November 1, 2005

Important Concepts Models of physical action: Fitt’s Law, Hick’s Law, Keystroke Level Model GOMS model, in various forms Cognitive dimensions of notation What makes a good interface? Who says? GUEPs Mental models, in various forms

Important Concepts (2) Applied perception How humans perceive their surroundings Usability models That metrics for interfaces exist Simple interfaces are best Making better concept maps

Confusions – Mental Models As theories How one believes a system works, e.g. an ATM machine, a history list As problem spaces A set of partial solutions to a problem with transitions from one partial solution to the next, e.g. the “screen shots” as you solve a Sudoku puzzle

Mental Models (2) As homomorphisms of the physical world An analog picture of a description from which inferences may be drawn Derived from language, perception, or imagination The image, or pictorial context, drawn from a textual description

Mental Models (3) As representations of representational artifacts (yoked state space) A combination of the goal space and the operations available to transform the elements of the goal space. The model one uses when editing text or creating a webpage in a text editor.

Mental Models (4) As computationally equivalent to external representations (internalization)

Confusions – GOMS Match GOMS to the problem space view of a mental model Compare GOMS and the KLM for a system Develop two or three clear examples Clock setting Route discovery POS credit card payment

Confusions – Others Cognitive dimensions Models and frameworks in general Which are better Which are more important Three-stage visual model Preparing for the exam

Button Experiment Button syntax Button semantics Notation Button semantics Properties of buttons Button class Cognitive dimensions of the button GUEPs supported/violated by the button

Interface Evaluation Models and techniques GOMS analysis Keystroke Level Model Cognitive dimensions of notation Hierarchy of design principles Task analysis Layout appropriateness

Interface Evaluation (2) Measurements Time Counts Geometry Satisfaction

Interface Evaluation (3) Musike Scoring System Developed for menu-based systems Modified for web pages Provides weighted sum of scores of individual factors Each individual factor to be based on a measurable design principle

Example -- AWSP Evaluates web sites Based on Jakob Neilsen’s design principles Rewritten by Lea Taylor

AWSP Definitions Above the Fold: The first screen content that is visible without scrolling Examples: Content that provides insight into the results of following a link External Ads: Ads for companies or organizations other than the focus of the current website

AWSP Definitions (2) Liquid Layout: Layout that allows the text to adjust to the size of the available space Widget: A simple interface feature such as a dropdown menu or a text box

Web Site Assignment www.allentownpa.org www.altoonapa.gov www.arnoldpa.org www.bethlehem-pa.gov www.cityofduquesne.com www.yorkcity.org www.cityoferiepa.com www.franklinpennsylvania.net www.harrisburgpa.gov www.cityoflancasterpa.com www.mckeesport.org www.newcastlepa.org www.cityofreadingpa .com www.cityofwilliamsport.org

Next Time Read Carroll, Chapter 10. Create concept map for Chapter 10

Research Team Meetings