user experience from a business perspective
DESCRIPTION
Presentation at CMSExpo, May 2012TRANSCRIPT
User Experience (UX) from a Business Perspective
User Experience (UX) from a Business Perspective
Daniel [email protected]
College of Computing and Digital Media
Hi !
The IssuesThe Issues
• Web CMS texts gloss over planning process for a site--and jump right into design
• But good UX is dependent on a strong user-centric planning process
• How do we do this if we are planning for a CMS solution?
A SolutionA Solution
• Apply user-centric UX planning and analysis concepts to CMS site projects.
CMS Development ProcessCMS Development Process
• Emphasis on PROBLEM SOLVING• Emphasis on CONTENT• Emphasis on USER EXPERIENCE
Steps in the UX Life Cycle
Understand the business problemUnderstand the business problem
• What is the business objective of the site.
• What is the business problem that your client is trying to solve?
–Or is it an opportunity?
1
The more specific, and complete you
are, the better.
Know your UsersKnow your Users
• Who are you designing for?
–categorize your users• Think about
–demographics (age, exp., sex, etc.)
– technographics (platforms and skills)
–psychographics (behaviors &attitudes)
• Create personas.
2
The more specific, and complete you
are, the better.
How to create a persona?How to create a persona?
1. Gather background info– demo- techno- psycho- graphics– referent site information
2. Interview your users3. Compile and organize research
to isolate key target markets4. Write fiction:
2
Create characters who summarize the research for each key target
Interview your usersInterview your users
• Or survey them (if need be)– Understand their motivations– Understand their behaviors– Understand their frustrations– Learn their "stories" from
them.– Use group techniques with
them• Focus group sessions• Mood sessions• Card sort session.
3
Name
Key Feature
Descriptive Information
Scenario
Trigger
Example PersonaExample Persona
Example PersonaExample PersonaName & Key Feature
Quote, from Research
Objectives &
Motivation
Descriptive
Information
Behaviors
Concerns
Capture your user storiesCapture your user stories
• What do your users want to do on your site?
• How will they go about doing those things
• Tell complete user stories
• Tell as many as you need to tell.
4
How to create user stories?How to create user stories?
• Group exercise: have users put stories on cards
• Make personas the voice of the story
• Be sure to include "so thats"As a <role>, I want <function>, so that <value>
• I.N.V.E.S.T Independent, Negotiable, Valuable, Estimable, Small, Testable.
4
13
How do you create User Stories?How do you create User Stories?
• Card• Conversation• Confirmation
4
14 http://www.mind-mapping.org/blog/2010/09/edistorm-for-brainstorming/ http://www.edistorm.com/
15 From http://www.agile-ux.com/2012/03/01/user-story-checklist-be-ready-be-effective/
• http://www.agile-ux.com/tag/user-stories/• How to write meaningful user stories
http://www.subcide.com/articles/how-to-write-meaningful-user-stories/Nice first introduction to user stories.
• How to Create User Storieshttp://techportal.ibuildings.com/2011/07/19/how-to-create-user-stories/Another similar introduction written more for agile coders.
• The User Experience (UX) of User Stories (part 1)http://www.andersramsay.com/2011/07/16/the-ux-of-user-stories-part-1Expands on ideas above
• User Story Examplehttp://www.allaboutagile.com/user-story-example/Capturing more info on backs of cards
• Better User Storieshttp://mindtheproduct.com/2012/02/better-user-stories-come-hell-or-high-waterfall/
This post discusses process a bit, focusing on tips and tricks for getting better results from your interviews with users.
Some User Story ResourcesSome User Story Resources
16
4
Research referent sitesResearch referent sites
• Look at referent sites• Look at competitor sites• Look at sites for ideas
– Look for best practices– Look for recurring patterns– Look to see how they addressed
similar user stories• Reverse engineer their user stories
and personas.
5
17
Research wisdomResearch wisdom
• Test the users you want, not the users you have
• Users give you conflicting feedback
• Validate the problem you are solving actually exists
• Verify your mental models
• Prototype early• Plan through version two (or three).
5
http://uxmag.com/articles/five-ux-research-pitfalls18
Develop a Content StrategyDevelop a Content Strategy
• Explore content issues early in the process.– card sorting
• Do the users want to see the information grouped by subject, process, business group, or information type?
• How similar are the needs of the different user groups?
• How different are their needs?• How many potential main categories are
there? (typically relates to navigation)• What should those groups be called?
6
Take content seriously.
Really.
19
20
Card Sorting resourcesCard Sorting resources
Some card sorting resources:
Great Primer on the details of card sortinghttp://www.usability.gov/methods/design_site/cardsort.html
This one lists several online card sorting productshttp://www.measuringux.com/CardSorting/
More resources with rich detailhttp://sixrevisions.com/usabilityaccessibility/card-sorting/
http://www.boxesandarrows.com/view/card_sorting_a_definitive_guide
6
Conduct a content audit & determine content strategyConduct a content audit & determine content strategy
• Use audit to understand content properties and relationships.
• Understand cognitive mapping of users
• Understand howcontent relates to user stories oruser communities.
7
21
How to conduct a content audit ?How to conduct a content audit ?
• If you already have a site or content:– Inventory content page
• Is all of this content still relevant? What business, customer, or employee need does it support?
• What new content must be created? What is driving those needs?
• What drove decisions about file types and/or variations in format that exist? Do these decisions still hold?
– Look at site traffic by content type/item
– Use this to provoke useful discussion with stakeholders.
7
22
Results of a good content audit ?Results of a good content audit ?
• Acute awareness of site priorities• Increased understanding of
business or operational constraints• Surfacing of a common language• A accurate sense of scale
for the project.
7
23
How to conduct a content audit ?How to conduct a content audit ?
• If your context is new:– Build process flow diagrams to ID
data and workflow of systems users• Document input and output content
– Refer to your user stories• Look at what data they need to
complete their user stories successfully
– Look at referent sites and deconstruct their content.
7
24
Create a Site MapCreate a Site Map
• Consider vertical, horizontal, or sequential layouts
• Design site map offline
8
Note we haven’t built anything yet!
25
CMS's don't generate separate pages!CMS's don't generate separate pages!
• OK, so this is a trick question• We do need to think through our
menuing scheme• We do need to logically cluster
categories/sub-categories• We do need to deal with any
"special" pages outside main content
• We do need to think through our "tag" scheme
• And we want to think through module/widget/block assignments
8
26 Nice sitemap primer: http://viget.com/inspire/ux-101-the-site-map
27
Site Map with template informationSite Map with template information
http://www.advomatic.com/blogs/julie-blitzer/why-non-profits-need-user-experience-design-ux
8
Build a Wire FrameBuild a Wire Frame
• On paper, line drawings, black and white; or try a tool like mockflow.com
• Conceptual, void of design artifacts• Note we haven’t
built anything yet!
9
28
http://speckyboy.com/2011/05/29/20-effective-examples-of-web-and-mobile-wireframe-sketches/29
How to create a Wire FrameHow to create a Wire Frame
• Use your previous research to inform this model
• Understand relative importance of information
• Group items by user story, by content type, or by relative importance
• Use accepted design patterns.
9
30
31
Heat MapHeat Map
Heat MapHeat Map
32
Research design patternsResearch design patterns
• Read best practice design patterns for site design constructs you are building
• Select, modify if necessary, and apply these patterns.– http://www.smashingmagazine.com/2009
/06/15/40-helpful-resources-on-user-interface-design-patterns/
– http://uxmovement.com/resources/4-best-design-pattern-libraries/
– http://www.briankenyon.com/content/ui-ux-design-pattern-repositories
10
33
Design Pattern BooksDesign Pattern Books
• My favorite pattern references:• Van Duyne, Landay, Hong:
The Design of Sites (on Safari)
• Schummer, Lukosch: Patterns for Computer-Mediated Interaction
• Vora: Web Application Design Patterns (on Books24x7)
11
34
Test early concepts on users Test early concepts on users
• In real world, this is key• Validate your analysis• Then validate your logical design• Test against legacy system (if
possible)• Test with real users (if possible)• Now you are ready
to start building
12
35
36
Daniel MittlemanDePaul University CDM
[email protected]: 312.362.6103Skype: dmittleman
That was fun