id 102 designing a world-class user experience for notes · designing a world-class user experience...

®

ID 102 Designing a World-Class User Experience forIBM Lotus® NotesMary Beth Raven, Lead Designer for Lotus Notes 8

Chris Reckling, Manager of Product Design

Goals of this presentation Learn about our Design methodology and approach

Understand why Lotus Notes 8 is the way it is

Get excited about the new release!

Agenda

The Mission

Making the Vision a Reality

Visual Style

Usefulness

Execution

Innovation

Summary

Overheard from Engineers in Early Notes 8 Planning…

<screens removed>

Management decided it was time to take action…

to involve interaction designers…

and usability experts…

and graphic artists.

And the next release of Lotus Notes was born… <screens removed>

The mission…

From June 14, 2005 announcement at the DNUG Conference in Hannover, Germany:

“Hannover” will deliver a world class user experience in mail, calendar and contact management, and new capabilities such as activity management and composite applications…

Their mission…



Focus on Improved UI and Productivity

Their mission…



Innovation in How to Collaborate

Their mission…



Powerful Application Paradigms

Agenda

The Mission


Visual Style

Usefulness

Execution

Innovation

Summary

Attributes of a World-Class User Experience

Visual Style

Usefulness

Execution

Innovation

No Such Thing as “Absolute” World-Class UX

Specific User Groups

Specific Tasks

The Lotus Notes 8 Design Team IBM Employees And many of YOU!

The Person of the Year - YOU

Once upon a time…

Methods Used to Collaborate with You

XXXBlog

XXUI Spec Reviews

XXXUsers First

XXXXUsability Testing

XXPrioritizations

XXSurveys

XXXSite Visits

InnovationExecutionUsefulness Visual StyleMethod

Understanding the (124 million) Users Persona technique

Focused on “Knowledge worker”, individual contributor role Administrative assistant Executives who have AA’s manage their mail and calendar

Interviewed individual contributors

Reviewed interviews with AA’s collected for previous Notes releases, then did more

Used executive interviews originally conducted to inform the design of WBSE (Websphere Business Strategy and Execution)

Site Visits and Interviews to Understand Users Manufacturing

Legal

Financial

Pharmaceutical

Automotive

Data Processing

Human Services

Interviewed Notes Users:

The Personas Fictional characters based on

interviews with real users.

Keep real end users and their motivations and skills in mind at all time.Samantha Daryn, Promotions Manager at Renovations

Ted Amado, VP of Marketing and Merchandising at Renovations

Betty Zechman, AA to Ted Amado

Samantha

Ted Betty

Some Constraints Backwards compatibility

No loss of functionality

Don’t confuse existing users

Agenda

The Mission


Visual Style

Usefulness

Execution

Innovation

Summary

Visual Style Create a visual system

Consistently apply it across the product

Our Process Research: What brand attributes do we want the new visual style to convey Studies with users Refine the style

Visual Style Research: Brand Attributes to Convey

Simple

Modern

Fresh

People-oriented

Business-oriented

InnovativeFamiliarReliable

Agile

Visual Style: Study One Purpose: Determine preferred palette, textures, shapes

Method: Surveys of the target users (Executive, AA, Knowledge worker, Domino developer, Domino admin)

Created five “Image Boards” by purchasing the most popular magazines from each group and cutting out images that reflected the attributes we wanted to convey

<screens removed>

Visual Style: Study One (continued)

Surveyed all five user groups for their responses to the image boards Each participant looked at 3 boards

Answered questions for each attribute on each board: How well does this board represent [IBM attribute] They were asked to point to specific images that prompted their answer, and to

describe what about the image conveyed that concept.

Chose the boards with the highest number of repeat answers

<screens removed>

Visual Style: Analysis of Study One

Analyzed the boards for Color Palette Textures Shapes

<screens removed>

Visual Style: Study Two Purpose: Apply the palette and design tone choices to wireframes of the

UI to determine a favorite

Method: Web survey asked respondents to look at 10 user interface wireframes and answer questions about them, indicating their preferences and reasons

<screens removed>

Visual Style: Refinements to the Style Based on our goals for openness and native look and feel

Based on usability – we refined to create more room for content

Agenda

The Mission


Visual Style

Usefulness

Execution

Innovation

Summary

Usefulness Capability

Day-to-day usage

Task-oriented

Our process Prioritize features with customers Conduct surveys to learn about product usage Design and hold design reviews Conduct site visits as part of our new Users First program Usability test, feed results to development, and test again Blog, speak at conferences, and get feedback

Usefulness: Prioritize Features with Customers

Goals:

Feedback on the overall design direction

Specific feedback on some initial designs

Have customers prioritize features

Usefulness: Prioritize Features with Customers (p. 2)

“In ‘Hannover’, Samantha can…”

Usefulness: Prioritize Features with Customers (p. 3)

Usefulness: Conduct Surveys On-line surveys to learn more about usage/validate our assumptions

Locations & replication

Bookmarks & Workspace

Usefulness: Design and Hold Design Reviews

Designs took the form ofOnline documentsPaper specsPrototypes in several technologies (Html, visual basic, other)

Internal design reviews

Weekly design reviews with our design partners

Usefulness: Users First Program On-site visits

Interviews

On-site usability tests

Partnership

Usefulness: Usability Test, and Re-Test Over 475 usability test sessions so far

More during Lotusphere 2007 and public beta!

Usefulness: Blog and Gather Feedback Quick feedback prior to

implementation

Responses have influenced the design ofInbox column headersDeletion modelMenus(Not) having dialogs ask about adding applications to the Workspace

