休息一下！ (Get some rest!)

After four weeks of four-day design sprints each week, I welcomed the opportunity to work on this 9-day design challenge. With this also being an individual project, I allocated 50% of my time on the UX process and 50% on the UI process.

在每周进行了为期四天的为期四天的设计冲刺之后，我很高兴有机会参与这一为期9天的设计挑战。 由于这也是一个单独的项目，我将50％的时间分配给UX进程，将50％的时间分配给UI进程。

客户端 (The Client)

The client, the National Wellness Institute, has a mission of:

客户国家健康研究所的任务是：

“providing health promotion and wellness professionals unparalleled resources and services that fuel professional and personal growth.

为健康促进和健康专业人士提供无与伦比的资源和服务，从而促进专业和个人发展。

The institute defines wellness as,

该研究所将健康定义为

“an active process through which people become aware of, and make choices toward, a more successful existence.”

“一个活跃的过程，人们可以通过这个过程了解并做出选择，以实现更加成功的生存。”

Furthermore, the NWI breaks wellness into six different dimensions:

此外，NWI将健康分为六个不同方面：

While there currently seems to be endless wellness apps available for download, many people continue to struggle to maintain a healthy lifestyle. So, the NWI has “hired” me to reimagine how people can adopt and maintain a routine that enhances their wellbeing.

尽管目前似乎有无数的健康应用程序可供下载，但许多人仍在努力维持健康的生活方式。 因此，NWI“聘请”我重新构想人们如何采用和维护能改善其健康状况的常规活动。

While we had complete creative freedom for this project, there were three business requirements from the NWI that we had to include:

尽管我们对该项目拥有完全的创作自由，但是NWI提出了三个业务要求 ，其中包括：

1. Users need to be able to set up their profile to include important information relevant to their goals
   用户需要能够设置其个人资料以包括与他们的目标相关的重要信息
2. Users need to be able to set goals and track their progress
   用户需要能够设定目标并跟踪他们的进度
3. Users need to be able to share their stats with their wellness coaches
   用户需要能够与健康教练共享其统计信息

I chose to focus on the topic of sleep and productivity.

我选择专注于睡眠 和 生产力这一主题。

发现 (DISCOVER)

二次研究 (Secondary Research)

To better understand the landscape of the sleep and productivity space, I started by conducting secondary research. I discovered that “morning people” versus “evening people” illustrates a classic left-brain versus right-brain division. Amanda Rugger, from the BBC, said:

为了更好地了解睡眠和生产力空间的状况，我从进行二级研究开始。 我发现，“早起的人”与“晚间的人”说明了左脑与右脑的经典区分。 英国广播公司的阿曼达·鲁格(Amanda Rugger)说：

“Night Owls tend to perform better on measures of memory, processing speed and cognitive ability.”

“夜猫子在记忆，处理速度和认知能力等方面往往表现更好。”

She also stated:

她还说：

“Early Birds set higher goals for themselves, plan for the future more and have a better sense of well-being.”

“早起的小鸟为自己设定了更高的目标，为未来做更多的计划，并拥有更好的幸福感。”

So while genetics are partially involved in when we function most optimally throughout the day, there were also arguments stating that behavior changes could also flip you into either the morning or evening “camp”.

因此，尽管遗传因素部分地参与了我们全天最佳发挥作用的过程，但也有争论表明行为改变也可能使您陷入早晚的“营地”。

Regardless of when you function best, I found the graph below quite interesting. It shows a percentage of respondents worldwide who used select tactics to ensure a good night’s sleep as of 2019 —

不管您什么时候运行得最好，我都发现下面的图很有趣。 它显示了截至2019年，全球使用精选策略确保睡个好觉的受访者百分比-

This means that as we get older, we tend to care less about ensuring a good night’s rest. I was curious as to how this lack of sleep would affect peoples’ motivation to both hop out of bed in the morning to kick-start their day and then be productive throughout the day.

这意味着随着年龄的增长，我们倾向于较少关注确保一夜安眠。 我很想知道这种睡眠不足会如何影响人们的动机，他们既要早上起床开始新的一天，又要全天工作。

商业分析 (Business Analysis)

Leveraging Strategizer’s Lean UX Canvas, I defined the business problems and outcomes, as well as the users and benefits to the users. At this stage, I only focused on sections 1–4 of the canvas (sections 5–8 are revisited later once the MVP/hypothesis is defined).

利用Strategizer的Lean UX Canvas ，我定义了业务问题和成果，以及用户和用户的利益。 在此阶段，我仅关注画布的第1-4节(定义了MVP /假设后，将重新讨论第5-8节)。

The business problem was two-fold:

业务问题有两个：

1. Sleep deprivation and its effect on productivity
   睡眠剥夺及其对生产力的影响
2. Lack of planning for a more balanced/proactive tomorrow
   缺乏为明天更加平衡/主动的计划

Overall, treating this tool as a living document was a helpful reference point as I moved further along the UX process.

总体而言，当我进一步推进UX流程时，将此工具视为活动文档是一个有用的参考点。

竞争对手分析 (Competitor Analysis)

To better understand the playing field, I conducted a competitor analysis. The competitors I chose included: Calm, Headspace, Oura, Evernote, and Apple’s native iOS app, Bedtime.

为了更好地了解比赛环境，我进行了竞争对手分析。 我选择的竞争对手包括：Calm，Headspace，Oura，Evernote和Apple的本地iOS应用程序Bedtime。

There were many features to compare (more than what I listed above), but I decided to hone in on the three features I believed to be most relevant to a sleep/productivity app (highlighted in yellow).

有很多功能需要比较(比我上面列出的要多)，但是我决定磨合我认为与睡眠/生产力应用程序最相关的三个功能(以黄色突出显示)。

市场定位 (Market Positioning)

Building off the competitor analysis, the market positioning chart provided a nice visual snapshot of the current competition. It also revealed the “Blue Ocean”, or uncontested position in the marketplace. With my x-axis labeled as “Sleep focused” to “Productivity-Focused”, and my y-axis labeled as “Feature Minimal” to “Feature Heavy”, you’ll see where my competitors landed below:

