如何建立设计系统来授权营销团队

为营销团队建立设计系统可以让他们更快地建立自己的页面,而不会破坏一切。

没有发现。

设计系统通常被认为是设计人员和开发人员之间的桥梁。但这种说法存在一个问题:为什么把营销人员排除在外?你的网站是你最好的营销工具。只有营销人员直接参与建设才有意义,对吗?这就是为什么我们需要在构建设计系统时考虑到营销团队。

但是营销团队如何使用设计系统呢?这对公司的投资回报意味着什么?如果市场营销人员不能设计或编码,他们怎么能以一种有助于网站开发的方式传达他们的战略和愿景?

我们会花时间来回答所有这些问题。但首先,让我们分解一下设计系统到底是什么。

什么是设计系统?

produck设计系统
Produck的设计系统 设定品牌应该如何在所有媒介中体现自己的准则。

关于设计系统是什么,有很多混淆的信息。为了确保我们在同一页上,这里是我们的定义:设计系统是唯一的真理,包含帮助团队设计、概念化和开发产品和营销网站的元素,为用户提供满意和一致的体验。欧宝体育在线首页

这些元素包括(但不限于):

  • 品牌指导方针
  • 设计原则
  • 排版
  • 颜色
  • 布局
  • 可重用组件
  • Webflow实施细则
  • 设计实施细则

这些元素有助于团队将产品或网站整合到一个解决方案中,以取悦和帮助他们欧宝体育在线首页的目标受众。

总之,一个设计系统要做的事情如下:

  • 为设计人员、开发人员和营销人员提供一种共享语言。
  • 允许设计人员、开发人员和营销人员在运行中重用图像、按钮、代码和样式。
  • 鼓励产品和网站建设的模块化方法欧宝体育在线首页

我们并不是第一个做这种类比的人,但理解设计系统如何工作的一个好方法是将它们与乐高积木进行比较。就像乐高积木一样,设计系统为您提供了构建更大整体的组件,每个人都能直观地理解它们是如何组合在一起的。

设计系统能为营销团队做什么?

给营销团队一个平台,让他们把想法转化成视觉形式,他们就更有可能完成kpi。这只能帮助你的网站粉碎它的营销和领先的目标。

毕竟,营销人员在识别客户需求和实施满足这些需求的品牌故事方面发挥着巨大的作用。营销人员会从人口统计学和人物角色的角度来思考问题,而这些知识在打造消费者喜爱的数字产品时将会派上用场。欧宝体育在线首页他们可以指出你的网站是否与你的用户产生了共鸣,是否在执行公司的品牌目标。

虽然营销人员主要处理kpi、品牌信息和营销触点,但这并不意味着他们没有视觉思维的能力。营销人员(或者他们中的一些人)可能在UI和UX设计方面知识有限,但如果他们掌握了一个好的设计系统,他们就可以像专业设计师一样很快地建立网站。

投资于设计系统的案例

毫无疑问:一个设计系统,如果执行得好,将大大提高你的投资回报,特别是当把它交到多个营销团队手中时(这在企业中是可能的)。ob体育app苹果版

这个问题?衡量设计系统对组织的影响并不容易。再加上设计系统需要大量投资的事实,很容易就能看出为什么一些高管和关键利益相关者在迈出这一大步时犹豫不决。

为了获得认可,你需要加倍努力。不要止步于展示一个设计系统如何使每个人的生活变得更容易——你需要展示它在各个层面上使你的组织受益的许多方式。做到这一点的一个好方法是让每个人都参与到一个全面的发现过程中。通过大量相关数据的推断,你可以得出惊人的结果。

如果你做得很好,提高生产力、效率和质量对收入的综合影响将会很明显,为你赢得前进所需要的支持。欧宝体育在线首页如果你想知道数学是如何计算这个分数的,可以看看Bryn R的精彩文章《一件设计值多少钱?

设计系统对营销团队的好处

让我们深入研究一下设计系统是如何让营销团队受益的。

1.改进的协作

营销人员关心的是品牌信息,kpi和营销策略,但给他们提供工具,以视觉形式呈现他们的想法可能是有用的。有了一个设计系统,营销团队可以创建更详细、更专注于转换的网页,消除了很多不必要的反复,这往往会浪费每个人的时间。

通过实现一个设计系统,让你的营销团队轻松地创建简单的网站,设计师和开发人员可以专注于创建客户和新的组件,这将比重复的工作增加更多的价值。

2.一致且更好的用户体验

给营销人员一个平台,让他们在服务于公司核心目标的视觉上交流他们的想法,这不仅改善了合作,还带来了更好的用户体验。

