用戶畫像作為一種設計工具，可以很好得幫助設計師跳出“為自己設計”的慣性思維，聚焦目標用戶，發現核心價值，賦能產品。

設計分析是作為交互設計師必備的一項基礎能力，一套有效的分析思路可以幫助我們找準設計發力點，更效率的推導出合理的設計方案，它是一種思維能力，也是一種方法工具，但是在我們的實際項目中，常常會遇到這樣幾種場景：

• 新手設計師或者第一次做活動的設計師，設計分析不知道要如何入手

• 花了很多時間做分析，但感覺對實際畫稿子并沒有什么幫助

• 分析過程中發散了很多很好的點，但最后大多都落不了地

這些情況常常會導致設計分析流于形式，套用了很多方法、花了很多時間、輸出了很長的文檔，內容看上去似乎很豐富，但落地的方案卻平平無奇，甚至也會自我懷疑設計分析真的有用嗎？

總結下來，會出現這些場景的原因有兩點：首先是設計分析太泛，沒有聚焦到核心問題；其次是時間分配不合理，沒有抓到發力重點。那么結合我們目前的項目來看，怎樣做一個更有用的設計分析呢？

活動中常見的項目類型

根據活動產品化設計思路，可以把我們的日常項目分為兩類：迭代型項目以及探索型項目。

迭代型項目是指過往已有過積累的成熟項目，例如大促主會場、我的專屬會場、榜單會場、攻略等等，通常是一些已經比較固化的經典業務，或基礎的功能類業務；探索型項目則是一些全新的業務方向，例如下沉會場、直播會場等等，剛處于進入期或成長初期。

如何完成一個有效的設計分析

1. 迭代型項目

迭代型項目容易陷入的一個誤區是時間分配不合理，沒有抓到發力重點，尤其是對于很多新手設計師來說，往往大部分的精力花在重復之前已經做過的內容，比如花了很多時間重新去分析用戶、分析方向、分析行業趨勢等等，但是對于已經比較穩定的迭代型項目來說，這部分背景內容相對來說已經比較固化（除非有明顯的變化），這就可能會導致重復分析出來的結論跟之前的差別并不大，也很難帶來實際業務提升。

既然迭代型項目過往已有過經驗和策略的沉淀，也經歷過多輪的數據迭代，核心思路應該是先定義要解決什么問題、然后才是如何解決，這樣才能找準關鍵發力點。

要解決什么問題

首先要思考是不是真的有問題，沒有問題的項目也可以不用再花時間做分析，效率做即可，例如像全部會場，本身的業務模式就比較簡單，過往的效果也相對比較穩定，如果不考慮進行突破性的創新，通常是可以效率復用的，這種時候則不需要再去做分析，畢竟也要考慮投入產出比。

那么怎么定義要解決什么問題呢？有三個常用的思路：看數據、看用戶反饋、看運營策略。

第一，從數據分析中找到關鍵問題，例如根據618的項目數據復盤，我們發現預售會場、品牌會場的頁面跳失率較高，那么雙11核心可以圍繞“如何降低跌失率？”“如何提升流量利益效率？”去進行分析，從而推導出更有針對性的設計策略。

第二，根據用戶反饋來找到關建問題，例如過往的主會場，用戶調研一直都會反饋主推樓層太長而找不到感興趣的內容，那么可以圍繞“如何更好的進行需求匹配？”“如何提升屏效？”來思考和分析，解決實際存在的問題，才更有可能提升體驗和數據。

第三，結合運營策略，很多業務雖然已經相對穩定，但隨著每次大促戰略的變化，運營策略上也會有一些新的需求，那么就根據這些差異化的訴求去找到發力點。例如針對我的專屬會場，在原會場定位不變的情況下，在近兩次大促中運營側都提出需要由這個會場來承載平臺服務內容曝光的訴求，那么服務內容如何匹配“專屬”會場的用戶心智，則是這個會場可以重點解決的問題。

如何判斷真正有效的解決方案

在定義清楚核心要解決的問題后，就可以按照常用的設計方法進行方案的推導，在發散解決方案的過程中，如何判斷方案的合理有效，確保最后的可落地性，是讓我們設計分析有價值的關鍵，因此總結了兩個常用的技巧。

首先要理解業務邏輯，減少無用的策略發散，很多時候我們的方案很難推動落地的原因，是沒有考慮到業務的訴求，越能夠深入的了解業務，才能更好的解決業務側的顧慮，保證方案的可落地性。

其次是要跳出來從整體來看優先級，我們在進入自己的思維邏輯中時，會比較容易陷入細節，有時候自己覺得很棒的想法花很大力氣去推卻很難獲得其他人的重視，并不是因為我們的方案不夠好，而是沒有關注到整體優先級，因此要學會看全局，通過多溝通多評估的方式來讓自己的判斷更加準確。

2. 探索型項目

