×

文案设计 干货 手把手 学会 轻松

【UI设计干货】!手把手轻松学会UX文案设计

jnlyseo998998 jnlyseo998998 发表于2023-04-18 14:10:04 浏览17 评论0

抢沙发发表评论

前一阵子我接到了一个优化“课程列表”的需求,课程列表有“未解锁”和“已解锁”两个状态。

看需求文档时发现,解锁后的课程列表的提示文案似乎写得不太对。某节课在5月10日0点解锁,解锁后用户可以学习此课,但此时课程列表上的提示文案写着“建议在5月10日前完成听课”。当天解锁,建议在当天之前完成?我感觉文案写得不对,于是找到产品经理,有了下面一段对话:

展开全文

虽然只是优化短短的一句话,但想把正确信息快速传递给用户,还是需要花心思认真设计。

文案这个东西看似毫不起眼、无关紧要,但实际上是界面中重要的组成部分,可以发现国内外产品中,几乎每个界面都有文案的存在。

在日常工作中,不少同学觉得工作重心应该放在设计功能上,界面中的文案用户差不多能看懂就行了。但在国外,不少公司很早就发现,越是界面中毫不起眼的文案,越有可能影响产品体验和业务转化。为了能把文案设计好,发挥出文案的强大效果,不少国外公司设立了一个专门负责UX文案设计的岗位。

反观国内,文案设计还处在萌芽阶段,少有专人去负责,大家只是凭感觉去编写文案。多数人写文案时只是考虑“要让用户看得懂”这条基本原则,但这远远不够。

在这篇文章里,我总结了以往的经验,查阅了大量资料,给大家详细讲解界面中的UX文案到底如何设计。

1.1 到底什么是UX文案设计

谈到“UX文案设计”首先需要明确一下,本文所说的“文案”是指在产品界面中,用户与软件交互时看到的文案。这些文案大多与用户的操作和体验直接相关,因此被称为“UX文案”。简单的理解就是,除了商品名称、商品介绍、条款规则等等这些我们无法设计的固有文案,其他在界面中出现的文案都属于UX文案。

在国内产品中,常见的UX文案可以简单归类为以下几种:

1. 标题文案:弹窗标题、卡片标题等

2. 按钮文案:常规按钮、文章按钮等

3. 引导文案:新手引导、操作引导等

4. 反馈提示:系统提示、操作提示、状态提示等

5. 解释说明:辅助文案、说明文案等

6. 通知消息:app 消息推送、系统消息等

UX文案设计是通过优化文案的手段,来帮助用户解决问题,使产品更容易使用,或帮助业务达成他们的目标。

例如,当系统出现错误时,有的产品会像机器人一样发送下图一样的提示文案:

windows的“蓝屏”页面,一旦出现大家就十分头疼,上面的文案看起来就很难理解,不知道接下来该如何处理。

而有的产品在系统出错时就做得非常好。Dropbox在此类情况下,通过通俗的文案告诉用户发生了什么,以及提供可能的解决方案。“可能有帮助的链接”让用户感到十分贴心,缓解了沮丧的情绪。

1.2 UX文案设计起源于何处

“UX文案设计”看似有些陌生,但“文案设计”在某些行业却由来已久。比如在广告行业,就有专门的文案一职。是的,这个职位就叫“文案(Copywriter)”。“文案”是指为广告或其他形式的营销目的而编写文本的职业,以文字来表现已经制定的创意策略。

我们常见的品牌slogan(品牌标语、品牌口号)就是文案的工作内容之一。一个好的品牌slogan,只需几个字就能影响用户对于品牌的认知观念和消费决策,从而为品牌带来巨大的商业价值。

比如国外耐克公司的经典广告语“JUST DO IT”,传达了一种“不要想太多,做就行了”的品牌理念,不同年龄不同心境的人,对此都能得到共鸣,从而认可品牌、认可nike的产品。再如,国内知名凉茶品牌王老吉的广告语“怕上火喝王老吉”,精准地切中了产品的使用场景,同时又和其他饮料做出了差异化,潜移默化地影响消费者的购买行为。