在竞争者分析的基础上，市场定位图提供了当前竞争的良好视觉快照 。 它还揭示了“蓝海 ”，即市场上无可争议的地位。 将我的x轴标记为“睡眠集中”到“关注生产力”，并将我的y轴标记为“最小特征”到“特征繁重”，您会看到我的竞争对手跌落到哪里：

The Blue Ocean represented an app that is more productivity-focused (roughly 80%), but with sleep app elements (roughly 20%). Because sleep is a precursor to your productivity the next day, it was important to consider that element.

Blue Ocean代表了一个更加注重生产力的应用程序(大约80％)，但是带有睡眠应用程序元素(大约20％)。 由于睡眠是第二天工作效率的先决条件，因此考虑该因素很重要。

I’m grateful to be learning how to merge this type of business analysis with the UX process because of the valuable insights (data points) it extracts. And, solutions rooted in data equal solutions that provide true value to the user.

我很高兴学习如何将这种类型的业务分析与UX流程合并，因为它可以提取出宝贵的见解(数据点)。 而且， 植根于数据的解决方案等于为用户提供真正价值的解决方案。

用户研究 (User Research)

I started my user research by conducting 71 surveys, with most responses generated through a variety of productivity- and sleep-focused subreddit threads.

我通过进行71项调查开始了我的用户研究，其中大多数答复是通过各种以生产力和睡眠为重点的subreddit线程生成的。

Asking the right survey questions had been a challenge for me in prior projects, but by week #5, I felt I had improved in this area. A few examples of questions I asked included:

在以前的项目中，问正确的调查问题对我来说是一个挑战，但是到第5周，我觉得我在这方面已经有所进步。 我提出的一些问题示例包括：

• After your alarm goes off, how quickly do you start to engage with your phone?
  闹钟响起后，您多快开始使用手机？
• How much time do you budget in the mornings to get from your bed to work / your desk?
  您每天早上有多少时间预算从床上起床/上班？
• If you had extra time in the mornings what would you do, and how much time would you need for those activities?
  如果您早上有多余的时间，该怎么办？这些活动需要多少时间？

70% would ideally have 15–60 minutes each morning to themselves.

理想情况下，每天早上70％的人自己需要15-60分钟。

64.7% of respondents were most productive between 5:00 AM and noon.

64.7％的受访者在5:00 AM和中午之间生产率最高。

Answers to these questions provided very valuable data points and a peek into potential openings for solutions. I could then begin to find the gap between what users wanted to do better/differently and what they currently do. In combining that gap opportunity with my competitor research, I could better position my wellness app in that “Blue Ocean”.

这些问题的答案提供了非常有价值的数据点，并为您提供了解决方案的潜在机会。 然后，我可以开始发现用户想要做的更好/不同与当前所做的事情之间的差距。 通过将差距机会与竞争对手的研究相结合，我可以更好地将健康应用程序定位在“蓝海”中。

At this point, however, it was still too early to come up with ideas. More research needed to be done!

然而，在这一点上，想出主意还为时过早。 需要做更多的研究！

面试 (Interviews)

Next, I conducted five interviews. The quantitative data I received from my surveys was certainly valuable, but the qualitative data from interviews is where I found even richer data. For instance, in response to one of my questions asking about phone usage habits, one interviewee stated:

接下来，我进行了五次采访 。 我从调查中获得的定量数据当然很有价值，但是从访谈中获得的定性数据是我发现更丰富的数据的地方。 例如，在回答我的一个有关电话使用习惯的问题时，一位受访者说：

“I start engaging with my phone instantly after I wake up. I’m conscious that I do it and I hate that we do it but like you’re so addicted you can’t help it.” — Abby

“醒来后，我立即开始与手机互动。 我意识到我会这样做，但我讨厌我们这样做，但是就像你是如此上瘾，你无能为力。” —艾比

In response to my question about how users carve out time in the morning for themselves, a different interviewee stated:

在回答我有关用户如何自己节省时间的问题时，另一位受访者表示：

“Reading on the bus is a nice solitary activity and a good way to have a nice buffer in the morning.” — Sasha

“在公共汽车上读书是一种很好的孤独活动，也是一种在早上缓冲的好方法。” 萨沙

A third user, in response to the same question, stated:

第三位用户在回答同一问题时说：

“I do a workout or hit the ground and crank out 10 push-ups every morning. …That way, going to work only feels like the second part of my day and not my entire day.” — Patrick’

“我每天做一次锻炼或摔倒，然后俯卧撑10次。 …那样，上班感觉就像一天的第二部分，而不是一整天。” -帕特里克

Now, not all users are like Patrick — waking up every morning to “crank out 10 push-ups”. I found that most users had a desire to have extra time in the morning, but would let out a sigh and give a somewhat nostalgic response to my asking what they would do with that time. There was clearly a wish there to accomplish a goal or activity that brought personal fulfillment, but people seemed unsure of how they would make that work in reality.

现在，并不是所有的用户都像Patrick一样-每天早晨醒来以“锻炼10个俯卧撑”。 我发现大多数用户希望在早上有更多时间 ，但会发出一声叹息，对我询问他们在这段时间里会做些什么怀旧之情。 显然，人们希望实现能够带来个人成就感的目标或活动，但是人们似乎不确定如何实现这一目标。

How could I create something to give people the chance to do that little extra thing daily that they know would bring more happiness to their routine, and in turn overall wellbeing? This was an ‘AHA’ moment!

我该如何创造一些东西，使人们有机会每天做一点额外的事情，而他们知道这些东西会给他们的日常工作带来更多的快乐，进而给整体福祉带来回报？ 这是一个“ AHA”时刻 ！

People know what it is that makes them happy, or what makes them relaxed. They’ve identified it, they just need a way to be reminded and encouraged to pursue it. How can I build something to give people a daily sliver of happiness, that sets them up for better mental clarity and focus for the day ahead?