探索型的項目沒有過往的參考依據，相當于需要從零開始去探索如何做，對于設計分析的能力要求會更高，那么常常容易陷入兩種極端相反的誤區，要不就是容易被方法論套路，設計分析過泛但得不出實際有價值的結論，要不就是完全沒有頭緒，屬于想一步做一步的類型，分析的內容之間缺乏邏輯。

因此，探索型項目的核心思路是要先有分析框架、再做縱向深挖，就像畫交互稿的過程一樣，需要先定義交互框架，縱再進行交互細節的打磨，才能夠保證設計效率及效果。

確定分析框架

確定分析框架的過程主要分為兩步，一是先想清楚要分析哪些內容，包括哪些環節是必要的，哪些是重點的，時間要怎么分配。例如當我們第一次做寵物品類活動時，需要對這個品類有深入的理解，因此我們在前期需要去分析養寵人群的特征、寵物行業的發展現狀、京東寵物貨品的優勢等內容，而如果我們做的是一次大促的綜合會場，其主要用戶群體如果跟常規站內主流群體并無差異時，則不需要再花費大量的時間單獨去分析用戶畫像，因此，需要結合項目情況先想清楚需要分析的內容、以及這些內容的必要性和優先級。

第二步是梳理清楚內容之間的邏輯關系，常見的邏輯結構有兩種，一是遞進式的推導（A→B→C），分析維度之間是先后關聯的，通過嚴謹的邏輯步步推導而來，例如先梳理用戶畫像、才能進行用戶行為痛點的分析、進而推導解決方案；另一種邏輯結構是進行綜合歸納（A+B→C），即通過幾個不同的維度綜合推導，例如經典的五導家分析方法，結合用戶目標以及業務目標綜合推導出設計目標。

在很多設計分析中，我們也會參考一些方法論，其實方法論提供的就是分析框架，在理解了這一步之后，相信也能更靈活的應用。以下是根據我們日常項目梳理的一些常用分析框架。

縱向深挖如何得到有價值的策略

有了分析框架后，接下來就可以進入每個模塊的具體分析了，如果要得到有價值的策略，同樣有兩個小技巧。

首先，策略要足夠具體、有差異化，盡量避免提出過于籠統的結論。例如針對如何提升流量利用率比較泛的策略就是要進行流量精細化運營，這個大的方向沒有錯，但如果只到這一步是很難指導具體內容落地的，所以需要細化到流量的渠道有哪些、這些渠道有什么樣的特征、針對不同的渠道用戶可以用怎樣的內容吸引他們，才能夠更準確的判斷是否會存什么問題。

其次，策略最好能夠關聯驗證指標，可以參考UGD數據增長思路，在推導策略時要能預判它能帶來哪些數據指標的提升，以保證設計分析的結論是有理有據的。

文章來源：站酷   作者：大蔥設計

藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

產品該如何避免同質化？本文作者依據工作中項目實踐的所思所想，從產品同質化的產生原因出發，結合企業和用戶的具體應用案例，就此話題分享了自己的想法，供大家一同參考學習。

這篇文章只是想從個人理解的角度回答下標題問題，如有不足，歡迎指正和討論。

一、為什么會有產品同質化？

產品是需求實現的載體，是企業和用戶實現價值交換的媒介。需求是有來源的并不是憑空可以創造的，這也就意味著可見的、可交換且可盈利的需求在一定程度上（沒有新元素加入的情況下）是有限的（這和需求本身的無限性并不沖突）。再也不是移動互聯網初期一片藍海，站在風口就可以起飛的時代了。

除了這個外部因素外，新業務的試錯成本往往比已經驗證過可行性的產品來的高的多。因此，為求穩，也有不少本身有實力的公司會進入相同的賽道一爭高下。

但是沒有差異的產品對用戶來說由于替代成本低，很難維持穩定的用戶群體。本文分別從用戶分析和企業核心競爭力兩個角度分析，在同質化中尋找突破口。僅為作者本人經驗和觀點，如有不足和問題，歡迎溝通和指正。

二、從用戶出發，精準把握產品定位

1. 飛豬 VS 攜程

因為前段時間去成都需要訂酒店，原本是想單純的做下比價的。但是卻意外的發現兩個APP酒店的推薦邏輯差異甚大。

根據推薦結果不難發現，攜程的關鍵詞是商務型、中端酒店，而飛豬則更偏重于經濟型、酒店公寓（民宿），且兩者在整體均價上也是拉開了差距的。

攜程作為出行行業的老大哥，在移動互聯網還沒有普及時，就已經占據旅游出行機酒業務的半壁江山了，特別是商務出行板塊。而酒店線上預訂業務本身就是偏重于供給型，沒有資源就沒有話語權。

而在這種情況下，飛豬通過抓住近年旅游行業爆發的契機以及大眾對民宿接受度的提高，把握年輕群體對休閑游、窮游的訴求，加之其對小型公寓酒店、民宿的扶持和曝光（19年成立了菲住酒店聯盟，實現聯盟會員共享），實現了這部分用戶和商家的在線交易。

雖然從表象上看產品的形式是相同的，都是酒店預訂，但是產品本身的定位和底層邏輯的不同，各自圈定了不同的用戶實現了差異化競爭。

