【UX Writing】UI Copy設(shè)計入門(方法篇)

一年多沒更新了。這期間公司發(fā)生了很多變化:2022年10月公司決定退市與私有化,隨之而來的是,一系列減員節(jié)支操作--美國英國非核心部門全部裁員求橄,然后是在印度招人回填;這其中就包括了IX (文檔部門)葡公。到23年5月基本美國的IX同事都走的走罐农,轉(zhuǎn)部門的轉(zhuǎn)部門。也就是從5月開始催什,印度backfill陸續(xù)到位】心洌現(xiàn)在,我所在CVAD Core產(chǎn)品線蛆楞,共入職了6位新同事。

所幸夹厌,NJ業(yè)務(wù)未受影響豹爹,而且還有所擴張。但是矛纹,小J同學3月決定轉(zhuǎn)崗做PM臂聋,他的backfill只在印度招人。小J以前是一個重要項目的IX lead(包括他、我孩等、美國三位同事參與)艾君。一系列變化之后,我從這個項目的participant角色肄方,轉(zhuǎn)變?yōu)閘ead角色冰垄。面對新加入的兩位毫無domain? knowledge的印度同事,我要肩負tutor的角色权她,手把手教他們熟悉流程虹茶、寫作規(guī)范,作為peer reviewer隅要,保證項目文檔質(zhì)量...與此同時蝴罪,我還是另個兩個項目的Independent Contributor。每日的忙碌讓我嚴重質(zhì)疑當初換工作的決定步清,身體透節(jié)嚴重要门。 同時,IX印度化的趨勢廓啊,也讓我琢磨不透新來的印度Manager的心思欢搜。最近一點想通了, don't bite off more than as you can chew崖瞭。盡力把基本隊伍培養(yǎng)起來狂巢,然后做回IC吧。

UX? Copy Design是我工作中重要的一塊书聚。通常在業(yè)內(nèi)唧领,UX Desinger與Technical Writer是兩個不同的職位。但以前公司這兩塊都是由IX部門負責雌续。新來的印度同事斩个,都是TW出身,對UI Copy Design一臉蒙圈驯杜,完全沒有章法受啥。翻看我以前的blog,我也是從21年底開始慢慢接觸這塊的工作鸽心。一路在學習與實踐的路上走了快兩年滚局,從理論與實踐上都積累了一些經(jīng)驗。我打算借寫blog顽频,結(jié)合一些設(shè)計實例藤肢,介紹UX Design的方法步驟,以及常用的工具糯景。

準備工作

拿到PD(UX DESINGER)的設(shè)計(比如Figma)的同時嘁圈,把Engineer JIRA TICKET中的Description仔細閱讀省骂,理解EPIC的設(shè)計意圖。

FIGMA初稿是 PD經(jīng)過與 Feature owners幾輪討論后最住,提供的UI設(shè)計與文字的初稿(這一過程涉及反復溝通钞澳,IX通常不參與)。在了解了EPIC context后涨缚,帶入用戶視角轧粟,體驗UI設(shè)計的可用性。如果覺得設(shè)計有不合理之處仗岖,及時與PD與Feature Owner討論逃延,修正UI設(shè)計。

示例:待提供

四段法優(yōu)化文字設(shè)計

UI String需要滿足以下4個終極目的:

-? Purposeful

-? Concise

-? Coverstational

-? Clear

對于經(jīng)驗不是很豐富的IX轧拄,可以試著從4個設(shè)計目的為步驟揽祥,逐步展開UI String的設(shè)計優(yōu)化過程。

Phase I: Purposeful

在這一階段檩电,追求的是文字做到meet all purposes拄丰。暫且不管文字長度,不追求小而精俐末。

Purposeful come in two dimensions:

-? purposeful for the users: 用戶通過UI Copy達成哪些目的料按。基于這些目的卓箫,我們可以設(shè)計多個版本的文字信息载矿。

? 了解用戶操作目的是關(guān)鍵,作為TW烹卒,

? 1. 仔細研讀epic description闷盔,了解這個feature的設(shè)計意圖,使用場景旅急,UI用戶操作方法逢勾。

? 2. 帶著步驟1中產(chǎn)生的問題,與feature owner做充分溝通藐吮。

? 3. 用文字把使用場景描述清楚溺拱。

-? Purposeful for the organization:比如提高用戶粘合度,減少運營支撐部門成本谣辞。

盡量減少出現(xiàn)“Please contact your administrator to resolve the problem.”這樣的表達迫摔。盡力挖掘問題的各種solutions,讓用戶能自己解決出現(xiàn)的問題泥从。

Phase II: Concise

Users don't read UI text they scan it. 試著想想我們自己在操作手機淘寶APP句占,面對彈出的Pando提示,看到長一點的文字歉闰,我們是不是幾乎直接忽視辖众。按微軟設(shè)計概要所述:Users tend to read control labels first, especially those that appear relevant to completing the task at hand. By contrast, users tend to read static text only when they think they need to.

所以文字一定要短,要字數(shù)小和敬,便于scan---對于英文 message而言凹炸,通常要少于3行,寬度小于40個字符昼弟。如果英文翻譯成其它語言啤它,長度可能會增加1/3

