89
User Centered Design - Maximising the Use of Portal Sean Kelly, Certus Solutions Limited General Manager, Enterprise Web Solutions Make change work for you IBM Insight Forum 09 ®

User Centered Design - Maximising the Use of Portal › events › nz › ibmforum › presentations › ... · User Centred Design (UCD) UCD is a design methodology that aims to

  • Upload
    others

  • View
    6

  • Download
    0

Embed Size (px)

Citation preview

User Centered Design - Maximising the Use of Portal

Sean Kelly, Certus Solutions LimitedGeneral Manager, Enterprise Web Solutions

Make change work for youIBM Insight Forum 09®

Agenda

What is UCD

Why User Centered Design?

Certus Approach iNTERACTCertus Approach - iNTERACT

The iNTERACT ActivitiesDry Stuff

UCD relevance to a Portal Solution

ExamplesExamples

Eye Candy

Make change work for youIBM Insight Forum 09®

Some Definitions to begin…

User Centred Design (UCD)UCD is a design methodology that aims to improve the userUCD is a design methodology that aims to improve the user experience offered.

UsabilityUsability is the measure of “ease of use” of a solution. Usability is an outcome of UCD practicesoutcome of UCD practices

User Experience (UX)p ( )User experience is a cumulative entity which is composed of the overall experience the user takes away from your system. Usability is one component of this overall experienceone component of this overall experience.

Make change work for youIBM Insight Forum 09®

Business Unit Designation or other information

The iNTERACT Methodology The UX Iceberg gy

Make change work for youIBM Insight Forum 09®

Why is User Centered Design y gimportant?

You are not your user…• If you are only thinking about a problem from your own pointIf you are only thinking about a problem from your own point

of view, you are only, at best going to be half right.

• By understanding your user, you can create a more relevantBy understanding your user, you can create a more relevant and valuable product

• Allows understanding of the true nature of the problem beforeAllows understanding of the true nature of the problem before devising the solution

• Reduces chances of failure and positively affects user Reduces chances of failure and positively affects user satisfaction

Make change work for youIBM Insight Forum 09®

Business case for usabilityBusiness case for usability• Reduced development costsReduced development costs

Most development and maintenance costs are associated with “unmet or unforeseen” user requirements and other

bilit bl hi h i t h l t i tusability problems which are expensive to change late into development

C• Improved Conversion ratesA usable system improves the rate of purchases against traffictraffic

• Enhances brand positioning and brand credibilityBad usability causes a bad user experience influencing theBad usability causes a bad user experience, influencing the experience of the brand.

Make change work for youIBM Insight Forum 09®

Business case for usabilityBusiness case for usability• Improved user adoption and customer loyaltyImproved user adoption and customer loyalty

Good usability leads to satisfied, purchasing and returning customers. Bad usability leads to angry customers and

t ti l lpotential losses.

• Improved productivityff fIt is more productive and efficient if a system is designed to

support how users prefer to work and is guided by usability principles for efficiency.principles for efficiency.

• Reduced costs for trainingUsable systems are easier more intuitive and require lessUsable systems are easier, more intuitive and require less training.

Make change work for youIBM Insight Forum 09®

What is iNTERACT?

iNTERACT Methodology is based on User Centered Design discipline and aims to provides a modularDesign discipline and aims to provides a modular approach that aims to deliver customised solutions to an organisation’s usability problems.g y p

Based on ISO 13407 (1999)( )Human centred design processes for interactive systems

“Human-centered design is an approach to interactive system development g pp y pthat focuses specifically on making systems usable. It is a multi-disciplinary activity…”

Make change work for youIBM Insight Forum 09®

The iNTERACT MethodologyThe iNTERACT Methodology Identify & Analyse • Getting to know the users and their goals

• Understanding Business objectivesUnderstanding Business objectives• Analyzing user tasks and goals• Assessing existing system and assets• Establishing Usability requirements

Conceive and Design • Design Personas and scenarios• Participatory Design techniques

Redesign Information architecture (if required)• Redesign Information architecture (if required)• Prototyping design ideas• Produce Visual Design

Evaluate and Iterate • User testing• Cognitive Walkthroughs

Strategize and Implement

• Standards compliant design production• Best practise strategy for implementation• Production of style guides and usability guidelines

Make change work for youIBM Insight Forum 09®

The iNTERACT UCD ActivitiesThe iNTERACT UCD Activities

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesCard SortingCard Sorting