人们知道是什么使他们感到高兴，或什么使他们感到放松。 他们已经识别出它们，只是需要一种提醒和鼓励的方式去追求它。 我该如何构建一些东西来使人们每天获得一小撮快乐，从而使他们更好地保持头脑清醒并专注于未来的一天？

定义 (DEFINE)

亲和贴图 (Affinity Mapping)

After collecting all of the survey and interview data, I meticulously sifted through my conversation voice recordings and notes. I then jotted down 78 insights onto digital sticky notes via the Adobe XD’s Whiteboard feature.

收集了所有调查和访谈数据后，我仔细筛选了谈话的语音记录和便笺。 然后，我通过Adobe XD的Whiteboard功能将78个见解记入了数字便签。

To add some structure to the chaos, I then grouped sticky notes into main themes (represented by the blue labels below).

为了给混乱增加一些结构，然后我将便签分为主要主题(由下面的蓝色标签表示)。

Zooming in on those labels…

放大这些标签…

The affinity mapping exercise really helped define patterns in user behavior. By extracting those patterns and grouping them accordingly, I could take a large data set and start distilling the insights into foundational pillars.

亲和力映射练习确实有助于定义用户行为的模式。 通过提取这些模式并将其相应地分组，我可以获取大量数据，然后开始将见解提炼为基础Struts。

价值主张画布 (Value Proposition Canvas)

The Value Proposition Canvas (VPC), is a two-part diagram that provides a business perspective on the user. At this stage, I focused on the right side of the diagram — the customer profile side.

价值主张画布(VPC)是一个分为两部分的图，为用户提供了业务角度。 在此阶段，我专注于图的右侧-客户档案侧。

Referencing the Jobs To Be Done framework, I had to ask myself, what do users want to achieve by “hiring” specific features/experiences to achieve specific “jobs”?

引用待完成的工作框架，我不得不问自己，用户通过“雇用”特定功能/经验来实现特定“工作”想要实现什么？

I determined that in order for users to achieve their productivity goals, they needed to start their day proactively, rather than reactively. Emotionally, that would promote less anxiety, too. Being able to anticipate issues is easier to do when you’re prepared, than when you wake up late and you’re already starting the day on your heels.

我确定，为了使用户实现其生产力目标，他们需要主动而不是被动地开始新的一天。 从情感上讲，这也会减少焦虑。 当您准备就绪时，相比于您起床较晚且已经开始新的一天，能够更容易地预测问题。

用户角色 (User Persona)

To give more life to the data collected thus far, I created my user persona. Say hello to Tired Tom!

为了使到目前为止收集到的数据更有生命，我创建了用户角色。 向疲倦的汤姆问好！

“I’m a Night Owl, but an aspirational Early Bird”

“我是夜猫子，但是雄心勃勃的早起的鸟儿”

Tired Tom is my primary persona and is a composite of my target user group. His goals, habits, pain-points, and favorite brands are a representation of how my user group perceives the world and engages with technology.

厌倦的汤姆是我的主要角色，是我的目标用户群的组成部分 。 他的目标，习惯，痛点和喜爱的品牌代表了我的用户群如何看待世界并与技术互动。

Building the persona allowed me to further understand the users’ mental models and in turn, keep them at the center of the design process.

建立角色可以使我进一步了解用户的心理模型 ，从而将他们放在设计过程的中心。

任务分析 (Task Analysis)

The task analysis is a simple breakdown of user tasks as they go through a specific scenario. This posed some difficulties at first because I wasn’t sure where the task should start — the night before or the day of. Because the night routine is an indicator of the next day, however, I chose to make two task analyses.

任务分析是用户任务在特定情况下的简单细分。 起初这带来了一些困难，因为我不确定任务应该从哪里开始—前一天晚上还是一天。 但是，由于夜间例行程序是第二天的指标，因此我选择进行两次任务分析。

Here is the task analysis for the evening routine:

这是晚上例行工作的任务分析：

Note: for the tasks on the second line above, there would normally also be a series of subtasks. For instance, under “brush teeth” you might see: pick up a toothbrush, apply toothpaste, dampen with water, then brush. To streamline the flow, I have omitted those sub-steps.

注意：对于上面第二行中的任务，通常还会有一系列子任务。 例如，在“刷牙”下，您可能会看到：拿起牙刷，涂抹牙膏，用水润湿，然后刷牙。 为了简化流程，我省略了这些子步骤。

A word of advice from my TA, Kathryn McClure, which really helped me understand this process, was to write out the tasks in such a way that a robot could understand them 🤖.

我的助教凯瑟琳·麦克卢尔 ( Kathryn McClure)的一句话真正帮助我理解了这一过程，就是以使机器人能够理解任务的方式写出任务🤖。

Here is the task analysis for the morning routine:

这是早上例行的任务分析：

The key insight from the morning task analysis was that Tired Tom snoozes his alarm three times before getting up. That is an average of 15–20 minutes of pure snoozing!

早上任务分析的主要见解是，累了的汤姆在起床前打了三下警钟 。 这是平均1 5–20分钟的纯打sn！

This was another ‘AHA’ moment, and already I could feel the ideas trickling to the surface. To stay in the Define stage of the UX process, however, I had to suppress these thoughts for the time being. If we take our eyes off the user too early in the UX process, we run the risk of creating a solution that doesn’t cut at the real underlying problem.

这是另一个“ AHA”时刻 ，我已经可以感受到这些想法浮出水面。 但是，为了停留在UX过程的“ 定义”阶段，我不得不暂时抑制这些想法。 如果在UX流程中过早将视线移开用户，则会冒创建无法解决真正根本问题的解决方案的风险。

The Revamped Double Dimond design thinking framework, developed by the Stanford d. School, in conjunction with Dan Nessler, is a good representation of where I currently was in the process — “Converging” out of the Define stage.