当然好的品牌slogan不仅可以产生共鸣和做出差异化,甚至可以影响人们的观念认知。

在经典美剧《广告狂人》(Mad Men)中,主角唐·德雷柏给“喜”牌香烟写的广告文案令我印象深刻。剧中美国读者文摘上称吸烟有害健康,导致烟草公司的“喜”牌香烟销量惨淡,为此香烟负责人找到了德雷柏希望通过广告解决销量问题。德雷柏想出的广告语是“It's Toasted”(它是烘焙过的)。这句话妙在,暗示当时的美国人经常吃的面包是烘焙过的,饼干也是烘焙过的,为什么要害怕同样是天然植物(烟叶)烘焙过的香烟呢。这让烟草公司的人十分满意,最终采纳了这条slogan。

别看文案能在广告中这么厉害,在界面中它一样可以发挥巨大的效果。界面中的UX文案设计,最早可以追溯到2009年6月,Joshua Porter在其博客撰写的“Writing Microcopy(写微文案)”一文。这篇文章提到了优化界面的最快方法是优化文案,并讲了一个简单的案例。

在这篇文章中他介绍了一个电商网站项目。用户在这个网站购买商品流程中,需要填写一个结账表单。但5%~10%的交易,因用户填写的地址和信用卡的地址不一致,导致结账失败。因为这个问题,公司损失了大量收入。之后,他尝试在填写地址表单的最上方添加了一条提示语“请务必输入与您的信用卡关联的账单地址(下图蓝圈处)”,看看是否可以解决该问题。

一夜之间,问题完全消失了。不仅解决了用户问题,也带来了丰厚的收入。

从这之后,他开始注意产品之中一些细微之处的文案,并定义了一个全新的概念“Microcopy”,即微文案。微文案是简短的句子、短语或一个字,在用户使用产品过程中能为用户提供信息或引导,解决用户的特定问题或减少错误认知。优化这些文案,可以极大地提升用户体验。

Joshua Porter在十几年前,通过添加文案解决了问题,并且获得了成功。这给后来的人们提供了一种解决产品问题的新思路。

1.3 UX文案设计究竟有何价值

曾在 Dropbox、NIO 和 All Turtles 的设计团队任职,负责过UX文案编写的 Lisa Sanchez 说过下面一句话:

确实,在用户遇到问题时,并不是我们直接和用户进行沟通。不是站在用户身边说:“你这步操作不对,应该这么操作”。而是借助我们所设计产品,来告诉用户目前应该怎么做,是通过产品和用户进行沟通。

和真实世界中人与人之间的沟通一样,两个人要想达成沟通顺畅,首先要能理解对方话语中所表达的正确意思,明白对方在说什么,才能达成一致,实现我们或者对方的目标。就好比下周女朋友过生日,你问女朋友过生日想要什么礼物呢?她回了个“随便”。她的意思真的是随便吗?要是真随便买个东西,下周就等死吧。

其次,如果在沟通中,我们的话语能在表达清楚意思的前提下具有贴心、个性的感觉,便能让我们的人格更加立体而富有魅力,进而让对方产生好感,愿意和我们一直愉快交流。

可以发现,产品中的UX文案正是具备“沟通、对话”的功能。对UX文案进行设计,可以让我们的产品具备与用户沟通顺畅的能力,让用户更爱使用产品。

总的来说,UX文案设计主要有以下三大好处:

1. 提升用户体验

2. 帮助业务实现目标

3. 强化品牌调性,实现产品差异化

1.3.1 UX文案可以提升用户体验

1)帮助用户实现目标

UX文案可以通过准确精炼的表述,传达给用户正确的意思,让用户消除疑虑,明白当前发生了什么,自己应该怎么做。UX文案有时出现的时间稍长,有时很短可能只有几秒。所以文案简洁、传达正确的意思十分重要,这是用户高效做出判断、决策的基础条件。一旦文案产生歧义或表意不清,便会没法实现用户的目标,导致产品体验很糟糕。