A simple technique to learn about how l i t tpeople perceive content groups

Content items are written on index cards

People group the cards in ways that p g p ymake sense to them

Results are used as an input into aResults are used as an input into a new IA

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesOnline Card Sorting

Online Card Sorting

Content Groupings

Content T iTopics

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesCard Sorting - Analysis

Make change work for youIBM Insight Forum 09®

Card Sorting AnalysisMy Account

Resources

Tools & Calculators

Training

Investing

Ri k M t

Borrowing

Risk Management

Advisory Services

Cluster Analysis – DendrogramCustomer Website

14

Customer Website

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activities

Personas and Scenarios

A Persona is a fictitious character that is created to represent the a type of user that might use a system.

A scenario is a user-centered interpretation of a use case which represents a typical manner in which a goal will accomplished by a user through the systemy

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesPersonas & Scenarios - Creating a PersonaPersonas & Scenarios Creating a PersonaCollect and analyze data about your user group: •Personal information, such as age, gender and location., g , g•Technical information like what kind of computer and browser they use, how and why they use the Web, and how often.•Their relationship is to your company client or organization•Their relationship is to your company, client or organization.•How they view your site, or potential site, as well as those of your competitors.•What they like in a Web site and what they don’t.

Where does persona data come from?• web traffic dataweb traffic data• the results of user tests• observation of users in their own work environment

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesPersonas and Scenarios - BenefitsPersonas and Scenarios - Benefits• Personas represent a larger group of users within a construct framework

and provide a realistic point of reference.

• Personas help provide a strong user focus to the development process and helps aligning the product with the user’s mental model.

The idea isn’t to build something that only one single person will love. Rather, th id i t b ild thi ith i l i i d Ifthe idea is to build something with one single person in mind. If you use personas as a tool to focus on very specific goals, you’ll focus on a whole class of people–who all share those goals.” –Nielsen Norman Group, Adlin & PruittAdlin & Pruitt

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesHeuristic EvaluationHeuristic Evaluation

• Heuristic evaluation is done as an inspection of a user interface design for usability by one or more evaluators to identify usabilitydesign for usability by one or more evaluators to identify usability problems (and prioritize them based on criticality) in the design so that they can be addressed in the iterative design process.

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activities

Heuristic Evaluation – Quantitative Evaluation metricsHeuristic Evaluation – Quantitative Evaluation metrics

• Visibility of system status• Match between system and the real world

• User control and freedom

• Consistency and standards

• Error prevention

Recognition rather than recall• Recognition rather than recall

• Flexibility and efficiency of use

• Aesthetic and minimalist design• Aesthetic and minimalist design

• Help users recognize, diagnose, and recover from errors

• Help and documentationHelp and documentation

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesHeuristic Evaluation – The Evaluation Process

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesHeuristic Evaluation – The Result

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesUsability TestingUsability Testing

What is it?U bili i i l i i f k f lUsability testing involves setting a series of tasks for people to

complete and noting any problems they encounter

What do we test with?• Low fidelity Wireframesy• Interactive HTML prototypes• High Fidelity Visual Design concepts• Existing SystemExisting System• or even Competitor sites

Make change work for youIBM Insight Forum 09®

The iNTERACT activitiesThe iNTERACT activitiesUsability Testing – Performance MetricsUsability Testing Performance Metrics

What to test for ?

• Completion Rates – Are users able to complete the task?• Time on Task – How long does it take users to complete?• Page Views – How many pages does it take to complete?

Errors The number and severity of errors per task?• Errors – The number and severity of errors per task?• Satisfaction – How does the user rate the system?

Make change work for youIBM Insight Forum 09®

How is UCD relevant to Portal?

Make change work for youIBM Insight Forum 09®

What is a Portal?Perceptions and expectations• For IT Team• For IT Team

A technology platform, lowers integration costs and complexitycomplexity

• For BusinessA business channel to connect with audiences and partners

• For UsersAggregate content and functionality in one place, customizable, personable. Provides interaction among ario s b siness processesvarious business processes

Make change work for youIBM Insight Forum 09®

How does UCD fit within your yPortal Strategy?

BusinessBusiness

UX/IA

UserContext/

Make change work for youIBM Insight Forum 09®

A User Centered Portal SolutionA User Centered Portal Solution

Make change work for youIBM Insight Forum 09®

Portal StrategyPortal StrategyA Key objective from your portal strategy…A Key objective from your portal strategy…

