请前往电脑端查看
Please go to PC to view
Home
About Me

Meshhub app

上线项目
在项目中的角色
UI/UX设计师
创作
2022
标签
APP
关于MeshHub APP
由于业务线的扩张，且Adaprox app不具备中立性，需要建立中立的第三方应用，以吸纳更多的To B客户融入生态。
Due to the expansion of business lines and the lack of neutrality of the Adaprox app, it is necessary to establish a neutral third-party application to attract more To B customers into the ecosystem.
业务诉求
在过去的十几年中，物联网发展迅速。其中催生了一大批品牌、OEM 厂商、开发者、零售商，同时也培养了意蕴热爱智能家居的用户。但是厂商和用户之间存在很大的壁垒。MeshHub的出现旨在连接上下游。使品牌方的产品能快速的到消费者手里。同时消费者也可以获得更好的体验。
In the past ten years, the Internet of Things has developed rapidly. Among them, a large number of brands, OEM manufacturers, developers, and retailers have been born, and at the same time, it has also cultivated users who have a passion for smart homes. But there are big barriers between manufacturers and users.
The emergence of MeshHub aims to connect upstream and downstream. So that the brand's products can quickly reach consumers. At the same time, consumers can also get a better experience.
用户访谈
在项目立项后，进行了深入访谈和调查，以了解用户的痛点。
Due to the expansion of business lines and the lack of neutrality of the Adaprox app, it is necessary to establish a neutral third-party application to attract more To B customers into the ecosystem.
上游工厂CEO
贾旻
我们有强大的硬件制造和创新能力，但是接入智能家居技术门槛高、品牌化能力差、推广能力差，导致最终销售利润被瓜分了很多。
We have strong hardware manufacturing and innovation capabilities, but the high threshold for access to smart home technology, poor branding capabilities, and poor promotion capabilities have resulted in a lot of final sales profits being divided up.
硬件制造能力强，
智能化和营销能力差
中游经销商
班婉君
我们是中小型品牌经销商，手里有大量的包括adaprox的OEM产品。但是在选择软件平台时，不是一些粗制滥造的小平台，就是一些接入门槛高的平台，想要自己开发app，无奈成本太高。
We have strong hardware manufacturing and innovation capabilities, but the high threshold for access to smart home technology, poor branding capabilities, and poor promotion capabilities have resulted in a lot of final sales profits being divided up.
硬件产品量大，
缺少能快速接入的中立平台
下游智能家居爱好者
Kevin
探索一些最新的的智能家居是我的爱好。但是这导致我的智能家居应用过多，且操作风格不统一，学习使用成本高。
Exploring some of the latest smart home is my hobby. However, this leads to too many smart home applications, and the operation style is not uniform, and the cost of learning and use is high.
喜欢探索各种新鲜的智能家居，
需要有统一操作风格的应用
产品的问题和解决方案
产品问题
1
每个产品面板操作体验不统一，导致开发成本高、用户体验差。
The operating experience of each product panel is not uniform, resulting in high development costs and poor user experience.
2
中小商家品牌多、产品杂。且不想在操作应用时看到其他品牌信息。
Small and medium-sized businesses have many brands and miscellaneous products. And don't want to see additional branding while operating the app.
3
同一品类产品外观差距大，拟物化的产品icon容易误导消费者。
There is a big difference in the appearance of products of the same category, and quasi-materialized product icons are easy to mislead consumers.
4
App简单粗暴，导致软件端对用户吸引力低，存留率低。商家也很容易换到其他平台。
The app is simple and rude, resulting in low user attraction and low retention rate on the software side. Merchants can easily switch to other platforms as well.
1
剖析主流产品硬件产品，提取交互共通点。将操作面板组件化。
Analyze mainstream hardware products and extract common points of interaction. Componentized the operation panel.
2
简化产品配网交互流程，通过连接协议进行分类。缓解用户连接时的焦虑情绪。
Simplify the interaction process of product distribution network and classify by connection protocol. Alleviate user anxiety when connecting.
3
采用扁平风格icon，弱化对产品外观细节的刻画的同时保持产品品类的辨识度。
The flat style icon is adopted to weaken the depiction of the details of the product appearance while maintaining the recognition of the product category.
4
强化APP视觉风格，统一整体操作体验，提升APP的用户价值，形成厂家 - 平台 - 用户的良性循环。
Strengthen the visual style of the APP, unify the overall operating experience, enhance the user value of the APP, and form a virtuous circle of manufacturers - platforms - users.
解决方案
项目目标
在项目立项后，进行了深入访谈和调查，以了解用户的痛点。
Due to the expansion of business lines and the lack of neutrality of the Adaprox app, it is necessary to establish a neutral third-party application to attract more To B customers into the ecosystem.
01
品牌价值
Brand Value
02
直观简约
Intuitive and simple
03
风格新颖
novel style
04
体验顺畅
Smooth experience
设计流程
调研

