Designing The User Experience In The Lotus Notes Client

1
Designing The User Experience In The Lotus Notes
Client

• Chris Blatnick
• interfacematters.com

2
Who Am I?

• Internal/external consultant with 10 years
  experience in Notes and web development
• Recent presenter for Lotus Developer2006,
  Lotusphere 2007 and local/regional user groups
• Project contributor to OpenNTF (Application
  Activity Tracking)
• Author of Interface Matters blog focused on UI
  topics such as interface design, usability and
  the overall software user experience

3
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

4
Why Are We Even Talking About This?

• To the users, the interface is the application
• Users dont care about the technology, just
  getting their jobs done quickly and efficiently

5
What Do We Mean by Interface First?

• Simply put, when developing a new
  application,start with the design of the
  interface, NOT the programming logic
• This is a new way of looking at development, but
  it is not a radical departure
• Use same skills and tools that are currently
  employed, but possibly get rid of some of the
  non-value-added processes and enhance other
  design skills
• Use fewer design documents (views, forms, etc.)
• User interviews become more important
• Learn to focus on usability

6
Looking From the Outside In

• Using Interface First design ideas, initial
  efforts focus on determining what the user sees
  and does while inthe application
• The aim is to address the users work experience
• We want to answer some basic questions
• How will it look?
• How will it work?
• How can we simplify it?

7
The Interface Is King

• The interface is designed before any code is
  written
• This is a crucial point at this stage, its
  still easyto turn back
• Great benefit Changes are cheaper and faster
• Often the choice of interface has a direct effect
  onthe code path you take
• Changes to the interface can cause a lot of
  rework

8
Whats the Payoff for Doing Interface First
Design?

• Design methods are low cost and changes canbe
  made easily
• Early emphasis on the design allows you to make
  many iterations before being locked in. Dont
  like something?Make a quick change or throw it
  away completely.
• If changes are required after code is written,
  the applicationis already on the way to
  increased costs

9
Additional Benefits Are Seen When Finished

• User acceptance is usually higher and the users
  have greater satisfaction with the application
• This is especially true if they are involved in
  thedesign process
• For example, helping design the low-fidelity
  prototypeand being involved in usability testing

10
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

11
Key Elements of Interface First Design

• Interface design is an integrated part of
  thedevelopment plan
• It should be a required part of all projects
• It should be the first phase of the development
  process
• Interface design is ITERATIVE
• Does not stop after the first part of the process
  is complete
• Keep examining if the interface is living up to
  its expectations. Remember the questions
• How will it look?
• How will it work?
• How can we simplify it?

12
Use of Standard Tools

• Low-fidelity prototypes
• Answers How will it look?
• User interviews and user profiles
• Answers How should it work?
• Usability testing
• Answers How does it work and how can we simplify
  it?

13
No Code Allowed!

• Code should not be written during the initial
  phase of Interface First design
• Stay technology agnostic
• Although customers may come to the table
  expecting touse Notes, it may not be the right
  fit
• Dont become constrained by the software. Design
  the interface and then worry about how to build
  it.

14
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

15
Usability Its All About the User

• What is usability?
• Usability is about trying to make a product
  transparent to whoever is using it. The goal of
  usability is not to get people to like the
  program it is to make it so they do not
  noticethe software at all.
• "Good design is transparent.
• It's so good you can't see it." Justin Fox

16
In Other Words

• Its all about ease of use
• Good usability productive, happy users
• Poor usability unproductive, grumpy users
• In Interface First design, usability is one of
  thedriving forces
• Continue to test usability through each iteration
  of the design
• Make features fight for their lives
• If they dont have a purpose or they hinder
  usability,get rid of them

17
Whats Included

• Usability addresses several factors
• Interface
• Functionality
• Copywriting
• Learnability
• User satisfaction
• Errors

18
You Be the Designer

• How can the train notification system be improved?

19
Elements of Good Usability

• An application with good usability will usually
  have