斯坦福大学(Stanford d。)开发的经过改进的Double Dimond设计思维框架。 School与Dan Nessler一起很好地代表了我目前所处的位置-在“ 定义”阶段“融合” 。

Again, I had to remind myself of the importance of following the data. I was close to the Develop stage but still needed to define the user journey.

同样，我不得不提醒自己注意数据的重要性。 我已经接近开发阶段，但仍然需要定义用户旅程。

用户旅程图 (User Journey Map)

Pulling insights from the task analysis and VPC, I created a user journey map. Visualizing the data through this lens helped uncover the low-points, or pain-points, in Tom’s journey.

从任务分析和VPC中获取见解，我创建了用户旅程图。 通过这个镜头将数据可视化有助于发现汤姆旅程中的低点或痛点。

Zooming in…

放大…

The three problem areas revealed themselves as:

三个问题区域显示为：

1. Going to bed too late the night before

1.前一天晚上睡得太晚

2. Snoozing wakeup alarm

2.暂停唤醒闹钟

3. Waking up groggy and tired

3.醒来时昏昏欲睡

Flipping those problems into How Might We (HMW) statements:

将这些问题归纳为“我们将如何做”(HMW)语句：

1. HMW…? help the user get to bed at a reasonable hour

   嗯...？ 帮助用户在合理的时间上床睡觉

2. HMW…? motivate the user to redistribute their alarm clock snooze time in the morning towards something they can look forward to?

   嗯...？ 促使用户将闹钟的打sn时间重新分配给他们可以期待的东西？

3. HMW…? help change the user’s morning routine to reduce grogginess, elevate mood, and boost productivity?

   嗯...？ 帮助改变用户的早晨习惯，以减少烦恼，提高情绪并提高生产力？

发展 (DEVELOP)

构想 (Ideation)

Because this was an individual project, progress was slower through each of the steps in the UX process compared to previous sprints with teammates. Brainstorming is inherently a group activity, however, so I was happy to team up with a few classmates to both collaborate and accelerate my project.

因为这是一个单独的项目，所以与先前与队友的冲刺相比，UX过程中每个步骤的进度都较慢。 但是，头脑风暴本质上是一项集体活动，所以我很高兴与一些同学合作，共同合作并加速我的项目。

For each HMW, I teamed up with a different classmate to help with brainstorming — double the brains, double the power (shoutout to Lauren, Monica Maloff, and Kathryn for joining in)! We time-boxed ourselves to five minutes per “HMW…?”

对于每个HMW，我都会与另一位同学一起进行集体讨论，以帮助他们集思广益 -加倍智慧 ，加倍力量(向Lauren ， Monica Maloff和Kathryn 喊叫 )。 我们的时间盒装自己到五分钟每“HMW ......？”

…then we took five minutes afterward to popcorn any additional ideas off those first ones.

…然后，我们花了五分钟的时间 ，将第一个想法中的其他任何想法爆米花 。

After the brainstorm, I relieved my volunteers of their duties and continued to group similar ideas together and organize the diagram.

头脑风暴后，我解除了志愿者的职责，并继续将相似的想法归纳在一起并组织图表。

With over 50 ideas generated in roughly 25 minutes, I needed to do some prioritization. Enter, the MoSCoW method.

在大约25分钟的时间内产生了50多个想法 ，我需要确定一些优先级。 输入MoSCoW方法。

MoSCoW方法 (MoSCoW Method)

Looking at the data through the lens of the MoSCoW method helped with prioritization. The visual categorization and organization allowed me to decipher which ideas should be built first.

通过MoSCoW方法的角度查看数据有助于确定优先级。 视觉上的分类和组织使我能够确定应该首先构建哪些想法。

Based on the data from the users, I narrowed my focus to the following Must-Have features

根据用户的数据，我将精力集中在以下必备功能上

价值主张画布 (Value Proposition Canvas)

Circling back to the left side of the Value Proposition Canvas (VPC), I then examined who is using my app and why. The goal here was to achieve that product-market fit based on what users value.

回到价值主张画布(VPC)的左侧，然后检查了谁在使用我的应用程序以及原因。 这里的目标是根据用户的价值实现产品市场的适应性 。

Associating pains and gains with product features helped me further identify emotional and functional benefits/disadvantages and, in turn, land on my key product offering.

伴随痛苦 产品功能上的收获和帮助我进一步确定了在情感和功能上的优点/缺点，进而找到了我的主要产品。

For users to achieve their productivity goals, they must start their day proactively, rather than groggy and reactively.

为了使用户实现他们的生产力目标，他们必须积极主动地开始新的一天，而不是无所适从。

快速回顾 (Quick Recap)

To quickly recap, based on the data from the research, the Blue Ocean is an app that is more productivity-focused, but that maintains elements from sleep apps.

为了快速回顾，基于研究的数据，Blue Ocean是一款更加注重生产力的应用程序，但它保留了睡眠应用程序中的元素。

Based on my market positioning chart, the Blue Ocean is roughly in the center, but with a stronger lean towards productivity and minimal features.

根据我的市场定位图，“ 蓝海”大致处于中心位置，但是对生产力的依赖更强，并且功能最少 。

The three main problem areas from the user journey map were:

用户旅程地图中的三个主要问题区域是：

1. Going to bed too late the night before

1.前一天晚上睡得太晚

2. Snoozing the wake-up alarm

2.暂停唤醒闹钟

3. Waking up groggy and tired

3.醒来时昏昏欲睡

The three main business requirements from the NWI were:

NWI的三个主要业务需求是：

1. Users need to be able to set up their profile to include important information relevant to their goals
   用户需要能够设置其个人资料以包括与他们的目标相关的重要信息
2. Users need to be able to set goals and track their progress
   用户需要能够设定目标并跟踪他们的进度
3. Users need to be able to share their stats with their wellness coaches
   用户需要能够与健康教练共享其统计信息

With that in mind…

考虑到这一点…

这个概念 (The Concept)

First Things First inspires users to kick-off their day with whatever brings them personal joy. The goals set are reinforced by a personal motivation coach, who then helps guide the user towards a punctual bedtime and an activated morning. First Things First is here to get you there.