2. 巧克力VS口紅

上面攜程和飛豬的例子是基于一個小的賽道在做細分，如果只將目光放在這個層面，那只是在“分餅”，但是這種情況下餅的大小總是有限的，如果不換個角度“把餅做大”，在競爭嚴峻的當下也很難長久的不被打倒。

之前在阿里媽媽的公開課中看到過這樣一句話：今天巧克力最大的競爭對手是誰，不是糖果，不是堅果，而是口紅。

這是基于當今消費并不只基于個人的需要，而是越來越多的扮演著情感表達、場景營造的角色（基于阿里媽媽2020消費觀察數據），25歲男性對口紅價格的接受度甚至是女性自用的三倍，口紅逐漸蠶食了巧克力在男女戀愛市場中穩固的禮物寶座，想想在口紅一哥李佳琪的一聲聲“OMG，買它”中，多少男性也同時乖乖的掏出了腰包。

因此，我們差異化的思考不應該只局限于品類下人群的思考，也應該基于不同的場景去挖掘場景下的用戶群體。

三、從企業出發，發揮企業核心優勢

1. 美團優選 VS 橙心優選 VS 多多拼團

今年年初的疫情，雖然對各大行業都造成了不同程度的損傷，但是卻“社群團購”這個模式看到了曙光。

艾媒咨詢數據顯示，在疫情的刺激下，2020年社區團購市場發展迅猛，市場規模預計將達到720億元，而未來隨著市場的良好增長態勢，2022年中國社區團購市場規模有望達到千億級別。

各大平臺也在下半年爭相加入這個賽道：美團、滴滴、拼多多相繼推出了美團友選、橙心優選和多多拼團，均將其作為下個階段的業務重點。

本身社群團購這個模式本身是可以成立且存在用戶體量龐大。但是，從松鼠拼拼到呆蘿卜，都昭示著生鮮、社群并不是一個好啃的骨頭。

從三個平臺目前呈現出的產品來看，產品邏輯是一致的，依然是通過團長建立社群拉流量下單并獲得提成的模式，前期搶地盤搶團長的價格戰看來是在所難免了（某鹿已經為能夠薅到羊毛平臺羊毛開始暗自竊喜了），但是價格戰始終是雙刃劍，并不是長久之計。

這就需要深究，相同的模式，企業通過什么實現差異化競爭。這三家平臺加入這場戰役，憑的到底是什么核心競爭力，總不能真的是指望靠燒錢燒到行業第一吧。

回歸社群團購這個模式本身面向的群體是偏價格敏感型，且因為社群本身快速傳播的特質，對品質的要求更為嚴格了，真正是要求物美價廉。對供應鏈和履約的要求十分高，也難怪乎有人說“社群團購，始于團長，終于供應鏈”。

對于美團來說，O2O的基因是刻在骨子里的，本地現成的數以萬計的線下商家都是潛在的團長，且這些團長是自帶線下流量的；對于線下B端的管理和運營也是輕車熟路；此外線下商家支持以供應商模式入駐美團優選為平臺供貨，對于平臺品類的豐富度提升有極大幫助；外賣配送的管理經驗讓他在物流上也占有相當優勢。

滴滴原來的行業布局和社群團購看起來似乎是毫不相關的，但其對在線下司機的管理、運營上是有一定沉淀的，而對于團長的管理在這個點上是可以互通的，在團長履約上是具有一定保障的。而滴滴因為有貨運的布局，其在物流上是具有一定優勢的，社群團購雖然時效要求沒有外賣高，但也都是要求次日達的。但在供給上的劣勢也是十分明顯的。

早期多多是從生鮮水果拼團開始做起，不排除他在這塊供應鏈的運營和把控上是有積累的，且從早期的生鮮價格來看，其價格優勢較為明顯。同時因為拼多多原生用戶群體中一大部分都是對“白牌”價低質優商品存在相當高接受度的用戶，相信價格和品牌差異（限于標品，非生鮮果蔬類）依然會延續成為多多拼團的優勢。

但拼多多目前一直只有線上電商業務，本次社群團購是其首次轉戰線下履約的嘗試，其挑戰難度也是不言而喻的。

所以基于以上的剖析，從我的角度來說，這三家中，我個人目前是更看好美團優選未來前景的，他底層在供應鏈上的優勢差異是目前另外兩家還無法達到的。不過這個領域盤子不小，各家發揮優勢的話后續還真不好說。對于這場仗，我拭目以待。

總結

基于以上論述，即使是看似“同質”的產品和業務，但是通過對業務的理解，對用戶的挖掘，對企業自身優勢的把握而實現“不大相同”的邏輯，我認為這就是身為產品經理很重要的意義所在了。希望我們都可以做出各自領域與眾不同的產品來。

文章來源：人人都是產品經理    作者：麋鹿產品   

藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

亞馬遜作為一個知名的電商平臺，它的成功背后卻有一個很難讓人理解的設計邏輯：成功的設計不一定是美觀的。為什么會這么說呢？本文將從四個維度展開分析，希望對你有幫助