业务诉求
Business requirements
用户访谈
User Interview
原型

用户流程图
User Flowchart
交互线框图
Wireframew
规划

产品的问题和解决方案
‍Product problems and solutions
项目目标
Project Objectives
输出

视觉规范
‍Visual specification
设计组件
Component design
界面展示
Interface display
产品的问题和解决方案
交互线框图
视觉规范
设计组件
界面展示
登陆
由于智能家居的产品属性，用户需登陆后才能进入APP。新用户注册成功后，自动创建家庭和满足大部分用户的房间，降低用户学习成本。
Due to the product attributes of smart homes, users need to log in to enter the APP. After successful registration of new users, families and rooms that satisfy most users are automatically created, reducing user learning costs.
主页
通过用户访谈，发现MesHub的经销商售卖的产品大多价位区间不高，但是用户的客单量较高。所以将产品卡片设计为较为密集的布局，单屏能显示更多设备，且传感器类产品所占比重较高，所以在主页加入天气、气温、湿度灯数据。
个性化的主页加入了可设置的常用场景和彩色背景，大面积使用毛玻璃元素能减少彩色背景的割裂感。
Through user interviews, it is found that most of the products sold by MesHub's distributors are not in a high price range, but the number of customer orders from users is relatively high. Therefore, the product cards are designed in a denser layout, more devices can be displayed on a single screen, and sensor products account for a high proportion, so the data of weather, temperature, and humidity lights are added to the homepage. The personalized homepage adds common scenes and color backgrounds that can be set, and the use of frosted glass elements in a large area can reduce the sense of fragmentation of the color background.
配网流程
通过选择连接协议的方式配网。大大缩短了多品牌，多产品情况下用户配对设备查询时间。
Configure the network by selecting the connection protocol. It greatly shortens the query time of users paired devices in the case of multiple brands and multiple products.
设备面板
设备面板是用户设置智能家居的重要页面，应该具备简单，统一，个性化的需求。我们通过直观的界面和统一的操作逻辑，减少用户学习成本。根据产品特性，用不同的渐变色区分产品。加深用户对于不同产品的印象。
The device panel is an important page for users to set up smart homes, and should have simple, unified and personalized needs. We reduce user learning costs through an intuitive interface and unified operation logic. Different gradient colors are used to differentiate products according to product characteristics. Deepen the user's impression of different products.
IR remote学习模式、定时设置、场景启动动画展示
在产品面板内，用户可通过开关、模式、设置日程、场景/自动化控制设备。通过日志查看设备历史信息。在设置页面内，加入品牌和商城入口，形成复购。
Within the product panel, the user can control the device with switches, modes, set schedules, scenes/automations. View device history information through logs. In the settings page, add the brand and mall entrance to form a repurchase.
场景/自动化
场景可让您根据自己的心情创建个性化环境，可以通过触摸激活按钮来触发场景。
自动化可设置触发条件，不需要主动发送指令即可完成设备流程运行。
Meshhub在Adaprox流程的基础上、加入推荐场景/自动化模块，亦可引导用户进入商城。
Scenes allow you to create a personalized environment based on your mood, which can be triggered by touching an activation button.
Automation can set trigger conditions, and the equipment process operation can be completed without actively sending instructions.
Based on the Adaprox process, Meshhub adds recommended scenarios/automation modules, and can also guide users to enter the mall.
MeshHub官网设计
全部页面
Adaprox Shopping website