First Things First激发用户以带给他们个人快乐的一切开始新的一天 。 私人动机教练加强了设定的目标 ，然后教练指导用户准时入睡和活跃的早晨 。 第一要紧的东西在这里可以带你到那儿 。

最低可行产品(MVP) (Minimum Viable Product (MVP))

First Things First is an app that:

First Things First是一款应用程序，可以：

1. Links you with a motivation coach

   将您与动力教练联系起来

2. Utilizes smart, gamified alarms

   利用智能游戏警报

3. Encourages voice recorded time capsuled messages between friends

   鼓励朋友之间进行语音录制的时间压缩消息

待完成的工作(JTBD) (Jobs To Be Done (JTBD))

Defining the MVP and JTBD was a challenge because there was an entire UX process worth of data to consider. I eventually developed two main JTBD:

定义MVP和JTBD是一个挑战，因为需要考虑整个UX流程中的数据。 我最终开发了两个主要的JTBD：

1. When waking up in the morning, the user wants to visualize/hear their goals for that day/week/month, so that they don’t procrastinate their morning routine, which gives them additional time to be at peace with the moments they enjoy, which makes them feel happy and motivated.

   早上起床时 ，用户希望可视化/听到他们每天/每周/每月的目标，这样他们就不会拖延早晨的例行活动 ，这使他们有更多的时间与自己喜欢的时刻保持安宁，这使他们感到快乐和有动力 。

2. When going to bed the night before, the user wants to not snooze their alarm, so that they can spend an extra 15–30 min each day doing what brings them joy, which delivers a sense of accomplishment and purpose for a productive day ahead.

   前一天晚上睡觉时，用户不想打sn他们的闹钟 ，以便他们每天可以花费额外的15–30分钟来做让他们 感到高兴的事情，这给成就感和成就感的 一天带来了成就感 。

用户流程图 (User Flow Chart)

The user flow chart was the toughest stage of the UX process for me. My problems had been identified, my features were defined, I had both concept and MVP statements, and now it was time to take the theory and put it into action.

对我来说，用户流程图是UX过程中最困难的阶段。 我的问题已经确定，我的特征已经定义，我既有概念又有MVP陈述，现在是时候将该理论付诸实践了。

The user flow is the blueprint of the app and what sets the foundation for a seamless experience. It’s also a great tool to share with stakeholders, as well as with any developers who eventually need to understand how to code the app… so no pressure!

用户流程是应用程序的蓝图，它为无缝体验奠定了基础。 它也是与利益相关者以及最终需要了解如何对应用程序进行编码的所有开发人员 共享的一个很好的工具，因此没有压力！

As with the task analysis, I decided to create two user flows (PM and AM). This is the single, happy path for the evening user flow:

与任务分析一样，我决定创建两个用户流(PM和AM)。 这是晚上用户流的唯一快乐路径：

For the morning flow, my initial thought was to gamify the alarm clock experience. In order to deactivate the alarm, the user would have to beat the computer at a game of Tic-Tac-Toe, Sanke, Pac-Man, or Tetris. The flow looked like this:

对于早晨的流量，我最初的想法是游戏 化闹钟体验。 为了停用警报，用户将不得不在井字游戏，三科游戏，吃豆人游戏或俄罗斯方块游戏中击败计算机。 流程如下所示：

After finishing the flow, I realized I had spent quite a bit of time on the game aspect, and not enough on building a solution for the rest of the users’ pain points. I had to ask myself, do I pivot or preserve?

在完成流程之后，我意识到我在游戏方面花了很多时间，而在为其余用户的痛点建立解决方案方面花的时间不够。 我不得不问自己，我是枢轴还是保留？

Seeing as the gamified alarm clock was a distinguishing feature of my app, I decided to minimize the feature (in accordance with my market positioning chart), and instead, create a “trace your finger through the maze to unlock” system (pictures to follow in my prototypes below). That approach still required the user to emerge from their state of sleepiness, but without making it too difficult to the point where the user could potentially lose interest in the experience.

鉴于游戏化闹钟是我的应用程序的一个显着功能，因此我决定最小化该功能(根据我的市场定位图)，而是创建一个“在迷宫中追踪手指以解锁”系统(图片如下)在下面的原型中)。 该方法仍然需要用户从他们的困倦状态中摆脱出来，但又不会使其变得太困难，以至于用户可能对体验失去兴趣。

Side note: due to the time constraints, and this being an app rather than a website, I only built the user flow chart and omitted a site map.

旁注：由于时间限制，这是一个应用程序而不是网站，因此，我仅构建了用户流程图，并省略了站点地图。

交付 (DELIVER)

It was time to begin rapid prototyping with the build-measure-learn framework in mind. The goal was to build as quickly as possible, measure that progress against user data, then bring in users for testing to provide further guidance.

现在该开始着眼于构建测量学习框架的快速原型开发了。 目标是尽快构建，根据用户数据衡量进度，然后引入用户进行测试以提供进一步的指导。

样机素描 (Mockup Sketch)

The user flow gave me a great outline of how to start visualizing the idea. I started with a series of simple sketches as a way to brainstorm the layout. Here is the evening routine:

用户流程为我提供了有关如何开始形象化想法的概述。 我开始用一系列简单的草图 ，以此来集思广益布局 。 这是晚上的例行活动：

I then did the same exercise for the morning routine:

然后，我在早上的例行活动中做同样的运动：

While far from perfect, the mockup sketches got the visual design butterflies out of my system.

虽然远非完美，但样机草图却使视觉设计蝴蝶从我的系统中脱颖而出。

Lo-Fi原型 (Lo-Fi Prototype)

Let the fun begin! With the mockup sketches providing some baseline visual understanding, I moved into my lo-fi prototype. The lo-fi prototype below illustrates the evening routine for the user:

让乐趣开始！ 通过样机草图提供一些基本的视觉理解，我进入了Lo-Fi原型。 下面的lo-fi原型为用户说明了夜间活动：