例如,当弹窗出现时,用户从观看文案到做出选择判断的时间,可能只需要几秒钟。因此,我们需要在这几秒钟内,通过文案快速传达给用户当前发生了什么,引导用户应该如何操作。一个糟糕的文案,会影响用户的操作效率,带来不好的感受,甚至降低产品的信任度。

下图中展示了一个糟糕的弹窗文案。用户在取消对某人的关注时,弹出了这个二次确认弹窗。光看弹窗上的文案,用户不知道应该点击哪个按钮可以去取消关注,似乎点击“取消”按钮可以取消关注,好像点击确定也是可以取消关注。弹窗上的糟糕的按钮文案给用户带来了疑惑,甚至无法进行决策。

我们来看一下这个弹窗,弹窗按钮中使用的“取消”、“确定”文案,和弹窗标题的文案含义有一定重合。所以,文案的修改方案是应该将按钮的“操作”更明确地展示出来,同时给按钮增加操作引导。具体方案如下图。

只需改几个字,我们便能消除用户的疑惑。用户甚至只用看按钮文案,不用结合标题也能做出正确选择。所以即使只是优化按钮上这么简短的文案,也能帮助用户实现“取消关注”的目标。

2)减少用户负面情绪

用户在使用产品时可能会遇到一些特殊情况,如:状态异常、内容为空、操作错误、获取权限等等。这些情况都可能让用户产生负面情绪,此时UX文案可以通过合理的解释、巧妙的引导、个性化的表达来缓解负面情绪。

我们在初次使用产品时,经常会遇到获取相关权限的弹窗。像下图左侧的产品“激萌”,上来就要3种权限。用户就会很纳闷,你要这么多权限干嘛,进而导致很多权限不开启。但是获取权限是大部分互联网产品必须要做的事情,无论是让用户使用对应功能,还是达成业务目的。那么,怎么样做才能让用户不反感呢?

下图右侧的产品“画音”就做的就比较好。每一个权限的开启,它都在下方通过文案给用户阐述了充分的理由,这种方式相比“激萌”直接简单粗暴的要权限会好很多,用户也更容易能接受。

1.3.2 UX文案可以帮助业务实现目标

在产品中,有一部分UX文案与业务目标强相关,文案需要引导用户去做业务期望的行为,最终实现某项数据指标的提升,从而为公司带来收益。

Google曾经分享过一个预订酒店的案例,只需要优化两个词就能影响产品的转化率。

下图展示了Google预订酒店的一个页面,用户可以查询某个时间段是否有可预订的酒店。最早,页面上的标题使用的是“Book a room(预订房间)”。但他们发现用户看到这个词以为此时就要开始下单,而实际用户在此时是只去看看有没有可预订的房间,该时间段的酒店房间价格是多少。“Book a room”这个词用在这个阶段有点过于早,导致用户在做决策时产生了较大的心理压力。

之后,Google 将“Book a room(预订房间)”改成“Check availability(查看可用房间)”。通过这样一个简单的修改,对应功能点击率提升了17%,这给业务数据带来了巨大的提升。

1.3.3 UX文案可以强化品牌调性,并差异化产品

常见的品牌体现方式有logo、吉祥物、品牌色、品牌字体、品牌图形等等,这些大多都是基于视觉表现来塑造品牌,那文案能不能也具有品牌调性呢?其实是可以的。在文案中融入品牌,可以加强用户和品牌的情感联系,从而对品牌产生好感和喜爱。

谷歌旗下有款的产品叫 Android Pay ,在它的品牌原则里有一条是:有新鲜感的。UX writer 需要将“有新鲜感的”融入文案中,从而体现品牌调性。

如何让文案有新鲜感呢?可以看下面的例子。

当有人在谷歌搜索 Android Pay 时,最热门的结果会把他带到 Android Pay 的营销网站。页面的标题会写着“tap.pay.splash”(点击.支付.拍打着水游)、“tap.pay.tasty”(点击.支付.美味可口的)。通过 splash 和 tasty 这种词,强调使用 Android Pay 就能“享受游泳拍水的感觉”、“享受美味的感觉”。这种文案在当时十分新奇,具有一定的新鲜感。

