发布时间：2022-9-4 分类： 行业资讯
空状态是必须存在于APP中的状态。适当的空状态设计可以增强用户体验并实现用户保留。鉴于空状态在异常状态下的重要性以及容易被忽视的现状，本文以实际设计要求为例，从需求到提问，然后解决问题，提出解决方案，介绍设计方案，逐一显示空状态。打开设计的正确方法。
文章大纲：
需求与提问：了解空状态设计要求，空状态是什么？旧版本的问题在哪里？您想如何以及为什么要关注用户，背后的产品目标是什么？
解决问题：空状态出现在APP初始使用，完成或清空内容，软件错误等的上下文中。旧版本的问题在于设计并不全面，与5.0品牌认知度不相符。通过护理意味着产品是情感的，而情感和人类的产品更受欢迎。该产品的目标是间接增强用户在产品中的保留，从而导致点击转换。
解决方案：如何使这个目标具体化？寻找被广泛认可和广泛使用的情感空状态设计。通过对竞争产品解决方案的分析，找到最常用的反光设计表达方式，从侧面寻找什么样的侧面反光设计深受用户喜爱并可用于信息。
设计方案：结合美来现有资源完成设计。
一，需求与提问题
US 5.0空状态的设计要求是优化US 5.0空状态的设计，这样可以减轻用户遇到空状态的挫败感并给予用户关心。
什么是空状态？旧版本的问题在哪里？您希望如何以及为什么要关注用户，背后的产品目标是什么？
2.解决问题
1.从4个方面理解空状态
△空状态4个方面
（1）定义
空状态通常是在初始使用，完成或清空内容，软件错误等的上下文中出现的页面状态。
（2）角色
空状态应该实现三个目标：教育用户，取悦用户和引导用户。每个空状态都有其实现的核心目标。
（3）场景出现
用户未执行操作，用户操作的结果或错误。
（4）常见解决方案
使用系统建议，使用操作指南，使用缓存，情感表达和提供新任务。
2.梳理旧版本的空状态设计问题
（1）设计不完整
4.0的空状态设计不够全面，并且有很多场景。需要更新空状态下的旧品牌图像，甚至一些空状态页面也没有内容。当遇到异常情况时，这将导致用户的疑虑和情绪得到有效解决。在这种空状态设计中需要解决这些问题。
（2）不同的品牌认知
美丽的5.0设计定位精致，时尚和品质。而4.0的空状态设计无法带来新的品牌意识。因此，空状态的设计对整个App的品牌统一具有重要的补充意义。
（3）空状态冗余
完成后，有必要优化新添加的页面总共20个空状态。由于存在许多空状态页面，因此具有类似提示功能的一些空状态使用一般的可视表达式。
3.情感和人性化的产品更受欢迎
传递护理是情感设计的第三层 - ——反思设计的核心。关怀意味着产品是情感的，情感和人类的产品更受欢迎。与冰线机器人手臂相比，具有拟人外观的“Ava”更受欢迎。
△冷机器人手臂VS人形“Ava”
4.产品目标
通过人性化的空状态设计来缓解用户遇到空状态的挫败感，给予用户关心。间接增强产品中用户的保留，从而导致点击转换。
△空状态设计优化目标
溶液
1.竞争产品的选择
通过对竞争产品解决方案的分析，发现最常用的反光设计表达方式，以及从侧面寻找什么样的反光设计深受用户喜爱。鉴于美丽的美丽和社区的电子商务属性，女性的时尚应用程序被选中：小红树，看，HIGO和电子商务应用程序：自由鱼，网易严格选择，淘宝。
△竞争产品选择
2.分析竞争产品的状态
（1）竞争产品状态的内容
小红树，先玉和淘宝使用品牌形象作为空态的主要形象。使用主图像的品牌形象不仅可以实现空状态功能，还可以在用户心中不断提升品牌形象。网易严格选择，HIGO和See使用文本和图形作为空状态的主要图像。
每个应用程序的空状态从不同角度反映其品牌知名度。
（2）情绪护理
小红书和自由鱼使用可爱的小红薯和自由鱼。淘宝使用小人。网易严格选择与场景相关的项目。请参阅和HIGO使用文本和图标。拟人化图像可以使产品更贴近用户。
3.结论
通过对竞争产品现状的分析，主要形象利用品牌形象给予用户最佳的情感关怀，品牌知名度也是显而易见的。
4.设计方案介绍
1.空状态主题图像
从以上分析可以看出，主要形象是利用品牌形象给予用户最佳的情感关怀，品牌知名度也是显而易见的。
美丽的5.0品牌地位采用了全新的形象：美丽的兔子— —活泼美丽的兔子和她的伴侣— —负责Box的化妆品，共同作为美国的代表和用户互动。我们希望用户在美国的经历是顺利的，但当她遇到一个空虚的状态时，会有漂亮的兔子陪伴她。
△梅拉兔和她的小朋友Boxes
2.头脑风暴关键字绘图草图
在确定了主题图像和基本结构之后，你需要在脑海中设想不同的场景，并给出美丽的兔子故事情感。用文字记录你想到的场景。例如，购物车：趁年轻人想要拿起他们的手，来填饱肚子，是时候拉草了;例如，刷新，变得美丽，就好了。将化妆品洒在盒子里，你的包裹盒就在这里。当在一定程度上发散时，可以执行会聚，并且一些相对确定的场景由草图表示。
草图允许您更早地查看结果并更快地进行设计调整。例如，404，在星空中迷失，在山谷中寻找信号，可以表现出信号丢失的感觉，但这样的场景远非美丽的美女和社区品牌。因此，考虑用户更熟悉的城市场景，同时用化妆品取代城市建筑。美丽的兔子在化妆品城找不到回家的路。
3.统一颜色规范
美璐5.0的品牌色彩依然是美丽的粉红色，适用于主要形象，并贯穿整个空旷的状态;辅助颜色黄色，应用于辅助图像;辅助颜色绿色，蓝色作为场景元素。
4.统一设计元素
右侧的光主要是前视图。
图像被最新的Meila兔子取代，这只兔子是以美丽的兔子为基础的。
微纹理，浅投影。主要元素有一个阴影，使其更丰富。部分笔划塑造了结构。
收敛的几个场景很容易与用户产生共鸣，用详细的复制故事来描述，同时发布完成的地图和场景故事，404页面，通用空，购物车是空的，刷新。
5.场景显示
场景一
在一般的“网络异常”场景中，美丽的兔子在化妆品城找不到回家的路。化妆品之城呼应了美璐的品牌特征，最具代表性的唇膏以表现形式选择。美丽的兔子拿着一个信号接收器，找到唇膏高度的方向。
场景2
像所有小仙女一样，美丽的兔子总是希望变得美丽。但有时美女需要等待，就像清爽一样。当网络不是那么好的时候，你需要一个小仙女再等一会儿。
更多场景（部分）
6.清空状态界面
空状态占帐户的两个区域：
第一个全屏状态：导航+空白内容显示区域。
第二个非全屏状态：导航+部分内容+空白内容显示区域。
全屏状态的空白区域很大，空状态的视觉性能属于主要内容并且可以突出显示。
非全屏状态具有一些正常内容显示，空白区域较小，空状态的视觉性能属于二级显示内容，视觉性能需要服从主要内容。
7.总结和反思
空状态的设计已经结束，但是美容应用程序中的情绪操作还没有结束，并且启动画面，操作活动，主题帖子，弹出窗口等的设计仍在继续。全面，持续的情感设计就像一股温暖的潮流，给予用户持续的关怀。
作者：Jenny Huang Jingwen（微信公众号：“Jenny Huang Jingwen”），平安银行愿景&插画。微博设计美学博主，花瓣认证设计师，优优网，设计指导员，深圳插画家协会专业会员，视觉中国合约设计师。
本文最初由@Jenny Huang Jingwen发表。未经许可，禁止复制。
该地图来自Unsplash，基于CC0协议