• A clean, uncluttered interface
• Readability as a priority
• Clear definition of the purpose of each element
• Logical flow of information across the page
• Absence of unnecessary features

20
Aesthetics Matter

• An application has to be functional, but it must
  look good while doing so
• Research shows that perceived usability is
  increased witha pleasing design
• A good design does not mean fancy graphics
  orcomplex layout
• Simple and clean applications are highly prized
• Avoid non-standard UI elements
• Example Using checkboxes but only allowing
  asingle value

21
The Overall Goal

• The best interface is the one that the user does
  not notice. That is get the interface out of
  the way.
• If the user does not have to consciously think
  about how the program works, the designer has
  achievedtheir goal!

22
What Users Hate

• There are many things users hate to do whenusing
  software
• Good usability avoids this when possible
• Dont make users
• Repeat information
• Learn obscure codes, routines, etc.
• Wait
• Search for functionality they need
• Read a manual

23
So Why Care About Usability?

• In the end, a focus on usability is important
  because it has a direct impact on the customers
  satisfaction
• Usability is also important to the developer
  since it
• Helps reduce cost of rework
• Can minimize customer complaints
• Simplifies end-user support
• Enhances the image of the firm or company

24
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

25
Beyond Requirements

• Users often come to the development staff with a
  preconceived notion of what they want
• Often they leave out a lot of important
  information
• Many times, they are not sure what they REALLY
  want
• Requirements only tell part of the story
• To be thorough, it is important to uncover all
  the necessary details to design the application
• This is done with User Interviews

26
The User Interview

• The purpose of the User Interview is to gain
  additional information about the users work
• Gaining this knowledge allows the developer to
  frame the context of the application
• Look for
• Additional detail about the requirements
• Background information about the job, department
  politics, past project failures and successes

27
Ideally, the User Interview Consists of

• Direct face to face conversation about the
  application and the users job function
• Observation of the users behavior i.e., how
  theydo the job today

28
Nondirected Interviews

• To be most effective, ask questions that remove
  bias, opinions, and expectations
• Open-ended questions are best
• Avoid Yes/No questions

• Good Questions
• What do you likeabout this?
• How would you ?

• Bad Questions
• Is this a good idea?
• Do you likethis feature?
• Dont you think ?

29
Choosing the Right Users

• For user interviews to be successful and most
  productive, make sure that the best
  candidatesare chosen
• Good mix of subject matter experts
• Users that represent the end-to-end process
• Let them know what is expected ahead of time
• On large projects, ensure that users will have
  the time tomake themselves available
• Dont go for marathon sessions two hours or
  lessworks best

30
The Role of User Profiles

• User Profiles are typically used in larger
  applications where there are so many users that
  interviews wouldbe impossible
• In these cases, create fictional models that
  represent some typical users, based on
  interviews with some of the intended real world
  users

31
User Profiles Help Shape Your Design

• To use them effectively, user profiles should not
  just be a list of duties or requirements
• Treat the profiles as real people
• Develop goals, personality traits, needs and
  wants, tools, etc.
• Just as done in actual user interviews, construct
  a picture of how the user works in a typical day
• What do they do?
• What do they need to accomplish?

32
How Do User Interviews and Profiles Help?

• Use the information that has been compiled to
  drivethe design
• Answer the questions that were asked
• Align the design with the targeted goals
• Frequently review the user interviews or profiles
  as work moves through the design process to
  ensurethat the team is on the right path

33
A Sample User Profile
34
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

35
About Prototyping

• Prototyping is a crucial part of a good design
  process
• Prototypes should be used as early as possible in
  thedesign phase
• Prototypes are much cheaper and easier to change
  than code
• Prototypes provide a solid foundation for
  discussion between developers and users
• Fortunately, due to its RAD nature, prototyping
  is well known by most Notes developers
• Whats not so well known is the power
  ofLow-Fidelity Prototypes

36
Low-Fidelity Whats That?

• Fidelity refers to the level of detail in the
  design