The user is first notified that it’s time to “simmer down” for the evening. Once they swipe, they are then prompted to check-in on their goals for the week. A dashboard displays goals for the month, week, and the following day. Next, the user is alerted that their motivation coach has sent them an encouraging time-capsuled voice recorded message.

首先通知用户该是晚上“沉迷”的时候了。 滑动后 ，系统会提示他们签入一周的目标。 仪表板显示月份，星期和第二天的目标。 接下来，警告用户其动力教练已向他们发送了令人鼓舞的时间限制的语音记录消息。

Upon reviewing both the goals dashboard and the coach's message, the user is then notified that their progress has been recorded and shared with the coach.

在查看了目标仪表板和教练的信息后，便会通知用户其进度已被记录并与教练共享。

Afterward, the user can select an accountability partner, which draws friends from Facebook (the method that our persona, Tired Tom, used to set up his First Things First account). After the connection has been established, the user can send a quick text or audio message to their friend.

然后，用户可以选择一个问责制合作伙伴，该合作伙伴从Facebook吸引朋友(我们的角色Tired Tom用于建立他的First Things First帐户的方法)。 建立连接后，用户可以向其朋友发送快速文本或音频消息。

Lastly, once the preceding tasks are completed, the user is shown a bedtime countdown timer to assist with an on-time bedtime.

最后，一旦完成前述任务，就向用户显示就寝时间倒计时计时器，以帮助准时就寝时间。

可用性测试 (Usability Testing)

As my instructor, Daveed, always says,

作为我的老师，戴夫(Daveed)总是说，

“We prototype our way forward” — davidfast

“我们为前进的道路原型” – davidfast

I recruited five users to test my lo-fi prototype using Useberry (a plugin within Adobe XD). I was also sure to record each test using Otter.ai, a great app that provides highly accurate speech to text transcription, as well as Facetime to catch facial expressions/reactions (given that we currently live under COVID-19 lockdown and I can’t be there in person).

我招募了五个用户使用Useberry (Adobe XD中的插件) 测试我的lo-fi原型。 我还确保使用Otter.ai来记录每个测试， Otter.ai是一款出色的应用程序，可为文本转录提供高度准确的语音，以及Facetime来捕获面部表情/React(假设我们目前生活在COVID-19锁定下，我可以不能亲自去那里)。

Out of the five tests, there was a 100% completion rate, with an average of three minutes to complete the task. Even though the completion rate was 100%, this did not mean that the app was flawless — far from it, in fact! Here are some of the user insights that I received from testing:

在这五项测试中， 完成率为 100％ ，平均需要三分钟才能完成任务 。 即使完成率是100％，这也不意味着该应用程序是完美无缺的-实际上，它远非如此！ 以下是我从 测试中获得的一些用户见解 ：

“Is there a listen later option for the voice message, or only play now/pause/next?”

“是否有语音消息的“稍后收听”选项，还是仅现在/暂停/下一个播放？”

“I know I can see what time it is, in the upper lefthand corner of my phone screen, but I feel like it should show me what time it is next to the bedtime timer.”

“我知道我可以在手机屏幕的左上角看到现在的时间，但是我觉得它应该向我显示就寝时间旁边的现在的时间。”

[referring to the nav icon of a whistle, located at the bottom of the screen second from the left] “Is that a blowdryer?”

[指的是哨子的导航图标，它位于屏幕底部，位于左侧第二个位置]“是吹风机吗？”

The verbal data was also supported by the heatmapping results below:

以下的热图结果也支持了口头数据：

The lo-fi prototype stage is a great place to validate or invalidate learnings. I had a variety of ontology issues that I needed to work through, and I was grateful to be bringing in the user at this stage to help identify the confusion early on.

lo-fi原型阶段是验证或无效学习的好地方。 我遇到了许多需要解决的本体 问题 ，并且很高兴能在此阶段引入用户，以尽早发现混乱。

中音原型 (Mid-Fi Prototype)

Building off the usability test results from the lo-fi prototype, I made changes and built out the mid-fi prototype. Here is a macro overview:

根据lo-fi原型的可用性测试结果，我进行了更改并构建了mid-fi原型。 这是一个宏概述：

Again, I conducted five usability tests and received a 100% completion rate. However, there were a variety of taxonomy and choreography issues that still needed to be revisited. The report from the user testing showed:

我再次进行了五次可用性测试，并获得了100％的完成率 。 但是，仍然存在许多需要分类的分类法和编排 问题 。 用户测试的报告显示：

1. A need for a calendar view of the dashboard, not just a linear view
   需要仪表板的日历视图，而不仅仅是线性视图
2. The voice message screen felt more like a music playback graphic
   语音消息屏幕更像是音乐播放图形
3. The folder icon didn’t associate with a new message, but rather with a new file
   文件夹图标不与新消息关联，而是与新文件关联
4. Button ontology — nav bar icons didn’t fit the feel of what was on the screen
   按钮本体-导航栏图标不适合屏幕显示的感觉

The heatmapping below further illustrates user confusion and misclicks:

下面的热图进一步说明了用户的困惑和误点击 ：

By prototyping early and often, it’s much easier to catch errors and make changes. As designers, especially when it comes to visual work, it can be easy to grow attached to your own design (whether consciously or subconsciously). I understand the importance of receiving critique early on, but it’s easier said than done. It’s an area I’m working on — to crave critique and not get attached to designs. Because ultimately, the experience I create will be much better if the user is involved throughout the process.

通过尽早且经常进行原型制作 ，可以更轻松地发现错误并进行更改。 作为设计师，尤其是在视觉作品方面，无论是有意识还是潜意识，都可以很容易地成长为自己的设计。 我了解尽早接受批评的重要性，但说起来容易做起来难。 这是我正在研究的领域- 渴望批评而又不迷恋设计。 因为最终，如果用户参与整个过程 ，那么我创造的体验会更好。

