创建第二个ui_移动应用程序APP的UI设计流程

　Sketches　　通过创建移动应用程序UI设计库，为我提供了一个很好的机会来磨练我的视觉设计技能和学习过程。UI设计库，也称为视觉样式或主题，是一个自定义的图形界面元素包，应用于一个特定的应用程序或网站，以为用户创造优雅的体验。

　　ui设计流程：

　　需要注意的一件事是，该项目专注于UI / Visual设计，其中不包括UX设计。例如，用户研究，可比评论，用户旅程图，信息架构等。

　　应用程式概念

　　问题定义

　　通过我的新应用程序解决的问题是搜索课程和研讨会的难度。对于像我这样想要学习新事物的人来说，寻找适合他们的优秀课程是具有挑战性的。

　　价值主张

　　通常，价值主张采用陈述的形式，通常是第一句话。其主要目的是传达客户可以从您的产品中获得的好处。

　　一个类似的想法是电梯音高-当您将应用程序概念提炼成易于记忆，引人注目的和可重复的短语时。我在她的《 UX策略》一书中遵循了杰米·利维(Jamie Levy)的价值主张公式。

　　它是<客户类型或客户需求>的<著名平台或应用程序>。

　　引入BetterMe —“为课程和讲习班做准备。”

　　它是一个课程列表应用程序，可以帮助多伦多的人们以便捷的方式查找课程和讲习班。

　　用户角色

　　线框

　　在对用户目标和行为有了更好的了解之后，我在下面列出了该应用程序的一些关键功能，以便创建低保真线框。

　　课程列表(按热门，附近，即将到来的适合您的顺序排序)

　　搜索(按类别，类型，价格范围，位置，等级等过滤)

　　即时消息(查询)

　　用户个人资料(游戏化，学习列表)

　 Sketches

Mid-fi wireframes

　　视觉语言

　　语言由可以组合在一起以创建消息的不同类型的单词组成。视觉语言就像其他任何语言一样。视觉语言可以分为颜色，空间，形状和运动。

　　我采访了一些用户以了解他们的需求，并发现了该应用程序的心情，以进一步定义视觉语言。

　　面试问题：

　　1、你为什么要使用这个程序?

　　2、什么样的心情会有助于满足这些需求?

　　3、您如何通过视觉语言传达这种情绪?(颜色，空间，形状和运动。

　　设计开始工作表

　　 情绪板

　　作为设计师，我们旨在优化和加快我们的流程。Atomic Design的想法是允许UX设计人员，UI设计人员和前端开发人员并行工作，而不是瀑布式过程。

　　我们如何设计视觉效果，以便在早期呈现给客户?

　　情绪板是设计过程中的视觉可交付成果之一。它是一个拼贴画，通常由图像，文本和对象组成，这些拼贴画描述了除了页面的实际布局之外，我们通过数字产品获得的感觉。

　　我创建了两个独特的情绪板来展示针对不同用户组的感受。第一个是安静，干净，最小的，适合于学习和研究的目的。第二个是令人兴奋的，年轻的和快节奏的，传达了热情和积极的情绪。

　　情绪板(左-V1;右-V2)

　　然而， 情绪板对于许多人来说可能过于抽象，因为预测情绪板如何显示为有形的视觉设计元素具有挑战性。

　　风格瓷砖

　　样式图块是有形的视觉设计元素(如调色板，字体或按钮样式)的拼贴，有助于与利益相关者交流具体的视觉语言。它弥合了情绪板和线框之间的差距。在早期阶段获得设计反馈非常有用。

　　样式图块可帮助人们可视化各个元素的组合方式。我采访了15个朋友，以选择他们喜欢的风格。原来，有2/3的人更喜欢第一种视觉风格。这是一些报价。

　　“我喜欢第一个，因为它在视觉上很吸引人，我会花更多时间在应用程序中进行发现和研究。”

　　“第一个是简约的。我比图片更喜欢图标。”

　　“第二种风格更令人兴奋，但在我看来，对于课程列表应用程序来说有点过分。”

　　用户界面和原型

　　“如果一张图片价值1000字，那么一个原型价值1000场会议。” 创意

　　在确定视觉样式之后，我将其应用于中等保真度的线框并进行了一些设计迭代。然后，我使用以下高保真用户界面创建了交互式InVision原型。

　　用户界面-主页面

　　InVision原型

　　时尚指南

　　样式指南 是一套建立和实施样式以改善沟通的标准。它统一了设计标准，并极大地影响了团队的生产力。

　　风格来来去去。好的设计是一种语言，而不是一种风格。