編輯導語：B端產品往往由于業務體量龐大，導致信息復雜，同時對業務的性的要求很高；服務于B端的業務，不能夠出信息錯誤，填錯一個信息，就會引發巨大的問題。本文結合筆者自己的工作經驗，總結了大型B端業務中表單的設計方法，供小伙伴參考。

一、表單的定義

表單是信息添加、錄入的通用形式；其作為獲取用戶輸入的重要交互方式，也承擔著將問題和答案進行配對的角色。

二、表單的設計原則

設計原則是任何一種解決方案的指路燈，它們體現解決方案應包含的基本目標。

針對互聯網表單設計，我倡導的原則如下：

1. 盡量減少痛苦；
2. 說明填寫完成路徑；
3. 考慮情境；
4. 確保一直溝通。

三、表單的結構

我們先看看表單的結構，表單主要由5部分組成：

1. 標題：這個元素幫助用戶引導完成表單填寫的整個過程，尤其在你對信息進行分組方便用戶填寫時，特別有用。
2. 標簽：告訴用戶相對應的輸入字段的含義。
3. 輸入域：包含了文本框、密碼框、多行文本框、復選框、單選框、下拉選擇框和文件上傳框等。
4. 提示信息：包含幫助信息、占位符和反饋信息提示。
5. 操作按鈕：包括提交按鈕、保存按鈕、復位按鈕和一般按鈕；用于將表單數據傳送到服務器上。

四、表單的表現形式

1. 標簽

標簽根據標簽與輸入域的位置關系，分為：左對齊、右對齊、頂部對齊、內聯標簽、圖標標簽和浮動標簽。

每種標簽樣式都有自身的優點與局現性，根據不同的場景選擇適合的標簽樣式，能提高用戶閱讀效率，同時還能降低信息填寫時的錯誤率。

1）頂部對齊：根據Matteo Penzo 發布的關于標簽放置的文章表明：采用頂部對齊的標簽樣式，瀏覽表單所需的時間最短；如果希望用戶能快速掃描填寫表單，頂部對齊的標簽是一個不錯的選擇。

頂部對齊的結構，使得能放下更長的標簽；但對于縱向空間是一個挑戰，當填寫信息過多時，表單就會很長。

• 優點：有最快的瀏覽和處理速度，同時標簽長度彈性大。
• 缺點：非常占縱向空間。

2）左對齊：左對齊標簽，文字開頭按閱讀視線對齊，符合人們的閱讀習慣，是有利于閱讀的。

