今天要介绍的是两个设计项目的ui风格草稿的设计，都是沃顿商学院新推出的项目，两个项目分别命名为LevelUp和StepUp。LevelUp的目标是帮助科学家研究如何帮助学生取得更好的成绩。StepUp的目标是帮助科学家研究如何帮助人们养成持久锻炼的好习惯。
第一个项目:升级
项目开始后，我们遵循了这样的设计流程:为了了解用户和产品的目标，我们采访了团队关于学生的人口统计数据，回顾了团队的早期原型，并使用他们的beta产品来熟悉平台。初步调查后，开始设计。
设计方案1
方案一品牌及设计灵感实例
在第一种风格设计中，我希望用户将品牌定位为聪明、精通技术、酷。我想传达给学生的是，这个产品不是他们必须使用的蹩脚工具，而是一个很酷很有趣的程序。这种风格的灵感来自Playstation和Spotify等品牌。设计的主题是渐变、冷色调和重叠形状的混合。
为了更好地展示每一种风格，我从情绪板和风格原型开始。然后设计一个欢迎界面，让团队直观感受这种风格。最初的设计使用了随机的形状，冷色调和高对比度的文字。
单一风格的欢迎界面设计
设计方案2
方案二品牌及设计灵感实例
第二种风格的取向是:热情、乐观、友善。我希望它清楚地表明，该平台易于使用，有用，并有认同感。灵感来自迪士尼和海滩等体验，设计元素包括热带色彩和俏皮的插图。
上图是灵感心情板和风格块元素，然后将上图中的元素转化为下图中的欢迎界面。
设计方案三
第三个方案的品牌和设计灵感实例
至于第三种风格的定位，侧重于干净、俏皮、古怪。这种风格传达了“LevelUp对学生来说是新东西，很有趣，也很容易使用。”灵感来自任天堂和Aeropostale。使用的设计元素是衬线字体，明亮的颜色和俏皮的图案。
您可以在下面的示例欢迎屏幕中看到这些样式元素。
最后选择的方案
很多设计师都有这样的经验，精心设计了几个方案。提出方案后，领导从每个方案中挑出几个优点，然后希望你把它们整合成一个新的最终方案。
这个方案大体是一样的。在与客户进一步讨论后，确定LevelUp应该看起来很酷，但仍然需要让学生感觉像一个学术工具。不应该太友好也不应该太傻。应该有一些有趣的元素混合在一起。
对于最终的风格，我们选择了蓝色，灰色和绿色的配色方案。排版结合了衬线和非衬线字体。重叠的圆圈和充满活力的插图增加了设计的活力和趣味性。
一旦设计方向达成一致，下一步就是在代码中实现我们的新风格。下图是LevelUp的其他页面设计。
Tatiana Bischak为这个项目创作了一系列可爱的插图和图标。
第二个项目:升级
和LevelUp一样，StepUp也是行为科学家研究和帮助人们的平台。项目背景:BCFG与24小时健身公司合作创建了StepUp，这是美国最大的健身房之一。StepUp的目标是了解什么将有助于人们改善锻炼习惯。
StepUp比LevelUp发布的早，探索风格研究需要更好的时间。因此，我们采用了移动优先的方法，创建了三个不同版本的网站移动主页。
设计方案1
第一种风格方案的目标是传达自信、精力充沛和值得信赖。主色调为藏青色、灰色和白色，给人一种权威感，以鲜艳的蓝绿色和海泡绿色为主，增添活力。它结合了衬线和非衬线字体，以强调专业性和友好性。一个穿着运动装备微笑的女人的图片给人一种平易近人和志同道合的感觉。此图配以俏皮风格图标，进一步营造出一种活力和乐趣。
设计方案2
这种风格在排版和版面上类似于第一种方案，但更多的是一种“技术和科学驱动”的氛围。为此，我们结合了明亮的渐变和原子符号的插图。
设计方案三
第三种设计方案被用户直接采用。融合了客户喜欢的第二选择的“科学背景”的感觉。它没有使用冷色，而是使用了更友好的黄色和橙色。顾客喜欢这种设计。
移动端的首页设计一旦敲定，我们就为网站设计搭建了几个额外的响应式页面，并为程序设计了一个额外的桌面网页。
