A mobile App for IoT weather stations
The SPOT App enables enterprise users to manage weather stations, data and other weather services provided by BloomSky.
SPOT Mobile App
Team
Working with a multi-disciplinary team, including front-end, back-end engineers, data scientists and meteorologists
Duration
5 months
Challenge
Users needed the Mobile App to setup the SPOT device. Therefore, a clear guidance was one of the biggest challenges for the App. Another challenge was figuring out how to deliver large weather data and data services.
My responsibilities
I was responsible for the UX and UI designs of the Mobile App. Starting from the research to the wireframe development and implementation, I cooperated closely with the back-end, iOS, and Android engineers.
Secondary Research
Learn from others
I researched weather and IoT related Apps to get inspiration on data display and device management. Here were some examples of my research.
Define workflows
Based on user research and discussions with our back-end engineers and marketing team, we figured out three critical features of the SPOT Mobile APP: device installation, real-time data display, and device management.
Wireframe iteration
Wireframe V1.0
Here was the first version of the wireframe I developed based on workflows. I came up with the idea of the device group where users could manage devices more flexibly by grouping devices when needed.
Wireframe V2.0
The firmware engineers suggested adding troubleshooting features where users could download data via Bluetooth, reset 4G/Wi-Fi network in case of connection failure, or replace the device if necessary. I developed the second version of the wireframe as a follow-up.
Interface Design
I initiated the interface design after we confirmed the wireframe structure. I started with the essential screens: the SPOT data page, the group list, the map view, and the device installation guide.
Interface refinement
I finished the design on the rest of the screens based on the developed visual guidance.
Dashboard and detail page update
Error tagging wireframe design
Screens
