智能能温湿度计小程序开发方案

智能能温湿度计小程序开发方案

智能温湿度计是一款厂家生产的室内温湿度环境监测的智能家居产品。

智能能温湿度计其具有支持NB-loT网络的技术功能，并同时提供Web端与微信小程序两种设备管理接口，以此方便用户配置设备参数及监测设备数据(同步间隔、告警门限、预报城市、历史数据记录等)。

警报：

警报列表展示产生警报的数据记录，可查看警报详情

设备：

设备设置、对设备进行具体设置，包括重命名、设备开放及设备定位等

警报规则、提供设备警告规则设置入口，可对警告规则进行具体设置

设备信息、提供查看设备详细信息入口，包括硬件与模组版本、信号质量等信息

成员：

成员列表、对设备成员进行管理、通讯录管理

数据曲线：

历史记录、查看设备温湿度数据的变化的历史记录

设置

一、串码/扫码登录添加设备

用户需通过关联具体设备方可进入小程序查看设备详情，因此登录页采用简约的封面设计，仅此在加深品牌印象的同时，亦达到降低用户繁琐感的效果。

通过卡片式的展示，配以易于辨识的ICON来增强用户添加设备时的确定感与拥有感。

二、我设备页

设备页的天气信息模块采用了轻量简约的图形插画来表现实时天气状况，增加趣味性的同时亦避免分散用户过多的注意力。

各设备使用轻投影卡片展示，在页面中营造的空间实感突出了其层级上的优先，便于用户迅速、直观地了解各设备的温湿度状况。

三、设备详情页

瓷片区域

瓷片区的ICON采用了低透明度叠色的风格，圆润的图形设计在增添趣味性的同时，亦营造活力健康的观感。统一蓝色渐变的配色使视觉更趋统一

实时数据

实时数据使用清晰的模块将温度]湿度]解读提示]进行分区展示，增强了信息的易读性。

四、历史记录页

历史记录页数据展示使用了大留白风格，降低无关信息的干扰。

温度与湿度数据作为信息重点采用了双色展示，为用户快速获知关键信息提供视觉基础。

五、警报列表页

警告列表的展示采用卡片式分割布局，在视觉上更容易聚焦，突出信息层级。

列表内容利用简介的图标来对内容类别进行区分，并通过合理运用颜色及字号大小等反差来处理内容的信噪比，关系，强化关键信息，弱化次要信息。

六、警报详情页

警告提示

利用恰当的辅助色引起用户注意提供解决状况的建议，快捷引导用户解决安全隐患

可视化

警报详情页利用图形来量化实际数据，实现数据可视化，提高用户对设备所在环境状况的掌控效率。

警报信息

清晰划分信息层级，使用灰色区域处理[警报ID]警报时间，等次要信息，使用户更容易对[温度][湿度，等关键信息聚焦，降低用户的理解成本

七、设备设置页

设备信息

设备信息设有ICON标识，帮助用户快速辨认设备环境类别，并提供跳转[更多信息页，入口，同时用户还可即时编辑设备名称

选项开关

选项开关采用轻投影卡片式分割布局展示，双色线性ICON在提高用户进行精确操作效率的同时，亦增添了趣味性。

上报区间

上报区间模块为用户提供数个泛用的上报信息的时间段，帮助用户快速定位区间，降低用户的操作成本。

八、警告规则页

调节组件

通过直观的可视化控件来调节温度数值，降低用户学习成本，强化操作感。

规则生成

用户通过操作[高于/低于] 温/湿度值Jr温湿度开关，三项控件后，实时生成文字化警告规则。

九、成员管理

成员列表页采用卡片式布局把页面分为操作区与信息区，清晰直观的布局有助于提升用户的操作效率。操作区可直接对成员进行增加/删除的管理操作，点击删除按钮可直观地对头像操作进行删除，而增加和转让权限的操作则需通过跳转通讯列表页来完成。