Additionally, in UI text, concisely communicate the essential information. If more information is necessary for some users or some scenarios, provide a link to more details.
示例:
左側(cè)為原設(shè)計舱痘,右側(cè)為我的設(shè)計变骡。
Highlights:
1. 添加:Benefits for enabling and configuring write-back cache;并提供一個learn more link to direct users to user documents for details.

2. 原Information message太長芭逝。經(jīng)過分析塌碌,前一句是可以通過UI design讓用戶感受到這兩類cache間的聯(lián)動, 因而沒有必要用文字描述旬盯,刪除這一句台妆。

2‘ 在Memory cache是一個optional but recommended setting,這個信息很重要胖翰,讓其顯性化接剩。

示例

Methodology

Editing for conciseness is a process of winnowing down phrases to their core meanings.

Then, try out different sequences to find the ones that are briefest and easiest to understand. Four sequences to start:

-? Start with the imperative verb.
-? Start with the purpose users might recognize. E.g. To do something, XXX.
-? Start with the context. E.g. Context: XXXX
-? Start with an emotional motivator. E.g.: Alerts: XXXX

Tips:

When three or more ideas must appear in the same sentence, it tends to be the last word or idea that will be the most powerfully remembered.

Rule 18: Place the emphatic words of a sentence at the end.
--【學習筆記】必須爛熟于心的十條 English Writing規(guī)則

Phase III Conversational

無論是技術(shù)文檔寫作還是界面string創(chuàng)作,都有一條就是:

Use everyday words you can, and avoid formal language you wouldn't use when speaking to someone in person.

When making the UX text conversational, we might still be making radical changes to the text. We will still be adding and moving words and changing their order, this time focusing on making the most conversational choices for the experience.

Tips:
The best editing tool is the human voice. Read the titles and description as if the experience is "talking" to the person, and read the buttons, options, links, and other input fields as the person responding back to the experience.

示例

Phase IV Clear

The right words will be the ones that users will recognize immediately, without having to think.

-? Remind ourselves of the purpose, to reimagine where the person is, what they are doing, and why they're seeing this UX text.
-? Check the text with teammates and partner with user researchers to get feedback from people who will use the experience. For

Write up the best options in the order that we think will be most effective, and describe the details that make them different from each other.
示例

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末萨咳,一起剝皮案震驚了整個濱河市懊缺,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌培他,老刑警劉巖鹃两,帶你破解...
    沈念sama閱讀 222,183評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異靶壮,居然都是意外死亡怔毛,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,850評論 3 399
  • 文/潘曉璐 我一進店門腾降,熙熙樓的掌柜王于貴愁眉苦臉地迎上來拣度,“玉大人,你說我怎么就攤上這事螃壤】构” “怎么了?”我有些...
    開封第一講書人閱讀 168,766評論 0 361
  • 文/不壞的土叔 我叫張陵奸晴,是天一觀的道長冤馏。 經(jīng)常有香客問我,道長寄啼,這世上最難降的妖魔是什么逮光? 我笑而不...
    開封第一講書人閱讀 59,854評論 1 299
  • 正文 為了忘掉前任代箭,我火速辦了婚禮,結(jié)果婚禮上涕刚,老公的妹妹穿的比我還像新娘嗡综。我一直安慰自己,他們只是感情好杜漠,可當我...
    茶點故事閱讀 68,871評論 6 398
  • 文/花漫 我一把揭開白布极景。 她就那樣靜靜地躺著,像睡著了一般驾茴。 火紅的嫁衣襯著肌膚如雪盼樟。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,457評論 1 311
  • 那天锈至,我揣著相機與錄音晨缴,去河邊找鬼。 笑死裹赴,一個胖子當著我的面吹牛喜庞,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播棋返,決...
    沈念sama閱讀 40,999評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼延都,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了睛竣?” 一聲冷哼從身側(cè)響起晰房,我...
    開封第一講書人閱讀 39,914評論 0 277
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎射沟,沒想到半個月后殊者,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,465評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡验夯,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,543評論 3 342
  • 正文 我和宋清朗相戀三年猖吴,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片挥转。...
    茶點故事閱讀 40,675評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡海蔽,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出绑谣,到底是詐尸還是另有隱情党窜,我是刑警寧澤,帶...
    沈念sama閱讀 36,354評論 5 351
  • 正文 年R本政府宣布借宵,位于F島的核電站幌衣,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏壤玫。R本人自食惡果不足惜豁护,卻給世界環(huán)境...
    茶點故事閱讀 42,029評論 3 335
  • 文/蒙蒙 一哼凯、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧楚里,春花似錦挡逼、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,514評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽嘱能。三九已至吝梅,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間惹骂,已是汗流浹背苏携。 一陣腳步聲響...
    開封第一講書人閱讀 33,616評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留对粪,地道東北人右冻。 一個月前我還...
    沈念sama閱讀 49,091評論 3 378
  • 正文 我出身青樓,卻偏偏與公主長得像著拭,于是被迫代替她去往敵國和親纱扭。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,685評論 2 360