Chapter 16 (continued) dialogue notations and design.

Slides:



Advertisements
Similar presentations
Interaction Design: Visio
Advertisements

Getting Started with PowerPoint
Chapter 16 dialogue notations and design. Dialogue Notations and Design Dialogue Notations –Diagrammatic state transition networks, JSD diagrams, flow.
Copyright © 2005 Rockwell Automation, Inc. All rights reserved. 1 Micro Logix 1100 RSLogix 500 LAB#2 Timing, Counting & Comparing.
Dialogue Notations and Design zDialogue Notations yDiagrammatic xstate transition networks, JSD diagrams, flow charts yTextual xformal grammars, production.
1 textual notations grammars production rules CSP and event algebras.
Office 2003 Post-Advanced Concepts and Techniques M i c r o s o f t Excel Project 7 Using Macros and Visual Basic for Applications (VBA) with Excel.
Chapter 16 dialogue notations and design. Dialogue Notations and Design Dialogue Notations –Diagrammatic state transition networks, JSD diagrams, flow.
PIC Programming with Logicator
Guide to Oracle10G1 Introduction To Forms Builder Chapter 5.
A Guide to Oracle9i1 Introduction To Forms Builder Chapter 5.
CMPUT 301: Lecture 25 Graphic Design Lecturer: Martin Jagersand Department of Computing Science University of Alberta Notes based on previous courses by.
Macros Tutorial Week 20. Objectives By the end of this tutorial you should understand how to: Create macros Assign macros to events Associate macros with.
Creating, Formatting, and Editing a Word Document with a Picture
Office 2003 Post-Advanced Concepts and Techniques M i c r o s o f t Word Project 8 Working with Macros and Visual Basic for Applications (VBA)
Module 3 Productivity Programs Common Features and Commands Microsoft Office 2007.
EDITING AND FORMATTING A DOCUMENT Presented by: Dr. Ennis-Cole.
PYP002 Intro.to Computer Science Microsoft Word1 Lab 07 Creating Documents with Efficiency and Consistency.
COMPREHENSIVE Excel Tutorial 8 Developing an Excel Application.
Microsoft Visual Basic 2012 CHAPTER TWO Program and Graphical User Interface Design.
Visual Basic Chapter 1 Mr. Wangler.
Microsoft Word 2010 Chapter 1 Creating, Formatting, and Editing a Word Document with Pictures.
Assignment 2 Self-Introduction slideshow Throughout DM10 you will need to access PowerPoint files like this for various software tutorials and other course.
Department of Mechanical Engineering, LSUSession VII MATLAB Tutorials Session VIII Graphical User Interface using MATLAB Rajeev Madazhy
Chapter 8: Writing Graphical User Interfaces
Chapter 2 More Controls Programming in C#. NET © 2003 by The McGraw-Hill Companies, Inc. All rights reserved.
Microsoft Access Lesson 1 Lexington Technology Center February 11, 2003 Bob Herring On the Web at
Visual Basic 2005 CHAPTER 2 Program and Graphical User Interface Design.
Chapter 10 Fireworks: Part II The Web Warrior Guide to Web Design Technologies.
Microsoft Visual Basic 2005: Reloaded Second Edition Chapter 2 Creating a User Interface.
This tutorial teaches Microsoft Word basics. Although knowledge of how to navigate in a Windows environment is helpful, this tutorial was created for.
 Application – another name for a program.  Interface – is what appears on the screen when the application is running.  Program Code – is instructions.
Chapter Two Creating a First Project in Visual Basic.
Visual Basic.NET Comprehensive Concepts and Techniques Chapter 8 Debugging, Creating Executable Files, and Distributing a Windows Application.
1 chapter 16 dialogue notations and design (pt 1).
Dialogue notation focus on STNs extract from chap 8 slides for Human Computer Interaction
1 Creating Windows GUIs with Visual Studio. 2 Creating the Project New Project Visual C++ Projects Windows Forms Application Give the Project a Name and.
McGraw-Hill/Irwin Programming in Visual Basic 6.0 © 2002 The McGraw-Hill Companies, Inc. All rights reserved. Update Edition Chapter 2 More Controls.
Object-Oriented Application Development Using VB.NET 1 Chapter 10 VB.NET GUI Components Overview.
Dialogue Notations and Design zDialogue Notations yDiagrammatic xstate transition networks, JSD diagrams, flow charts yTextual xformal grammars, production.
Chapter 2 More Controls Programming in C#. NET Objectives Use text boxes, group boxes, check boxes, radio buttons, and picture boxes effectively.
Click on this button to move to the previous slide of your notebook. Click on this button to move to the next slide of your notebook. Click on this button.
Programming Logic and Design Fourth Edition, Comprehensive Chapter 14 Event-Driven Programming with Graphical User Interfaces.
Microsoft Visual Basic 2012 CHAPTER FIVE Decision Structures.
CHAPTER 5 Introduction to Word Processing. OBJECTIVES 1.Define common terms related to word processing 2.Create, format, edit, save, and print Microsoft.
Chapter 10 Using Macros, Controls and Visual Basic for Applications (VBA) with Excel Microsoft Excel 2013.
Word processing is the software package that enables you to create,edit, print and save documents for future retrieval reference. creating a document.
Chapter 4: Do-It-Yourself Designing (Designing Interfaces)
Dive Into® Visual Basic 2010 Express
Excel Tutorial 8 Developing an Excel Application
Microsoft Visual Basic 2005: Reloaded Second Edition
An Introduction to Computers and Visual Basic
How to access your work from home or another computer
Multiple Classes and Inheritance
Program and Graphical User Interface Design
CHAPTER FIVE Decision Structures.
Creating, Formatting, and Editing a Word Document with Pictures
Chapter 1: An Introduction to Visual Basic 2015
An Introduction to Computers and Visual Basic
Chapter 2 Visual Basic Interface
Program and Graphical User Interface Design
MicroEconomix 1500 RSLogix 500 LAB#2
Shelly Cashman: Microsoft Word 2016
An Introduction to Computers and Visual Basic
European Computer Driving Licence
dialogue notations and design
Dialogue Notations and Design
Presentation transcript:

chapter 16 (continued) dialogue notations and design

textual notations grammars production rules CSP and event algebras

Textual - Grammars Regular expressions sel-line click click* dble-click compare with JSD same computational model different notation BNF expr ::= empty | atom expr | '(' expr ')' expr more powerful than regular exp. or STNs Still NO concurrent dialogue

Production rules Unordered list of rules: if condition then action –condition based on state or pending events –every rule always potentially active Good for concurrency Bad for sequence

Event based production rules Sel-line  first C-point first  rest C-point rest  rest D-point rest  Note: –events added to list of pending events –‘ first ’ and ‘ rest ’ are internally generated events Bad at state!

Prepositional Production System State based Attributes: Mouse: { mouse-off, select-line, click-point, double-click } Line-state: { menu, first, rest } Rules (feedback not shown): select-line  mouse-off first click-point first  mouse-off rest click-point rest  mouse-off double-click rest  mouse-off menu Bad at events!

CSP and process algebras used in Alexander's SPI, and Agent notation good for sequential dialogues Bold-tog = select-bold?  bold-on  select-bold?  bold-off  Bold-tog Italic-tog =... Under-tog =... and concurrent dialogue Dialogue-box = Bold-tog || Italic-tog || Under-tog but causality unclear

Dialogue Notations - Summary Diagrammatic STN, JSD, Flow charts Textual grammars, production rules, CSP Issues event base vs. state based power vs. clarity model vs. notation sequential vs. concurrent

Semantics Alexander SPI (i) Two part specication: EventCSP - pure dialogue order EventISL - target dependent semantics dialogue description - centralised syntactic/semantic trade-off - tollerable

Semantics Alexander SPI (ii) EventCSP Login = login-mess -> get-name -> Passwd Passwd = passwd-mess -> (invalid -> Login [] valid -> Session) EventISL event: login-mess prompt: true out: “Login:” event: get-name uses: input set: user-id = input event: valid uses: input, user-id, passwd-db wgen: passwd-id = passwd-db(user-id)

Semantics - raw code event loop for word processor dialogue description - very distributed syntactic/semantic trade-off - terrible! switch ( ev.type ) { case button_down: if ( in_text ( ev.pos ) ) { mode = selecting; mark_selection_start(ev.pos); }... case button_up: if ( in_text ( ev.pos ) && mode == selecting ) { mode = normal; mark_selection_end(ev.pos); }... case mouse_move: if (mode == selecting ) { extend_selection(ev.pos); }... } /* end of switch */

Action properties completeness missed arcs unforeseen circumstances determinism several arcs for one action deliberate: application decision accident: production rules nested escapes consistency same action, same effect? modes and visibility

Checking properties (i) completeness –double-click in circle states? double click ?

Checking properties (ii) Reversibility: –to reverse select `line'

Checking properties (ii) Reversibility: –to reverse select `line' –click

Checking properties (ii) Reversibility: –to reverse select `line' –click - double click

Checking properties (ii) Reversibility: –to reverse select `line' –click - double click - select `graphics' –(3 actions) N.B. not undo

State properties reachability can you get anywhere from anywhere? and how easily reversibility can you get to the previous state? but NOT undo dangerous states some states you don't want to get to

Dangerous States word processor: two modes and exit F1- changes mode F2- exit (and save) Esc- no mode change but... Esc resets autosave edit exit menu F1F2 Esc

Dangerous States (ii) exit with/without save  dangerous states duplicate states - semantic distinction F1-F2 - exit with save F1-Esc-F2 - exit with no save edit exit menu F1F2 Esc edit exit menu F1F2 Esc any update

Lexical Issues visibility differentiate modes and states annotations to dialogue style command - verb noun mouse based - noun verb layout not just appearance...

layout matters word processor - dangerous states old keyboard - OK Esc F1F2 F3... F tab... edit exit menu F1F2 Esc edit exit menu F1F2 Esc any update

layout matters new keyboard layout intend F1-F2 (save) finger catches Esc EscF1F2F3... edit exit menu F1F2 Esc edit exit menu F1F2 Esc any update

layout matters new keyboard layout intend F1-F2 (save) finger catches Esc F1-Esc-F2 - disaster! EscF1F2F3... edit exit menu F1F2 Esc edit exit menu F1F2 Esc any update

Dialogue Analysis - Summary Semantics and dialogue attaching semantics distributed/centralised dialogue description maximising syntactic description Properties of dialogue action properties: completeness, determinism, consistency state properties: reachability, reversibility, dangerous states Presentation and lexical issues visibility, style, layout N.B. not independent of dialogue

Dialogue Analysis - Summary Semantics and dialogue attaching semantics distributed/centralised dialogue description maximising syntactic description Properties of dialogue action properties: completeness, determinism, consistency state properties: reachability, reversibility, dangerous states Presentation and lexical issues visibility, style, layout N.B. not independent of dialogue

Digital watch – User Instructions two main modes limited interface - 3 buttons button A changes mode

Digital watch – User Instructions dangerous states guarded … by two second hold completeness distinguish depress A and release A what do they do in all modes?

Digital watch – Designers instructions and... that’s just one button