The UI stack, as defined by Scott Hurff has 5 states:

  • Blank - No data yet, e.g. new signup to your product
  • Loading - In the middle of requesting data from APIs
  • Partial - There a small amount of data
  • Error - Something broke and you need to report it to the user
  • Ideal - Lots of data

A lot of effort goes into thinking about the ideal state, as it should, but you shouldn’t skip the others. Even if you don’t have a designer, or full designs for each state, there are questions you can always ask yourself about what you’ll need to implement them.

For the blank slate, are you going to have some sort of educational copy for the user to read? If so who’s going to write that? Will the backend code that returns the data work if there’s no records? Have you got tests for that?

For the loading state, how long is it going to take to load the data? Will a spinner that’s displayed while the request is in flight work or will it take long enough that you’ll want to report progress? If you need to report progress how will you measure it and tell the frontend?

For the partial state does your UI work properly if you don’t have a full page of data to display?

For the error state are you handling errors that come from the backend as well as errors that can happen in the frontend? Do you distinguish between errors that the user can correct and ones that are out of their control? If the error happens when they ask to save data can you recover enough so you don’t lose their data and they can try again? In my opinion getting the error state right is a big differentiator between good and great user interfaces.

This is definitely not a definitive list of questions you can ask yourself, your designer, or your product manager.

How often do you think of these states when you’re working on UI/UX?