概念落地:电影高概念理论与用户体验设计

已发表: 2022-03-10
快速总结↬最成功的大片是那些具有易于理解的概念,可以用一句话来传达的大片。 网页设计应该以同样的方式进行。 让我们看看如何。

史蒂文·斯皮尔伯格曾经说过一句名言:“如果一个人能在 25 个字或更少的时间内告诉我这个想法,那将是一部相当不错的电影。” 他指的是最好的大众吸引力“大片”电影能够用一个简短的句子简洁地陈述他们的概念或前提,例如大白鲨(“这是关于鲨鱼恐吓一个小镇”)和玩具总动员( “它是关于一些玩具在没有人注意的情况下变得栩栩如生”)。

如果网站也是如此呢? 以简单方式解释其“概念”的网站是否更容易吸引用户? 例如,如果我们看一下 Google 主页的超级简单布局,它给用户一个关于其概念的明确信息,就像Jaws电影海报一样:

谷歌主页
谷歌主页:“它是关于让你搜索东西。” (大预览)

意识到“高概念”的重要性,让我们——作为设计师——能够真正关注用户的最初印象。 在你开始设计之前花时间真正定义你想要的简单“高概念”可以真正帮助引导你走向正确的用户体验。

跳跃后更多! 继续往下看↓

高概念理论对 UX 设计意味着什么?

因此,让我们认真对待这一点,并从 UX 设计的角度来看待它。 理所当然地,如果你能以一种简单的方式解释你的网站的“概念”或目的,你就会降低新用户在尝试理解它时的认知负担,并且这样做,你会大大增加你的机会他们参与。

“高概念”理论和用户体验设计最佳实践之间的相似之处是显而易见的。 大片的观众更喜欢以简单的方式呈现的简单、易于关联的概念。 Web 用户通常更喜欢更简单、易于理解的 UI(用户界面)设计、干净的布局和没有杂乱的东西。

无论您的信息是什么,以简单的方式呈现它对于您网站用户体验的成功至关重要。 但是,消息本身呢? 了解您的信息是否足够“高概念”也可能对网站的成功至关重要。

网络世界中的“高概念”是什么概念?

当我们说“高概念”时,我们是什么意思? 对于电影来说,这很简单——这就是电影要讲的内容,可以很容易地将基本故事情节放在一句话中,例如侏罗纪公园是“关于恐龙复活的主题公园”。

然而,当我们在网站上看到“高概念”时,它实际上可以适用于任何事物:使命宣言、服务产品,甚至是新产品线。 这只是您想通过您的网站分享的主要信息。 如果我们应用“高概念”理论,它告诉我们,我们需要确保以简单明了的方式传达该信息。

如果你做对了会发生什么?

为什么“高概念”如此重要? 呈现“高概念”用户体验设计有什么好处? 我们在 UX 设计中经常犯的错误之一是专注于用户任务的细节,而忘记了初始意见的重要性。 换句话说,我们关注的是用户一旦选择与网站互动,他们将如何与网站互动,而错过了一切之前的决策过程。 考虑“高概念”使我们能够专注于这个初始阶段。

要考虑的基本前提是我们更好地参与我们理解的事情和我们觉得舒服的事情。 确保您的网站以简单的“高概念”方式呈现其信息将有助于初始用户参与。 最初的参与是随后所有好东西的关键前兆:销售、互动和更好的转化率。

多少概念是太多概念?

真正的诀窍是弄清楚您的用户在定位您的消息时可以轻松处理多少复杂性。 您最初需要专注于仅呈现高级信息,而不是预先用所有东西轰炸用户。 仅向用户提供他们最初与您的网站互动所需的理解水平,并推动他们更深入地了解您的旅程,并在您进行时披露更多细节。

Netflix 在这方面做得很好。 新用户在主页屏幕上看到的初始视图是其超高概念——“我们做视频内容”一旦用户参与了这个前提,他们就会被进一步带入提议——披露更多信息、价格、流程, 等等。

网飞
Netflix:“它可以让你在任何地方观看节目和电影。” (大预览)

何时登陆你的高概念?

当您决定如何布局网站时,另一个需要考虑的关键因素是您何时选择向您的用户介绍您的初始“高概念”。 记住用户从主页开始在您的网站中遵循一个简单的线性旅程是多么罕见的关键。 现实情况是,有机用户旅程有时会从搜索结果开始。 因此,与您网站的实际交互从与用户查询最相关的页面开始。 考虑到这一点,至关重要的是要考虑您网站的前提如何在您网站的关键入口页面上向用户显示,无论它们出现在整个层次结构中的任何位置。

在介绍您的网站信息时要考虑的另一个关键点是,在许多情况下,用户甚至会在到达您的网站之前就判断是否与您互动。 如果你第一次向用户展示你的概念是通过 Facebook 广告或电子邮件活动,那么实施就大不相同了。 然而,理论应该是相同的,即确保您以单句“高概念”风格的方式向潜在用户展示您的信息。

如何传达你的高概念

到目前为止,我们已经讨论了以“高概念”信息为目标如何提高参与度——但我们如何做到这一点? 首先,让我们关注显而易见的方法,例如您使用(或不使用)的措辞。

在您开始设计之前,请坐下来专注于您希望网站的前提是什么。 从那里,画出你的标语或标题来反映这个前提。 不过,请确保您依赖于内容层次结构,使用标题来定位概念,并且不要将对于深入理解的关键信息埋藏在正文中。

这是来自 Spotify 的一个很好的例子。 他们通过简单、整洁的图像和措辞组合实现了定位服务的“高概念”方式:

Spotify
Spotify:“它可以让你听很多音乐。” (大预览)

单句措辞

尽可能简洁是关键:你的信息越短,它就越易读。 真正的平衡行为在于决定在太少而无法提供足够理解和太多以使其易于阅读之间划清界限。

如果我们以 Google Drive 为例——它是一项相对复杂的服务,但它以一种非常基本的高概念方式呈现——最初是一个暗示安全性和简单性的一句话:

谷歌云端硬盘

然后网站的下一个级别只包含更多的服务概念,但仍然保持在 25 个单词以下的简单句子中(斯皮尔伯格会很高兴):

谷歌云端硬盘
Google Drive:“一个可以安全地在线存储文件的地方。” (大预览)

解说视频

它不仅仅停留在您的措辞上,因为您可以利用页面上的无数其他元素来实现您的概念。 解说视频被亚马逊用来向用户介绍Amazon Go的概念。 实际上,这是一项高度复杂的机器学习、计算机视觉识别和 AI(人工智能)技术试验,旨在重新构想购物体验。 由于它只是在网站上装帧,因此可以以“高概念”的方式进行解释。

亚马逊为用户提供了一个句子,而且至关重要的是,使整个标题部分成为关于该服务的简单解释视频。

Amazon Go:“现实生活中没有结账的商店。” (大预览)

意象

您使用的图像可用于快速简单地传达有关您的概念的强大信息,而无需使您的 UI 与其他元素复杂化。 救助儿童会使用图像来快速向用户展示他们工作的至关重要性,这可以说比他们用文字做得更好。

拯救孩子们……“他们是帮助孩子们的慈善机构。” (大预览)

字体和颜色

将网站的每个元素视为一种潜在机制,通过字体或颜色选择帮助您向用户传达您的目的,这一点至关重要。 例如,不必明确告诉用户您的网站是针对学者或儿童的,您可以制作您的 UI 来帮助展示这一点。

用户有现有的心智模型,你可以求助。 例如,鲜艳的色彩和童趣的字体表明该网站是针对儿童的,衬线字体和有限的颜色使用通常表明更严肃或学术的主题。 因此,在登陆您的网站概念时,请将这些视为与您的用户交流的重要盟友,而不必使您的信息复杂化。

乐高乐园:“一个适合孩子们的大型乐高主题公园。” (大预览)

设计可供性

到目前为止,我们主要专注于使用消息传递将概念传达给用户。 尽管如此,如果您的页面的主要目标只是让用户与特定元素进行交互怎么办? 例如,如果您提供某种工具? 如果是这样的话,那么展示这个工具本身的界面通常是向用户传达其目的的最佳方式。

这与“设计可供性”的概念有关——设计形式应该传达其目的的想法。 有理由认为,有时通过易于使用的界面向用户介绍您的简单工具的最佳方式是向他们展示该界面。

如果我们看看Airbnb,Airbnb概念的很大一部分是允许搜索和查看结果的在线工具; 他们通过显示该搜索的数据输入视图,在此登陆页面设计中使用了这一点。 向用户展示搜索是多么容易,同时向他们展示有关 Airbnb 概念的简单信息。

爱彼迎
Airbnb:“它可以让您租用人们的房屋进行旅行。” (大预览)

如何测试你已经登陆它

既然您已经设计了您的网站,并且您很高兴它几乎可以像 80 年代的大片一样宣传其概念 - 但是您如何验证这一点? 通过几轮深入的基于实验室的用户研究来检查事情会很可爱,但实际上,你很少有机会,你会发现自己依赖于更多的“游击”方法。

检查您的网站是否“高概念”的最简单和最有效的方法之一是“5 秒”或“一目了然”测试。 简单的测试包括向某人展示该站点 5 秒钟,然后将其隐藏起来。 然后,可以向用户询问有关他们可以回忆有关该站点的内容的问题。 这个想法是,在 5 秒内,他们只有机会查看立即显而易见的内容。

以下是一些问题示例,可让您了解您的网站概念的传达程度:

  • 你还记得你刚刚看到的网站的名称吗?
  • 你认为你刚才看到的页面的目的是什么?
  • 您刚刚看到的网站提供的内容很明显吗?
  • 你认为你会使用你刚刚看到的网站吗?

与相当数量的与您的目标用户相匹配的人使用此测试应该可以提供一些非常有价值的见解,以了解您的设计如何传达您的网站目的以及您是否确实设法实现了“高概念”。

付诸实践

让我们尝试在现实世界中实现所有这些知识? 在将其转化为实用方法方面,我尝试为每个项目遵循以下简单步骤:

  1. 追求高概念
    当您确定任何新网站(或页面或广告)的目的时,请尝试将其归结为一个单一、简单、总体的“高概念”。
  2. 写下来
    用 25 个字或更少的字数记录您希望该关键概念的内容。
  3. 返回
    在整个设计过程中不断地回顾这个概念。 从选择你的字体和颜色到制作你的标题内容——确保它都支持你写下的高概念。
  4. 测试它
    完成后,与许多用户一起对您的设计进行 5 秒测试,并将他们的初始想法与您最初的 High-Concept 进行比较。 如果它们相关,那么很好,如果不是,请返回第 3 步并重试。

在本文中,我们讨论了制作大片的简单规则,并将这种智慧应用到网页设计中。 没有“令人震惊的情节扭曲”——只是一些常识。 有人第一次接触您的网站时,重要的是要考虑您想要的初始信息是什么。 如果你想要大众市场的吸引力,那就把它制作成斯皮尔伯格自己会引以为豪的“高概念”信息!