• Low-fidelity Hand-drawn screens
• High-fidelity Lots of detail
• Professionally rendered drawings
• Screenshots

37
Simple Tools Are Used

• The low-fidelity method uses simple tools to
  buildthe prototype
• Paper
• Pencils
• Crayons
• Scissors

38
Features of a Low-Fidelity Prototype

• Good low-fidelity prototypes
• Are quick and dirty
• Are easily changed
• Can be thrown away without worry
• Are combined with usability testing
• Are created at the very beginning of the project
• Go through several iterations

39
Purpose of the Low-Fidelity Prototype

• The main purpose of the low-fidelity prototype is
  to map out the key aspects of the user interface
  and application functionality early in the
  process
• With this method, prototyping can be done
  cheaplyand easily in a very short time frame
• This usually results in big cost savings

40
Low-Fidelity Prototyping Benefits

• There are some key benefits that low-fidelity
  prototyping gives the developer
• Because it doesnt look professional, users are
  much more likely to speak freely about the design
• Users can become actively involved in the design
  processby picking up the crayons or pencils
  investment leads to better acceptance

41
More Benefits

• Specifically from the developers perspective,
  the changes required dont hurt as much, since
  the developer is not emotionally invested in the
  design

42
Low-Fidelity Examples
43
Low-Fidelity Examples (cont.)
44
Low-Fidelity Examples (cont.)
45
Low-Fidelity Examples (cont.)
46
The First Step

• Begin by creating the frame of your UI togive
  it context
• Its OK to cheat here by capturing a screenshot
  of the Notes client window, Web browser, etc.
• This sets up the environment the user will be
  working in and provides them with a familiar
  starting point (menus, window commands, etc.)

47
Building the Interface

• Next, simply draw out the features of the
  interface
• Screen layout
• Buttons
• Dialogs, etc.
• Use a new sheet of paper for each screen
• For example, in a Notes application, there might
  be pages for
• Home page
• Forms
• Views
• Embedded Editors

48
Additional Bonus

• At the end of the project, the low-fidelity
  prototype serves both as a history of the design
  changes and as a good documentation resource

49
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

50
Bringing It All Together

• Usability testing is the component of Interface
  First design that joins together all of the
  design workdone to this point

51
Usability Testing Defined

• Usability testing is a technique for ensuring
  that the users of a system can carry out the
  intended tasks efficiently, effectively, and
  satisfactorily
• Note that this is not the same as testing that
  the system actually returns the correct results
• Functional testing and QA should still take place

52
Usability Testing Is About Testing Your Design

• The purpose of the usability test is to test the
  application, NOT the user
• Never make the user feel like they made a
  mistake. If they dont do what was planned, the
  design MAY be wrong!
• The test should uncover whether or not thedesign
  works
• In particular, look for
• Ease of use
• Functionality
• Uncovering unknowns or items not thought of
  before

53
Poking a Little Fun
54
Participants in a Usability Test

• User
• In testing, users should be given specific tasks
  to accomplish (e.g., complete an employee
  profile)
• Facilitator/Host
• The Facilitator runs the test session, explaining
  the test tothe user, collecting notes, etc.
• Usually, the Facilitator is the only person
  besides the user who will speak during a testing
  session

55
Additional Participants

• Computer
• One person takes on the role of the computer,
  explaining to the user what is happening when
  they perform a certain action
• They also change the screens when necessary
• Observer(s)
• The observation group may be made up of several
  team members, including process owners,
  developers, etc. Observers do not interact with
  users they are there onlyto record the actions
  of the user.

56
But Theres Only One of Me

• Taking on multiple roles is OK
• Sometimes it is necessary to play all the roles
  
  in the usability test. Just remember some
  simple
  rules
• When acting as the computer, dont talk or guide
  the user
• Take notes after the user has completed an action
• Break sessions into small chunks a tired user
  wont give you optimal results

57
Using the Testing Results

• The results of the usability test should be used
  to