当你有一个集中的系统,包含预先批准的组件和资产,市场营销人员可以在不影响视觉一致性的情况下创建网页和用户界面,从而产生创造更好体验的解决方案。

3.提高效率,减少开支

设计系统包含可重用的资产和组件,市场营销人员、设计师和开发人员可以使用它们动态地创建网页。没有人需要从头开始创造任何东西,因为他们需要的一切都在设计系统中。

很方便的,对吧?这意味着不会在重复的资产上浪费更多的资源。因为所有的东西都整合在系统中,公司不太可能招致“设计债”,允许每个人更有效地完成各自的任务。

当然,执行和维护一个设计系统需要资源,但当你有一个单一的真相来源,从而创造全面的效率时,正面远远超过负面。

即使你的内部团队缺乏建立网站的诀窍(或者太忙了没有时间学习),你也可以从以下机构获得帮助Refokus

4.不依赖任何人创造自己的能力

你可能有最好的产品,但如果你不能在你的竞争对欧宝体育在线首页手之前推出你的产品,你几乎每次都会被打败。记住,在当今快节奏、竞争激烈的环境中,如果你不快速行动,你就会失去机会、客户和市场份额。

意义呢?如果一个类似的产品已经在市场上获得了吸引力,你的营销团队不能等待你的设计团队的介入。欧宝体育在线首页当营销人员可以自己设计登陆页面时,为什么还要等待呢?

有了一个合适的设计系统,你的营销团队就可以利用当前的趋势,在不等待设计团队的情况下,通过发起营销活动来领先于其他团队。

为什么你的设计团队应该使用Webflow

了解设计团队如何利用Webflow简化他们的工作流程,并构建更好的体验。

订阅成为一个Webflow内幕
谢谢你!你已经订阅了!
哦!订阅的时候出了点问题。
合作更容易

Refokus是如何为营销团队创造设计系统的

Refokus主页的图片。

在Refokus,我们使用一种可靠的方法来创建设计系统,其核心是增强营销团队的能力。我们采用了这个过程,以确保我们正在构建的是有效的,可持续的,与我们客户的需求相关的。我们还旨在建立一个设计系统,营销团队可以轻松使用。

我们将我们的过程分为五个阶段:发现、策略、设计、Webflow和研讨会。

1.发现

我们一开始就尽可能多地了解客户的业务。他们的商业目标是什么?他们的目标受众的需求是什么?他们目前的策略是什么?

除了与客户的营销团队进行访谈外,我们还会回顾客户当前的网站,看看有哪些地方可以改进,并找出可能影响业务结果的潜在问题和差距。

2.策略

在我们收集和审查了所有必要的信息之后,我们进入了战略阶段。在这里,我们将创建可视化资产和文档,这将帮助每个人理解将要构建什么以及如何构建。这些包括:

Moodboard

一个设计系统项目提供了一个很好的机会来改进客户的设计,并把它带到下一个水平。但要以一种保持品牌一致性的方式做到这一点,我们需要创建一个基线来定义品牌的视觉语言。

我们为此创建了一个模拟板。通过在探索过程中收集客户的所有信息,我们可以创建一个情绪板,准确地代表和传达客户的品牌个性。

为了想出最好的视觉创意,我们要求客户的团队(或多个团队)加入我们的头脑风暴会议。然后,我们从会议中挑选出最好的想法,并以一种易于浏览和理解的方式对它们进行分类。

线框图

然后我们创建线框并与客户端共享它们。线框图基本上就是设计系统的草图。这个阶段很重要,因为它设定了客户的期望,并帮助双方就如何前进建立共识。通过向客户展示线框图并寻求反馈,我们可以在投资设计和开发之前实现必要的布局和结构更改。

接下来,我们与客户合作,将设计系统的布局和结构概念化,并进行必要的更改。

Webflow实施细则

一旦我们对设计系统的整体结构达成一致,我们就可以定义如何在Webflow中构建一切。我们通过定义类名称、组织原子和组件以及设置模板和示例来实现这一点。我们还提供了完整的文档,以使每个人都一致商定一切将如何实现。

3.设计

现在进入设计阶段!在这里,我们定义了设计系统的外观和感觉,创建了组件的用户界面,并对每个细节进行了最后的润色。为此,我们在Figma中创建了一个风格指南,并与我们的客户团队共享,以促进合作。

有了样式指南,我们就可以在进入Webflow之前在Figma中不断发展和改进设计系统。到目前为止,我们不仅有了可重用的组件来在Figma中构建新的网站,而且我们也有了在未来创建新组件的方法。

