发布时间：2020-8-11 分类： 电商动态
如何更精致地打磨产品是每个UI设计师的目标，但作为设计师，如何系统地优化APP并使产品更有趣，我们可以一起讨论。
为什么要视觉优化?
大多数人似乎从视觉层面来说是微不足道的，因为它不会给产品带来实际好处。但作为产品的性能层，视觉语言可以为用户传达不同的心理感受。
战略层面：通过视觉手段进行品牌升级，使产品更符合品牌定位，营造用户信赖的品牌。
产品等级：目前市场上产品的同质化严重，有必要根据产品的特点设计不同的产品，以提高产品的友好性。
个人层面：设计一个好的产品也是设计师自身价值的体现，给设计师一种成就感。
如何优化？
一. 寻找切入点
要从视觉级别优化应用程序，我们可以从许多方面入手。如何找到合理的优化切入点也非常重要。产品版本迭代通常不能提供足够的开发资源，因为它们只能优化视觉。因此，视觉设计师合理地提出视觉要求并实施着陆更为重要。这允许视觉设计师通过子模块进行优化并批量迭代，这为用户提供了每个版本的一些视觉惊喜。
二. 分模块化优化
从视觉角度来看，我们可以总结出多个模块。由于空间限制，我们将使用产品的四个模块作为设计分析的示例。
1. 加载模块
通过用户加载整个行为路径，合理的加载方法将极大地增强用户体验。装载设计对产品的影响可分为三个层次：
为用户提供及时有效的反馈。
消除用户等待的焦虑，使装载有趣的事情，忘记时间的概念。
通过加载进行品牌传播，加深用户眼中品牌的印象。
从使用场景中，可以分别针对下拉负载，全局负载和滑动负载负载优化视觉。我们可以通过分析市场上的装载方法来分析和总结相对优秀的产品。下图为百度外卖，途牛旅游和熊猫阅读的装载设计：
下拉式装载：下拉式装载是一个重要的设计点。优秀形式的使用可以有效地增加品牌曝光度并增加产品友好性。
百度外卖采用吉祥物，头盔，电动车，房屋等设计元素为外卖兄弟制作送出场景，并立即将用户带入外卖场景。风格可爱有趣，加上循环效果。下拉装载增加了用户的及时兴趣，同时增加了品牌的兴趣并通过使用吉祥物增加了品牌曝光的机会。
通过牛徽标延伸的吉祥物，图牛旅游以旅游建筑景观为背景，给用户一个旅程场景，正确展示产品口号，品牌传播高度。
熊猫阅读通过可爱的熊猫插图和书籍的可爱效果让阅读变得有趣。
全局加载：全局加载使用场景相对较宽。当网络不好时，如何消除用户等待加载的焦虑是非常重要的。
百度外卖采用拉下来加载统一的设计元素，整体风格一致，及时反馈，趣味，品牌传播并存。 Tuniu Tourism使用文案和吉祥物的线性轮廓作为加载方法，加载动态效果时显示品牌颜色。整体比较直观而简洁。熊猫通过书中的元素和吉祥物的轮廓进行阅读，以实现装载过程。
向上滑动载荷：向上滑动载荷是相对频繁的用户行为，并且所有三种产品都削弱了载荷效应。
百度外卖采用品牌彩色简易装环和装版文字显示; Tuniu旅游由吉祥物的轮廓和品牌颜色呈现;熊猫阅读直接以副本的风格显示。
小结
设计出色的加载方法，同时满足及时的反馈，趣味，品牌传播功能，设计师可以通过以下几点进行优化：
场景设计：通过场景设计，用户可以即时沉浸在产品中，加深用户对产品的印象。
吉祥物的使用：这种元素的使用主要使产品更贴近用户，并能充分展示产品的特性和乐趣。
动态效果的运用：巧妙的动感设计将让人眼前一亮，操作过程更加顺畅。
外围元素的使用：外围元素是指产品属性。例如，如果它是一个阅读产品，我们可以在设计中找到一些相关元素，如书籍，文本，论文，钢笔等，以便进行改进并应用于设计。
文案的使用：文案是最直接的呈现方式，通过口号的呈现可以更直观地传达品牌理念。
品牌颜色：用户对颜色的记忆清晰，品牌颜色用于加深用户对产品的印象。
2. 缺省模块
目前，市场上很多产品都有特殊设计的默认模块。即使没有搜索结果或网络有问题，用户也不会感到不舒服。有趣的默认状态会给用户带来一点安慰。下图显示了淘宝和百度外卖的默认状态：
事实上，良好的默认状态是它拥有自己独特的设计系统，而不是设计师可以轻松绘制插图。上图是淘宝和百度外卖的默认状态。
淘宝的默认状态是以主题方式呈现，相关的外围元素根据不同的默认状态，如使用空的购物车来表示购物车是空的，网络无法通过行星和Wi连接 - Fi元素表达与品牌颜色的使用相结合，为用户传达最准确的主题信息。
百度外卖默认状态以场景方式呈现。通过设计产品吉祥物和相关的状态元素，每个默认状态都有一个场景，这是一个故事，使默认状态更加生动和具体。并拥有自己品牌的独特风格。
小结
场景化和设计默认状态的方式可以使页面更有趣，但每个都有自己的优点和缺点。主题设计风格更加通用，页面风格更弱。场景设计风格更有趣，但可扩展性较弱。每个默认状态都有自己的状态，这使设计人员的设计成本更高。
3. 默认图模块
在产品设计中，默认地图非常常见，例如，未加载屏幕时的默认地图，没有登录的默认地图或没有替换头像的第一次登录。默认地图似乎很简单，如何设计与产品匹配的地图也需要设计师仔细审查。
默认加载映射：下图显示了加载默认映射的三种方案：A方案是纯灰色默认映射，B方案是带有图片图标的默认映射，C方案是带有产品的默认映射商标。事实上，我们经常可以在市场上看到三种解决方案。从视觉方面来看，C方案更好。它不仅实现了加载默认地图的功能，还增加了品牌的曝光度，使设计更有价值。
头像默认地图：事实上，默认的头像模块有一个很大的优化空间。通常默认的头像是灰色头像，设计略显单调，如图所示。
从视觉角度来看，设计师如何通过设计打破单调，并在界面上平衡统一与丰富之间的关系。作者总结了几种常用的设计方法。
方法1：Illustrator表单
设计人员可以根据产品定位设计默认图像，并根据不同的用户组设计图像。例如，面向产品的用户是高中生。可以根据学生图像设计默认图像。如果面向产品的用户是白领，可以根据白领的特点进行设计。有针对性的图像设计不仅使页面更精致，而且使用户进入熟悉的场景，增加了页面的亲密度和用户的身份。如下所示（默认头像取自网络）：
方法2：文本爬网表单
如果用户使用更多默认图像，我们可以使用技术手段执行批量匹配，在视觉上预设头像背景的颜色，然后抓取用户名的前两个单词或最后两个单词以生成用户头像。它看起来不那么单调，整体视觉风格相对统一。如下图所示：
方法3：使用相关照片
一些更垂直的产品默认头像可以根据自己的产品功能进行匹配。例如，对于宠物友好型应用程序，默认头像可以使用不同的可爱宠物照片，使产品具有自己独特的色调。如下图所示：
方法4：产品吉祥物或主题图像填充
如果产品有自己的吉祥物或产品形象，设计师也可以通过设计元素进行设计，并通过相关配件或丰富的表情形成不同的默认化身，这不仅避免了化身的单调，而且加深了用户的印象。牌。 。
小结
默认的图形模块设计方法多种多样，但设计师需要掌握品牌和形式的两个核心要素。细节由设计师精心设计，不仅可以增强用户体验，还可以加深用户对品牌的认知度，同时也可以从侧面展示设计师的专业能力。我们可以找到更多的设计和探索方法，以便设计师可以获得更多的灵感和想法。
4. 新手引导模块
新手指南是一种表示形式，允许用户快速学习产品的新功能。它主要分为两种类型：产品的主推功能通常基于开机画面引导;因为逻辑很强，步骤稍微多一点。通用功能更改的功能或位置通常以气泡的形式显示。
1）启动屏幕指导表
下图为百度地图新手指导设计：界面设计简洁，主题清晰，图片有趣，使用户可以清楚地了解被推送产品的功能。
该设计使用产品吉祥物元素，以及需要显示的主题，使图片有趣和讲故事。
布局排列在文本的顶部和底部，视觉语言统一。
副本简洁明了。
在交互方面，用户可以在任何页面上关闭页面，体验更人性化，操作更方便。
2）气泡引导形式
气泡形式是一种相对简单有效的方式来告诉用户发生了什么，但这种提示也会在一定程度上干扰用户的操作路径。因此，当产品需要引导用户时，如何减少用户对产品的负面影响是设计师需要考虑的问题。下图显示了两种气泡引导产品的不同选项：
自由鱼APP采用新手指南形式的半覆盖方法，以尽量减少对用户的干扰;交互式关闭功能允许用户随时离开;该设计采用图形和文字的组合，通过吉祥物的形象引导用户阅读短信并最大限度地减少各方面的干扰。
百度地图采用另一种呈现模式，采用全覆盖方式，给用户最清晰的显示; “知道它”按钮取代了直接关闭按钮，使交互更加情绪化;设计是吉祥的超可爱表达引导用户浏览图形信息，使页面更像故事。
小结
无论使用哪种设计形式，页面指南都可以实现产品的功能。在引导用户注意新功能的同时，有必要提高产品的良好性并避免对用户的干扰。
新手指南页面不应该太多，最好是3±页面，用户可以耐心地阅读信息而不会引起用户的不喜欢。
该设计尽可能新颖有趣，以吸引用户的注意力。
需要完成交互，以便用户可以随时退出，并尽量不强制用户的设计。
三. 梳理模块之间的关系
在从视觉角度优化每个模块的同时，我们必须注意它们之间的相关性。虽然每个模块都相对独立，但品牌特征需要统一。品牌特征的传达反映在产品的每个细节中。一致的视觉语言将使用户对产品有更深刻的印象。因此，选择产品的每个模块的颜色，使用设计元素和大型设计风格需要设计师精确控制。
总结
通过上面的例子，我希望小伙伴们可以打开设计思路，让他们有更多的设计解决方案来解决设计问题。
作为视觉设计师，我们首先要做的是满足设计的业务需求，但在此基础上，如何使界面更加精致和美观。设计感是设计师努力工作的方向，因此设计师应该更全面地了解每一个。模块，更深入的设计探索，使设计更有价值。同时，对交互逻辑和业务需求的全面深入理解是设计人员更高水平的进步，跟上UXD趋势，使他们能够不断探索新事物，保持创新理念，提升设计价值和他们自己的社会。竞争力。
