網頁設計 ? 視覺設計 ? UI文案5原則:比視覺更重要的是文案

UI文案5原則:比視覺更重要的是文案

發表于: 視覺設計. 評論
Sponsor

UI文案是產品向用戶傳達信息的橋梁。糟糕的文案會讓用戶難以理解產品傳達的意思,甚至會引發歧義,使得產品吸引力不盡人意。UI文案是信息傳遞的一種手段,應注意效率優先,做到直接高效,而不要去將其復雜化,將其視作和用戶的一次坦誠交流來撰寫吧。

UI文案5原則:比視覺更重要的是文案

對于許多科技公司來說,設計是難以理解的。因此,當我和初創公司合作時,會通過談論流程和技巧來闡明設計。我的想法是:設計富有創造性,但并不難以理解,也不僅僅只有設計師才能有幸參與其中。它是理性和客觀的,而且設計過程也并不復雜。

在谷歌風投公司,我和我的搭檔總是嘗試不同的方式去設計,而且每周會和不同的初創公司一起工作。作為一個寫手和設計師,我的設計方式是使用優秀的文案和簡單的視覺設計去突出重點。我的搭檔最近告訴我,盡管我設計的原型過于簡單粗糙,甚至可以說有些丑陋,但是在用戶調查中效果卻出奇地好,經常勝過那些整潔、視覺奪目的原型。出于驚訝和好奇,我開始整理一些技巧和方法來幫助我設計出清晰和易理解的文案,于是就有了下面這5個能幫助你寫出優秀文案的原則。

(什么是界面文案?它是一些文本標簽、按鈕文字、描述說明等,應用在產品界面上。)

UI文案5原則:比視覺更重要的是文案

當我告訴其他人文案編輯是一種設計技能時,他們通常感到驚訝。我曾與一位非常優秀的視覺設計師共事,他認為并不是所有的設計都只是視覺表現。我們主要的目的是要用設計去解決各種各樣的問題:產品是用來做什么的,它是如何運行的,它傳達了什么信息?最后,我們的產品應該向用戶傳達什么樣的信息?我一直將其視為最重要的事情去思考。

一、以清晰為主

些人說文案應該簡短,也有人說豐富一些更好,還有一些人指出用戶只會快速掃視軟件產品上的文字并不會去仔細閱讀,所以只要關鍵信息放到相應位置,文案是長是短就不重要了。

我的原則:以清晰為主。我們應該努力做到清楚、簡潔且優雅地向用戶傳達信息。所以我們怎么達到這一目的呢?

要具體

當我們實際想表達“篩選”時,就不要使用“搜索”?!氨4妗焙汀疤峤弧辈灰粯?。

UI文案5原則:比視覺更重要的是文案

京東的“新建收貨人”和“功能反饋”頁面

注意行話和縮寫

當我們不注意的時候,很容易讓這些詞不經意地出現?!熬W站”比“站點”好?!把垺北取罢埱蟆备线m?!胺劢z圈”比“圈子”更清晰。

把標簽放在前面(即把重要的詞放在前面)

表單欄應該顯示“姓名”,而不是“名稱”。按鈕顯示“同意并繼續”,而不是“單擊繼續”。

UI文案5原則:比視覺更重要的是文案

阿里云網站注冊頁面,不是簡單的顯示“注冊”而是“同意條款并注冊”

不要偷懶

要確切地說出那些按鈕的作用,不要單單只是“確定”和“取消”。

UI文案5原則:比視覺更重要的是文案

淘寶“支付”與餓了么“會員紅包領取”

這是一些很細節的部分,不太讓人注意到。但如果做得好,我們的界面將更容易讓用戶理解,使我們的產品質量更高。

二、個性并沒有你想的那么重要

每個公司都想要吸引眼球和獨樹一幟。許多初創公司都嘗試去打造一個個性鮮明的品牌,他們想做出不同凡響的創新。盡管文案在品牌發展中扮演著至關重要的角色,但相對于清晰性來說,它只是一個次要的問題,品牌更需要的是積少成多、日積月累的打磨。

當我們執著于個性時,標題可能會寫成,“好吧,我們開始吧!”,而按鈕可能寫成“聽起來不錯!”。標題和按鈕是我們產品的重要組成部分,需要絕對的表達清晰。我一直致力于將文案描述清晰并幫助用戶理解,例如:“告訴我們您的需求”和“保存并繼續”。

在我們確定了基本內容之后,我們可以使用副標題和輔助文案來表達個性。但是不要用力過猛——你的個性(以及你公司的個性)會自然地展現出來。

三、直接告知用戶,不要繞圈子

