导语：我们所接触的事物都由不同颗粒的更小物质组成，所有细节总和构成了所看的样子。作者运用斯坦福设计思维中常用的 UX 设计方法，通过对 Spotify 社交功能的设计分析，向我们展示了设计语境、衡量标准、理解用户在用户研究及优化迭代方面的重要意义。

文章从用户调研、设计策略、原型设计、可视化设计、可用性测试和品牌推广等方面阐述了项目流程，揭示了新功能从无到有的全过程，并运用大量的设计工具及研究方法，产出了细致精美的分析图表。

最后，作者抽丝剥茧，对自身收获和成长进行了复盘总结，强调了组件化对于设计成本和设计师的价值所在。

一个全新的 Spotify

一、一石二鸟

还记得自己在各个 APP 之间不断切换吗？

例如在多个社交媒体上分享歌曲或内容；同时打开多个应用查询信息；从未得到过偶像的回复，却依旧热衷于评论和打榜；通过社交软件寻找兴趣相同的音乐好友……所有这些除了加载等候，还需要冗长的操作流程，我们在互联网上投入如此多的精力，到底是为了什么呢？

试想，你可以在一款产品上完成这些事，不必多平台切换，会是怎样的体验？如果可以一边听音乐一边做这些所有的事情，不必来回切换，会是怎样的体验？如果为 Spotify 提供社交功能来提升产品体验，会是怎样的效果呢？

以下是我在 Purwadhika Startup & Coding School 设计课程中，为 Spotify 创建的社交功能的项目流程。希望通过提供多样化的音乐服务，满足全球大多数用户的需求。

1. 设计背景及目标

Spotify 作为流媒体音乐行业的领跑者之一，试图通过延伸社交能力来提升产品的参与度和留存率。

产品已经建立了一些核心功能，例如关注艺术家或朋友、宣传音乐活动等基本社交活动，但除此之外，Spotify 还有很多事情可以做。我们的任务是制定一个最佳方案，确保新功能可以无缝衔接到 APP 中。

2. 分工及时间规划

用户界面及体验设计师需要在精益用户体验框架（within a Lean UX framework）内，完成用户调研、设计策略、原型设计、可视化设计、可用性测试和品牌推广等工作，最后一个环节，预计在 4 周内完成。

3. 我的设计流程

设计思维流程图

二、理解用户

在这个阶段，我的目标是充分理解整个业务，并了解 Spotify 的用户群体，与目标群体产生共情，从而理解用户需求。为了实现这一目标，我先后进行了竞品分析、启发式评估、用户体验研究等作业。

1. 竞品分析

首先，我对二手资料进行了快速研究，花费几个小时来了解 Spotify 在流媒体音乐中的定位，并收集了足够的信息来帮助确定我的研究重点和范围，我收集了竞争对手的信息并分析了优劣势，以帮助 Spotify 通过新的社交功能实现差异化，从而找到了让 Spotify 的社交功能脱颖而出的机会。

竞品分析（2020）

2. 启发式评估

在进行了竞品分析后，我想通过执行启发式评估来熟悉 Spotify。

即使我对移动端 APP 非常熟悉，但我认为在设计新功能之前，首先要建立结构性认知。启发式评估是一个很有效的应用走查方法，可以用来评定 Spotify 的可用性，深入了解产品框架、结构和内容。

Spotify 应用程序走查分析（2020）

3. 用户体验研究

在熟悉产品结构之后，我进一步挖掘了 Spotify 的用户需求，这有助于为后续设计注入真实的声音，从而为用户提供最佳的解决方案。

1）研究方法

研究采用 定量 和 定性 两种方式。定量作为初步研究，采用在线方式，目的是获得用户行为及模式的量化数据。这些数据可以帮助我们识别 Spotify 用户群体存在的某种现象，以更具体的方式推动研究。

然而，仅依靠定量数据并不能揭示用户更深层次的见解，我们还需要借助定性研究，通过 1v1 的用户访谈，进一步挖掘用户行为的动因。

2）用户访谈

为了确保研究顺利进行，我创建了一个 开放式访谈指南，来验证设计是否达成初始目标。了解受访者听音乐、内容分享、社交互动的使用习惯，以及他们是如何收集信息的。

3）招募要求

为了获得更全面的用户信息，这次访谈需要涵盖 Spotify 中艺术家和非艺术家群体。同时，我借助了人口统计学的方法，收集了更多来自普通用户的声音。此外，还需要对比其他社交媒体，了解 Spotify 的用户在其他平台上的社交行为。

基于这些假设，招募的受访者需符合以下特征：

• 艺术家 2 名 / 播客 2 名 / 非艺术家用户 4 名
• 22 – 34 岁的用户
• 每天在 Spotify 上花费 2 小时以上的用户
• 每天在社交媒体上花费 2 小时以上的用户

4. 研究综述

根据用户访谈内容，我整理了一份文档，将陈述和观察到的信息组织在便签上，归类相似信息，再定义各自的主题，以便发现和确定用户需求。其中包含了一些重复的答案，描述了用户如何思考、感受、表达和倾听。

用户访谈整理

5. 用户洞察

• 随机调研 Spotify 用户创建的歌单，发现大家音乐喜好相似；
• 协作共享播放列表通常用作歌曲参考或纯分享；
• 分享歌曲或播客是一种自我意识的表达；
• 用户倾向于在 Spotify 上寻找志同道合的人进行交流和分享；
• 艺术家和粉丝之间的互动深入且有趣，尤其是现场问答环节。

6. 用户需求

• 用户需要一种有效的方式找到志趣相投的人；
• 艺术家需要一个和粉丝亲密互动的空间；
• 用户需要一个分享和接收信息的空间。

7. 创建人物画像

为了创建更准确的人物画像，我重新审视了访谈中有关用户看法、需求和痛点的内容 —— 这些代表了关键用户群体的核心需求。最后，从人物背景、特点、需求、痛点、常用功能等方面进行了人物刻画。

三、定义问题

1. 定义问题

人物画像建立后，我试着 将用户的见解和需求转化为明确的观点陈述（POV：Point of View Statements），尝试回答 “我们如何做”（HMW：How Might We Questions）。通过定义设计挑战和设计问题，为一系列创新方案铺平了道路。

2. 理解业务与用户目标

在寻找解决方案之前，需要确定业务目标和用户目标的优先级。通过对业务目标、用户目标和技术因素的拆解，将三个维度的重叠区域设定为项目目标。

3. 定义功能并确定优先级

基于业务目标和用户目标，以及头脑风暴提出的想法，确定了哪些构想可以进一步发展为社交功能。

Spotify 论坛希望为 用户提供一个随意且亲密的交流空间，以问答发帖的形式进行互动。在这里，允许用户寻找趣味相同的人，更深层次地连接艺术家和粉丝，通过激发他们的社交驱动力，从而提升产品的参与度和留存率。

4. 信息架构

之后，我搭建了 Spotify 的信息架构，展示了新功能与当前架构的融合方式。

四、绘制原型

1. 绘制流程图

新功能融入产品体系后，我开始 梳理产品的任务流，用来描述用户需要经过哪些步骤来完成关键任务。

接下来，我需要对任务流进行详细的说明，梳理出与新功能交互时可能存在的所有必要关键点。我通过两个场景假设（粉丝交流 & 成员问答）创建用户流程图，展示用户与新功能交互的两条路径。

2. 低保真原型图

在绘制了一系列低保真原型图后，我输出了第一个高保真原型图，可以用于第一次可用性测试。

社交信息流 / 询问卡片 / 收件箱 / 回答页

五、测试阶段

1. 可用性测试

该测试的目的是 对功能可用性、接口设计、信息流及信息架构进行评估。为了确保测试结果的稳定，我设置了适度和非适度两种测试场景，分两期进行，共 46 名参与者。

适度可用性测试 –主持人将直接与测试参与者合作，指导他们完成研究，如果参与者在完成任务时遇到任何挑战，主持人会帮助指导回答问题。适度可用性测试中研究人员可以远程或亲自进行。

非适度可用性测试 — 它 没有受到监控或指导，因此在研究期间除了参与者外，没有其他人在场。参与者按照自己的节奏、时间、地点完成任何任务并回答问题。

由于新冠疫情的大规模爆发，测试选择线上开展。

非适度可用性测试将在 Maze 网站进行；而适度可用性测试由管理者主持在线会议，向参与者提供一系列任务和问题，然后记录下他们的导航选择、测试完成率、评论、总体满意度、问题和反馈。

每个非适度可用性测试大约需要两天，适度可用性测试则需要花费参与者 1 个小时左右。

总的来说，通过可用性测试的会议可以验证某项功能的目的和意义，以便参与者可以很快理解并使用。根据会议中出现的几个关键问题，将成功、模式、评论、收获四个内容，划分为观察/反馈、用户洞察、建议三个维度。

2. 关键反馈

尽管测试存在许多问题，但也 收获了关键的正向信息。或许是因为任务流足够简捷，用户能够快速获得信息，几乎所有的参与者都认为产品非常容易使用。

有趣的是，一些正面评价与负面评价出现了重叠，虽然看似可以达成某种平衡，但事实并非如此。这些现象恰恰 指出了该功能的作用需要更加明确，尽管其概念已经存在，但仍然需要被更好的执行。

六、重新绘制

1. 迭代改变了什么？

根据第一次测试结果，我做了重要的优化设计，并再次邀请 5 名受访者参与测试。受访者都认为与先前版本有很大不同，并表示这是一个正向的变化：功能更加清晰；整体的隐私性提升；任务流程也更加顺畅。

1）社交信息流

• 修改前：信息层级不清晰；视觉压抑；艺术家个人论坛层级较深且不明确；
• 修改后：功能融合算法推荐；提供清晰导航介绍；突出论坛入口，更容易找到志趣相投的人；弱化交流空间；提供更多的交流机会；轻松访问个人主页；简化论坛的验证流程。

社交动态的迭代

2）询问卡

• 修改前：询问流程不清晰；用户对向谁询问以及选择的原因感到困惑；按钮功能不清晰；
• 修改后：用户清楚向谁提问；更好的对比问询对象；按钮的功能指向性更明确。

重复询问卡片

3）收件箱

• 修改前 — 与社交信息流布局太相似；不支持内容筛选。
• 修改后 –布局优化；更新入口和信息层级；支持关键词搜索以及问题排序。

收件箱页面的迭代

2. 品牌识别

遵循 Spotify 品牌设计原则，在现有色板、字体、图形的基础上，我创建了视觉规范文档（这也是设计灵感收集的方式），其中包含 Spotify 论坛迭代后的设计元素。基于项目背景和用户调研，我首先定义了品牌调性。

3. 更新低保真原型图

在考虑了一些建议后，我将优先级更高的问题分离出来，重新绘制了低保真原型图，并用相关软件渲染出高保真原型图。其中社交页、收件箱、询问卡、答疑流程是优化的重点。

七、总结

1. 语境限制

在 Spotify 项目中，我成长了很多，最重要的是培养了自信心：相信这是一个合适的解决方案。根据项目的设计语境，优先考虑哪些是必要的，哪些是多余的，并以此设定目标。这些都促使我不断评估自己的期望，努力去创造一个允许所有因素存在的体验，并且坚信它是 “值得的”。

另外，设定一个预期成果，有助于我们审视设计过程以及有计划的规划时间节点，使自己变得更加灵活且具备项目管理意识。所以，我始终坚信，实际项目的限定语境，能够帮助我们根据实际情况明确关键的设计要点。

2. 明确衡量标准

另一个收获是，定义清晰的衡量标准。这有助于更好地分析研究结果，找到最佳的前进方向。无论是共情分析，还是可用性测试，指标都是推动优化的关键，同时有助于我们关注更重要的东西。

3. 多维视角（共情力）

通常在穿越马路前，我们需要看下路的每一边，这一点也适用于设计流程。在设计一款产品时，会有多方参与共创，当然也会产生多种 “应该被满足” 的需求。

在 Spotify 项目中，我切实体会到了共情力在设计中的意义，设计师不仅要从用户的角度进行思考，理解业务同样是找到最佳方案的关键。

4. 冰山一角

设计过程高于设计内容。设计师的价值不仅在于图稿的输出，美学只是冰山一角，更重要是的思考、组织以及共情力，为产品找到最佳的战略方向和解决方案，这才是令人兴奋的时刻。

八、反思

1. “完美” 参数

研究过程中，我们需要提供准确的平均值，识别那些引起数据偏离的异常值，并设定一个较小的误差范围。为了做到这一点，我们需要更大的样本量，来假设那个更准确或更具代表性的结果。

这也是该项目中可以被优化的部分。尽管有时情况并非如此，大量的样本只会增加更多成本，并没有改善结果，但我相信，找到样本量与成本的平衡点，是共情设计的关键环节。

2. 所有细节的总和

人类由细胞构成，细胞则是由更小的事物组成，更小的事物中还存在更细微的成分。数字产品亦是这样，不同颗粒和层级构成了我们最终看到的东西。

通过本次 Spotify 的项目，让我认识到了组件的重要性，它们不仅决定了设计的一致性，还可以减少迭代成本，使设计过程变得简单、高效。这也是我成为优秀设计师的必备技能，希望在未来的工作中，能够将注意力放在更重要的部分。

作者作者：Faisal R Wargadinata

原文链接：https://uxplanet.org/unleashing-spotifys-social-capabilities-a-ui-ix-case-study-2ac44ed012cc

译者：张小玺；审核：徐曼鹭、张聿彤；编辑：徐小淇

本文由 @三分设 翻译发布于人人都是产品经理，未经许可，禁止转载

题图来自 Unsplash，基于 CC0 协议