跳过导航
Sketch 内部

幕后花絮:我们如何在你的工作区中构建 Discover —— 一个知识中心

深入了解 Sketch 最具协作性的项目之一是如何诞生的

今年早些时候,我们推出了 Discover,它精选了文章、资源和灵感,以及最新的 Sketch 更新,都在你的工作区内。从分享有用的插件到突出我们钦佩的设计师的成功案例,Discover 为每个人都准备了东西。

对于我们的入职团队,这个项目背后的驱动引擎,Discover 的目的是创建一个人们可以找到所需一切,从而在 Sketch 中做出最佳作品的地方。但他们是如何做到的呢?

让我们深入了解一下!

互相帮助,创造我们的最佳作品

我们始终努力制作 产品指南 以及 设计教程,以帮助你更好、更快地进行设计。虽然你始终可以在我们的网站上找到这些内容,但我们希望让你比以往任何时候都更容易找到它们。所以我们把它们放在了魔法发生的地方 —— Sketch 本身。

“我们真的想为首次尝试 Sketch 的人提供足够的见解。但同时,我们也不希望他们受到过度的指导。我们重视自我发现的节奏,并且知道并非所有信息都与每个人相关,所以我们决定构建一个反映这一点的产品,”团队入职的产品经理 Laura Palombi 说道。

这就是 Discover 诞生的原因:渴望创造一个你可以随时回来寻求指导和灵感的空间。

确定 MVP

虽然 Discover 作为一项功能感觉是自然的下一步,但我们必须尝试它的功能。我们有很多有用的想法和资源可以与你分享,所以我们的首要任务是找到一种方法来缩小这些元素的范围。

我们希望创造一些对你有意义且相关的东西,所以我们花了很多心思考虑我们将提供的内容类型、部分和过滤选项。挑战在于在哪些元素是必须的,哪些元素可以基于你的偏好之间取得平衡。

正如团队入职的前端开发人员 João Guiomar 所看到的那样,“从实现的角度来看,我们需要以有影响力的方式展示各种组件。这是一个有趣的挑战,从创建带有视频动画的大型 Hero 组件到添加复杂的网格系统,以便内容紧密地结合在一起。我们可以全力以赴,因为 Discover 始终意味着要成为一个有影响力的页面”。

这是一个快速浏览 最终产品 的方式。

微调体验

没有两个 Sketch 用户是相同的。这就是为什么我们希望让你有机会个性化 Discover,以便你始终看到对你最有用的内容。正如我们所提到的,Discover 的主要目标之一是以尽可能最好的方式分享相关内容。实现这一目标的一种方法是创建一个模态窗口,你可以在其中选择不同级别的 Sketch 熟悉度。

“我们喜欢这个想法……直到我们意识到它有太多的交互,太多的决策点 —— 以及太多的 UX 文案!”产品设计师 Ramsés Cabello 分享道。“随着我们进一步迭代,我们大幅简化了交互,并将重点从技能水平转移到使用户的决策更容易、更轻松的选择上”。

起初,我们根据人们的角色和他们对 Sketch 的熟悉程度为他们提供了自定义选项。但这太复杂了,所以我们开始简化设置。最终,我们认为每个部分中的一个简单切换是最好的,因为它不会迫使你评估你的技能 —— 你可以直接深入到你想要的内容中。

寻找 Discover 的核心

虽然我们对 Discover 有很多想法,但有一点很清楚:我们希望它易于迭代且易于个性化。创建内容存储库时最常见的陷阱之一是添加太多的选项和复杂性。我们希望 Discover 干净直观,以便获得所需资源不会以额外的学习曲线为代价。

“我们的主要优先事项是能够立即更换内容,而无需回到绘图板,”团队入职的另一位前端开发人员 Ruben Almeida 解释道。“为此,我们问自己诸如内容之间的共同字段是什么,我们如何使它对未来的内容具有灵活性,我们如何使其易于更新和添加新元素等等。然后我们从那里开始构建”。

解决方案?采用网格系统。这种类型的模块化设置意味着我们始终可以使用最佳内容来更新你的页面。它甚至在移动设备上看起来也很棒!我们还为常用功能创建了可重复使用的组件,例如标题、简介、图像等。现在,每当有人需要更新 Discover 时,他们所要做的就是替换具体内容。它在视觉上看起来都不同,因此你可以轻松地一目了然地看到差异。

“这个项目最大的成果之一是,即使对于第一个 MVP,我们也不需要实施内容管理器,”Laura 说道。“添加和修改内容非常容易,以至于 Sketch 中的任何人都可以在安全地进行。从这个意义上说,它确实增强了与该项目合作的每个人的能力,”Laura 说道。

填充网格

Discover 的核心是一个不断变化的页面,旨在反映 Sketch 和设计行业当前的兴趣和趋势。填充 Discover 的过程汇集了产品、技术和内容团队,他们都对我们应该展示的内容有想法。

“我们决心使 Discover 有用,而不仅仅是用对我们重要的项目来填充它。它们必须首先对重要,”Laura 说道。

一旦我们绘制了内容、层级以及人们可能喜欢的资源类型,实现过程就相当简单了。该团队还能够在设计方面获得一些乐趣,弄清楚哪些模块应该更加突出,以及如何使所有模块协同工作。

“整个技术团队都喜欢 Discover 作为一个整体所散发的光芒。它内容丰富,并具有多种不同的组件,使整体视觉体验非常愉快,”前端团队分享道。

An image showing different modules in Discover

Discover 的两个主要模块是“指南”和“洞察”。正如你所看到的,你可以使用上面的选项卡在初级或高级内容之间切换。

Discover 的下一步是什么

Discover 背后的概念不言而喻。你今天在工作区中看到的内容仅仅是个开始。随着我们在未来几周和几个月内创建更多内容,你可以期待看到 Discover 也会不断发展。而且因为它内置于你的工作区中,你不会错过任何东西。

“我们希望为人们提供一个空间来初步了解 Sketch 的机会,我们计划与人们一起发展这种对话。这是一条非常令人兴奋的道路,我们已经在设计下一步,”Laura 说道。

在哪里可以找到 Discover

你会在工作区的侧边栏中找到 Discover 选项卡。我们将定期更新 Discover,所以请经常回来查看新鲜内容!

与往常一样,我们构建所有产品都以你为中心,并感谢你在每一步中提供的反馈。请通过你喜欢的渠道(例如 TwitterInstagram)告诉我们你的想法和建议。

你可能也喜欢

Sketch 内部

Sketch 和 AI

一段时间以来,我们一直在思考 AI 对 Sketch 的意义。以下是我们如何使用它,我们永远不会如何使用它,以及指导我们思考的内容。

免费试用 Sketch

无论您是 Sketch 的新手,还是回来看看有什么新功能,我们都会在几分钟内让您设置好并准备好完成您的最佳作品。

免费开始
免费开始