Reconstruct and visualise automations
You can right-click “Open Image in New Tab” for larger images) (可以右键“新窗口打开 ”放大图片)
Project Background
The client provides agricultural solutions based on IoT devices. The main product are control boards (PCBs or SBCs) connecting to sensors and controllers, thus facilitate unmanned control. For example, in green houses, sensors of temperature, humidity, and level of light, can be linked to controllers of heating, irrigation, roller, etc. All of which works automatically based on a set of strategies and alert staff when necessary.
Tasks
My responsibility is to build a web-based user interface for this automation system, with a dashboard integrating information from hundreds of control boards.
UX Findings
- User ranging from electronic engineers to farm worker. Engineers create presets based on real-world conditions. Farm worker can pause/override the presets and manually adjust devices or parameters (heater, water jets, film roller, etc.)
- Due to the complex nature of the hardware, professional users need an advanced mode to create complicated presets; while also simple mode for average user to run simpler automation
- Batch operation is key in the workflow due to the large number of sensor and controllers
- Dashboard will be used to present information to the public, as well as regulatory bodies. Therefore it serves display and data visualisation purposes, instead of actions.
Work Flow and Wireframe
This section is not translated
Expand/Hide
- Sign up and sign in
- Device registration and management
- Program and project structure
- Automation Strategy
- Data export and backup/restore
- System info
Hi-Fi Mockups
- Dashboard with component Variants
- Dashboard in fullscreen view mode (for monitor hub)
-
Sign up with: Username and password; Mobile & SMS code; QR code
-
Variants: Sign up / Sign in / Password reset / SMS verification / Error messages
- Device registration (single device)
- Device registration (batch operations): batch naming, batch self-check, batch tagging
- Program and project tree views
- Invoke preset strategy in projects (basic and advanced)
- Create a basic strategy with pre-defined input/compare variables
- Create an advanced strategy with customised input/compare variables (more complex functions)
- Data export and backup
- System information, permission management, license update variants