raphaelfleckenstein.com

The UX Design Checklist

UX Design

• I am proud of the design

  ×

  How to do this task:

  Subtasks:

• Did you run to your colleagues and say "Look at this awesome shit? If yes, move on. Are the most important elements on top of the page? Does every element on the screen deliver value? Will the user achieve his goal with it? Is it persona-checked? What could make the design fail?

  ×

  How to do this task:

  Subtasks:

• Error states provided

  ×

  How to do this task:

  Subtasks:

• Bad error handling paired with useless error messages will make your visitors leave. Are all forms and input fields error handled? What does the error page look like? Don't blame users and say they did something wrong. Help them do it right.

  ×

  How to do this task:

  Subtasks:

• Blank states provided

  ×

  How to do this task:

  Subtasks:

• The first impression is the most important one. It sets expectations and the initial experience of your product. What does the screen look like when the user opens it for the first time? What if there is no result for a search.

  ×

  How to do this task:

  Subtasks:

• Loading animations

  ×

  How to do this task:

  Subtasks:

• When users click and nothing happens they will likely leave. Make sure you always show your users when new content is loading. If it takes a while, use a progress bar Did you provide the initial loading state of the screen you designed?

  ×

  How to do this task:

  Subtasks:

• Design system checked

  ×

  How to do this task:

  Subtasks:

• Consistency is key. Did you check it you reinvented elements that already exist in the design system? Did you only use fonts from your defined text styles? Did you introduce new colors or shades of colors. Always make sure the symbols page of your Sketch File is empty and everything is in your library.

  ×

  How to do this task:

  Subtasks:

• Wording is awesome

  ×

  How to do this task:

  Subtasks:

• Copywriting is interface design. Do you speak the same language as your audience? What do your users need to know on this screen? Don't use industry jargon and keep it short and sweet. Always try to word things so your mom could understand it.

  ×

  How to do this task:

  Subtasks:

• Tested on 5 users

  ×

  How to do this task:

  Subtasks:

• After the screens have been developed, design changes take longer. A lot longer. Did you prepare a click dummy to test the design properly beforehand? Did you test it on 5 users? Always try to use real data in your designs, it will increase the quality of the user tests.

  ×

  How to do this task:

  Subtasks:

• Developer handover prepared

  ×

  How to do this task:

  Subtasks:

• Make sure your developers have an effortless experience. Are all Icons exportable? Are they compressed and displayed correctly in the browser? Can they access it via design collaboration tools like Zeplin? Make sure to write down every error state, blank state or animation placement placement.

  ×

  How to do this task:

  Subtasks: