Context for the Project

• During a critical mission, the field teams using external devices need to connect to the main app for different types of requests, such as checking the proper functionality of the external devices.

• This project involves a critical communication app in the telecommunications industry. 

• The app includes an interface dedicated to checking the functionality of hardware devices to ensure they are operational for future critical missions.

• The goal of this project was to create a user-friendly interface for both automatic and manual connection to check the external devices used by the team.

• Clicking ↓ on these hardware buttons from external devices to check their proper functionality in the critical communication app.

The whole flow ↓

Settings page -> Loading bar (with skeleton) -> Device found -> Hardware buttons testing -> Confirmation if it works or not.

Prototyping ↓

Skeleton for loading ↓

During the connection to the external devices, because it can sometimes take more time, there is a user-friendly loading skeleton and circular progress indicator.

Micro-Interaction ↓

to open a hardware buttons testing page with click feedback, smooth transitions, and loading indicators to enhance user experience.

Thanks for watching!