发布时间：2023-2-18 分类： 行业资讯
UI设计不仅仅是创建精美的图像。
挑战
我给自己一个很好的机会来培养我的视觉设计技能，并通过创建一个移动应用程序用户界面库来学习设计过程。 UI库（也称为视觉样式或主题）是自定义图形界面元素包，应用于特定应用程序或网站以为用户创建优雅体验。
我的设计过程：
需要注意的一点是，该项目侧重于UI /视觉设计，而非用户体验设计;例如，用户研究，可比评论，用户旅行映射，信息架构等。
应用概念
问题定义
通过我的新应用程序，我可以解决他们在寻找课程和研讨会时遇到的困难。对于像我这样想要学习新知识的人来说，为他们找到合适的课程仍然非常困难。
价值主张
一般而言，价值主张以陈述的形式出现，通常是向公众呈现的第一句话。其主要目的是传达客户对产品的期望。
这类似于电梯销售情景——当您将应用程序概念细化为令人难忘，引人注目且可重复的短语时，您可以在“用户体验策略”一书中体验JamieLevy。价值主张公式。
这是一个为客户提供服务的平台。
介绍BetterMe的课程和研讨会——“ Yelp。 ”的
这是一款应用程序，可以帮助多伦多合作伙伴快速轻松地找到课程和研讨会。
用户角色
线框
在我更好地了解用户目标和行为后，我列出了应用程序的一些关键功能，以创建低保真线框。
课程列表（按人气，附近，即将推出，推荐给你）
搜索（按类别，类型，价格范围，位置，评级等）
即时通讯（查询）
用户个人资料（游戏化，学习列表）
以上是草图
部分完成的线框
视觉语言
该语言由不同类型的单词组成，但可以组合以创建消息。视觉语言与任何其他语言相同，可分为风格，距离，响应和趋势。
我采访了一些用户并了解他们的需求，并发现该应用程序提供了情感指导以进一步定义视觉语言。
面试问题：
你为什么要用这个应用程序？
什么样的情绪会使这些需求得到满足？
你如何通过视觉语言传达这种情感？
设计初始工作表
情绪板
作为设计师，我们的目标是优化和加速流程。 Atomic Design的想法是允许用户体验设计师，UI设计人员和前端开发人员并行工作，而不是以瀑布式方式工作。
我们如何设计一些在早期阶段呈现给用户的视觉效果？
情绪板是设计过程中的可视交付物之一。这是一个拼贴画，通常由图像，文本和对象组成。除了描述页面的实际布局外，还有我们通过产品获得的感觉。
我创建了两个独特的情绪板，为不同的用户群体呈现一种感觉。一个是安静，干净，简洁，适合学习和研究目的;然而，第二个是激动人心，年轻，快节奏，传达激情和积极情绪。
情感板（左– V1;右– V2）
然而，对于许多人来说，情绪板可能过于抽象，因为难以设计情绪板如何表现为有形的视觉设计元素。
瓷砖风格设计
图块样式是视觉设计元素的有形集合，例如调色板，字体或按钮样式，有助于通过特定的视觉语言与参与者进行交流。它填补了情绪板和线框之间的空白，并且在早期获得设计反馈非常有用。
瓷砖风格有助于人们想象如何将元素融合在一起。我采访了15位朋友并要求他们选择他们喜欢的风格。结果，2/3的人喜欢第一种视觉风格。以下是他们的答案：
“我喜欢第一个，因为它具有视觉吸引力，我将花更多的时间来发现和研究这个应用程序。 ”的
“第一种简洁，我喜欢的图标比图片更好。 ”的
“第二种风格更令人兴奋，但对于课程列表应用来说有点太多了。 ”的
用户界面和原型
“如果一张图片价值1000字，那么原型将值1000次会议。 ”的—— IDEO的专家说。
在决定使用视觉样式后，我将其应用于保真线框并进行了一些设计迭代。然后，我创建了一个具有以下高保真用户界面的交互式InVision原型：
UI——主页
风格指南
风格指南是建立和加强风格以改善沟通的一套标准。它统一了设计标准，对团队合作产生了重大影响。
深思熟虑
“风格来来去去。好的设计是一种语言，而不是一种风格。 ”的—— MassimoVignelli
该项目是由红色学院的UI设计基金会提供的兼职项目。我花了两个周末试验和探索各种UI设计方法来制作我的应用程序——从概念到实际原型更好。
作者：林黛蕾
地址：https://blog.prototypr.io/ui-design-more-than-just-creating-pretty-images-cc1f46a7c81b
本文由@Mockplus团队翻译为原始版本，未经许可不得复制。
该地图来自PEXELS，基于CC0协议