视觉竞争分析 (Visual Competitive Analysis)

Before diving into the hi-fi prototype, it was important to conduct a visual competitive analysis. That way I could assess user expectations when it came to color, pattern choices, typography, icons, and other style choices.

在进入高保真原型之前，进行视觉竞争分析很重要。 这样，我可以评估用户对颜色，图案选择，版式，图标和其他样式选择的期望 。

First, I investigated Headspace:

首先，我调查了Headspace ：

Then I examined Calm:

然后我检查了一下Calm ：

Between the two apps, I noticed a wide range of color palettes, use of gradients, bold imagery, interesting textures, animated characters, and simple /clean typography.

在这两个应用程序之间，我注意到了各种各样的调色板，渐变色的使用，大胆的图像，有趣的纹理，动画人物以及简单的/ clean字体。

Conducting this type of visual research was important to my process because it gave me an understanding of what my users would expect of First Things First.

进行这种视觉研究对我的过程很重要，因为它使我了解了用户对“第一件事”的期望。

品牌属性 (Brand Attributes)

With my competitors in mind, I brainstormed the brand attributes for First Things First. My original brand attributes were:

考虑到竞争对手，我为“第一件事”集思广益。 我最初的品牌属性是：

Punctual, Motivational, Supportive, Accountable, Clear

准时 ， 动机 ， 支持 ， 责任感 ， 清晰

To test if my brand attributes resonated with my users, I created a mood board.

为了测试我的品牌属性是否引起了用户的共鸣，我创建了一个情绪板。

情绪板和合意性测试 (Mood Board and Desirability Testing)

With my brand attributes in the foreground, I time-boxed myself for 20 minutes and created a mood board with the images below:

将品牌属性放在最前面，我对自己进行了2 0分钟的 时间装箱 ，并使用以下图片创建了一个情绪板：

Afterward, I conducted desirability testing with my class. I asked them: How does my mood board make you feel? Does anything feel out of place? Respondents commented with words like:

之后，我在课堂上进行了合意性测试 。 我问他们：我的情绪板如何使您感到 ？ 有什么感觉不合适吗？ 受访者用以下词语评论：

Motivated, eyes-on-the-prize, goal, tracking, timing, planning, willing, perspective, professional, rested, teamwork, support, and routine

积极进取，目不转睛，目标，跟踪，时间安排，计划，意愿，远见，专业，休息，团队合作，支持和日常工作

The one photo that felt out of place was the girl in the upper-righthand corner. Users described that photo as snoozing and lazy.

一张感觉不合适的照片是右上角的那个女孩。 用户将照片描述为打sn和懒惰。

Through this testing, I also discovered that my initial brand attribute of “Clear” wasn’t being communicated. However, “goal” and “goal-oriented” was mentioned a handful of times. So, I changed my brand attributes to:

通过该测试，我还发现我的初始品牌属性“ Clear”没有被传达。 但是，有几次提到“目标”和“面向目标”。 因此，我将品牌属性更改为：

Developing brand attributes was a foundational step in the UI process. Those five words would become a guiding beacon of light in the UI choices I made. Essentially, the brand attributes were my MVP for UI.

开发品牌属性是UI流程中的基础步骤。 这五个词将成为我做出的UI选择的指导性灯塔。 本质上， 品牌属性是我的UI MVP。

样式图块和合意性测试 (Style Tile and Desirability Testing)

Based on the test results from my classmates about my mood board, I time-boxed myself for 20 minutes and created my style tile. Here is version 1:

根据同学关于我的情绪板的测试结果，我对自己进行了20分钟的时间装箱，并创建了我的样式图块。 这是版本1 ：

Taking the abstraction of the mood board and making decisions on colors, icons, buttons, and key imagery was an exciting part of the UI journey.

对情绪板进行抽象并在颜色，图标，按钮和关键图像上做出决定是UI旅程中令人兴奋的一部分。

I then time-boxed myself for 15 minutes to take a stab at creating a logo for First Things First:

然后，我将自己的时间装箱了15分钟，以刺痛为First Things First创建徽标 ：

After returning back to my classmates for a time-boxed 10-minute desirability testing session on my style tile/logo, I learned that:

回到我的同学那里，我在样式图块/徽标上进行了10分钟的有时间限制的合意性测试 ，之后我了解到：

1. The color palette was promoting neutral feelings, but the orange was exciting
   调色板促进了中性的感觉，但是橙色令人兴奋
2. The icons, like the lightning bolt and dashboard circle, felt energetic
   闪电图标和仪表盘圆圈等图标充满活力

For version 2 of my style tile, I added a few more images to capture the “goal-oriented” feeling that users were describing. I also selected the typeface, Muli (regular), and added design elements such as message conversation bubbles, arrows, and pop-ups.

对于我的样式图块的第2版 ，我添加了一些其他图像来捕捉用户所描述的“面向目标”的感觉。 我还选择了字体Muli(常规)，并添加了设计元素，例如消息对话气泡，箭头和弹出窗口。

原子设计清单 (Atomic Design Inventory)

Zooming in to the molecular level, I then built an atomic design inventory. Juno Jo gave a fascinating talk to my class about atomic design and the importance of component-based development for both organizational purposes and long-term efficiency.

放大到分子水平 ，然后建立了原子设计 清单 。 Juno Jo在我的课堂上就原子设计以及基于组件的开发对于组织目的和长期效率的重要性进行了精彩的演讲。

Although not nearly as impressive as his systems (check out Juno’s YouTube channel for some great tutorials), here is my time-boxed attempt:

尽管不如他的系统令人印象深刻(请查看Juno的YouTube 精彩教程的频道)，这是我的限时尝试：

The beauty of an atomic design system is that you can build your app or website like Lego bricks.

原子设计系统的优点在于您可以构建 您的应用程序或网站， 如乐高积木 。

For instance, your first “lego brick” might be a checkmark (atom). Then that checkmark could be placed onto a button (molecule). Then, that button could be added to a UI card (organism). That UI card could then be added to a page full of UI cards (template). And with multiple templates, you build pages.

