How to use this page

The design review process is the final step before handing design over to developers. Unlike feedback, the goal is not to reiterate on feature concepts, solutions, UI or layout.

Instead, the goal of the design review is to make sure base cases are well documented and that the design adheres to standards (internal and external) as well as accessibility guidelines and spelling.

The design review process should be structured to minimise the amount of work to be redone when errors are found. E.g. the most fundamental issues should be addressed first.

If new components were created and added to our Design System during the design of a new feature. Make sure each component undergoes a design review of their own.

<aside> 💡 This page is also useful as a reference during the design process! After all, it’s the cheat sheet for what will be checked before designs are approved.

</aside>

The design review process

1. States

One could bake the following questions/checklist in their design process to make sure that it covers all aspects of the user experience:

  1. First time use: What would happen when the user lands on our product for the first time? How would the system help them get on boarded?
  2. Empty states / no data: What would happen when they have been on boarded but there isn’t any data? What should be the ideal call to action then?
  3. Feedback: How does the system provide feedback about the consequences of my actions? How will I know that an action has been successful or that a state has been saved?
  4. Error handling: What if they were taking an action and it ended up in an error? What are some of the alternate flows for them to recover from the error? Is there need for undo or redo functions? If a process can not be undone, has the user been properly warned?
  5. Loading: What would the product show when it’s trying to load some data based on a user action? Animation if it’s a quick turn around time? Or, blank templates where data would show up (lazy loading)? Or, something else altogether?
  6. Lots of data: How would you like to show lot of data? Does it make sense for an infinite scroll? Or, shall we paginate the records?
  7. Navigation / dead ends: How will the user get out of the current view or flow? How are pointers or other component states used communicate intent and the results of a users action ahead of time?

<aside> <img src="https://asset.brandfetch.io/idZHcZ_i7F/idcJ00e7RI.svg" alt="https://asset.brandfetch.io/idZHcZ_i7F/idcJ00e7RI.svg" width="40px" /> Use Figma plugins like **Content Reel** to fill in test data for various fields.

Also consider Google Sheets Sync plugin for data consistency, especially for testing and marketing purposes.

</aside>