• Satisfy the needs of diverse portal users and• Satisfy the needs of diverse portal users and the ever-expanding variety of activities, work practices interactions and decisions that theypractices, interactions, and decisions that they expect the portal to support

Make change work for youIBM Insight Forum 09®

UCD in your Portal StrategyUCD in your Portal StrategyUser Interface Design

Navigation Design

Information Design

User Centered Your Techniques Portal Strategy

Task Analysis

Personalization

Best Practise

Make change work for youIBM Insight Forum 09®

ExamplesExamples

Make change work for youIBM Insight Forum 09®

Honda Extranet PortalHonda Extranet Portal

Solution Corporate Extranet

Pain Points • Outdated content

• Poor navigation structure

• Lack of user focus in functionality resulting in poor staff uptake

Technology WebSphere Portal 6 1Technology WebSphere Portal 6.1

UCD Techniques • Stakeholder Interviews

• Heuristic EvaluationHeuristic Evaluation

• Site Maps

• Low fidelity Wireframes

• Visual Design support

Make change work for youIBM Insight Forum 09®

Original System

ScreenshotsScreenshots

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Post-Redesign

ScreenshotsScreenshots

Make change work for youIBM Insight Forum 09®

Proposed Site Map

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

BaulderstoneBaulderstoneSolution Policies & Procedures System

Pain Points • Poor findability of documents

• Unfriendly authoring leading to outdated content and hence compliance issuesand hence compliance issues

• Poor overall experience leading to frustrated users.

Technology IBM Web Content Management

UCD Techniques • Stakeholder Workshops

• Low Fidelity Wireframes

• Prototyping

• Visual DesignVisual Design

• XHTML Production

• WCM Implementation

Make change work for youIBM Insight Forum 09®

Original System

ScreenshotsScreenshots

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Post-Redesign

ScreenshotsScreenshots

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

PMGPMG

Solution Employee Performance Management System

Pain Points • Difficulty in managing diverse and distributed work fforce

• Poor overall experience leading to frustrated users.

UCD Techniques • Stakeholder Interviews

• Low Fidelity Wireframes

Interactive Prototypes• Interactive Prototypes

• Visual Design

• XHTML Production

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Regional Council… Regional CouncilSolution Infrastructure Charges Register

Pain Points • Difficulty in using existing system

• Poor experience for users

UCD Techniques • User Interviews

• Stakeholder workshops• Stakeholder workshops

• Heuristic Evaluation

• Prototyping

• User testing

• XHTML production

• Portal implementation

Make change work for youIBM Insight Forum 09®

Original System

ScreenshotsScreenshots

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Post-Redesign

ScreenshotsScreenshots

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

RetailerC tConcepts

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Cement AustraliaS h tScreenshots

Make change work for youIBM Insight Forum 09®

HR Solutions - HR RAFT

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®Make change work for youIBM Insight Forum 09

®

HR RAFT delivers Online Forms with Workflow :HR RAFT delivers Online Forms with Workflow :

For automated transactions within the business units across HR,

P ll d K l d & C bilit f tiPayroll and Knowledge & Capability functions

Make change work for youIBM Insight Forum 09®

Credit Union Australia

Make change work for youIBM Insight Forum 09®

Who are CUA?Who are CUA?

Formerly Credit Union AustraliaFormerly Credit Union Australia

Established in 1966

Leading member owned banking alternative in AustraliaAustralia

400,000 members

800 staff

75 branches around Australia75 branches around Australia

Make change work for youIBM Insight Forum 09®

What did CUA need?

N b it t fl t b d f hNew website to reflect brand refresh

A new sales and communications channel

Easy to use Web Content Management t f k ti t ffsystem for marketing staff

Ability to ‘dynamically’ cross-promote y y y p

A platform for future digital marketing

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Make change work for youIBM Insight Forum 09®

Business BenefitsBusiness Benefits

Large increase in hitsLarge increase in hits

Doubled online enquiries and sales

Website = core part of marketing strategy

New communication channel

Easy for marketing to updateEasy for marketing to update

All promotions reference website

Make change work for youIBM Insight Forum 09®

Business BenefitsBusiness Benefits

More effective cross promotionMore effective cross promotion

More movement throughout site

Campaign landing pages

F t b (fl h/XML)Front page banner (flash/XML)

Users are happy!ppy

Staff are happy!

Make change work for youIBM Insight Forum 09®

Thank oThank [email protected]@

IBM Insight Forum 09®

Make change work for you