Arthur Fink Page 1

Notes on Designing User Interfaces

for

OpenEdge GUI for .NET

Arthur FinkArthur Fink Consulting

www.arthurfink.com © 2008 by Arthur Fink

Arthur Fink Page 2

My promise

You'll learn guidelines for visual design of modern user-friendly OpenEdge applications

combining rich full-featured controls into simple easy to use applications.

Not a “paint by numbers” toolkit ! 

Arthur Fink Page 3

Moving to .NET is a re-write

Opportunity to rework whole concept

Not a one-to one screen replacement

Make sure UI gets better – not worse!

Arthur Fink Page 4

A “old” program that was easy to use

Arthur Fink Page 5

Only got harder to learn

Arthur Fink Page 6

And the paid version even harder

Arthur Fink Page 7

Our process

Careful observation of user tasks and goals

Real user role in design and testing

Consistent and clear visual standards

Careful selection, styling and use of all .NET controls and other components.

Arthur Fink Page 8

Designing user interfaces that work

Arthur Fink Page 9

Which knob controls lower left burner?

Arthur Fink Page 10

Small changes can make a big difference

Arthur Fink Page 11

Fear of change – and blindness to the gain

Arthur Fink Page 12

Listen to users

Arthur Fink Page 13

Automation anthropologist at work

Arthur Fink Page 14

REAL client is the user. 

What does the user need?

Not what does client think user wants. 

User need to be part of design process.

How can user be in control during operations?

Arthur Fink Page 15

Users need simplicity

Easy to learn

Easy to use

Easy to enter data

Hard to “mess up”

Arthur Fink Page 16

Keep it simple,

No extra data or control

Not everything visible at once

Rarely used features rarely visible

User in control – can drill down

Arthur Fink Page 17

Clear labels

Arthur Fink Page 18

Which way to room 1512?

Arthur Fink Page 19

Offer a clear message users need to hear!

Arthur Fink Page 20

Don’t hide your controls

,

Arthur Fink Page 21

Don’t hide your controls

,

Arthur Fink Page 22

Don’t just mark the hazard; eliminate it!

Arthur Fink Page 23

Not "Error" messages – positive hints

Arthur Fink Page 24

Instead of this rebuke

Arthur Fink Page 25

Encouraging feedback – sounds and sights

Saving project ..... Saving project ....… Saving project .......... Saving project ............. Saving project ................ Saving project ...................

Arthur Fink Page 26

Consistency IS for us  

One way to do things

Common view from screens, paper forms, reports

Same terminology

Ideally the same code is behind each

Arthur Fink Page 27

Optimize for the common cases

Simplify the most common input case.

Unusual cases may take more key strokes.

Arthur Fink Page 28

Allow mouse OR keyboard (when possible)

Hand movement mouse to / from keyboard takes time

(Exception to “one way to do things” rule)

Arthur Fink Page 29

Microsoft Health Common User Interface

Arthur Fink Page 30

A medicine list (from MHCUI)

Arthur Fink Page 31

Prescription (Rx) form (from MHCUI)

Arthur Fink Page 32

Rx form – filled in (from MHCUI)

Arthur Fink Page 33

Standards for consistency (from MHCUI)

Arthur Fink Page 34

Visual standards (from MHCUI)

Arthur Fink Page 35

Visual standards applied (from MHCUI)

Arthur Fink Page 36

Display order for medications (from MHCUI)

Arthur Fink Page 37

Distinguishing similar data (from MHCUI)

Arthur Fink Page 38

Choosing the right control

Not necessarily the fanciest

Learning curve vs. power user features

Arthur Fink Page 39

The right control

Accepts simple direct input

Offer clear unambiguous display

Does require computation or conversion

Doesn’t have many un-used options.

Arthur Fink Page 40

The right control (continued)

Can’t be replaced by something simpler.

Invites easy use (clear affordance)

Is easy to use; hard to mis-use

Has unobtrusive but clear operation

Arthur Fink Page 41

The right control (continued)

Doesn’t make user “think” at all

Has common visual style with other controls

Is visually attractive, and easily readable

Is often familiar to user (from Word, Excel, etc.)

Arthur Fink Page 42

Using the controls right (or not!)

Arthur Fink Page 43

Using the controls right (or not!)

Arthur Fink Page 44

This window looks clear

Arthur Fink Page 45

A confusing window

Arthur Fink Page 46

The confusion here can be dangerous

Arthur Fink Page 47

Progress (OpenEdge) has the tools . . .

Arthur Fink Page 48

More Progress (OpenEdge) . . .

Arthur Fink Page 49

A system that really works

Allow quick, easy, accurate data input

Provides prompt and helpful feedback

Lets the user feel in control

Isn’t hurt by user “mistakes”

Arthur Fink Page 50

A few more guidelines

Don’t interrupt users, or tell them that something worked.

Don’t provide information users can’t use.

Provide “undo” for any destructive action.

Design the interface before starting to code!

Arthur Fink Page 51

Time for your questions, your concerns

? ? ?