1.4 如今文案设计发展如何

自从2009年 Joshua Porter 尝试设计产品中的文案之后,文案设计经过几十年的不断发展,越来越多的外国公司意识到,文案设计需要交给专人负责,才能发挥其最大价值。

据观察从2017年开始,像 Dropbox、Facebook、Airbnb、Pinterest、Google、Spotify、18F 和许多中小型科技公司都陆陆续续组建了内容策略或内容设计团队,并不断招人。大多数公司称呼这些团队中编写文案的职位为“ UX Writer ”。

在公司中,UX Writer 主要和交互设计、视觉设计一起工作,有时也和用户研究合作了解用户特征,有时和开发合作了解产品运行机制。

文案设计不仅在招聘市场具有旺盛的需求,而且现在国外很多教育机构开设了UX writer相关的学习课程,很多人想要通过学习进入这一领域。比较常见的教育机构有Careerfoundry、UX Writing Hub等。

这一切,都代表着文案设计越来越被国外公司所重视,这是能够给公司带来价值的能力。

不同于国外的繁荣,国内的文案设计领域由于发展较晚,只有极少量公司有相关岗位。这些公司大多是跨国公司,或者有海外业务的公司。但我认为这一领域在国内极具潜力,有待开发。

2.1 在公司中谁来写文案

不同于国外,国内只有极少部分公司有 UX Writer 一职专门负责文案编写,国内的UX文案设计其实处在一个比较尴尬的位置。不少公司中,无论是产品经理、交互设计师还是UI设计师,他们的工作职责里并没有明确指出需要设计文案,所以文案处在一个“三不管”的地带,谁写都行。而且在同一个产品中,不同功能模块可能由不同的项目组负责,不同组的文案风格可能又不一样,导致整个产品的文案质量不稳定、风格不统一。

通过观察,国外的UX Writer通常和交互设计、视觉设计一起工作,因为设计师是负责定义产品的最终样式,所以文案的最终样式也需要在这个环节确定。由于国内很少有UX Writer这样专门负责文案的因此,国内最应该负责文案设计的职位,其实就是设计师。他们了解业务和开发的基础知识,知道是什么原因导致了这个错误。同时也了解用户,经常从用户角度去思考问题和方案,也就更明白什么样的文案用户能看懂、能影响用户行为。

文案设计的工作流程,主要还是设计师先根据产品经理的需求文档里的各种功能、状态编写文案。设计图设计完成交付开发后,开发同学可能会发现可能会发现一些少见的极端情况,这时需要他们统一记录下来,之后反馈给设计师。在之后的测试阶段,测试同学也可能发现一些文案的特殊情况,这时也需要交给设计处理。设计师把收集来的各种文案相关问题,优化完成后,把确定的文案,最后再交给开发同学去实现。

这样一来,设计师通过和其他角色配合,基本上能解决产品中绝大多数的文案相关问题。

2.2 写前需考虑写作对象

我们写的文案不是给自己看的,而是给用户看的。所以我们所编写的内容,无论是字词的斟酌、句式的表述、语气的使用都要服务于我们的目标用户。要让用户能理解文案中的每个字、每个词,使用的表达方式也要符合用户习惯,不能产生陌生感。

常见的思考方向,可以分为以下几点:

1. 年龄

不同年龄段的人,对一些流行语、缩写、表情包的理解不太相同。比如这个表情 ,父母认为是微笑,而不是年轻人觉得不是。

2. 性别

注意某些词可能只有一种性别的人才懂。比如有相当一部分男生,完全分不清女生用的粉饼和气垫,觉得都是一种东西。

3. 地域

不同地域会有不同的方言、俚语。如果写到方言,考虑目标用户是否能理解。

4. 行业

常见的就是行话、黑话,互联网的“抓手”、“赋能”等等。以及一些学术用语、专业词汇。

5. 文化程度

低文化程度的人,对一些成语、英文、计量单位的英文缩写不太理解。比如“分钟”的缩写是“min”,如果直接在界面上写min,很可能低文化程度的人,完全不知道是什么意思。