瀏覽表單所需時間最長，但是緩慢完成率并不總是一件壞事——如果表單要求敏感數據(例如提供駕駛證、身份證、銀行卡號等，可以故意減緩用戶的填寫速度，來確保填寫的準確性）。

左對齊的結構需要更多的橫向空間，因此在移動端的呈現上可以是個問題。

此外，在屏幕空間有限的情況下，也會一定程度上限制了標簽和輸入框的長度。

• 優點：文字開頭按閱讀視線對齊，方便閱讀，節約縱向空間。
• 缺點：填寫速度慢，標簽長度和輸入框彈性小。

3）右對齊：右對齊使得標簽和輸入之間的距離固定，有明確的視覺關聯。

對于簡短的表格，右對齊的標簽可以有很快的完成時間；但由于標簽長短不同，左邊緣參差不齊，整體掃讀表單的時候不容易了解全部信息。

與左對齊類似，在屏幕空間有限的情況下，也會一定程度上限制了標簽和輸入框的長度。

• 優點：時間較短，節約縱向空間。
• 缺點：整體可讀性低，標簽長度和輸入框彈性小。

4）內聯標簽：內聯標簽由于它對空間的占比很小，往往運用于移動端的界面設計中；但如果在交互上處理不好，會有很大的缺陷。

內聯標簽是用作提示性文字，來告訴用戶應該填寫什么內容，但用戶在填寫的適合，它就會消失；因此用戶無法仔細檢查他們是否寫下了所要求的內容，這增加了錯誤的可能性。

另外一個問題是：用戶可能會把占位符文本誤認為預填數據，因此忽略它（正如尼爾森諾曼集團的眼動追蹤研究所證實的）。

• 優點：空間占比小。
• 缺點：在增加錯誤的可能性。

5）圖標標簽：圖標標簽是內聯標簽的一種演化形式，在一定程度上緩解用戶的困惑和自我懷疑的心理。

但就圖標而言，用戶需要時間來反應它所代表的意思——若表意性不強或者并不是常見的圖標樣式，用戶就要思考和猜測它的含義。

此外，輸入項一多，還得記憶那個圖標所對應的意思。

• 優點：空間占比?。辉谝欢ǔ潭壬暇徑庥脩舻睦Щ蠛妥晕覒岩伞?/span>
• 缺點：可能造成用戶的認知負擔，增加用戶記憶成本。

6）浮動標簽：用戶在輸入時，內部標題（提示信息）進行浮動位移，即節省了空間，提示性信息依舊在。

但相比其他幾種標簽樣式來說，需要一定的開發成本。

• 優點：空間占比小，無需用戶對標簽進行記憶
• 缺點：需要一定的開發成本

關于標簽樣式的選擇

2. 輸入域

輸入域是表單的核心主體，包含了文本框、選擇器、開關、復選框、單選框、步驟條、滑塊、上傳、標簽頁等控件（按類型分）。

選擇適合的控件樣式，能在一定程度上提高表單填寫的效率。

在輸入域中，存在多種控件樣式，那么在設計產品的過程中，我們該如何選擇，如何取舍呢？

以下是我在日常工作中的一些摸索，也包括借鑒前輩的一些經驗。供大家參考。

1）文本框

文本框包含了單行文本框和多行文本框。

針對單行文本框的設計建議：

a. 選擇適合的大小，它的寬度應該向用戶暗示所需輸入內容的長度來減輕判斷負擔。

如下圖即一典型案例，一個實際不需要花多少錢的金額輸入框在左圖中進行等寬處理的話，容易誤導用戶對所需輸入金額的判斷，造成極大不安全感。

b. 采用字段掩碼，自動匹配特定數字的輸入格式。

例如：電話、身份證、銀行卡等；按照7加減二法則，根據用戶的記憶結構來最大化提升閱讀體驗。

c. 彈出鍵盤應與需要輸入的文本類型相匹配（移動端）。

d. 涉及到金額輸入時，當用戶輸入的金額超過千時，出現最高分位提示，每多輸入一位，最高分位隨之增加。

e. 文字輸入最好有自動補全、自動建議功能，減少不必要的文字輸入，減少出錯。

例如：填寫地址欄通常是表單中最成問題的部分，像地址自動填充（基于用戶的定位和輸入提供準確的建議）的工具使用戶能以更少打字量完成輸入。

f. 有限制輸入時，給予用戶明確的提示，增加用戶感知，減少出錯率。

知識擴展：什么是7加減二法則？

早在19世紀中葉，愛爾蘭哲學家漢米爾頓觀察到，有一個神奇的7±2效應；意思就是人們的短時記憶的信息量是7個，可能會上下浮動2個。

針對多行文本框的設計建議：

使用可拉伸的文本框比固定框更好，從使用體驗講，可變化的文本框使頁面整體效果更統一。

固定文的文本框當輸入文本超過其設置的寬度，會出現內滾動條，當頁面上出現兩個滾動條時（大頁面的滾動條），在使用操作上會帶來一定的混亂。

2）選擇框

包括下拉列表、選框、開關、日期選擇器等。

對于選擇框有如下幾個建議：

a. 避免設置默認值：除非您認為大部分用戶將選擇該值，尤其是必填字段。

為什么？

因為你可能會增加錯誤，用戶會快速掃描表單，所以他們可能會跳過一些已經有默認值的字段。

但是這個規則不適用于智能的默認值，也就是根據用戶的信息設置的默認值；因為智能的默認值可以使表單更快，更準確地完成。

例如：根據定位數據預先選擇用戶所在的國家/地區。

不過，請謹慎使用。

b. 當選項很多時，提供檢索功能。

c. 提示信息要明確，要讓用戶明確自己選擇的是什么。

3）單選框與復選框

a. 按一定的邏輯進行選項排序，例如根據發生的可能性、難易程度、風險大小來排序。

b. 選項應該易于理解，容易區分。

c. 盡可能提供默認選項。

4）關于控件的選擇

a. 選擇框優于輸入框。

任何高密度的操作，都會引起用戶的不適；因此，在輸入項的選擇時，用選擇來代替鍵盤輸入。

• 一方面：簡化用戶的操作，點擊次數遠小于輸入，減少用戶的操作密度；
• 另一方面：減輕用戶的認知、記憶負擔。

相較于輸入框，選擇操作步驟少，相對來說效率較高；同時，用戶用思考輸入值，也不用承擔輸入錯誤要重新輸入的風險。

用戶可以通過選擇項，清晰明確的知道有哪些值可以選擇，對于一些無關緊要，或者用戶較難理解的輸入項，可以預制默認值，可以照顧到各階段的用戶。

b. 單選框與下拉選擇框。

單選框較為適合選項較少（少于五個），同時選擇項之間較為類似，需要強調或對比時，可以優先考慮單選框。

另外，當選項能見度和快速響應優先時，也建議優先考慮單選框。

因為相較于下拉選擇，用戶可以通過展示出來的選項，直接選中目標選項，提升輸入效率。

下拉選擇框較為適合選項較多（超過五個），有默認選項或者選擇項之間有較大差異，同時下拉選擇，最好不要引起隨后輸入項數量以及頁面的變化；否則下拉選擇的收起以及頁面的變化，易引起用戶不適。

若選項過多，超過二十個，最好引入模糊匹配以及一定排序規則（首字母排序、數字排序等），方面用戶提前預知選項的大致位置，或通過模糊檢索找到相應的選項。

5）關于必填項

大多數情況下，所有字段都是必填項，只有幾個字段是可選的，一般用“*”標記必填字段。

但星號并不適合所有類型的用戶，記得之前客戶問星號是什么意思？

它是頁面中的標簽還是描述中的標簽；同時，并且紅色會從用戶方面引起負面關聯，因為紅色表示錯誤。

為了避免這種誤解，可采用文本框內暗提示。

它也是一個比較清晰標志必填項的方式，并且還很節省空間，也能在一定程度上起到視覺降噪的作用。

3. 提示信息

提示信息可以分為引導性提示（幫助文字、輸入框提示、錯誤提示信息）和反饋性提示兩種。

這里主要想講講錯誤提示的設計：

1）關于錯誤提示的最佳位置

Javier Bargas-Avila和Glenn Oberholzer對表單驗證的研究發現——在表單頂部顯示所有錯誤信息，會給用戶的記憶造成較高的認知符合，會強制用戶回憶每個錯誤輸入框中的錯誤消息。

錯誤信息提示在輸入框行間顯示是減少記憶認知負荷的有效方法。

它可以幫助當場識別錯誤而不是靠回憶錯誤，縮短反應時間，提高表單填寫效率。

因此，錯誤信息提示與錯誤的字段鄰近放置可以獲得最佳性能。

下面來看一個簡單的例子，如下圖：

當我們在錄入客戶信息時，假設填寫錯誤手機號碼，按照上面的論述，錯誤提示可以最直觀的顯示在這4個位置。

哪一個位置是最佳位置呢？

答案是：右邊。理由如下：

a. 錯誤信息提示右邊，符合人們從左到右的閱讀習慣；用戶視覺路徑自然流暢，很大程度上減少了用戶的精力和視覺工作。

放在左邊則恰恰相反，同時左邊與用戶期望相違背，因為左側放置更高優先級的元素，是我們的直覺。

但事實上用戶需要專注于糾正他們的輸入，因此輸入框應該是更重要的元素。

b. 對于上邊的錯誤信息提示，有著更高的認知負荷。

當標簽頂部對齊時，錯誤提示和輸入框中的提示這兩個文本靠得很近會產生視覺噪音，用戶注意力被分散，很難專注于其中一個，并且可能混淆它們。

c. 放置下邊的錯誤信息提示，雖然不符合從左到右的閱讀習慣，但它確與自然的從上倒下的閱讀流程相對應。

手機屏幕缺少水平空間，把錯誤信息提示放置在下方是個不錯的選擇。

雖然它可能會增加用戶閱讀文本時的認知負荷（與類比上邊的錯誤信息提示），但可以通過將它們隔開足夠的間隔來防止這種情況。

綜上所述，如果是web端請選擇放置在右邊，如果是移動端則放置在下邊。

當然，如果開發時間有限，都選擇放置下邊也可以，方便適配。

2）幫助信息

有時候需要幫助性信息，來輔助用戶完成表單填寫。

當文本簡短的時候，可以直接放在改輸入框的附近。

當文案過長的時候，就需要做氣泡框——獲取鼠標焦點，則展開信息，失去焦點則消失（在氣泡展開時，切忌勿擋住input輸入框）。

也有些產品是將幫助信息放在頁面頂部，如果是針對全局幫助性信息，則可以采用這種方式。

如果只是針對某個元素提醒，則應將兩者放在一起，讓用戶知道當前處于什么地方，在針對什么進行引導、輔助。

五、復雜業務表單布局結構探索

在復雜業務表單設計中采用單列布局，大家有沒有遇到過類似的問題，例如：

• 客戶1：“單列右側空白區域過大，留白多，表單太長啦?！?/span>
• 客戶2：“單列縱向占比大，表單太長，我看不到全部內容?！?/span>
• 客戶3：“怎么不采用多列，多列我能看的內容多啊”等等…

針對這些問題，我們團隊從自身的業務出發，對復雜業務表單布局進行了相應的探索。

1. 多列與單列的探索

首先，我們根據下圖的規則對復雜業務的表單布局進行多方案的實驗：

方案一：采用4列布局，標簽頂對齊。

那為什么標簽不采用右對齊呢？

四列布局，頁面已經很擁擠，加上標簽長度長短不一且最大長度也無法確定（用戶自定義），所以放置采用了標簽頂對齊。

總體上來看，縮減的長圖并不理想。

方案二：三列布局，標簽右對齊的方式。

由于三列布局，頁面空間較大，嘗試著把標簽右對齊，總體上達到了縮減表單長度的目的。

但字段若出現換行，則頁面信息模塊是混亂的。

根據CXL研究所的發現：單列表單比多列表單完成得更快一些。在這項研究中，參與測試的人完成單列表單的平均速度比多列表單快15.4秒；多列布局雖然縮減了表單長度，空間利用率也提高了，但整體的填寫效率降低了，這與表單設計原則相違背。

同時從開發效率來看，單列成本較低（多列需要做響應式）；從業務承載上看，單列擴展性更強，適合復雜多樣的業務場景（多列適合交單一的場景）。

綜上，最后還是采用單列布局。

2. 單列布局在復雜業務中運用

面臨的問題該如何解決？

我們團隊重新審視了客戶的這些反饋：空白區域過大、留白過大、表單太長、我看不全、不知道什么時候可以填完等等。

我們嘗試把這些問題翻譯成：我無法預知表單的填寫內容，我想要是把空白的地方也利用上我是不是就看全了整個表單。

如果是這樣，用戶的本質述求就是想要掌控感。

對現有的單列布局做了以下幾個處理：

• a. 采用卡片式布局，區分內容；
• b. 增加引導式的定位錨點；
• c. 在錨處加入微動效反饋，給予用戶確定感。

感謝閱讀！本文給表單設計提供了一個基本的指南，在具體項目中，你可能需要根據產品特性和用戶需求進行調整。

文章來源：人人都是產品經理           作者：@Nick 

藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

編輯導讀：如今，谷歌可以說是科技領域最大、最具有影響力的公司之一。正因為如此，它們的數字產品設計會對整個行業產生巨大的影響，成為人們競相模仿的榜樣。在該公司的UI&UX（用戶界面&用戶體驗）設計指南中，設計師們提到了10條原則，不管是iOS還是安卓系統都同樣適用。在這篇文章中，作者從這10條指南出發，加上自己的經驗和相關案例，在設計方面為大家提供一些建議，希望對大家設計產品有幫助。

6. 利用聲音和觸感喚起用戶的情感

這里的聲音特指“Hero sounds”，用于襯托一些喜慶的、重要的高光時刻，它們常被用來激起用戶的情感，或烘托一種喜悅的氣氛，從而塑造產品或品牌在用戶心中的形象。以下場合適合使用 Hero sounds：慶祝用戶進行了某項操作；歡迎用戶使用新的應用程序或體驗；確認用戶成功使用某款產品?！豆雀杪曇粼O計指南》

聲音可以被用來傳遞成功、成就或獲得回報等信息。谷歌指南中提到，Hero sounds出現的次數不應該頻繁，否則無法突出其重要性。通過在同樣的環節提供同樣的聲音，久而久之用戶會將這種提示音與成就感掛鉤，從而增加對產品的粘性。如每成功更新一次應用程序就會出現慶祝的聲音，或者每次待辦事項標記為完成后就會出現慶祝的提示音。

不管我們是否注意到這一點，我們所聽到的產品的聲音與自己的感覺都是相掛鉤的。無論是手機發出的“叮咚”的消息提示音，還是MacBook的廢紙簍在清空時發出的揉紙的聲音，都在某種程度上影響著我們的情緒，也幫助我們更加了解用戶界面上發生的一切。

觸覺可以和聲音配合使用，也可以單獨使用。舉個例子，在手機黑屏的時候，觸覺是唯一一種可以對用戶提供反饋的方式。和其他配合使用時，觸覺應該強有力、傳達愉悅的情緒?！栋沧坑|覺設計指南》

除了聲音之外，觸覺設計（如震動）也是一種刺激感覺的好方法，可以為用戶提供更加完整的體驗。用戶可以通過觸覺提示來嘗試、學習使用某一款產品。在有了不同的觸覺體驗后，我們將會對產品的某些功能有更加深入的了解。

舉個例子，如果某個用戶通過APP進行付款，但在付款過程中出現了錯誤。這時候APP會進行一連串緊張、短促的震動，對用戶進行錯誤反饋。當用戶熟悉了這種震動模式之后，下一次再感受到這種震動，就會立刻知道付款出現了問題。

產品設計師很容易忽略聲音和觸覺這兩個板塊，而過度專注于畫面。但這兩個板塊卻也扮演著非常重要的效果，可以為用戶體驗錦上添花。

7. 通過動圖表達獨特的風格、塑造個性化品牌體驗

圖片來自Material

動圖可以增加用戶的好感，在互動中為用戶增加個性化體驗，也可以表現品牌獨特的風格?！豆雀枋謩菰O計指南》

動圖是我自己設計的產品Confetti中一個非常重要的因素，這是一款運動追蹤APP，是為那些追蹤自己生活習慣的用戶設計的。在設計這款產品時，我希望可以為用戶創造出一種滿足感，鼓勵他們培養好習慣。在這款APP中，我大量使用切換功能，通過不同的手勢，界面或進程可以平滑過渡，使用起來非常便捷。當一個好習慣完成時，還會出現彩屑動畫飛舞的，加強用戶的滿意度。

簡言之，動圖可以應用于不同的場景，通過過渡和變化的吸引用戶。

動圖可以強化兩種元素之間的聯系，實現快速切換，迅速解決特定的任務。動圖可以讓用戶專注于眼下最重要的事，不被其他因素所干擾?！豆雀枋謩菰O計指南》

在2020年，你的產品可以在一秒之內激怒用戶。正如塔拉斯·斯凱斯基（Taras Skytski）在《用戶體驗設計中動畫使用的終極指南》中指出的那樣：“眾多研究發現，界面動畫的最佳速度在200到500毫秒之間。這一數字是通過研究人類大腦運行機制所得出的。100毫秒及以下的動畫因為速度太短而無法被識別，而超過1秒的動畫則會造成一種延遲感，讓用戶感到不舒服?！?/span>

通過動圖及產生的動畫效果（如切換）可以改善用戶體驗，同時保證可以迅速找到需要的版面，而不被其他信息干擾。但如果動圖及切換畫面的過程增加了不必要的等待時間，又不能改善體驗，那么這種環節就沒有必要存在。

8. 通過圖像進行交流，并區分和突出產品特性

圖片來自Bribble｜制圖Elena Petkovska

我們或多或少都有這樣的體驗：打開一個界面，里面充斥著太多文字和太少的圖像。在用戶體驗設計中，展示畫面比閱讀文字效果更好。用戶不希望通過閱讀來理解一款產品，而是希望通過圖像對一款產品進行直觀的視覺理解。

你所選擇的圖像應該能夠清晰地展示產品特點，不管是用戶自己上傳的圖片，專業攝影師的圖片，還是插畫風格的圖片，它們都應該能直觀展示產品外觀，反應產品的特點?！豆雀鑸D像設計指南》

APP里的插圖和所有的視覺元素一樣重要，好的圖片可以讓用戶界面更加生動，使用戶體驗更加完善。恰當的圖片還能展示品牌風格，成為無聲的“故事講述者”。

我們應當有目的地使用圖像，作為總體內容的補充而非替代。照片或者插圖最好能夠傳達足夠的信息，如產品外形、風格，APP的用途，狀態等。媒體界有這么一句話：一張圖片抵得上1000個字。你可以在Unsplash、Pexels、Adobe Stock等網站上找到高質量的圖片。

9. 關注產品的像素密度

圖片來自Material

用戶界面設計中應該關注產品的像素密度，讓界面可以適應不同的屏幕?！豆雀柘袼孛芏仍O計指南》

像素密度（PPI）是用來衡量每物理英寸的像素數。另一個常用的單位是DP（Density-independent pixels，有時候簡稱為DIP）。像素密度=屏幕寬度或高度（以像素為單位）/屏幕寬度或高度（以英寸為單位）。

在設計界面時，我們不應該只關注像素，還應該關注不同設備的像素密度。這樣可以讓我們在做設計時保證元素適當縮放，以適應不同屏幕的尺寸。

舉個例子，我們現在有一個按鈕素材資源，大小為200 x 50 px。在一個160ppi的屏幕上可以原畫顯示；在一個320ppi的屏幕上它就會擴大成400 x 100 px，相當于原始素材的兩倍大。

通過以上例子我們可以了解，在像素密度不同的屏幕上，素材呈現的狀態是不一樣的。在實際應用中，素材可以會被放大三倍甚至四倍，如果素材不夠清晰，就會在拉大后虛掉。這就需要我們在選擇素材時格外謹慎，嘗試在不同設備上打開并檢查。

素材密度如何適應屏幕尺寸？舉個例子，iPhone XS Max的屏幕是414 x 896 pt，注意這里的尺寸是物理尺寸pt，而非像素。如果以像素為單位計算，那么它的屏幕是1242 x 2688 px。所以當我們為iPhone XS Max設計應用產品時，我會首先考慮用414 x 896 pt的素材，然后在輸出素材時將其乘以3。

10. 考慮設計在線/離線狀態

圖片來自Material

離線狀態可以讓用戶知道這款應用程序沒有連接網絡。如果你的產品有一些功能需要聯網使用，你最好能向用戶明確顯示連線狀態。——《谷歌離線設計指南》

離線訪問功能是設計師經常忽略、對用戶體驗影響卻非常重要的一環。雖然有些功能離線也可以使用，但是在能聯網的時候，最好還是主動提示用戶，推薦他們連接網絡。

如果有可能的話，要提前告知用戶下載相關信息，以便脫機訪問。最常見的例子就是Spotify等音樂應用程序，它允許用戶下載歌曲，以便在沒有網絡的時候也能繼續聽歌。

假如你的產品不像Spotify或者Netflix那樣需要下載具體內容，你可以發揮創意來設計在線、離線兩種模式。

谷歌瀏覽器在離線頁面提供恐龍游戲就是一個著名的例子（在谷歌瀏覽器連網的過程中，離線畫面會出現一只霸王龍，按空格鍵或者向上的箭頭就能控制霸王龍——譯者注）。這個小游戲填補了用戶等待連線的時間，將消極體驗轉變成了積極體驗。

11. 總結

我希望這份設計指南可以為你提供一些想法。除了谷歌的設計指南之外，我們還可以在IEM Carbon、Zendesk Garden、Workday Canvas等網站找到關于用戶界面和用戶體驗的設計指導，在這一領域進行更深入地探索。

文章來源：人人都是產品經理           作者：Danny Sapio           譯者：Michiko

藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務