Icons

http://www-03.ibm.com/developerworks/blogs/page/marybeth

http://www-03.ibm.com/developerworks/blogs/page/InsideLotus

Usefulness: Capability Highlights Preview on Right in Mail, Calendar, Contacts

Improved Search access

Ability to Delegate Contacts

Use the “Open List” as a menu or as a docked bookmark bar

Improved Out of Office

Undo

Inline Spellcheck

Vertical Preview, Search Access

Calendar Views Navigator

Dock the Open List

Usefulness: Day to Day Use Highlights Streamlined mail, calendar, contacts forms

Updated views of inbox, calendar, contacts

Added a Tools menu and turned the Window menu on by default

Hid more advanced features, such as Agents

Show filter bar so users don’t get lost (e.g. for View Unread)

All Documents view easily accessible in the navigator

Re-Designed the Mail Form

Re-designed the Calendar Form

Lukas Geiger/Renovations

Re-Designed the Contacts Form

Usefulness: Task-oriented Highlights Added Send/receive mail button to action bar and menus

Context-sensitive action bar in Calendar

One-click Accept/Decline of calendar invitations

One-click action buttons (New message, Forward, etc)

Moved toolbar closer to your work, below tabs

New Calendar Views and Actions

One-Click Actions

Usefulness: Some of the Top Priorities We Heard Improve e-mail fidelity across the internet

Smart matching of names

Recent collaborations

Business Card view for Contacts

Message recall

Usefulness: Improve E-mail Fidelity Across the Internet

Usefulness: Use “Smart Matching” of Names

Usefulness: Recent Collaborations

Usefulness: Business Card View

Usefulness: Message Recall

Agenda

The Mission


Visual Style

Usefulness

Execution

Innovation

Summary

Execution Attention to detail

Delighting users with the experience

Our process Review and triage usability issues Prioritize usability issues with customers Re-design to fix the usability issues and hold design reviews Usability test, feed results into development, and test again

Execution: Review and Triage Usability Issues Design team created a prioritized list of usability issues

Validated our prioritization with a customer

Execution: Re-design and Conduct Design Reviews Re-designs took the form of written documents or prototypes

Design reviews were of 2 types: Hired external consulting form to evaluate the re-design Held internal reviews for conformance to spec and OS standards

Execution: Usability Test, and Re-Test Address usability issues in design and code

Execution: Some Issues We’re Addressing Crash recovery – don’t require reboot

Better blocking of spam

Unify preferences

More operating-system conventions

Simplify the process of finding free time

And many more… come to the UX lab to see

Agenda

The Mission


Visual Style

Usefulness

Execution

Innovation

Summary

Innovation Keep ahead

Innovation that matters!

Our process Work closely with IBM research Design and Review with Design Partners Usability Test

Innovation: Work Closely with IBM Research

Sidebar idea came from IBM Research in “Re-inventing e-mail”

Activities came from IBM Research “Activity Explorer”

Other ideas from Social Networking and activity-centric computing

Innovation: Design and Conduct Design Reviews

Design partners reviewed specs for Sidebar Activity Explorer

Usability Tests on new features

Innovation Highlights Mail Conversations

Sidebar

Grouped tabs

Productivity tools

Activities

Composite applications

Mail Conversations See the entire reply chain all at once

Reduces inbox clutter

Sidebar Peripheral vision

Handy

Easy access

Grouped Tabs Reduce window clutter

Documents, Spreadsheets, Presentations

Agenda

The Mission


Visual Style

Usefulness

Execution

Innovation

Summary

Summary – Designing Lotus Notes Designing a World-class user experience couldn’t be done without

YOU, our users, customers, and partners!

Ongoing process – join us!

World-class Visual Usefulness Execution Innovation

Related Sessions and Q&A Related Sessions

AD 407: How to Build IBM Lotus Notes Components for Composite Applications

AD408: IBM Lotus Notes 8 Views, Extensibility and Programming Model ID101:What’s New in IBM Lotus Notes 8 and Beyond ID103: IBM Lotus Notes 8 Mail, Mail, Threads, and Calendaring and Scheduling – Designs and Demo

ID104: Exploring the IBM Productivity Tools in IBM Lotus Notes 8ID105: Deploying IBM Lotus Notes 8 Clients

Visit us in the User Experience Lab, Oceanic 1

Please complete the evaluations

© IBM Corporation 2007. All Rights Reserved.

The workshops, sessions and materials have been prepared by IBM or the session speakers and reflect their own views. They are provided for informational purposes only, and are neither intended to, nor shall have the effect of being, legal or other guidance or advice to any participant. While efforts were made to verify the completeness and accuracy of the information contained in this presentation, it is provided AS IS without warranty of any kind, express or implied. IBM shall not be responsible for any damages arising out of the use of, or otherwise related to, this presentation or any other materials. Nothing contained in this presentation is intended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software.

References in this presentation to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. Product release dates and/or capabilities referenced in this presentation may change at any time at IBM’s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. Nothing contained in these materials is intended to, nor shall have the effect of, stating or implying that any activities undertaken by you will result in any specific sales, revenue growth or other results.

All references to Renovations refer to a fictitious company and are used for illustration purposes only. All references to Samantha Daryn, Ted Amado, and Betty Zechman are fictitious.

IBM, the IBM logo, Lotus, Lotus Notes, Notes, Domino, Sametime, WebSphere, Workplace and Lotusphere are trademarks of International Business Machines Corporation in the United States, other countries, or both.