2.3 写前需考虑用户场景

所谓场景,简单理解就是:“场”是指时间和空间,“景”是指情景和互动。即:一个用户在什么时间、什么空间,因为什么原因,做了什么事,做得怎么样。文案编写的内容,需要结合用户实际使用的场景。什么样的场景,用什么样的语气、字词。

常见的思考方向,可以分为以下几点:

1. 时间

不同时间的问候语:比如,早上说早上好,节日的一些“节日快乐”的祝福,当然清明节这种时间节点就不适合祝用户节日快乐。

特定时间的情感关怀:比如:夜间老师还在用办公软件,这时提醒用户“老师辛苦了,早点休息”。首次使用产品时使用热情语气。

2. 地点

判断内容用户是否理解:比如,在北方大部分用户都知道“暖气”是什么,而在南方不少用户可能从未见过暖气,甚至不知道长什么样。这时对南方用户可能需要详细解释暖气的基础概念。

3. 情景

常见的成功(恭喜语气)、失败(安慰)、错误(提供解决方案)、等待(缓解焦虑)

4. 行为

用户的行为偏好:比如开车时使用的产品,用户处于移动状态,没法给产品较多的注意力。各种提示文案不宜过长,会影响行驶安全。

3.1 文案设计基础原则

翻阅国外资料,不少UX文案设计理论、以及展示案例及话语描述是以英语为基础。不同的语言必然有其独特用词、语法、标点或其他特点。部分经验只适用于国外语言,不太能直接借鉴。

但我发现一些基础的设计原则却是可以通用的。像 Google UX writer 团队文案设计的指导原则是“清晰、简洁、有用”,部分原则同样适用于国内产品。

最终,参考国外设计原则并结合国内产品特性,总结了适合国内产品的UX文案基础原则:清晰、准确、简洁、统一。

3.1.1 清晰

清晰是指文案表达上要做到三点:通俗易懂、从用户角度表述、避免用户思考。

1. 通俗易懂

正如之前提到的需要考虑文案编写的对象,从年龄、性别、地域、行业、文化程度几个方向进行思考。充分了解用户特征,使用专业度适当、用户易理解文案。

比如,有一个招聘软件,主要用户低文化程度用户。他们在软件里,主要找驾驶员、配送员、保洁这一类工作。产品中工资的展示不宜用“4~8K”这样表示,用户的文化程度,不太知道“k”是代表“千”的意思。“k”来源于英文“千”的词根(kilo)。所以,应该直接使用“4000~8000元”这样表示,更易理解。

2. 文案从用户角度表述

文案的写作立足点是用户,要从用户角度思考他们想要听到什么样的文案,他们习惯用什么样的文案。而不是从开发者角度去表述文案。让文案侧重用户感受。

a. 让用户知道因为自己什么行为导致发生了什么,应该怎么做。

假设有人要登录你的产品,然后他们输入错了密码,用户此时会看到下图左侧的弹窗1。“失败”和“身份验证”表述的对象是系统,是系统的账户验证失败了。所以此时提示的问题是系统问题,而不是用户问题。

那么怎么改呢?我们首先需要把文案的表述对象改为用户,且和用户行为相关。把标题“失败”改为“登录失败”,“身份验证错误”改为“账户登录已失败”。

通过“登录”一词让文案的表述对象由系统变成用户,且和用户产生强联系。用户能清楚地知道,这个弹窗和自己之前的登录行为是相关的,不是平白无故系统就出错了。

这样改就结束了吗?其实并没有。文案虽然表述对象变为了用户,用户也知道当前状况和自己的登录操作有关,但还是不清楚哪里出错了。此时将“账户登录已失败”改为“你输入了一个错误的密码”就能解决这个问题。要明白,此时的文案已经符合了清晰的标准,但只满足这一个标准不一定是最优的方案,有时需要结合其他原则一同优化。

b. 让用户了解能用你的产品做什么、获得什么、知道什么,而不是你的产品能为用户做什么、提供什么。

