配音剧本_网络的各个阶段:剧本如何传达更好的UX_weixinwww.shan-machinery.com让我们将焦点放在使用剧本技巧提升显微镜上。 (Let’s put the spotlight on elevating microcopy with playwriting techniques.)

“Anything you put in a play — any speech — has got to do one of two things: either define character or push the action of the play along.” — Edward Albee, Playwright

“您在剧本中所做的任何事情-任何讲话-都必须做以下两件事之一:定义角色或推动剧本的动作。” —剧作家爱德华·阿尔比

I first encountered Edward Albee’s words as a college freshman in my undergraduate Intro to Playwriting course. I was no stranger to creative writing, but that class was my first dive into writing for the stage. And now, as I make my first leap into UX as a new graduate, I realize Albee’s words still apply.

在我的大学戏剧写作入门课程中,我第一次遇到爱德华·阿尔比(Edward Albee)的话是一名大学新生。 我对创意写作并不陌生,但是那堂课是我第一次涉足舞台写作。 现在,当我作为一名新毕业生首次进入UX时,我意识到Albee的话仍然适用。

剧作家以行动来表达自己的话,UX作家也以行动来表达-改变的是他们的舞台。 (Playwrights pen words for action, and so do UX writers — what changes is their stage.)

Playwrights write a scripted narrative, and that narrative stays contained in specific snippets of time — performances. By following stage directions and director cues, actors trace actions across a constructed world, but the story wraps when the curtain falls. And when it lifts, they play it again.

剧作家写了一段脚本化的叙事,这种叙事停留在特定的时间片段中- 表演 。 通过遵循舞台指示和导演提示,演员可以在一个已构建的世界中跟踪动作,但是当幕布落下时,故事会自动结束。 当它升起时,他们会再次播放。

Now let’s view the theater as a staged interface. The UX writers (playwrights) provide the copy (syntax and stage directions) to move users (characters) through product actions (plot). Plays are conversational. Transactional. And these interacting motives drive a production until the curtain drops.

现在,让我们将剧院视为分阶段的界面。 UX编写器(编剧)提供副本(语法和阶段说明)以通过产品操作(情节)移动用户(角色)。 戏剧是对话式的。 交易性的。 这些相互作用的动机推动了生产,直到帷幕落下。

Playwrights tinker with syntax, prompts, and rich text to indicate how their characters should engage with their world, and each other. Italicized words in an argument beg more emphasis. Parenthesized adverbs clue actors to speak lines in the appropriate tone. Plays are scripted moments — but spoken lines only land with proper context.

剧作家使用语法,提示和富文本进行修改,以指示其角色应如何与自己的世界以及彼此互动。 争论中的斜体字更加突出。 带括号的副词会提示演员以适当的语调说话。 戏剧是刻板的时刻,但口语只有在适当的背景下才能着陆。

Sound familiar? Strip away the costumes and curtains. You’re looking at a model for effective UX.

听起来有点熟? 脱掉服装和窗帘。 您正在寻找有效UX的模型。

UX编写者也编写脚本时刻。 (UX writers script moments, too.)

Our words move users through a series of scenes to reach a definitive end. Our stage cues come as meaningful word choice, deliberate tone.

我们的话语将用户引导到一系列场景中,以达到最终目标。 我们的舞台提示来自有意义的单词选择,刻意的语调。

Then, for context, the design kicks in. Specific typography and visual cues nudge users in the right direction. As UX writers, we can’t script their thoughts, but we can work with our design and development teams to guide their story.

然后,从上下文出发,开始进行设计。特定的字体和视觉提示会向正确的方向推动用户。 作为UX编写者,我们无法编写他们的想法,但我们可以与我们的设计和开发团队合作来指导他们的故事。

With parallels between playwriting and UX sketched out, we can take a closer look at the Edward Albee quote I pulled before.

勾勒出剧本和UX之间的相似之处后,我们可以仔细看看我之前提到的Edward Albee报价。

Albee breaks successful language into two theatrical drives.


An effective playwright uses words to:


1. Define character.

1. 定义角色。

2. Push action.


When we look at a user’s engagement with a UI, the same framework holds, just with a slight shift of phrase.


When writing successful microcopy, we want it to:

编写成功的显微镜时 ,我们希望它:

1. Define and maintain a brand voice.


2. Prompt user action.


We have limited space to communicate with users, so keeping our copy clear, concise, and conversational is key. Our UI should be intuitive. Our microcopy should support that mission, as if we’re stepping into the user’s mind and responding to their inner monologue.

我们与用户交流的空间有限,因此保持副本清晰,简洁和对话性是关键。 我们的用户界面应该直观 。 我们的显微镜应该支持该任务,就像我们要深入用户的头脑并回应他们的内心独白一样。

Basically, we’re looking to stage a user-interface dialogue.

基本上,我们希望进行用户界面 对话 。

这看起来像什么? (What would this look like in action?) 让我们通过在舞台上实时拍摄显微照片来增强我们的显微照片。 (Let’s strengthen our microcopy by picturing it onstage, in real time.)

Here’s a quick scene between a fictional patron and coffee shop employee. Patron wants to post a job on the shop bulletin. Employee is the individual overseeing the project:

这是一个虚构的顾客和咖啡店员工之间的快速场景。 顾客想要在商店公告上发布工作。 员工是监督项目的个人:

Patron stands facing a bulletin board decorated with flyers. They hold a homemade flyer of their own. Employee, wearing a branded apron, approaches.

顾客站立面对饰有传单的布告栏。 他们拥有自己的自制传单。 身穿名牌围裙的员工走近。

Employee: Hey, you look a little lost. Can I help you?