例如，您的第一个“乐高积木”可能是复选标记( atom )。 然后可以将该复选标记放在按钮( 分子 )上。 然后，可以将该按钮添加到UI卡( 有机体 )中。 然后可以将该UI卡添加到充满UI卡( 模板 )的页面中。 并使用多个模板构建页面 。

高保真原型 (Hi-Fi Prototype)

With my atomic design inventory in place, I was ready to begin on my hi-fi prototype.

有了原子设计清单，我就可以开始制作高保真原型了。

As a reminder, here are the three main pain-points (based in user-data) that I was solving for:

提醒一下，这是我要解决的三个主要痛点(基于用户数据)：

1. Going to bed too late the night before

1.前一天晚上睡得太晚

2. Snoozing the wake-up alarm

2.暂停唤醒闹钟

3. Waking up groggy and tired

3.醒来时昏昏欲睡

In addition, the three main business constraints from the National Wellness Institute were:

此外，国家健康研究所的三个主要业务限制因素是：

1. Users need to be able to set up their profile to include important information relevant to their goals

   用户需要能够设置其个人资料以包含与他们的目标相关的重要信息

2. Users need to be able to set goals and track their progress

   用户需要能够设定目标并跟踪他们的进度

3. Users need to be able to share their stats with their wellness coaches

   用户需要能够与健康教练共享其统计信息

With that in mind, I designed two tasks for my users:

考虑到这一点，我为用户设计了两个任务：

1. Evening Task: schedule your morning workout, review a welcome message from your coach, and connect with Max, your accountability partner

   晚上的任务：安排早上的锻炼时间，查看教练的欢迎信息，并与您的责任合作伙伴Max保持联系

2. Morning Task: disarm your wake up alarm, confirm you’re awake and on track with your accountability buddy, and begin your chosen activity (in this case, workout)

   早上的任务：解除唤醒警报的警报，确认您已经醒来并与责任追随者保持同步，然后开始选择的活动(在这种情况下，是锻炼)

Here is a macro view of all the hi-fi screens:

这是所有高保真屏幕的宏视图：

Click here to see the prototype in action!

单击 此处 查看实际的原型！

成功与失败指标 (Success & Failure Metrics)

I’ll know that First Things First is successful if I see 5-star ratings in the app store, newly registered users, and increased time spent in-app by current users.

如果我在应用商店， 新注册的用户以及当前用户在应用内花费的时间增加的情况下看到5星级评分 ，我就会知道“第一件事优先”是成功的 。

I’ll know that the app is failing if I see 3-star ratings (and below) in the app store, churn rates, and poor relationships between user and coach.

如果我在应用商店中看到三星级 (及以下)， 客户流失率以及用户与教练之间的不良关系 ，就会知道该应用失败了 。

重点学习 (Key Learnings)

1. Sometimes you need to build two user flows (AM / PM)
   有时您需要建立两个用户流(上午/下午)
2. The lo-Fi sketch mock-up is the perfect tweener step between the user flow and the lo-fi prototype
   lo-Fi草图模型是用户流程和lo-fi原型之间完美的过渡步骤
3. Usability and desirability testing is essential. With more time, I would have also have loved to test my hi-fi prototypes!
   可用性和合意性测试至关重要。 随着时间的流逝，我也很想测试我的高保真音响原型！

外卖 (Takeaways)

1. Layer names and components are your friends — don’t leave your friends behind! As I dove deeper into the UI process, I found it challenging to remember to label my layers. I recognize the importance of this step, especially as prototypes get more complex, so I know this will be a growth area for me.

   图层名称和组件是您的朋友-不要将您的朋友抛在后面！ 随着我对UI流程的深入研究，我发现记住标记自己的图层具有挑战性。 我认识到这一步骤的重要性，特别是随着原型变得越来越复杂，因此我知道这将是我的增长领域。

2. Patience. As I am still in the early stages of UI learning, I found myself getting frustrated when what I was clicking wasn’t performing the way I imagined it to perform. At those moments, I recognized I needed to step away from my screen and go for a surf or yoga class to reset.

   忍耐 。 由于我仍处于UI学习的早期阶段，当我单击的内容未按我想象的那样执行时，我感到沮丧。 在那一刻，我意识到我需要离开屏幕，去冲浪或瑜伽课以进行重置。

3. Prototype, test, prototype, test. Each project has repeatedly shown the value of bringing in the user early and often. User intel is data, and data drives ultimate value!

   原型，测试，原型，测试。 每个项目都反复展示了尽早吸引用户的价值。 用户信息就是数据，数据驱动最终价值！

下一步 (Next Steps)

1. Video chat check-ins with your motivation coach and accountability buddies
   与您的动力教练和责任伙伴进行视频聊天签到
2. Sync with your calendar
   与您的日历同步
3. Voice assistant selector (positive, negative, goofy, sarcastic, etc.)!
   语音助手选择器(正，负，高飞，讽刺等)！

谢谢 (Thank You)

If you made it to the end of this case study, thank you for your genuine interest. The last six weeks have felt like drinking from a UX/UI firehose, and I’m incredibly grateful to my instructor, davidfast, and my TA, Kathryn McClure, for sharing their time, wisdom, and passion with me.

如果您已完成本案例研究的结尾，则感谢您的真正兴趣。 过去的六个星期感觉就像在UX / UI 消防水上喝酒 ，我非常感谢我的教练davidfast和我的助教Kathryn McClure与我分享他们的时间，智慧和激情。

There is still much much more to learn, so I’m excited for what’s to come! If you have any suggestions, tips, critiques, jokes, or puns, all are welcome in the comments below. You can find me on LinkedIn here. Thanks for tuning in!

还有很多东西要学习，所以我为即将发生的事情感到兴奋！ 如果您有任何建议，技巧，批评，笑话或双关语，则欢迎在下面的评论中使用。 你可以找到我在LinkedIn 在这里 。 感谢收看！