還記得《宋飛正傳》中克萊默扮演電影售賣員的那一集嗎?克萊默意識到他無法通過電話上的按鍵數字的按鍵音來分辨顧客想要看哪部電影,于是問顧客:“你為什么不直接告訴我你想看什么電影?”這個故事說明了信息傳遞手段的不合理導致信息傳遞效率低,實際上有更好的手段可以使用。界面文案寫作的最有效的手段,是告訴你的用戶你想要他們了解什么。我看到過很多營銷網站這樣寫標題,比如將標題寫成“一個更好的方法”、“最好的方法”或者“一個新方法”,但是并沒有描述它具體是什么方法。在許多界面中,一個簡單的標題實際上就能很好地幫助用戶理解。我曾經與一家公司合作,他們的產品會重點介紹一個你正在關注的公司的推薦名單。然而,這個名單沒有標題,表達也不清晰,如果在其中加入一個標題“來自你關注的公司的推薦名單”,就會立即讓用戶明白。

這個原則在需要頁面跳轉的設計中很有幫助(用戶必須在頁面輸入一些信息,然后跳轉到下一頁)。在頁面中我們會通過一些特殊提示告訴用戶即將發生什么,比如將按鈕上的文案寫為“保存并繼續”,并在旁邊添加一些附加文案“之后我們將需要獲取更多的個人信息”,效果就會比直接簡單寫著“下一步”的按鈕要好。

UI文案5原則:比視覺更重要的是文案

四、用戶確實有閱讀界面文案的習慣

去的10年里,我在用戶研究中觀察了在各種 App 和網站上幾百位用戶的使用過程。有一點是可以確定的,用戶確實會在軟件產品中閱讀或短或長的文字。標題通常是最突出的,所以用戶閱讀它的可能性很大。一些交互控件比如按鈕、鏈接和標簽也會被閱讀。較小屏幕(在手機和平板電腦上)能容納的文字更少,用戶可能會放棄閱讀,因此我們更需要精心設計。

UI文案5原則:比視覺更重要的是文案

合理的文案會提高產品的可信度。我的合伙人杰克分享過一個例子:藍瓶咖啡的網站主頁添加了一些創業故事,這讓公司看起來更加真誠和值得信賴。我們在一些金融產品中也看到過這樣的例子,介紹產品的安全性和隱私性提高了用戶對產品的信賴感。因此,只要文案清晰中肯對用戶有幫助,就可以加入產品中。

五、寫作是設計過程的一部分

界面文案和設計如何結合在一起?

我了解到文案設計是產品設計過程的核心部分,與交互設計、視覺設計、原型設計以及用戶研究同樣重要。和其他核心設計技巧一樣,不是產品開發中的一個步驟。它穿插在我們整個設計過程中,不屬于開頭、中間或結尾。

在我設計第一批網站過程中,我會從客戶端的文案設計開始,第一步工作是編輯、組織和提交這些文案,它們中的大部分是網站的限制和聲明。后來我犯了一錯誤:設計產品時我在所有地方都使用“測試文案”,而且為了偷懶我不斷地在后面復制粘貼,當然這是不可取的。(建議大家避免使用測試文案,因為它雖然可以讓我們觀察排版是否正常,但是會影響閱讀而且不符合情景,還是輸入一些比較符合產品情景的文案比較合適)

當我們在一個項目中做設計時,我們早期的原型都相對簡單:交互體驗不好,視覺粗糙,復印件有些模糊。當我們測試這個原型時,會了解到什么是生效的以及什么需要生效,然后進行整體改進。如果在這個過程中忽略了文案的設計,我們的產品就會受到不利影響。即使是早期的原型也應該包含真實的文案。不要把文案的編寫工作安排到項目快結束時,這樣將失去了評估和改進界面文案的機會。

這些規則對我很有用,但并不是一成不變的,在你的下一個設計項目中試一試這些原則,看看是否有幫助。并告訴我效果怎么樣,請分享你優秀的文案設計并在推特上@我:@jazer。

注:Google Ventures是Google于2009年3月成立的風險投資基金,尋找并幫助優秀初創公司。作者 John Zeratsky是Google Ventures的設計合作伙伴,主要幫助初創企業使用設計來實現業務目標。

六、設計關鍵詞

waterfall process

注解: 瀑布過程(屬于一種產品開發的流程管理模式)

例句: Writing, like the other core design skills, is not a step in a waterfall process.

文案設計和其他核心設計技巧一樣,不是產品開發中的一個步驟。

lorem ipsum

注解:測試文案、隨機文本

例句:I made the opposite mistake: designing products with “lorem ipsum” all over the place, then trying to add copy at the end.

我犯了一錯誤:設計產品時我在所有地方都使用“測試文案”,而且不 斷地在后面復制粘貼。

原文作者:John Zeratsky
原文地址:https://www.fastcompany.com/3026463/
翻譯作者:Ballen貝林、Tong文舒
譯者主頁:https://www.zcool.com.cn/u/14592355

推薦:查看最受歡迎的 301 個設計網站 → http://hao.shejidaren.com
交流:結交更多有才華的設計師?請加入UI設計QQ群,與50000名設計師交流設計。
贊助商鏈接
贊助商鏈接
設計達人微信交流社區:shejidaren888
喜歡這篇文章嗎?歡迎分享到你的微博、QQ群,并關注我們的微博,謝謝支持。
版權:除非注明,本站文章均為原創文章,轉載請聯系我們授權,否則禁止轉載。

{ 發表評論 }