Last Update: Jan 17, 2023
Platform: Mobile
Designer: Joyce Lian
Fail to load picture 1
Intro
The or is a common action and widely used to refresh a mobile app to fetch for new changes done in the content of the app.
The content can also be updated by automatic processes, but this depends on the implementation and the interfaces of the mobile platform.
Usage
To manually refresh the app, the user can tap anywhere on the bottom half of the screen and drag downward.
In the process of refreshing a small refresh icon will appear as a loading indicator and will spin while the client fetches the changes.
The loading indicator gives the user feedback on how long the status of the update process lasts.
Types
Depending on the mobile platform there are different types of loading behaviors and icons.
Structure & Components
Behavior & Interaction
- The loading indicator should appear as close to the content that is being loaded.
- If the content is initially pulled down, for example a list, the loading icon appears in the free area.
- The icon disappears and the gap closes when the loading process is completed.
- If the content is first dragged down, for example a list, the gap is closed again and the loading icon appears floating on the UI.
- The icon will disappear when loading is complete.
Responsiveness & Adaptiveness
The loading mechanism builds on the existing UIs and behaves according responsive.
Application-specific examples
Mentoring mobile 2305, iOS:
Mentoring mobile 2305, Android: