Chapter 17. Showing Progress

This chapter is all about communicating progress to the user. React Native has different components to handle the different types of progress that you want to communicate. We'll start with a short discussion on why we need to communicate progress like this in the first place. Then, we'll jump into implementing progress indicators and progress bars. After that, you'll see specific examples that show you how to use progress indicators with navigation while data loads, and using progress bars to communicate the current position in a series of steps.

Progress and usability

Imagine that you have a microwave oven that has no window and makes no sound. The only way to interact with it, is a by pressing a button labeled cook. As absurd as this device sounds, it's what many software users are faced with—there's no indication of progress. Is the microwave cooking anything? If so, how do we know when it will be done?

Well, one way to improve the microwave situation is to add sound. This way, the user gets feedback after pressing the cook button. So, we've overcome one hurdle, but the user is still left guessing—where's my food? Before we go out of business, we had better add some sort of progress measurement display. A timer! Brilliant!

In all seriousness, it's not that UI programmers don't understand the basic principles of this usability concern; it's just that we have a stuff to get done and this sort of thing simply slips through the cracks in terms of priority. In React Native, there are components for giving the user indeterminate progress feedback, and for given precise progress measurements. It's always a good idea to make these things a top priority if you want a good user experience.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
13.59.122.162