员工:嘿,你看起来有些迷茫。 我可以帮你吗?

Patron: Uh, yeah. How do people get jobs up there?

顾客:是的。 人们如何在那找到工作?

Employee: Customers run their flyers by me.


Patron: How do you decide what to post?


Employee: If they’re appropriate, we tack ’em up.


Patron: Oh, neat. Can I throw one on?

顾客:哦,整洁。 我可以穿一个吗?

Employee: Depends. What’s the job?

员工:视情况而定。 做什么工作

Patron: I’m looking for a freelance copy editor.


Employee: Part-time?


Patron: Yep.


Employee looks over Patron’s printout.


Employee: Looks good. Pop it under the freelance section.

员工:看起来不错。 将其放到自由职业者部分下。

Notice how, in this mini scene, Employee approaches Patron to learn their needs. When writing for UX, we typically fuse this step into our copy to anticipate them instead. Now let’s transpose their conversation into a verbal UI exchange, with Patron as User and Employee as Interface:

请注意,在这个小型场景中, 员工如何与Patron一起学习他们的需求。 在编写UX时,我们通常将此步骤融合到我们的副本中以代替预期 。 现在,让我们将他们的对话转换成口头UI交换,以Patron作为User ,Employee作为Interface:

User navigates to a web bulletin where they can post or search for jobs. When given a choice between buttons “Post”or “Search,” they click “Post.”

用户导航到网络公告,他们可以在其中发布或搜索职位。 当在按钮“发布”或“搜索”之间选择时,他们单击“发布”。

Interface: Here to hire? Let’s get to work. What position are you looking to fill?

接口:在这里租? 让我们开始工作。 您想填补什么职位?

User: Freelance copy editor.


Interface: Is this position full or part-time?


User: Part-time.


Interface: How would you describe this job to applicants?


User: We’re looking for a savvy freelance editor to tackle our biweekly public health beat.


Interface: Great. Here are some suggested tags to get more eyes on your posting.

界面:很棒。 以下是一些建议的标签,可让您更多地关注您的帖子。

The scene would continue in a similar manner until User’s job posting is complete. Written out as a conversation, it can get pretty wordy, even if our scene’s language does establish character and prompt action per Albee’s advice. Our job as UX writers is to determine this path of user activity and work with designers to make these verbal exchanges more intuitive.

场景将以类似的方式继续,直到完成用户的职位发布为止。 以对话形式编写,即使我们场景的语言确实根据Albee的建议确定了角色并Swift采取了行动,它也会变得很罗word。 我们作为UX编写者的工作是确定用户活动的路径,并与设计师合作,使这些口头交流更加直观。

We can take this playwriting exercise, for instance, and integrate some of its dialogue into the UI design of a fictional job site with:


Input fields. Instead of verbally asking User, “What position are you looking to fill?” we could use Job Title as the placeholder text in an input field. Same goes for Job Description. This consolidates multiple lines of dialogue into one intuitive step.

输入字段。 与其口头询问用户,“您要填补哪个职位?” 我们可以使用“职务”作为输入字段中的占位符文本。 职位描述也是如此 。 这将多行对话整合为一个直观的步骤。

Selectable tags. Below User’s inputted job description, we can provide a horizontal scroll of additional tags they can activate by clicking.

可选标签。 在用户输入的职位描述下方,我们可以提供可以单击的其他标签的水平滚动。

But while we do want concise copy, we shouldn’t let efficiency overpower our brand voice. Indeed.com’s job posting form opts for a Job Title label with no placeholder text. This approach aligns with the company’s practical tone — their primary goal is to provide a functional hiring platform.

但是,尽管我们确实希望简明扼要,但我们不应该让效率压倒我们的品牌声音。 的确,Indeed.com的职位发布表单选择了没有占位符文本的职位标签。 这种方法与公司的实用语气吻合-他们的主要目标是提供一个实用的招聘平台。

A screenshot of Indeed.com’s empty “Job title” input field, with no placeholder text Indeed.com’s empty “Job Title” field的确,Indeed.com的“职位名称”为空

Indeed’s job description section follows suit. Notice how they add a succinct line below their field title to prompt appropriate user input.

确实,“职位描述”部分也是如此。 请注意,他们如何在字段标题下添加简洁的行以提示适当的用户输入。

Screenshot of Indeed.com’s empty Job Description input field, with no placeholder text Indeed.com’s empty “Job Description” field确实.com的空白“职位描述”字段

But if our fictional job site is known for a friendlier tone, maybe we’d use label text like Indeed’s and include placeholder text in the actual field, too.


我们可以呼吁剧本创作,使我们的作品更具对话性。 (We can call on playwriting to make our copy more conversational.)

For example, placeholder text in this job description field could read: Jobs with detailed descriptions get more views. Reach more potential applicants by adding yours. Incorporating brand voice into placeholder text encourages stronger user-product dialogue without compromising other design aspects.

例如,此工作描述字段中的占位符文本可能显示为: 具有详细描述的工作将获得更多视图。 通过添加您的公司来吸引更多潜在申请人。 将品牌声音整合到占位符文本中可鼓励更强大的用户与产品对话,而不会影响其他设计方面。

现在,我们可以看到剧作家和UX作家之间的联系。 两者都使用语言来创建和定义体验。 (Now, we can see how playwrights and UX writers are linked. Both use language to create and define experiences.)

While I won’t be writing UX plays, I can expand on elements of successful playwriting to map out user interactions and streamline my copy to best facilitate those exchanges.


To this end, as UX writers, we might view ourselves as techy pseudo-playwrights: Microcopy makes our lines, and all the web’s a stage.