• Fix obvious flaws in the design
• If a significant percentage of users could not
  accomplisha specific task or were confused by an
  aspect of the functionality, it should be
  redesigned. (Thus, a good reason that initial
  testing should be done with a low-fidelity
  prototype.)

58
Additional Considerations

• Test results can also be used to
• Add or modify behavior to meet user expectations
• For example, if users kept clicking certain text
  thinking it was a link, it might be worthwhile
  actually turning that text into a link
• Learn what works and what doesnt work for
  future designs
• If desired, create a knowledge base containing
  materials used in the testing process and results
  obtained
• This can be a great resource for future developers

59
What Well Cover

• Defining Interface First design
• Exploring the elements of Interface First design
• Caring about usability
• Conducting user interviews and creating user
  profiles
• Creating Low-Fidelity prototypes
• Leveraging usability tests
• Thinking beyond the screen

60
The User Experience

• Usability and UI design are all part of a greater
  package that encompasses every aspect of the
  users interaction with your software
• This all encompassing nature of design
  consideration is known as the user experience
• BUTgood user experience design goes beyond just
  the software itself

61
Theres Only One Chance To Make A First
Impression

• The initial engagement with a customer often sets
  the stage for the entire project
• Make sure to
• Clearly map out the work plan
• Inform customer of unique design ideas they may
  not have seen before, such as low-fi prototyping
  and usability testing
• Project an enthusiastic, up-beat attitude
• Truly LISTEN to what the customer has to say
• Avoid the temptation to start solving their
  problems
• Use this time to really focus on the people
  involved

62
Have Fun And Delight The Customer

• Dont underestimate the power of fun
• Just because it is a business environment doesnt
  mean that humor and fun cant be injected into
  the project
• Look for opportunities to play
• Use funny test names or names that have a lot of
  meaning to the customer (favorite singer, actor,
  etc.)
• Build an Easter Egg into your app

63
Question The Whole Process

• Consider the users perception of working with
  the designer and with the application
• How are problems reported?
• How are answers communicated?
• How do users make suggestions for improvement?
• Is online help readily available?
• How do users get support?

64
Some Good Answers

• Develop a sense of community around the
  application
• Build a mechanism for users to interact,
  especially if the user base is geographically
  disperse
• Discussion area?
• Process owner blog?
• Design a feedback process directly into the
  application
• Provide on-line help that users can update
  themselves
• Use a wiki to let users build a self-sustaining,
  more relevant help system

65
Consider Fast Release Cycles

• Many Web 2.0 apps introduce new features almost
  daily
• Sometimes new features work and sometimes they
  dont
• Dont be afraid to introduce a feature and then
  remove it if it doesnt live up to expectations
• Users prefer small, incremental changes to big,
  sweeping modifications
• Endeavour to make responding to bug reports a
  critical task
• Perception of responsiveness is key to engaging
  the users

66
Some Ideas To Get You Started
67
Rethinking Your UI

• Some great ideas to think about when building
  your UI
• Use layers
• Do you really need views?
• Hide complexityuse the 80-20 rule
• Embrace the concepts of dashboards

68
Resources

• Steve Krug, Dont Make Me Think A Common Sense
  Approach to Web Usability (New Riders Press,
  2005).
• Excellent book about using a common sense
  approach inWeb design (applicable to Notes too)
• Carolyn Snyder, Paper Prototyping The Fast and
  Easy Way to Design and Refine User Interfaces
  (Morgan Kaufmann, 2003).
• Companion Web site can be found at
  www.paperprototyping.com
• Great selection of downloadable materials to use
• www.useit.com
• Website of Jakob Nielsen, one of the foremost
  authoritieson usability and user interface design

69
Resources (cont.)

• www-03.ibm.com/developerworks/blogs/page/marybeth
• Mary Beth Ravens blog (lead product designer for
  Hannover)
• interfacematters.com
• My blog, where I discuss UI issues with a focus
  onNotes and Domino

70
How To Contact Me
Chris Blatnick http//interfacematters.com chris_at_i
nterfacematters.com