用户界面设计

我们为所有页面和组件创建视觉设计,添加定义图标、插图和动画图形,为用户提供良好的整体体验。

切换的发展

到这个时候,所有的技术规范都清楚了,详细设计也完全通过了,所有悬而未决的问题都已经解决了。一旦满足了这些条件,开发团队就可以开始Webflow实现了。

4.Webflow

我们相信在坚实的基础上构建高质量的产品,这就是为什么我们非常关欧宝体育在线首页心标准和过程。这就是为什么我们拥抱最新的技术,并不断改进我们的技术堆栈。虽然我们总是开放尝试最新的闪亮的工具,Webflow一直是我们的唯一不变的技术堆栈从2013年开始!事实上,在过去的7年里,我们做的每个营销网站都是用Webflow建立的。

Webflow是构建设计系统的完美工具最近发布的内容覆盖符号,我们可以创建设计系统,帮助营销团队更快地建立,而不损害或稀释他们的品牌的视觉识别或核心价值。

Webflow符号

以前,我们可以跨页面重用符号,但它们必须具有完全相同的内容。现在我们可以添加符号,为每个内容节点(文本、富文本、图像、链接)创建可绑定字段,并在每个实例上添加内容重写。这意味着我们可以创建一个带有标题、图像和文本块的卡片组件,并在具有不同文本和媒体的页面上重用它。

由于这个杰出的改进,我们现在可以使用Webflow将每个设计好的组件实现为可重用的符号。这让营销团队的生活变得更加轻松。他们需要做的就是创建网站和更新内容,把我们创建的可重复使用的符号拖放到画布上,然后编辑内容。太容易了!

Haufe说道教练在我们使用Webflow的新符号建立的新网站上,为关键的领导者和专家提供了快速方便的顶级商业教练。下面是一个实际的例子:

我们建立设计系统,以帮助营销团队更快地建立网站,以及帮助他们在他们创建的网页上执行他们的营销想法。为了实现这一点,我们确保我们创建的符号具有以下两个关键特征:

灵活性:我们创建用于不同用例的符号。通过这种方式,设计系统被剥离到其基本组件,使团队更容易浏览它们。

标准化:设计系统的一个关键好处是,它允许团队使用相同的原子和组件进行构建。通过标准化字体、颜色、按钮和图标的使用,您的内部团队可以使用相同的语言,消除决策和过程中的猜测和歧义。这当然会提高生产力、效率和工作满意度。欧宝体育在线首页

模板

拥有一个设计系统是很好的,但是那些没有设计背景的人在面对空白页面的时候会感到困惑。为了给它们一个良好的起点,我们回顾了最常用的组件和组合,然后根据它们创建一组模板页面。一旦这些模板在设计系统中建立起来,营销团队就可以更快更轻松地创建简单的登录页面。

SEO和页面速度

通过预先定义符号,我们允许自己有更多的空间来优化和完善它们的性能。但我们也这样做的方式,适合SEO最佳实践。毕竟,我们想让我们的客户能够轻松地建立在搜索引擎结果中排名靠前的网页。

5.研讨会

一个健壮的设计系统可以提高你的ROI,但这并不足以扭转客户的组织。我们不会简单地交出一个设计系统,让客户在没有适当的培训和指导的情况下运行它。

这就是我们举办Webflow研讨会的原因。除了教导客户如何使用他们的定制设计系统,我们还帮助他们重新建立他们的设计理念,这样每个人都可以相应地调整他们的流程。这些研讨会有助于营销团队充分利用Webflow的组件库。此外,这些会议为他们提供了所需的知识,以最大限度地利用数字解决方案提供的无限可能性,如Webflow和Refokus。

接下来是什么?

为了真正赋予你的营销团队力量,让他们创造东西。不要让他们一直在白板上画画。因为相信我,如果你给他们一个量身定做的设计系统,并为他们提供培训,帮助他们实现利益最大化,他们将完成伟大的事情。这只会帮助提升你的品牌和实现你的ROI目标。

发表

2020年5月21日

类别

设计过程

加入谈话

Webflow是什么?

免费试用
关于设计师的更多信息

设计师

可视化画布中CSS、HTML和JavaScript的强大功能。

的相互作用

可视化地建立网站交互和动画。

更多的互动

CMS

定义自己的内容结构,并使用真实数据进行设计。

关于CMS的更多信息

电子商务

再见模板和代码——可视化地设计你的商店。

更多关于电子商务

编辑器

在页面上编辑和更新站点内容。

更多关于编辑

举办

设置闪电般的管理托管在短短几次点击。

更多关于举办
Baidu
map