Process

The Problem

Focus on the problem, not the solution. Dig to the bottom of what is happening to the user. Why is it a problem? Understand your user.

  • Work with Product Management to learn what problem is.
  • Review user emails, ideas, complaints relating to the concept.
  • Who does it affect? What does it do? When is a problem? Where is it in the product? Why is it a problem?

Design Tools: Personas

Other Tools: Pen and Paper, Microsoft Word, Adobe Powerpoint, OneNote, Workflowy

 

Sketches and Notes

Intended to gather the thoughts relevant to this process. Can quickly capture the important information.

  • What do users want versus what do they need? Do both align?
  • What do users expect?
  • How have others solved this problem?
  • How and where will this fit into the larger workflow?
  • Does this require UI changes? New tab, window?
  • Does more information need to be displayed?

Design tools: Mental Models, Personas, Scenarios, Paradigms, Use Cases

Other Tools: Pen and Paper, Microsoft Word, Adobe Powerpoint

 

Wireframes

Quicker than prototypes but can include a high level of detail. Wireframes are useful for creating storyboards to display workflows and use cases.

  • Design the ideal solution for the user’s needs
  • Recognize possible resource or time limitations
  • Prepare design iterations of different levels of development efforts ranging from the ideal for the user to satisfying the basic need
  • Map out workflows and use cases

Design tools: Storyboards, Wireframes, User cases, Design Requirements

Other Tools: Paper Prototype, Microsoft Word, Pen and Paper, Balsamiq

 

User research

User research occurs at all phases of design; from the first reporting of a problem or enhancement to the completed code. User experience designers are concerned with the user first but must recognize other variables such as development costs and business decisions must be addressed. Iterative designs are the reflection of gathering many opinions and creating the ideal design.

Questions:

  • Does this solve the problem?
  • Does this solution create new problems?
  • Is the solution intuitive?
  • Would they use it? Will they continue to use work-arounds? Why?

Discuss design with user experience team*, user focus groups,* customer that reported the problem* and give a high level overview of the design to development to ward off any major technical issues*.

*and then adjust design if needed

Design Tools: Focus Groups, Interviews, Use Cases, Wireframes, Qualitative and Quantitative Methodologies

Other Tools: Powerpoint, Balsamiq

 

Mockup and Prototypes

Mockups and Prototypes show a visual representation of the code changes. Detail the design document in the order of the user’s usual workflow in preparation for development. Describe any edgecase scenarios and how the system will handle them. Present the detailed design to the users and stakeholders.

  • Detail workflow steps in design documentation
  • Describe rules and system responses

Discuss design with user experience team*, user focus groups,* customer that reported the problem* and give a high level overview of the design to development to ward off any major technical issues*.

*and then adjust design if needed
Design Tools: Scenarios, Prototypes, Mockups

Other Tools: Balsamiq, Adobe Photoshop, Morae

 

Usability Testing

Utilize usability testing for in-depth feedback. Different projects at different times require different user testing techniques. Interviews will give very detailed information but are costly in time. Focus groups are faster in time but quieter individuals can be drowned out. Detailed usability tests with tasks for the user gather detailed information about what you ask about but don’t leave very much room for user’s thoughts outside of what is specifically asked.

  • Create test scripts
  • Show the users workflows and use cases
  • Moderate usability tests
  • Utilize Focus groups and interview to get focused feedback.

Design Tools: Usability testing, Focus groups, Interviews, Qualitative and Quantitative Methodologies

Other Tools: Balsamiq, Adobe Photoshop, Morae