在操作前引导告知用户操作的目的、重要性或好处,能让用户更愿意去做我们期望的行为。

3. 避免用户思考

比如,界面中有具体的日期文案时,可以尝试用“今天”代替今天的具体日期,用“昨天”代替昨天的具体日期,用“明天”代替明天的具体日期。本周内直接用“星期几/周几”,过去一周或未来一周,可以用“上/下周+星期几”代替具体日期。这样可以避免用户看到具体日期还要思考今天是几号,距今天有多远。

举例:

2022年4月15日:上周五

2022年4月18日:星期一/周一

2022年4月20日:今天

2022年4月21日:明天

2022年4月25日:下周一

3.1.2 准确

准确是指文案要传达准确含义且字词与文案格式要符合书写规范。

1. 文案传达准确含义

文案传达准确含义指文案意思要精准,不能有歧义,不能含糊不清。避免使用错别字、含糊的比喻,酌情考虑是否使用口语、夸大的用词、网络流行语等。

假设有一个B端商户使用产品,商户在采购货物时,系统给了下图左侧“亲,抢购太火爆啦,请稍后再试”这样提示。用户很难理解当前到底发生了什么,只知道目前采购不了。B端产品中不适合使用表意不明确的比喻或亲昵的口语。所以应该减少无意义的修饰,准确直白地表述当前状态,使用“网络暂时拥堵,请稍后再试”更合适。

再如,产品之中最常出现的弹窗,最常用的按钮文案有“确定”和“取消”两种。确实,这两种文案在不少场景下都不会出错,但某些弹窗如果直接使用与内容对应的操作文案,则能更准确地表达按钮的功能(如下图)。

2. 文案符合书写规范

书写规范主要包含字词和格式两大方面。本人参考了大厂文案规范以及《中华人民共和国国家标准·标点符号用法》,在下方列举了字词和格式的推荐用法,帮助大家写文案更准确。

a. 字词

版面有限只能展示部分内容。若想获得完整版《文案自查表》,可关注本公众号,并在文章底部添加个人微信,发送关注截图即可获得。

b. 格式

3.1.3 简洁

过长的文案会影响用户的阅读效率,如果用简洁精炼的文案也能传达给用户正确的意思,则无须添加过多的文案修饰。

常见缩短文案的方法有以下几种:

3.1.3 统一

1. 用词统一

功能名称、操作名称在产品中的任何位置都应保证统一。

2. 结构统一

相同功能的文案形式、句子的语法结构都应保证统一。

3.2 注意事项

3.2.1 不一定要同时满足所有的文案设计原则

其实,好的UX文案并不一定要同时满足文案设计的 4 个原则。你会发现这 4 个原则之间有的存在一定的冲突。当我们想把文案写“清晰”时,它可能变得很长。当我们想把文案写“简洁”时,文案变短了,但这时牺牲一定的“清晰”来实现的。

因此,我们要尝试在这些原则之间找到适当的平衡。从用户角度、业务角度去考虑当前应该更侧重哪个、哪几个原则,哪些原则不太重要。也就是,根据具体场景具体分析。

3.2.2 不要滥用UX文案

1. 不要欺骗用户

偏刺激用户的UX文案很好用,如“仅售 200 件”。但当用户发现卖完200件后,商品又重新上架,再次标明“仅售 200 件”,循环往复,用户会立马感到被欺骗。

2. 不要把用户当傻子

某商品文案写到“限售 4 万件”,然后用户通过长期使用发现,该商品由于价格偏贵,销量常常都不会超过100件。这种文案就完全起不到应有的效果,不如删掉。

不要手里有锤子,看什么都是钉子。

优化UX文案只是众多优化产品手段中的一种,虽然优秀的文案能帮助用户更快速理解信息,但不是所有问题都能通过优化UX文案来解决。

如果发现,通过优化UX文案还是不能完美地解决问题,或找不到合适的文案来表述,可能是界面本身的设计出了问题。可以尝试优化框架、优化视觉、优化交互等其他手段来解决。方法要灵活使用,不要被框住。

来源网络