作者通過從會員體系構成的4個核心要素對“京東、亞朵、支付寶、騰訊理財通”的會員體系進行拆解，發現不同類產品中的設計會員體系需要注意的問題。
一款產品要想持續獲取用戶價值，前端增長和后端活躍、留存與轉化缺一不可。隨著流量越來越貴拉新成本越來越高，多數互聯網公司開始將用戶活躍與留存視為產品核心指標，而會員體系一直以來都是最有效的活躍留存與轉化的運營手段之一。
本文對比4款目前付費類產品中比較典型的“京東、亞朵、支付寶、騰訊理財通”的等級會員體系，分別代表4種不同的等級會員體系類型。從會員體系構成的4個核心元素：命名、層數、成長值計算、會員權益，來快速了解一款產品的會員體系。
希望通過這篇文章給在做會員體系抓耳撓腮的你一點啟發。
會員命名是品牌文化、用戶群體特征的體現，而會員層數的多少則反映了產品轉化路徑的長短。
京東會員分為非付費會員（下稱等級會員）和付費會員兩個體系。為了凸顯付費會員，2019.9.15日起，取消了等級會員原有的銅銀金鉆制會員體系，以京享值代替。
至此，從會員命名的角度，京東的會員只有付費會員和等級會員兩種名稱，等級會員會員之間以京享值的大小進行區分，共分為5層。
亞朵會員在命名方面充分體現了“舒心微笑”的品牌特征，等級會員共分為5級，分別為注冊會員（初遇）、銀會員（識君）、金會員（知己）、鉑金會員（執手）、黑金會員（逍遙）。括號內的短稱分別來對應著兩句詩詞，詳見官網的會員介紹。
支付寶等級會員共分為4級，分別為大眾會員、黃金會員、鉑金會員、鉆石會員。從級別數量來說，支付寶會員級別相比于前者少了1級，會員升級的難度也加大了。
騰訊理財通等級會員共分為4級，分別為普通會員、白銀會員、黃金會員與鉑金會員。顏色區分上，級別從低到高顏色分別為藍灰色、銀灰、金色、黑色，通過灰色調營造理財產品的嚴肅和專業感。
【注：等級會員是指，會員級別不能直接購買得到，而是要通過完成產品任務升級達到。付費會員是指，用戶通過付費購買產品會員特權，購買的會員獨立于非付費會員，不是非付費會員的某一級】
通常會員命名會以金屬作為主線，其中金、銀、鉆石等最為常見。
這是用戶已經熟知的命名方式，遵循以上規則有助于用戶更快的接受會員身份。但如果產品有特殊的品牌文化和目標用戶，可以考慮在命名上加入品牌元素，如亞朵。
付費會員與等級會員之間具有重疊性。
高階的等級會員分散了用戶對付費會員的注意力，因此京東最終不得不對等級會員體系采取“除名”做法。
付費會員必然會導致原等級會員體系影響力的削弱，在初始設計時需要綜合考慮付費會員和等級會員體系在維系用戶、營銷行為等方面的價值，做好取舍。
此外，還可以參考亞朵酒店的做法，將等級會員的某一級作為付費對象來售賣，如下圖，亞朵酒店將會員體系中的第三級【金會員】單獨售賣。
不同產品的會員層數不同。
電商等付費類產品會員普遍采用4-5級的分層、資訊類產品的會員體系可多達10級，如趣頭條等；社交、游戲類產品更是根據玩法的不同，設置幾十級的會員等級。
會員定級層數主要取決于產品的轉化路徑長短：
付費類產品轉化路徑短，用戶使用產品就一定會付費，因此只需要根據用戶實際消費能力進行用戶分層，4-5層即可覆蓋用戶的全部消費能力。
但社交類產品轉化路徑長，需要用戶長期活躍在產品內才有機會轉化付費用戶，會員級別需要足夠多，才能保證用戶有動力持續的活躍和留存。
此外，從成本的角度考慮，付費類產品的會員權益通常為商家的折扣和返利，會員級別越高企業付出成本越高，
級別過多會導致企業難以承擔成本，而社交、游戲類產品的會員權益通常為虛擬的勛章、身份象征等，即使會員級別高達幾十級，也不會產生過多的成本。
下圖是趣頭條10級會員的權益，可以看到權益大多數為榮譽勛章類虛擬獎勵，企業幾乎不需要付出成本。
成長值是用于衡量會員級別的刻度，用戶通過獲取成長值來達到升級、保級的目的。成長值的獲取方式體現了產品主要的運營動作，而計算公式也根據業務變動速度和產品特點有所不同。
分析如下：
京東的主要運營動作包括以下幾方面：提高用戶消費，促進用戶活躍、收集用戶信息、建立信用評分體系等。
京東成長值的具體計算公式并未明確給出，因此可以推斷其業務調整快，變動幅度大。不公布具體計算公式可以靈活的調整成長值計算公式，但也犧牲了用戶的確定性體驗。
分析如下：
亞朵對用戶的主要運營方向為消費和互動，運營動作主要是圍繞著訂房和相關服務展開。
成長值計算兼容地區差異：酒店業務通常分布在多個城市，每個城市的消費水平差異很大。若僅僅以消費金額來衡量會員級別，會導致大多數的高級會員都集中在高消費城市，無法實現對二三線城市的用戶激勵。因此，酒店行業會員的成長值通常結合間夜和消費金額綜合計算。
酒店預定更加依賴于用戶渠道，包括OTA（美團/攜程等平臺）、自營渠道、分銷商等。不同的渠道企業付出的成本不同，會員體系通常只給自營渠道的用戶計算成長值。如亞朵。
分析如下：
支付寶主要的運營動作包括促進用戶消費購物、完成生活繳費和增加金融理財。生活繳費任務的成長值獎勵較高，可以推測占據用戶生活支付場景是主要運營方向
支付寶的成長值計算公式為白盒，這與理財類產品性質相關，由于涉及到用戶的金錢投入，更需要獲取用戶的信任，明確的計算方式能夠帶給用戶確定感。
分析如下：
騰訊理財通的主要運營動作包括促進用戶購買理財、激勵用戶完善個人信息。騰訊理財通的會員任務多達27個，收集用戶信息的任務占到1/3，可見完善用戶畫像為產品的主要戰略。
理財通會員成長值的計算公式同樣為白盒，清晰的展示用戶完成任務能獲得的成長值。
（注：數字標記表示用戶級別，其中高級會員擁有低級會員的全部權益）
騰訊理財通會員等級禮遇如下圖所示：
通過分析會員體系的4個核心元素：命名、層數、成長值計算、會員權益，可以迅速讀懂一個產品的會員體系。
一個好的會員體系能夠通過選擇合適的會員命名、設置符合產品轉化路徑的會員層數、設計涵蓋主要運營動作并能靈活調整的成長值計算體系、提供滿足用戶核心需求的會員權益。最終形成業務閉環，引導用戶價值逐步提升，實現用戶價值的最大化。
文章來源：人人都是產品經理
本文分享國際化司機端首頁改版完整思考過程，化繁為簡提升司機使用效率，提升產品用戶體驗。
隨著滴滴國際化業務腳步不斷加快，司機端始終是作為承載全球化業務運力的基礎保障。
同時，在移動通信技術高速發展的背景下，不同國家間的傳輸速度與硬件設備差距正在不斷縮小，用戶對應用產品的期望由基礎的可接受、可使用、功能齊全，向更易用、簡約、更為專注的產品使用體驗上轉變。
在新階段下，「為全球司機用戶提供一個「克制」「可依賴」的產品使用體驗」、「為業務拓展提供有力的體驗支撐」是體驗設計團隊在新的階段下提出的目標。
2018 年 9 月我們與產品同學深入拉美當地對司機側進行為期 2 周的產品體驗調研。雖然在當地的時間較為短暫，但是我們依舊感受到了拉美國家的習俗文化和人文特點。
相比中國人的含蓄內斂，巴西與墨西哥人顯然更加熱情隨和。
在巴西，這個世界上假期最多的國家，處處體現著人們對生活的享受才是自始至終的追求。無論是世界杯一個月狂歡長假，還是周末下午兩點開門的商區，總會讓人羨慕的同時刷新你對享受生活的認知。
而娛樂至上的墨西哥人，熱情友好，能歌善舞，我們常說的放飛自我在這里幾乎成為墨西哥人每天的生活常態。他們喜歡享受當下，后天下之憂而憂。他們覺得工作賺錢就是為了更好的休息，大多數人每天都是開朗樂觀的處世態度。
同樣，落后的基礎建設、糟糕的交通狀況、教育水平低下、價格昂貴的電子產品以及相對不太穩定的社會環境，也是它們共同存在的問題。
在當地，我們通過實地調研與用戶訪談等方式，針對產品體驗的問題與司機進行面對面溝通。收集了很多寶貴的用研資料與司機訴求，如司機希望平臺為他們推薦訂單引導，司機希望獲得更多的實時動態訊息和司機每天都可以查看自己的收入狀況等，集中體現在效率、感知、體驗這三大方面。
其次，伴隨著業務的不斷增長，越來越多的功能使得我們的產品變的更加復雜，舊版的框架布局早已是不堪重負，無論是現存的體驗優化問題，還是未來業務功能的拓展問題，舊的框架體系都是難以為繼，無法再通過簡單的修補來滿足用戶和業務未來的訴求。
改版升級對產品本身來說是一件非常重要的事情，需要對多方因素進行慎重考慮。經過多次的溝通討論，權衡改版對產品可能產生的利弊關系，采用小步快跑，快速試錯，分階段分模塊的方式進行。
首頁既作為承載核心功能（發車）的載體又是其他重要板塊的分發的入口，在內容呈現與用戶感知上都存在很大的體驗提升空間；我們通過拆解業務中長遠需求規劃得知，大多數重點需求依賴于首頁框架布局，而現存首頁框架無法滿足業務訴求；在競品的改版中首頁的變化最大，并在司機群體中取得比較正向的反饋；通過上述分析，決定率先對首頁進行優化改造。
首先我們與產品、運營側進行深入討論，結合用戶訪談整理的用戶訴求，對此次首頁改版的目標達成一致。
在舊版的框架體系中，大量信息在首頁呈現，功能層級復雜，重點功能難以突破和查找，關聯較弱的信息架構嚴重影響和分散了司機的關注點。隨著業務模式不斷擴展，首頁新需求類型逐漸增多，一套更加具備靈活的拓展能力和管理能力的首頁框架尤為重要。
首先我們將舊版的首頁布局打破重建，對現有模塊進行整理。功能相似、定義模糊、司機操作相對低頻的模塊進行合并、刪減。
對司機高頻操作模板進行場景劃分，將相關信息進行聚合處理，通過對入口的強化，來明確司機對不同模塊的認知。
出車管理
將與出車相關信息進行組織聚合，結合司機不同的使用場景，將功能與模塊進行結合，加強認知，減少司機多余的思考與判斷，快速響應，提升工作效率，同樣也為業務在有關出車功能方面提供靈活可拓展的組件框架。
收入管理
通過顯示司機最關注的今日收入信息，為司機提供方便快捷的查看功能，使司機更專注于工作本身。同時對收入管理入口起到了強化認知作用。
信息管理
對關于個人相關的信息通知及功能操作進行聚合，方便司機對個人信息進行快速查看，提高查看效率。
通過對框架模塊的標準化定義，后續的業務需求便可以進行歸類管理，根據不同需求的不同屬性，結合功能使用場景，選擇合適的模塊進行展示，提高司機使用效率同時增加首頁的業務框架擴展能力。
通過對框架的重構，有效的解決了首頁信息承載壓力過大，功能層級復雜的問題，同時地圖的面積相比舊版首頁也大幅增加，信息呈現更加簡潔、輕量。
出車操作作為首頁的核心功能，通過調研得知，司機普遍反映在舊版首頁中存在出車操作感知弱、收出車狀態區分不明顯的問題，對司機的操作體驗和感知體驗造成了比較大困惑。
在首頁改版過程中我們著重對出車操作進行了設計分析，基于對業務的了解和競品的分析，得出以下三個結論：
通過「兩強一弱」，減少司機困惑提升發單效率的同時，間接的延長司機的在線時長。
完成頁面設計后我們發現，操作按鈕通過靜態視覺角度去表達收出車空間位置關系是十分困難的，僅通過 Toast 提示會造成用戶理解的斷層，于是提出使用動效去進行「搭線」串聯，搭線發車前按鈕的點擊和收納后的位置提醒進行視覺體驗上的串聯，從而達成感知增強，解決視覺體驗層面不容易解決的問題。
豐富的訂單獎勵活動是我們與競品相比重要的競爭優勢，司機在完成定量訂單的同時提供了更多的額外收入。查看每日獎勵活動，已成大多數司機每日上線必做的事情。
與舊版相比，在新版首頁中通過提升獎勵入口層級，縮短了查看獎勵活動操作路徑，從而方便司機快速查看。
通過首頁透傳的獎勵卡片，司機在首頁即可獲取到推送的獎勵相關信息，及時獲取到獎勵預告和進度，提升了司機工作效率的同時加強了司機對獎勵活動的感知。
在經歷了快速奔跑的粗放階段，我們也在思考司機端產品究竟以怎樣的品牌氣質傳遞給海外的司機群體。
在當地，我們在司機心目中更像是合作伙伴，憑借真誠互利的態度贏得了當地司機的用戶。
真誠、熱情與融合我想這就是我們想要傳達的核心品牌情感，而克制、可依賴將作為產品體驗的設計原則貫穿始終。
顏色系統
司機端顏色系統在基于現有品牌色基礎上，結合不同國家顏色文化的理解，新增加符合本地化的輔助色系，以提升產品的親和力，傳遞品牌情感。
文字系統
針對司機用戶的操作使用場景，對文字字號梯度進行提升，通過文字粗細、顏色、大小加強信息對比度，使司機在更多復雜場景下可快速獲取重要信息，提升閱讀體驗。
在此次改版中新引入 Barlow 與 DIN Alternate 字族作為模式數字展示字體，兩款字體分別為 Android 及 iOS 系統下默認包含字體，相比 Roboto 與 SF Pro text 兩款字族，在數字展示上更為明確、識別性更強，同時因為自身「纖瘦」的特性，在屏幕橫向面積上節省更多空間。
業務在不同的階段有不同的側重方向及打法，設計側根據業務所處階段應及時的調整自身的目標定位，快速響應，積極探索設計的機會和突破點，在不同的階段發揮自身價值，助力業務達成共同目標，為用戶創造更便捷的產品使用體驗。
首頁改版從立項到設計再到研發，多部門同學緊密配合，在有限的時間內最大化的完成預期上線效果。
全量上線后，通過問卷對首頁改版進行滿意度收集，司機對新版首頁的滿意度平均值高達 93%。取得的成績離不開每一位參與改版的同學支持，也得益于國際化團隊自始至終對產品體驗的重視與認同。
作為司機端體驗升級的第一步，首頁改版只是一個開始，希望通過不斷的打磨優化，秉持初心，為全球司機提供更克制、可依賴的出行平臺。
文章來源：優設
首先來解釋一下什么是動態布局：
所謂動態布局就是可以通過修改內容實現關聯內容自動改變的布局方式。
在 sketch 45 之后的版本，我們可以通過 resizing 對元素的上下左右邊距進行固定，來實現頁面布局的動態響應。這種響應是被動的，需要我們拖拽著它，它才能給出反饋。雖然不是多么的聰明，但是這種被動的方式解放了很大一部分生產力，足以讓你鄙視一下 Photoshop 的 UI 設計了。
有了被動響應，自然也想要有主動響應，通過改變元素內容去改變布局。之前在 sketch 里面一直有一個功能：文字尾部跟隨（間距在 20px 以內，后面可跟文字或圖標）。如圖：
功能雖單一，但在工作效率上帶來了極大的提升。當然我們想要的更多
比如：
一個標簽，我希望可以跟隨文字長度而自動適應。
△ 不是這樣
△ 而是這樣
在 Sketch 58 之前，我們可以通過 kitchen 或者 Anima 等外部插件實現這類效果。但是這類插件在創建為組件以后會出現一些莫名的抽搐，可用性不高。在 Sketch 58 之后 Sketch 自身就攜帶了這些技能，可以實現一些動態布局，不過目前來看它還是存在一定的局限性，它的動態布局是基于 symbol 的。但我們不會為了布局而刻意去做 symbol，這會加重組件庫的維護負擔，在整體的收益率及效率上不見得能帶來多大的提升。組件庫應盡可能的保證干凈、靈活以及它的實用性。
我們取長補短。所以，這里要講的不是某一個插件或某一個功能，而是結合插件與自身的布局來達到足夠的穩定與，解放雙手，釋放大腦。
這里主要通過介紹 Kitchen、Anima 和 sketch 的布局部分，整合它們各自的優勢來做一系列的動態布局。
對比一下各個插件之間的差異
Kitchen
輸入按鈕的上下左右邊距，讓文字與按鈕背景的邊距固定。改變文字寬度，按鈕寬度隨之改變。
Anima Padding
Anima 不需要手動輸入邊距，插件會自動保留文字周圍的邊距并生成 padding。
Sketch 布局
sketch 也不需要手動輸入邊距，但是需要將想要實現動態布局的內容創建為組件，在創建組件的過程中可以對它的動態方向進行限定。這里一共七種模式（無、水平「從左往右、居中、從右往左」、垂直「從上往下、居中、從下往上」）。文字的對齊方式最好和布局的動態方向保持一致。
可以看出 Anima 和 Sketch 會更一點
我們可以讓按鈕再可以復雜一點。
比如加個 icon：
或者換個行：
在一個維度上的動態改變，大家應用得都挺好。但 Sketch 組件在文字換行時并沒有在縱向上去改變高度。
解釋一下：
按鈕、標簽等這類元素，我們通常都會創建為組件，方便我們管理及調用。接下來我們把剛才做好的動態按鈕組件化，再來看看它們是否能實現動態響應。
Kitchen
Anima
Sketch
在組件化之后，Anima 出現了未知錯誤，按鈕并沒有任何變化。在實際使用中，sketch58 之前的版本可以正常變化。58 及其之后的版本暫時會出現問題，把 Anima 更新到 3.2.2 之后，官方更新說修改了 symbol 之后的 padding bug，但是在實際使用中并沒有帶來改善。
所以在這里不建議用任何第三方插件去做 symbol，即使 Kitchen 在這里沒有出現什么大的問題，但在實際操作中的響應速度及穩定性都比較差。此外 sketch 的更新速度很快，大多插件很難即時跟上它的更新速度，從而導致一些不可預知的問題。為了組件的可維護性、自身安全，請盡量用 sketch 的自帶技能去搭建組件。
按鈕或標簽這類組件通常會多個同時出現，比如這樣：
這樣：
我們可以通過以下幾種方式快速實現布局：
Kitchen
Anima
Sketch
其中 Kitchen 和 Anima 可以實現全自動的動態響應，包括復制、刪除等操作。而 Sketch 需要手動去維護或者創建為組件后才能實現全自動的動態響應。
這里傾向于直接利用 Kitchen 或 Anima，不會產生不必要的 symbol，但同時也能提升我們的設計效率。對比 Kitchen 和 Anima，Anima 的響應速度更快，功能更豐富，在實現固定間距的同時可以保證對齊方式。具體的應用場景，我們后面會講到。
動態的組件，結合固定間距可以實現一系列便捷的操作。接下來我們講一些具體的實現效果。
基于上面的結論，我們在這里的動態組件都會用 sketch 的布局功能來搭建。
label 在之前的版本中不需要特殊處理，因為有尾隨功能。59 版本之后這個功能被移除，新的布局可以完全取代它了。這里我們手動配置一下水平方向的布局。
注意文本的對齊方式與布局方向要保持一致。
再利用 「Anima-Padding」/「Kitchen-自動排版」 實現動態布局。
Anima 需要合理編組來實現
圖標解釋
△ Padding（內邊距）
△ Stack（堆載）
導航欄也是常用的組件之一。
首先創建「選中」與「未選中」兩種狀態組件。也可以用一種狀態（選中狀態）通過控制元素隱藏/顯示、修改文字樣式等來實現狀態改變。不過操作比較繁瑣，這里就不推薦了。
這里的選中狀態需要用到 sketch 的水平布局，短橫線才可以跟隨文字動態改變。
置入建立的組件，確定好間距，再次建立組件，保持水平布局。就可以得到一個動態的導航欄了
也可以用 Anima/Kitchen 的布局去實現這個效果。
再次強調：Anima/Kitchen 的最好不要作為組件使用。
通用性強，復用率高的組件建議用 sketch 的布局去建立組件。
如何把大象放進冰箱
這里要實現的效果是「改變文字寬度，保持文字與右側的線條間距不變」
方法：
序號、文字、白色背景成組，并水平「從左向右」布局
這樣文字可以推動白色背景變寬，與右側線條始終維持相同間距。
結合 sketch 的調整尺寸（resizing）還可以手動改變步驟條的寬度。
表單也可以通過 anima 或者 kitchen 來布局，實現數據的快速增刪。
PS: Anima 的 stack 會默認選一種對齊方式，出現下列這幾種布局效果（下方左對齊異常的原因和我組件的搭建方式有關）。
左對齊
居中對齊
兩端對齊
右對齊
6. switch / radioButton
同樣的，利用 sketch 的布局，還可以創建動態的 switch 和 radiobutton。
方法和之前建立動態按鈕類似，不過需要注意的是：這類 tooltip 會存在一個最大寬度，在超出這個寬度后需要換行處理。但是sketch 的動態維度只有一個象限（x或y）。這個時候當超出最大寬度后就需要手動去換行并調節高度（動態高度，手動調節寬度，可以依據文字是否換行來判斷邊距是否正確）。
建議：這里我們可以建立兩個組件，一個動態高度，一個動態寬度，根據文本量的多少去選擇合適的動態方向。上面換行的按鈕也可以這樣處理。
再多說一句：Anima 可以通過拖動寬度來改變文字的對齊方式（自動寬度、自動高度），結合自身的 padding 可以實現兩個象限的動態改變。但是出于穩定性的考慮，我們不推薦用它來做 symbol。
模塊相對于簡單的組件結合了多種布局方法。
以這個留言版為例展開說明：
這個留言版由頭像、name、like、dislike、留言內容等 5 個元素組成。從布局上看可以把頭像、name、like、dislike四個元素作為一個部分，留言作為一個部分。在整體上形成一個上下動態布局的組件。
頭像和 name 固定于左側；頭像鎖定寬高，name 文本自動寬度，布局方式從左向右。
like、dislike編組固定于右側，文本自動寬度，布局方式從右向左。
留言部分固定左右間距，文本自動高度。這樣我們可以通過拖動該區域的寬度去實現高度的動態改變。
利用 Anima 的 stack，實現每個留言版之間的固定間距。此外，在 stack 里面我們可以選中兩邊對齊的方式。
讓組內留言版的寬度保持一致。
分別建立「左上、上、右上、左、中、右、左下、下、右下」等 9 個單元格組件。通過（左、上邊框+th+td）的方式也可以，這里不細說。
每一列單元格分別打組，用 Anima（stack 左右對齊）或 Kitchen 固定垂直間距（間距為 0），組名 tr。無論是單元格的增減，還是單元格高度的變化，都可以在縱向上動態改變。
對 tr 打組，固定左右間距（間距為 0），實現表格在水平方向上的動態變化。
利用上面的知識我們來做一個相對復雜的卡片
要點
具體步驟
從上圖可以看出卡片主要分為三個部分
對圖片+標題編組，命名「banner」，確定標題的文本區域及動態方向，這里的標題我希望它在換行時往上走。這樣可以把文字定為下方固定。如圖：
對頭像、名字、標簽編組，命名「人物簡介」。固定頭像大小，固定名字位置。對標簽編組，這里標簽應該是動態的，從左往右布局。
標簽高度固定；人物簡介寬高固定；
固定人物介紹文本與卡片左右間距以及上邊距
對「海報」「人物簡介」「人物介紹」再次編組，確定組內各元素間距。編組和背景確定邊距。
這個過程剛開始可能是一個漫長的調試過程，在熟悉后，會讓調試有一個明確的方向，從而縮短時間。
不對，工作還沒交付給開發就不算完成。工作中我會使用藍湖把設計資源交付給開發。
結果
Anima 的布局在上傳藍湖后，藍湖上顯示正常，但是 sketch 本地布局統統崩潰了。我不禁長嘆一聲，??！
藍湖官方解釋「兩個插件在 Sketch 提供的方法調用是有沖突的，建議在上傳前關掉 Anima 插件」。
關掉 Anima 需要在插件中關掉后并重啟 sketch 才能生效，不然編組的內容依舊會保留 Anima 特性。
接下來重新總結一下：
結合以上內容為開發同事做的一個上線海報，他們可以只關注內容了。
文章來源：優設
一款產品從0到1的設計流程，在進入開發前的所有工作。這篇文章以去年做的一個小項目為例。
1.了解客戶需求，根據競品產生需求
工具：Axure、Mindmanager、Visio、OmniGraffle、PPT
1.1產品初期模型
1.1.1 競品收集（應用市場、專業網站、行業調查報告、搜索引擎、）
在應用市場、專業網站、行業調查報告、搜索引擎中尋找競品
輸出：
在產品的潛在目標用戶尋找競品
對產品的潛在用戶進行挖掘，分析核心功能的其他實現方法，將功能延展擴大可獲得不同層面的競品。
輸出：
將過程、操作的碎片化處理來尋找競品
將產品的結構、使用過程、操作等一步一步的拆開，根據每一個碎片信息來尋找競品。
輸出：
1.2競品選擇
競品選擇中最關鍵的一步，就是對競品進行分類。
1. 功能完全相同的競品：找出當下產品的核心價值，評估與我們設計目的與市場上成型產品的一致性；更快更好地借鑒對方取得成功的地方；有針對性地尋找差異化競品的方向。
2. 核心功能相似的競品：通過以點帶面地挖掘價值點或者創新點，將我們自己的產品做到。功能完全相同是一個點進行縱向思考，然后尋找競品；核心功能相似則是多個點，排列組合式地進行縱向思考，找到的競品更加全面，我們能夠借鑒到的價值點更多。
3. 功能本質相同的競品：加深對待設計產品的需求本質的理解，通過本質相同挖掘需求的核心所在，借此來找到相對應的參照物。該類競品，往往需要我們進行橫向思考，試圖從別的方面，方向入手，其思維廣度大大增加，有可能從其他領域中得到解決問題的啟示。這類競品是最容易發現亮點和突破的。
輸出：1.功能完全相同的競品
壁紙制作：可以將喜歡的圖片制作成精美的壁紙，定制專屬于你的高清壁紙。
2.核心功能相似的競品
座右銘壁紙：可選擇背景、輸入文字形成自己的鎖屏壁紙。
3.功能本質相同的競品
livefun:將視頻轉換為壁紙，將多張照片合稱為一個live photo。
1.3 競品拆解
競品拆解就是用碎片化方法對競品功能進行拆解，并最終形成競品的功能列表的過程。
形成功能列表后，對功能進行備注，尋找到競品使用過程中的不足，從而超越競品。
輸出：
接下來還需要和所有必要的相關人員就產品以及項目的開展方式進行多次頭腦風暴。
頭腦風暴(Brainstorming)是由美國奧斯提出的，一種激發集體智慧產生和提出創新設想的思維方法。頭腦風暴(Brainstorming)指一群人（或小組）圍繞一個特定的興趣或領域，進行創新或改善，產生新點子，提出新辦法。
頭腦風暴可能帶來一套啟動計劃、一個精簡的框架和一系列比較早期的概念圖以及模型。
頭腦風暴如下圖所示：
2.確定需求
2.1產品定位及如何正確描述需求
前面我們已經講述了怎樣搭建初步產品模型，通過梳理產品模型，可以清楚地了解應該如何定位一個產品。產品定位是需求收集的方向。
用戶需求主要包含三個要素：目標用戶、使用場景、用戶目標。
經過對產品定位的梳理，就明確了產品的目標用戶群體，接下來就可以進行需求的收集、分析活動了，總體流程包括需求收集、需求分析和篩選，需求優先級排序幾部分。
輸出：
產品定位：以用戶產出內容為主的可個性化推送壁紙應用。
用戶場景描述：
陶娟平時喜歡根據心情更換不同風格的壁紙，但是每次找壁紙都讓她十分頭疼，很難找到有個性又好看的壁紙（都是用戶制作上傳的壁紙作品）。
陶娟打開8樓壁紙app，登陸后填寫了她的個性偏好，系統根據她的喜好個性化推送壁紙。陶娟選了一款壁紙，還可以看到同時和她使用同一款壁紙的網友。
2.2需求收集的途徑
1.用戶場景畫像：根據之前的產品定位和使用場景用戶畫像文檔分析產出需求
2.競品分析：找到同類競爭產品，深入體驗競品功能
3.頭腦風暴：可以集結產品經理、設計師、運營、市場、開發、進行頭腦風暴，圍繞一個特定的話題進行討論
4.用戶反饋
5.數據分析
輸出：
2.3需求分析和篩選
在需求收集過后，已經有很多的被選需求了。
如何分析和篩選需求呢？
1.篩掉明顯不合理的需求
哪些是明顯不合理的需求？比如當下技術不可能實現的或明顯意義不大的，投入產出比低的、無匹配的產品使用場景、明顯不合理的需求等
2.做需求分析
把明顯不合理的需求排除后，就需要一個一個對剩下的需求進行分析。首先要了解需求的三個分類：用戶描述的需求、用戶實際想要的需求、用戶的潛在需求，這是三件不同的事情，卻有著千絲萬縷的聯系。我們需要通過用戶描述的需求，找到用戶實際的需求，再挖掘用戶潛在的需求。
3.需求做減法
有時候決定不做什么比決定做什么要更重要，產品的需求是無上限的，大量的堆積需求，會使產品非常臃腫，毫無特色，還會導致工期過長，拖慢了產品推出市場的進度，對產品百害而無一益。因此，應該傾向于做“輕產品”，學會做需求的減法。
這就涉及接下來需要討論的問題，如何判斷需求的優先級。
輸出：篩選后的需求列表
2.4需求的優先級
需要對所有的需求定義一下優先級，優先級高的需求優先開發，優先級低的需求延遲開發。
輸出：
2.5 輸出產品功能圖和功能需求列表
用戶需求列表確定之后，先以產品功能的形式展現出來，產品功能圖可以直觀的看出產品的初步功能架構。
輸出：產品功能圖
功能需求列表的價值，一是在于幫助產品經理理清思路，二是在于幫助項目團隊的其他成員了解產品功能需求，讓他們提前做好相關準備。
輸出：功能需求列表
3.產品架構
3.1 產品功能架構
結合之前的市場調研及產品路徑規劃，梳理了一下產品架構的大模塊
輸出：產品功能架構
3.2 流程圖的規范
流程圖有時也稱作輸入-輸出圖，某種程度上來說，流程圖是一種溝通性質的圖形化語言。一般會使用一些標準符號代表某些類型的動作，如判斷用菱形框表示，具體的操作行為、活動用方框表示，開始和結束用圓角矩形框表示。
3.3 確定核心功能流程圖
首先我們要設計的是產品的核心功能流程，例如登陸的流程就需要前期設計好，綁定手機號登陸還是直接微信登陸。登陸的流程會對后期的功能產生影響。
輸出：功能流程圖
做好了核心功能的流程圖后，我們需要對app主干做一個流程圖。保證每一個功能都可以形成閉環。
3.4 評審與確認
評審主要是讓業務部門和開發部門參與，好的流程圖具備清晰易懂、簡單明了、完整準確的特點
4. 原型設計
4.1 什么是產品原型
產品原型是設計方案的表達，是產品經理、交互設計師的重要產出物之一，也是項目團隊的其它成員（尤其是設計師、開發人員）的重要參考和評估的依據。
4.2 低保真產品原型
首先我們要根據產品架構畫出初步的頁面，也就是低保真產品原型。
這樣的原型圖有幾個好處：
可以快速產出：有時候一個需求的開發周期很短，低保真原型可以快速滿足同事的時間要求。
修改成本低：一個產品策劃很可能會被修改很多次，低保真的原型修改起來很方便。
輸出：低保真原型圖
4.3 高保真產品交互原型
工具：axure、ai、ps
高保真產品原型，則是高功能性、高互動性的原型設計，是忠實展示產品功能、界面元素、功能流程的一種表現手段。
高保真的好處：
便于梳理產品細節：制作高保真原型的過程中可以讓產品經理提前發現產品潛藏的各種問題，提前處理風險。
更容易讓其他成員了解產品設計：有時候簡單的線框圖無法讓別人想象出你要做的事情，也不清楚你要放的是哪幾個字段，而高保真原型就可以。
相對而言，劣勢就是制作周期比較漫長，涉及到產品流程的修改，那基本原型就得回爐重造一遍。所以高保真原型可以做一些核心頁面，不重要的頁面可以后期慢慢完善。
輸出：動態交互稿
5. 視覺設計
工具：Sketch、Ai
在產品0到1時候視覺評審，會花大量時間去討論產品的設計風格和主配色，在確定視覺稿沒有交互問題后，然后就是討論視覺設計稿的細節。在產品功能迭代的時候，評審的都是整體視覺風格的繼承性和視覺稿的細節。例如對交互設計的理解是否到位，邏輯是否正確，視覺層次是否正確等。
5.1 設計組件規范
5.1.1 為什么做組件規范
1.保證產品風格統一
每個設計師都有自己的審美和風格，產品迭代可能是不同的設計師來負責項目，但是產品的風格必須保證是統一的，所以就需要一個規范性的文件來作為設計標準。
2.提升團隊效率
在sketch里，有一個好的組件庫，設計師就不用重復去改每一個頁面上的圖標。只需要改動一個就能同步頁面上所有的圖標。
3.打磨細節體驗
在產品長期迭代的過程中，對每一個元素都需要對其場景、狀態考慮清楚。所以在整理過程中，經常會發現以前沒有注意到的問題并優化。
5.1.2 組件規范內容和分類
不同的項目的規范內容都是不同的，我們需要明確規范內容的分類有哪些?？梢韵却_定大體的規范內容，在頁面完善的過程中也不斷的完善規范。
iOS的設計尺寸建議使用一倍圖375*667的尺寸進行設計。因為這和安卓的常用尺寸360*640的誤差很小。安卓和iOS可以共用字體、圖標和間距?？梢愿臃奖憷镒龊媒y一的設計規范。
輸出：
文章來源：站酷
運營類活動是在某一段時間內進行的，有明確業務目標（業務轉化、品牌傳播）及營銷群體，依賴游戲化手段帶來優秀用戶體驗，從而獲得成功的一類活動。
1. 生命周期短
運營類活動生命周期較短，常在某一段時間（可能是周期性的），一般跟隨時節熱點或者運營節奏來進行。較短的生命周期給設計、開發、數據等帶來較大挑戰，設計程式化提供基本設計思路，組件化降低設計成本。
2. 業務目標明確
運營類活動一般以產品營銷、品牌運營為目標，發放各類優惠券大眾目標用戶，從而帶來業務轉化，或者營銷企業品牌，比如常見的年底 h5。
3. 有一定故事場景及氛圍
運營類活動需要較強的故事場景。良好的場景設計、氛圍營造可以帶來沉浸式的用戶體驗，與用戶建立情感共鳴。從而提升用戶參與度、帶來好的業務轉化。
故事場景結合時節熱點，同時考慮活動需要營造的體感氛圍。
4. 人群細分
運營類活動的特征在發起之初就有特殊的運營目的和特定特征的用戶群體。為實現最優的業務轉化，需要在設計之初明確活動覆蓋的用戶人群。同時在各個環節都能考慮到特定用戶群體的不同需求，尤其是在業務轉化的過程中，好的人群細分往往帶來事半功倍的效果。
5. 游戲化
引入游戲機制及游戲元素。
運營類活動結合時節熱點，通過富有故事性的視覺傳達（插圖、動效、聲音等設計元素）帶給用戶沉浸式的體驗，與用戶建立情感共鳴，從而有效的鼓勵用戶行為。
沉浸體驗的營造對設計師提出了更高要求，可以從活動設計的故事感、用戶代入感、產品互動感、主體差異感幾個方面來思考入手。
運營類活動中廣泛應用了游戲化機制和元素，它們是活動成功的有效保障。設計時綜合考慮業務及用戶需求，從用戶動機激勵、行為引導的角度出發，將運營活動游戲化?？梢栽诨顒訁⑴c深度的各個階段引導用戶操作，從而達成活動目標。以下列舉了運營活動中常見的用戶動機，后續我會從用戶參與路徑出發，盡可能詳細的描述在用戶參與的每一個階段起作用的為動機，以及實現的手段。
大獎帶來的誘因效應
動輒百萬的大獎獎勵幾乎已經成為運營活動的標配，在動機理論中，用戶行為的產生來源于需要，需要導致內驅力，引發行為，從而推動用戶實現特定的目標。當目標的誘惑力很大時，即使沒有內部驅動也能激發行為。這也是眾多運營類活動大獎存在的理由。
占便宜的心理
愛占便宜是人的本性，從心理學角度講，占便宜就像是額外得到的驚喜和獎賞，可以讓人產生滿足感！用戶在這種心理作用下，會為了小利益去做出設計預設的行為，將業務需求設置在‘占便宜’的路徑中可有效提高參與、轉化率。比如在設計中用中獎動態彈幕來強化用戶參與的動機，提高參與率。
有趣和好奇心
人天生具有好奇心，它幫助我們適應不斷變化的環境、發現新的資源，是一種「無法抗拒」的行為動機。在運營活動中，用戶會被有趣的活動頁面，未知的規則設計所吸引，從而開始主動「探索」。這也是用戶參與的動機之一，設計中精致的 UI、有效的頁面信息傳達保證了用戶好奇的有效性。
即時反饋及階段性成就
「即時反饋」是沉迷現象發生的原因。學習之所以痛苦正是因為其反饋鏈路太長，你只有在考試或者應用到所學知識時才能獲得反饋，還有可能是負面的。在活動設計中，每一次用戶操作都會有及時、細膩的反應，可以給用戶帶來精神愉悅，同時設計的階段性成就又給用戶帶來成就感，用戶會不知不覺中在活動中越走越遠。
隨機獎勵的多巴胺效應
人類的本能熱衷于冒險，隨機的、不確定的獎勵能夠刺激大腦分泌多巴胺，帶來愉悅感，從而刺激用戶行為的重復。在活動設計中，常用到這一理論，比如抽獎機制。
所有權與擁有感
當用戶感到他們擁有或控制某樣東西時，會自然而然的強化它的屬性、發揮其價值。尤其是通過適當的付出和自身努力，用戶還可能不合理的高估其價值。在活動設計中，常使用戶通過易實現的行為獲得權益，通過「幸苦操作」強化了擁有感，提升其心理價值，從而促進用戶對權益的使用。
稀缺性與用戶渴望
稀缺性的心理學原理在于人們想要獲得某樣東西的原因僅僅是它太罕見，或者無法立刻獲得。它破滅了人們對情況的控制感，人們會為了重獲控制而采取行動。設計時，可以利用這種心理鼓勵用戶做出期望的行為。常見的有時間限制、權利限制等。
使命感/社交影響/損失規避……
運營類活動中數據和策略思維是保證活動效果最大化的有效手段?；顒有枨筇岢鰰r，即考慮可能的參與用戶細分；活動開始時，考慮引流途徑和引流方式、物料的差異化；活動進行時，根據用戶細分策略化任務推送，根據埋點數據監測積極調整相關設計元素。事無巨細才能確保活動成功。
文章來源：優設
最近在工作時發現了一件很有意思的事情，不知從何開始，國內外的設計需求分化非常明顯。國內的公司在選擇產品平臺時，從幾年前的 PC 端網站，到如今已有大半的客戶考慮從小程序做起了。然而國外的創業者仍然以網頁為主，要說變化，大抵是在需求中多要求了響應式設計，以更好地適應桌面與移動雙端。
所以，今天我們無論坐在這里怎樣討論小程序的優劣得失，都不可否認的是，小程序確實給國內市場帶來了顯著的影響，而且人們已經逐漸接受，在產品初期，小程序是一個值得考慮的平臺。
但是到底小程序的市場是一片大好，還是只是一場危機四伏的狂歡？我將在本文中盡量以客觀的角度闡述，希望能夠給到各位設計師一些思考的方向。
同時，這幾個月來我參考了近 100 款小程序的設計模式，保留了500 張截圖和超過 10 分鐘的錄屏作為分析素材，來幫助那些想要邁入職場的設計師們，更好的上手小程序設計，不為信息和技術所桎梏。
小程序和App的區別
1. 開發成本、開發周期不一致
那么我們作為設計師，第一步需要了解的就是，究竟小程序和 App 之間有什么區別？作為設計師，應該注意哪些問題，這將是本篇文章前半部分的主要內容。
從開發成本看，小程序和 APP 有較大的區別。APP 開發需要兩個版本來適應不同操作系統的手機，產品開發周期長，開發人力投入多，因此開發成本高。而小程序只需要根據騰訊提供的開發平臺就能進行開發，無需考慮手機操作系統的區別，一次開發就能適配所有的機型，開發周期短，開發人力投入少，因此開發成本低。
一款 App 從提出需求到上線，通常的開發周期是 321 原則，即開發 3 個月，測試調整 2 個月，試運行 1 個月。而小程序開發周期在2 周左右，甚至功能簡單的 10 天內即可上線使用，所以是一種相對快速的模式。
小程序由于依附于微信，所以我們其實只需要制作一稿設計便可適配絕大多數的手機，而不像 App 那樣，需要針對不同的手機進行不同的適配。
事實上這是小程序相對于 App 的一個巨大的優勢。在開發 App 時，很多企業在初創期，由于成本問題不得不選擇到底是放棄Android 用戶還是 IOS 用戶。然而小程序只需要設計+開發一次的成本，在理論上就獲得了全部微信用戶接觸到產品的機會。所以從這個角度考慮，小程序是非常節省成本的一種模式。
2. App需要設置大量的數據埋點，而小程序則不需要
微信第三方后臺已經集合了諸多的數據供小程序方查看，在初級階段，這些數據已經足夠產品作為更迭的基礎了。
沒有做過小程序的朋友可能不太了解，微信提供的不僅僅是數量全面的埋點，而是可以自定義埋點位置以及爬取數據類型的系統。甚至還自帶一些簡單的分析系統，幫助運營人員更好的掌握小程序的總體運營情況。
除了已經封裝好的數據監控點，運營人員還可以自定義分析事件，這幾乎是一個可以達到「營銷平臺」級別的分析系統了。
同時，簡單明了的看版系統，也非常節省業務人員的數據清洗成本，的避免了開發人員由于機械重復性的埋點工作而導致的主觀漏采與錯采現象，這也是小程序的優勢所在。
3. 小程序有依附于微信的信息共享機制
小程序與微信形成的信息共享，可以非常方便的達到獲客目的。例如注冊登錄機制，我們幾乎不需要自己手動在小程序上進行注冊登錄。直接通過 Union ID 授權的方式，即可讓用戶用統一的注冊賬戶用遍所有的小程序。據測，用戶進入小程序時，同意微信手機號碼授權的轉化率大致在 35%，相對來說是一個非?？捎^的轉化率了。
除此之外，微信給小程序廠商提供了諸多接口，不僅僅是方便了小程序廠商，信息風向更多的是能夠讓用戶更加快速便捷的在小程序中解決問題。這一塊內容會在之后章節中詳解。
1. 具有社交裂變屬性
這類具有社交因子的小程序天生適合生存在微信的土壤中，通過微信龐大的社交流量助力優質社交小程序成為市場的爆品。比如拼多多、蘑菇街利用拼團實現社交電商的突圍。比如小年糕+通過社交場景實現低成本快速獲客，從而獲得很好的傳播效果，實現短時間的大量用戶增長 。
2. 垂直領域頭部
針對細分市場的小程序也容易受到傳播，比如汽車類小程序有多個排名靠前，用戶已經把小程序當做選車、購車、用車的重要入口，因為屬于低頻應用，沒有必要下載一個 app，如果切入的早，小程序場景的便利性就容易使其升到頭部。
3. 高頻場景喚醒產品
這些場景本身高頻發生且原有的體驗流程存在資源損耗，小程序優化解決了很多商家和用戶的痛點。 比如 KFC 小程序解決等位排隊、點餐、買單付費、發放優惠券、客戶消費分析、基于 LBS 的信息推送等問題，比如視頻、直播、K 歌等娛樂小程序因為輕應用的特點給了用戶娛樂多樣化的選擇,并且用戶可以直接將有趣的視頻、 直播等通過微信快速分享給好友，實現比 App 更好的傳播效果。
4. 不適合作為小程序的產品-工具類產品
相反，我們所推崇的工具類產品，在企業的角度來說，卻是最不適合做成小程序的產品。張小龍所賦予小程序的意義就是：「有用，不會給用戶造成打擾」，所以其實說實話，基于微信生態圈工具類的小程序比 App 更容易爆發。
但是這只是用戶增量提高，工具類 App 短暫的爆發卻很難維持存量。做工具類小程序和工具類 App 一樣，變現周期會非常長。從用戶體驗的角度來說，微信小程序里面的工具比起 App 的用戶體驗會好很多。
其實在張小龍的嘴里，我們已經得到了答案。他對于小程序的幾項基本原則已經足以說明問題，比如其中的一項就是「用完即走」，其實這不僅僅是張小龍給到的小程序的定義，而是小程序本身擁有的屬性。在現代這個時代，用戶的注意力被越來越分散，我們很多的設計其實都是為了緩解用戶焦慮。
在小程序的官方文檔中也提到了相關的元素，在現代社會，大家拿到一款新的產品之后都喜歡自己研究而非去研讀說明書。但是實際上，小程序的官方文檔是非常值得閱讀的內容，里面的規范內容目的不僅僅是為了讓小程序整體顯得整齊劃一，更多的內容是為了保證小程序能夠有良好的用戶體驗。從而增加用戶的留存率。
所以，本篇文章的主要內容是在「小程序官方文檔」的基礎之上，來探索更多的小程序設計的規律，建議大家在閱讀之前，可以先自行閱讀小程序官方文檔，再來看本文，才會有更多收獲。
App 的功能點可以很多，但是小程序的用戶路徑必須單一。
當然，這句話只符合想要入局的中小型企業，在建立小程序的初期，沒有額外的流量渠道，那么最好的留存用戶的方式就是讓用戶能夠的解決問題，對應到小程序的框架設計，即是簡短的用戶路徑。
不止中小企業如此，也有很多大型企業，開始從「復合型小程序」轉向小程序矩陣，目的就是為了給用戶提供專一的體驗路徑。因為從 PC 到 APP，再到小程序，用戶場景和時間在被不斷切碎，產品功能也要不斷簡化，更專注，才更能吸引用戶進行完整的體驗用戶流程。
設計一次性引導機制。
在用戶第一次使用小程序時，一些必要的提示是提升用戶體驗的關鍵因素。
減少特殊的交互模式的設計，必要時要進行足夠的引導。
運用用戶更熟悉的交互模式，更能讓用戶擁有良好的體驗，更快速的完成整個路徑與流程。
同樣這個原理只適用于剛剛布局小程序的企業，而不適用于大廠的小程序設計。但其實在 App 中，為了凸顯品牌調性，動態元素和裝飾性元素是一定會出現的。品牌調性幾乎是 App 設計的一個非常重要的環節。
這并不意味著小程序中的品牌調性不重要，而是說在某些環節中，良好的交互體驗比品牌調性重要的多。
即減少頁面跳轉，能不跳轉就減少跳轉，跳轉新頁面會增加用戶適應新頁面元素的成本，同時小程序的頁面層級過多，會讓用戶感覺到繁瑣焦慮。這個方法可以縮短用戶觸達產品的路徑，也是小程序用來減少用戶干擾的重要手段。
這樣做的好處就是讓用戶對小程序的架構有更全面的理解。用戶在較少的跳轉路徑中，始終清晰的知道自己處在小程序中的位置。這也是增加用戶對于產品安全感的一種方式。
在小程序初期，還未擁有懸浮窗功能。這個時候的表單輸入對于用戶和產品來說簡直是噩夢。比如用戶需要輸入一個信息，而這個信息儲存在手機中，那么用戶就需要中斷當前操作去查看信息。再通過其他的方式回到目前的操作填寫信息。在此過程中，很有可能由于操作過于繁瑣而喪失客戶。
即使增加了懸浮窗功能，用戶輸入信息的操作干擾也還是存在，所以能夠盡量避免信息輸入就要避免，以點選、拖動等手勢操作代替文字輸入。將熱門的、常用的、歷史信息前置，減少用戶的重復勞動。
在其他的小程序對比中，我們一樣可以發現類似的在用戶體驗上的差別。
有一次一個朋友來向我咨詢關于他司電商小程序轉化率如何提高的問題，我便運用了這個理論，去給他們的產品做了一個梳理，最后切實的獲得了數據上可觀的提高。
小程序官方文檔里花了大量的篇幅去闡述給予用戶「加載狀態」與「完成狀態」反饋的重要性，而反饋設計的好壞，對留存率存在著至關重要的影響。除了「微信官方文檔」中提到的「啟動頁加載」「頁面下拉刷新加載」「頁面內加載」「模態加載」「局部加載」「全局加載」外。
另外一種加載狀態同樣至關重要，即「預加載狀態」。預加載是一個老生常談的話題，如果一款產品沒有設計預加載，會給用戶心理造成很強的不安全感，這點在小程序尤為明顯，所以設計預加載場景是提高用戶體驗至關重要的因素，尤其針對一些網絡狀況不好的用戶。
其中以百度云盤的尤為出色，他的預加載模式是動畫效果呈現的，可以讓用戶清晰的了解數據正在加載。
如果沒有設計預加載，可以自行設計加載模塊，或者用微信提供的通用加載模塊，也是一個退而求其次的選擇。
而最壞的做法，就是完全不設計任何用于提醒的內容，這種極差的用戶體驗幾乎會全盤勸退用戶。
想必大家在看完了上述內容后，已經對小程序有了一個初步的概念，上述內容主要是一些理論層面對于小程序設計的分析，那么這個章節主要就是通過大量的線上案例和截圖來講述一些小程序設計的規律。
小程序的「即用即走」的機制，同時也促成了各個小程序的形成了一套應對機制，其中之一就是引導收藏小程序機制，目前這個機制幾乎成為了商業小程序的標配，大體分為三種類型：
我們在設計小程序時可以酌情參考這三種形式，簡單來說，用戶粘性高，用戶群體年齡偏高可以采用引導型，反之可以嘗試彈窗型和占位型兩種形式。
類似于「引導收藏小程序」，「導流公眾號/App」也是只有小程序中存在的一種模式。不同于「引導收藏小程序」，「導流公眾號/App」的方法可謂是百花齊放，不過渠道卻只有一個，就是客服會話系統。
在客服會話中回復「1」。
在客服會話中，回復「小程序」。
客服會話中的拇指圖設計非常有講究，一般的拇指圖設計都分為兩段文本，字號較大的文本用來在上述步驟二中提醒用戶點擊，而字號較小的文本則是用來在步驟三中提醒用戶點擊鏈接/掃碼來下載 App。
一些小程序會有彈窗提醒我們關注公眾號，但為什么我們不能通過這種簡單的方式讓用戶關注公眾號，而要用跳轉客服這么麻煩的方法。很簡單，仔細觀察就可以發現這是微信的廣告投放（看彈窗的左上角的標簽）。小程序即使接了廣告，也只能給別的公眾號導流。
雖然說小程序有辦法將用戶引導到 App 中，但是小程序和 App 的聯動非常有限，基本上局限于通過小程序引導用戶去下載/打開App，用戶無法在小程序和 App 切換時仍然保持完整的用戶體驗流程。
但是我同時也發現了一些產品運用巧妙的方式使得用戶體驗流程可以延續的產品。在愛奇藝小程序中，當用戶需要觀看一些 App 才能觀看的內容時，用戶可以通過復制一段口令從而在打開 App 時自動跳轉到相應視頻，使得用戶流程不中斷。
同樣一段內容，如果我想看高清版，或者想要給視頻評論，我需要自行在 bilibili 的 App 中搜索相關視頻，這種繁瑣的方式幾乎讓我放棄評論的興趣。
除了引導收藏和導流機制之外，在小程序里第二個重要的機制就是分享機制。如何做好分享機制是提高增量的一個必須要思考的問題。 正常的小程序分享分為兩種渠道，分享給好友和群聊，以及分享到朋友圈中。
分享給好友，一般就是以小程序鏈接的形式分享。因為小程序的優勢就在于依附于微信，其社交屬性被大大增強，所以分享按鈕往往要設計的引人注目。常見的設計方式有以下幾種。
在分享時，會有彈窗狀態讓用戶選擇分享的渠道，事實證明，這個彈窗也是可以被設計的。而其中被大部分小程序所選擇的設計感和實用性兼具的這種樣式。
小程序以圖片形式保存后的樣式，由于就是我們常見的 H5 設計，所以在此不做贅述，如果有感興趣的朋友，可以站酷私信的方式或者評論區聯系進行討論。
分享在聊天窗口的小程序，也是可以被設計的內容。這種小程序鏈接一般分為兩個模塊：標題文字 + 配圖。標題文字可以自定義 22個字，起一個有吸引力的文案可以有效增加轉化率。
一般配圖的設計有以下幾種分類：
很多同學會有一種擔心，覺得小程序既然如此輕便，會不會在技術上也會受到很多限制，很多特殊的功能無法在小程序當中實現。
這種擔心有依據，但不全對。事實證明，小程序在動效方面，確實被舍棄了很多，很多情況下甚至動效與跳轉邏輯無法匹配，會讓用戶體會到不安的感覺。但是在功能方面，很多已經存在的小程序已經證明，幾乎可以在 App 里實現的功能，小程序均可以實現。
VR看房
貝殼找房和同程藝龍的小程序都可以實現 VR 實景看房，而且在用戶體驗上是可以讓我感受到其真實用途，而不是我一開始認為的噱頭所在。這是我覺得在小程序上最令我吃驚的功能了。
可以發現的是，兩個 VR 看房的功能都是一家叫「如視」的公司提供的技術支持，其實這是一種小程序的發展趨勢，越來越多的功能模塊被第三方機構所替代，而小程序的持有者只需專注于服務與流程設計。那么小程序的門檻將會越來越低，小程序的運營團隊也會越來越精簡，推動著整個生態向良性發展。
地圖導航
另一個技術就是騰訊自家的「騰訊地圖」，可以在小程序端實現實時導航。這也能證明小程序在功能方面的強大屬性。
其實小程序也能做到很精美，下面我將帶大家看一些優秀的小程序設計案例：
京東良研通過良好的視覺設計、動效設計和信息展示方式，使得簡單的投票功能變得生動有趣，簡約明了。
在旅游行業，如何將繁冗復雜的信息排布的清晰易懂是非?？简炘O計師能力的。
同程藝龍就在不增加頁面跳轉的情況下，同時將信息以良好的視覺展示了出來。而在同樣領域的馬蜂窩的設計卻在對比下顯得混亂，除了設計方面的問題，BUG 頻發，諸多的彈窗與廣告也是影響用戶體驗的因素之一。
設置更新用戶數據功能。
有些小程序一次登陸后，就會永久將用戶數據定格在此，所以當用戶許久后重新打開小程序，陳舊的數據會讓用戶對小程序產生類似的許久不更新的感覺，所以一個更新數據的按鍵是必要的。
誘人點擊的文案。
有時，我們可以通過一些有趣的方式讓用戶完成流程，「JZ多媒體解決方案」的用戶登錄就是其中之一，不像普通的設計，它選用「點擊顯示微信頭像」這樣一個有趣的文案來吸引用戶點擊，從而完成登錄。
外部顯示名稱和小程序本體名稱可以不一致。
同樣的，名稱為「JZ多媒體解決方案」的小程序，外部顯示名稱為「除了干貨其他什么都沒有」。這給我們提供了一種新思路，在初期推廣時，不如把我們的 Slogan 當作名稱寫在外部，是一種推廣的更好方式。
小程序的頂部狀態欄。
我們都知道小程序的頂部狀態欄，右半部分是不可編輯的，那么怎樣可以既適應這個規則，又可以保持小程序的設計感呢？我在諸多小程序中發現了這樣兩種特殊的設計方法。
將 LOGO 放置在頂部狀態欄中。KeepLand 將 LOGO 放置在狀態欄中，既與其他小程序做到了區分，宣傳了品牌，同時又保持了整體的設計美感。
搜索欄不必要非放置在下方。放置在頂部導航欄的左端同樣可以實現空間利用的最大化，同時保持整體的設計美感。
將彈窗設計成系統樣式。
將彈窗設計成系統樣式，可以有效增強小程序的正規感和用戶對于品牌的印象，微信讀書就是用這樣的方法，使得用戶在使用小程序時，同樣體會到與 App 同樣的品牌與視覺感受。
結束了上半部分的理論分析，那么我們來聊一聊到底我是怎么看待小程序這個平臺以及這個生態的。
其實不只是企業家需要考慮這個問題，設計師同樣也需要考慮這個問題。前一陣子我一個朋友就來找我訴苦，說他不想在現在這個公司做下去了。原因就是，公司布局了五六個小程序，就是沒有一款 App 的項目提上日程，他以后不想走小程序設計這條路，所以不得已跳槽到一家有 App 產品的公司。其實這個問題轉化出來也很簡單，就是小程序到底有發展前景嗎？小程序是否會成為一個和蘋果搭建起來的 AppStore 一樣的平臺？
事先聲明一點，我不針對個人、企業或者某家資本，對這些將要提及的名字也沒有惡意，還是老規矩，對于商業，我們不談道德，只看決策。
1. 工具無界限，產品有派系
曾幾何時，我們在解鎖共享單車時，第一個打開的就是微信；現如今微信這樣一個培養了我們使用二維碼習慣的產品，卻無法成為人們解鎖單車的首選。
北京市面上存在的單車總共有 7 種：美團單車，摩拜單車，ofo，青桔單車，小藍單車，哈啰單車，永安行。但是目前只有舊版的摩拜單車，青桔單車能用微信小程序掃碼解鎖。（小藍單車小程序已經停止運營，ofo 雖然沒有停止運營，但是在小程序中已經無法搜索到單車服務了）而同樣，摩拜單車和美團單車可以通過美團 App 解鎖，小藍單車和青桔單車可以通過滴滴 App 解鎖。
可以發現，微信對于共享單車界的統治力早已不復存在，現在無論用哪款單車，微信都不是人們首先能想到的入口了。
雖然技術水平上小程序完全可以承載市面上大部分的工具，但是產品之間的派系分別，導致我們可能永遠不可能在微信一款軟件上一勞永逸的體驗到所有服務。就像我們永遠無法在微信小程序中發現「淘寶」小程序一樣。其實小程序在這一步上，已經不可能像App Store 一樣打造一個完整的生態了。阿里一家的存在，就已經讓微信失去了電商行業的半壁江山。
甚至更有趣的是，在小程序熱度排行榜中，位居前十的小程序中有 5 個是騰訊投資的企業下屬產品，還有 1 個是騰訊自身的產品。
但這本身無可厚非，因為這就是正常的商業競爭策略，只是選擇了這種策略生長的小程序，優勢就是可以將流量最大化的向自己的生態中轉化，缺點就是會有很多產品因此無法融入其中，小程序的生態，終究不會是一個全面而完整的生態。
2. 很多小程序都是完整產品的試用版
很多人曾在小程序風靡時預言，將來很多的產品都會入駐小程序，閹割掉次要功能，只保留核心功能在小程序中，這樣才可以既遵循小程序的輕量化原則，又可以讓用戶體驗到產品的優勢，形成轉化。但有趣的是，市場卻形成了另一套完全相反的機制。
Bilibili 小程序可以便捷的讓用戶隨時隨地觀看視頻，但是卻機智的閹割掉了畫質選項。這個小程序確實解決了一部分用戶對于觀看視頻的便捷性、分享視頻的傳播性的需求，但在這個手機流量多到可以鋪張浪費的年代，「高糊畫質」無異于加重了用戶被「望梅止渴」欺騙的想法，而更多的轉向了下載 App 只為了更高清的畫質與更多的操作自由。
微博小程序與 bilibili 小程序的做法如出一轍，雖然微博小程序的功能也很全面，看起來幾乎和微博 App 所具有的功能幾乎一致，但是一旦我們妄圖用微博小程序代替 App 來使用時就會發現，微博小程序竟然不能發帶圖片和視頻的微博。
知乎小程序亦是如此，他幾乎閹割掉了所有用戶和社區互動的渠道，用戶在小程序中只能接受知乎的信息，而無法發布回答與評論（只能點贊或者反對）。
甚至從名稱我們就可以看出微博和知乎想要突出的重點（熱門微博與知乎精選），在于讓用戶瀏覽微博和知乎中已經存在的信息，而當用戶想真正參與進整個社區時，發現幾乎所有的入口都被封死。在知乎中甚至連互動中的評論功能都被閹割掉了，完全給用戶一種隔著玻璃罩看珍藏品般的感覺。
所以各個互聯網產品不約而同的選擇了同一種方法來運營小程序，即小程序永遠是正規 App 的試玩版。因為微信的重點在于社交，而用戶在社交過程中能使用「嗶哩嗶哩」「微博」與「知乎」的場景只有分享社區中的內容這一種場景了。所以所有的互聯網產品都將社區中的主要內容呈現在了小程序中，而所有與分享無關的功能，即使滿足「即用即走」的特性，也并沒有在小程序中保留下來。（比如發帶圖片的微博，這應該非常符合即用即走的特性了，但并沒有被小程序保留下來）
3. 流量與格局
張小龍對于小程序有很多設想，其中一個就是打造一個屬于微信的生態系統，有人曾問我微信小程序生態系統會不會最終能成長為和 IOS 抗衡的力量？
我覺得很難。
2017 年 5 月 18 日開始刷屏，第二天即 5 月 19 日便被微信叫停服務，微信方面給出的理由是，小程序匿名聊聊「涉嫌誘導分享」。這是第一款被騰訊官方明確封殺掉的微信小程序。之后匿名聊聊換殼上線，改名「走心聊聊」。但可惜的是，走心聊聊依然沒有逃過被封殺的悲慘結局，上線沒過多久，走心聊聊便因違反《即時通信工具公眾信息服務發展管理暫行規定》，再次被暫停服務。
如果說「匿名聊聊」觸碰的是微信社交的這塊蛋糕，被封殺是情有可原的。那抖音被微信封殺的過程簡直是讓很多互聯網企業都大失所望。
在第一次封殺 H5 時，微信方給出了明確的回應。該 H5 在最后一頁存在誘導分享行為，違反《微信外部鏈接內容管理規范》，因此平臺對其進行了處理，分享到朋友圈僅自己可見。 但是在微信全面封殺抖音外部鏈接以及切斷使用微信賬號登陸抖音的功能時，微信方卻完全沒有給出任何官方解釋。
如果說封殺抖音是因為頭條系產品（包括今日頭條與抖音）有運用 cookie 機制挖掘用戶在騰訊體系內更多好友關系的嫌疑。但是接下來微信的做法無疑是令眾多互聯網中小企業看到了自己依附微信生存的結局。
據不完全統計，在短視頻盛行時期，微信已經將 20 多款短視頻類 App 的分享鏈接封殺。
但是此時微信卻力推騰訊系的短視頻 App – 微視，甚至為了微視打破了自己既定的規則 —— 開放了在朋友圈上傳 30 秒視頻的權限。
所以其實根本就沒有什么「誘導分享」這樣的說法，網絡上流傳著一句話「微信封殺是中國互聯網公司躲不過的一道坎兒」。
微信封殺你不需要理由，畢竟微信的違規內容中有一條明確地寫道：通過明示或者暗示的方式誘導點擊。但是回過頭一想，廣告的文案不就兩種，明示或者暗示都被微信說了，你放個廣告就不能有文字，既然有了文字，你不是明示就是暗示。
在微信規則范圍內，其對于誘導分享的懲戒存在很大的自由裁量權。所以懲罰你與否，歸根結底就是看你是否觸動了微信的利益，一旦觸動，你就會變成微信重點關照的對象。
事實上，微信這樣的做法也不是一兩天了。在三英（聊天寶、多閃、馬桶 MT）戰微信時，三款產品都被微信封殺了分享渠道。我們其實深知他們很難動搖微信的地位，但是還是很快遭到了封殺，甚至不惜動用其他渠道的力量，阻斷馬桶 MT 的傳播。這種寧可錯殺一千不可放過一個的行為，使得微信再也無法樹立起與蘋果/微軟等平臺公司齊平的公正性。
事實上不僅僅是騰訊如此，中國目前的互聯網環境都清晰的告訴我們，企業之間很難構建真正的信任。我一個美團的高管朋友告訴我，美團在進行設計與開發協作時，并不會使用藍湖，因為他們不信任國內企業。然而在國內使用 invision 又會受限于網速的影響，所以美團干脆開發了一款自己內部的切圖與協作的軟件：印跡，只為協調實用性與保密性。
有朋友可能對這款軟件比較感興趣，我也同樣如此，就問他美團之后會不會讓這款軟件開發注冊，走商業化道路。他說一開始在研發時他們也有這樣的想法，但是由于要提率，所以這款軟件越來越針對美團業務邏輯的方向制作優化，所以即使公開，也會很難為他人所用了。
入駐小程序，有時候也意味著需要將自己的數據交給他人管理，在小程序中，所有基于地理位置為用戶提供服務的小程序，幾乎全部都接入了騰訊地圖。
我雖然不了解其中的運作機制，但是不難看出，很多企業應該跟我抱有類似的想法。當所有數據集于騰訊一家時，自己是否還有立足于市場的根基呢？
4. 那些已經成為平臺的企業是如何看待小程序
在 2018 年 11 月 7 日中國烏鎮的互聯網大會上馬化騰說，微信現在有超過 100 萬個小程序，而在同年 4 月份，Appstore 才收錄了210 萬個應用。也就是說從 2008 年到 2018 年，蘋果用 10 年的時間打造的一個龐大的應用公園，被小程序不到 2 年的時間就從數量上追上了一半。這無疑會讓蘋果與 Google 重新審視小程序這款產品。
事實上，平臺與平臺之間的博弈從來沒有停息過。頭號玩家需要借助平臺來壯大自己，平臺需要頭號玩家來壯大自己的生態系統，但是也會忌憚這些頭號玩家有一天會強大到自己無法掌控，甚至反噬自己。
我們在國內一直看到的微信在自己的平臺上打壓其他的產品，但是反過來在國際市場上，微信何嘗不是架構在別人的平臺上？所以其實我們遍歷微信對待其他產品的策略，反過來，都會成為蘋果制約微信的策略。
還記得在 2017 年 4 月時，蘋果就根據自己的《開發者協議條款》第 3.1.1 項，對蘋果端微信內所有的贊賞內容強行征收 30% 的費用，雖然最終微信和蘋果雙方都做出了不同程度的妥協，但是微信還是做出了「斷臂」一般的抉擇，裁掉了微信公眾號的打賞功能。
雖然表面上看是蘋果對于開發者協議條款的嚴格把控，將公眾號打賞行為歸結為 APP 內購功能，因此要求微信改用蘋果的 IAP（in-AppPurchase 應用內付費），但實際上從時間節點上看，我們很容易發現，蘋果這次的發難明顯是針對小程序以及微信的「鏈接一切」的戰略的，一旦微信將「微信公眾號、朋友圈、微信支付、小程序」這幾個核心功能打通，勢必會對蘋果的生態系統產生較大的影響，蘋果不可能坐視不管。
雖然這件事結束后，蘋果和微信再沒有大的爭端，但是外媒卻風評不斷，他們雖然不認為小程序會最終成為制衡 AppStore 的力量，但是卻會搶占中國市場大部分的 App 開發人員的資源，使其向小程序設計與開發傾斜，一旦這種現象嚴重起來，蘋果勢必不能坐視不管。
興許下一次大戰就是微信與小程序進軍國際的那一步。我無法預測這場戰爭的結果，畢竟騰訊做了那么多年的生態，深諳自己是如何通過平臺一步一步贏到現在，現如今他也站在了劣勢方的一邊，勢必也會做好充足準備，但是這對于騰訊也一定是一個傷敵一千自損八百的戰役，而對于我們更重要的是，小程序到時還能不能是我們可持續發展的一個平臺，恐怕誰都不敢保證。
雖然小程序的限制與克制如此之多，但是我并不認為這代表著小程序不適合我們入局，相反我覺得微信的克制是一種純粹的理想，只能存在市場的初期，隨著行業的發展，越來越多的變量已經不在微信的掌控范圍內。小程序已經不再是微信能夠全權把控發展節奏的產品了，而需要主動去迎合時代做出改變。就像現如今的微信一樣，我們無數次在公開場合聽到張小龍說，他不希望用戶在微信上浪費過多的時間，但是微信已不可避免的成為一款超級 App，集合了越來越多的使用場景，甚至有時，手機里只有一個微信就夠了。
1. 頭部復合型小程序出現，使小程序無法保持初心
小程序發展到這一步幾乎是小程序團隊和張小龍沒想到的，本來小程序的屬性是「用完即走」，但是由于微信本身的流量龐大，所以在微信內部不可避免的會出現超級個體（即流量巨頭），這種復合型小程序（也可以稱之為「超級小程序」）幾乎可以不用遵守小程序的規范一樣可以獲得流量，那么越來越臃腫，幾乎是這類小程序不可避免的現象。
比如說在小程序領域耳熟能詳的「美篇」，美篇從微信朋友圈只能發布 9 張圖片的痛點出發，以圖文創作工具切入，成為了當時首屈一指的小而美的工具類產品。但隨著流量逐步增大，美篇開始尋求商業化變現的道路，從工具類產品向社交類產品轉型，最后形成了編輯、分享、閱讀、社交 四大功能的復合型小程序。
而基于圖文內容，以興趣聚合的交流社區，圍繞老師的家長社群，圍繞公務員的同事社群，圍繞攝影旅行的興趣社群，這些都是普通工具類小程序不具備的，但是卻是小程序發展的一個必經之路，同時也是轉型的一個典范。
所以同樣的道理，這就是為什么我不推薦大家在學習如何制作小程序時，去參考頭部的那些復合型小程序。體量大不意味著正規，不意味著遵守規范。
很多復合型小程序的設計其實是和小程序的初衷以及適用場景背道而馳的。這對產品本身并不會有什么過大的影響，因為在他們的考量范疇里，有比遵守規范優先級更高的事情。但是我們如果盲目借鑒，以為這就是小程序的規范，那么最終得不償失。
所以同類型的小而美的小程序，往往更應該成為我們的借鑒對象。
2. 友商的步步緊逼
雖然從數據上看，微信首發優勢明顯，但是其他平臺也不容小覷。從 2019 年上半年開始，各大應用廠商開始逐步布局小程序。小程序平臺從一開始的 2 家到現在已經覆蓋了 8 個平臺。這些平臺也都在積極的擴張小程序：阿里將支付寶小程序擴展到整個阿里系；百度創立了開源聯盟；騰訊旗下的第二大 App-QQ 也正式上線了小程序。
并且在數據上雖然有很大的差距，但是還沒有到達不可逾越的地步。并且除了微信外，幾乎所有的小程序走的都是中心化流量分發的模式。這時由于微信的克制與去中心化，反而讓其他的廠商逐步縮短了差距。
所以，隨著其他平臺的小程序步步緊逼，微信小程序急需一條出路打破目前的困局。某種程度上說，小程序對微信來說，是一場只能進不能退的戰爭，最終也會迫使微信妥協很多本來視為底線的規則。
張小龍在公開場合多次提到，他希望小程序廠商能夠專注于內容本身，而不要去思考流量紅利和不符合規定的裂變玩法。但是如果說市面上只有一款「微信小程序」，那么廠商可能還會更愿意去沉淀自己的內容。但是現實是面對這么多家平臺都開放小程序，那么熟悉平臺規則與政策，研究對應的策略與玩法，幾乎是必然會發生的事情。這基本就意味著，隨著各大平臺紛紛入駐小程序生態，微信對于小程序的底線遵守恐怕是越來越難。
3. 小程序已經成為一種任何平臺都可以復制的商業模式
小程序已經不止代表著「微信小程序」，而是一種任何平臺都可以復制的商業模式，那么去研究小程序的規則和玩法自然是值得的，因為它具有通用性。就像，如果我們一般人都會去學英語而不會去學習都可以法語一樣，因為英語在全世界都可以通用，但是法語基本只能在法國應用。
事實上，已經有小程序廠商開始在跨平臺之間進行積極的布局和嘗試了。汽車之家就是其中典型的例子。通過多平臺布局的方式，大大降低了小程序的開發與學習成本，實現一舉多得。這也是我覺得小程序值得研究和入駐的原因。
4. 微信仍然是目前的一個流量巨頭
據市場研究公司 comScore 稱，智能手機用戶用在設備上的所有時間幾乎都被放在他們使用率最高的 5 款應用上，而且幾乎一半的時間都被用到了使用率最高的那款應用上。
所以在中國，這就意味著大部分用戶的時間都被微信占據，而剩下的 App 則搶占用戶剩余的時間。所以入局微信對中小型企業來說是一個巨大的蛋糕，很少有人會不為此觸動。
大家可以發現，其實我所說的不看好小程序的未來，只是不看好微信小程序的未來，但是小程序這種生態模式，絕對是未來的一個趨勢所在，因為它擁有特定的應用場景，符合人們對于碎片化，場景化的功能與服務的期待。
所以我認為，小程序的設計模式是設計師一定要去學習的，而企業也一定要研究自己的產品是否在小程序下有應用場景，因為誰都不能保證，小程序是否也會有像 App 一樣，發生流量井噴的一天，到那時候如果再上車，真的就為時已晚了。
很多朋友問我為什么挑選這個時間來寫小程序？為什么不趕小程序大火的時候寫？或者為什么不寫一些別的流行趨勢上的話題？
希望我能一直帶著這樣的態度給大家帶來更多有益的內容。
另外，由于文章的篇幅有限，很多的內容其實經歷過了很多次篩選，才最終呈現給大家，希望能幫助到正在研究小程序的你。
文章來源：優設
您最近填寫過在線表單了嗎？
答案應該是肯定的。根據最近的研究，84% 的人每周至少會填寫一份線上表單。
雖然你可能沒有感受到，但在線填表單已經成為我們生活中不可或缺的一部分了。
其實，幾乎每個把用戶由 A 帶向 B 的線上交互都是一個網絡表單：與某個公司聯系、訂火車票、購物、訂一晚酒店等等。
網絡表單最早在 1994 年開始用于在線銷售，第一個拖拽式表單 2006 年在屏幕上出現。從那時起，表單已經成為線上交互的關鍵。
企業和客戶之間需要通過網站進行聯系，小到縣城的官網，大到國家政府網站，現在很難想像一個沒有網絡的世界。
但為什么線上表單一直備受詬??？
當然，確實沒幾個人喜歡填表，但大多數人絕對不會介意填寫那些清晰、簡潔、設計優秀的表單。
其實這也就是癥結所在。太多的在線表單冗長、令人迷惑或讓人感到有所冒犯（有時甚至三者同時出現）。
當表單產生讓人迷惑，或提出的要求超出必要范圍時，用戶的放棄幾率就會大大增加。 有些用戶可能會放棄填寫，甚至退訂整個業務。無論是以上哪種情況，您都不會再有第二次機會。
在設計一個表單的時候，我們怎么保證用戶能填到最后一步？
「創建一個表單很簡單，難的是讓人填完它?！?
在幫助 420 萬用戶創建線上表單后，我們在 JotForm 發現了一件重要的事情，就是一些小小的改變會讓整個事情大有改觀。通常，這些改變都是從那些被放棄的表單中獲得的靈感。
例子：
表單設計成什么樣呢？應該直觀、簡單以及體驗友好。以下是一些推薦的參考方法。
1. 歡迎填表者：標題與介紹
無論是誰，歡迎朋友的時候難道不會說「你好嗎？」我們都知道禮貌的重要性，但是在線上卻往往忽略了這一點。
歡迎頁和標題讓您有機會以一種清晰而友好的方式介紹表單和自己，而且還會留下一個良好的第一印象。
看看 BettingExpert 的數據吧：通過修改表單標題來強調「注冊理由」以后，他們的注冊率提高了31.54%。
標題是對下文最短最精的概括。用戶一般都會跳過表單內容，而且幾乎都不會仔細閱讀那種特別詳細的描述。所以用最少的文字說清楚一個表單的目的尤其重要。
標題可以簡單理解為描述被調查者對表格的期望。盡可能保持中立：要確保應答者誠實回答，而不是去滿足出題者的設想。甚至像陳述一個目標這樣簡單的事情，也可能會不知不覺地誘使應答者試圖迎合。
而且現在也需要一份清單，說明應答者應該事先準備的外部文件，沒人想中途去滿屋子找納稅證明或者護照。
如果填表需要很長的時間去完成，一定要提前告知用戶。不過如果是又快又簡單的？讓用戶感到驚喜吧(但不要冒險侮辱任何人的智力，以防萬一)。畢竟，他們能夠通過查看進度條或字段數量來推斷出這一點。
2. 放置相關的標題和副標題
一個有趣的事實：人類會在 50 毫秒內形成第一印象。重點：由于時間不夠長，他們無法仔細閱讀你的作品。
表單用戶很可能就是快速瀏覽一小部分內容，忽略大部分內容。而且有很大可能是他們正在忙著其他事情，無法集中注意力或者幾乎就沒有什么耐心，只想要快點結束。
顯然，我們無法阻止用戶，所以只能通過簡潔明了的標題來引導他們。標題絕對是個得力助手：可以將文本結構化、清晰化、保持用戶的參與度。
用戶應該可以看一眼標題就知道他們應該怎么做，而不是非得把剩下的全部看完。
測試這一點的最好方法是單獨閱讀標題，是否能讓人看懂呢？
3. 問題之間要有分隔符
分隔符很重要。就傳統表單來說，在視覺上把問題隔開以達到減少干擾的最好方法，就是使用分隔符。并不需要在視覺上做出很大的區別，區別太大反而容易分散用戶注意力。
4. 多頁面表單或單頁表單？
這主要取決于表單有幾個議題。
如果只有1，2個議題，單頁表單肯定是最佳選擇。但是如果一個表單有很多議題，那么就需要多頁表單來呈現。想象一下：用戶在面對一個似乎有成千上百議題的表單時，得有多心煩。
5. 強調「行動召喚」（CTAs，Calls-to-Actions）
成功的「行動召喚」強調的是「行動」部分：單擊這個按鈕，用戶要執行什么操作？類似「發送」，「注冊」或者「過程」之類的通用標簽并不會削弱召喚機制。描述越多越好。
為了消除不確定性，試著從用戶的角度回答一下這個問題「我想干什么？」舉個例子，如果是某項服務的調查表單，那就應該是「我需要免費咨詢」。
還需要更多證據嗎？在這類研究中，Unbounce 發現只是把「開始你的試用」換成「開始我的試用」，就提高了90% 的點擊率。
6. 標明表單中的區域
這并不是說要弄得花里胡哨的……
單選框、挑選區域和復選框之所以有效，是因為它們既簡單又常見。表單元素的標準格式等同于更好的可用性。
單選框適用于有很多選項而只有一個可選的情況。復選框用在多項選擇的情況下最好。
為了更短的認知適應過程，要盡可能地使用多選框或者單選框而不是下拉菜單。就像 Luke Wroblewski 說的：「下拉菜單應該是 UI中的最后選擇?！?
7. 別忘了「感謝」頁面
記住用戶是花時間的。所以千萬不要唐突結束，要記得說謝謝。
以下是一些關于表單書寫藝術的小建議。
從形式上來說，我們都更喜歡簡單的語言，尤其是那些學者，天才和專家。那為什么還有那么多線上對話像是復讀機一樣？
「請接受來自我們最誠摯的道歉。即便如此，我們還是希望能知道您的建議。除此之外……」
像一個老學院派那樣說話只會疏遠用戶，讓他們瞠目結舌。
簡單不意味愚蠢，而是等于可讀性。這意味著最清晰的平白直述。每個詞語都應該是最短，最直接的版本，能用「不過」就別用「盡管如此」。不用行話，不寫復雜句。
你可以通過大聲朗讀來檢查連貫性。耳朵能夠聽到眼睛看不到的東西，特別是在描述那些冗長復雜概念的時候。
一份表單應該就像是你和填表者之間的對話。通過用「我」，「你」，「你的」這些代詞來擬人化。
主動語態的表達（比如：約翰寫了一封投訴信）比被動語態（比如：一封投訴信由約翰寫出）更加有力。
被動語態會更冗長，不夠集中。
（譯者注：以下文章中帶橫線的內容適用于英語語法，不感興趣的讀者可自行跳過。）
一個被動語態句子究竟有多糟？這是兩點教訓：
還是不確定？你可以去查一下微軟 Word 可讀性標準，或者普渡大學語句方法。
許多作者都會陷入這樣的思維誤區：用的詞越多，就顯得他們越聰明。其實不是這樣的。在表單編寫方面，或者說各種寫作中，刪減詞語都要比添加詞語更加有益。
「你刪掉的每一個詞，都會為你多增加一個讀者?！?
在仔細檢查不必要的詞語后，文章會更篤實，更連貫，更吸引人。
刪減重點：
比起完整形態（比如 cannot，is not），語句的縮寫形式（比如 can’t，isn’t）能夠讓文章看起來更簡潔，友好和易讀。
另外，還能節省文字篇幅。一份優秀的表單閱讀性都不錯。
What’s 優于 What is。很簡單。
冗長曲折的句子容易讓人難以理解。密密麻麻的文字堆也是如此。
對于大多數讀者來說，每個句子最多 20 個單詞，每個段落最多 3 個句子，是最合適的。把每個長句都擴成兩個短句。短句實際上并不遜色。
使用空格，項目符號，表格以及打破繁瑣說明的任何其他元素，都會使您的讀者松一口氣。
在我寫博客的過程中，我（艱難地）認識到，優秀的文章是 30％ 的寫作加上 70％ 的編輯。
當你完善了問題，精簡了文字和內容后，把表格存儲好。隔幾天再回過頭來看，你會發現有些之前沒有發現的地方還可以再改進。
大多數用戶體驗的心理學原理其實都在人們的潛意識中，所以難以讓人注意到。
但是每種顏色，字體，線條和按鈕都有其用途。
日常的小規模設計可能不如十億美元的營銷活動那么引人注目。但小設計也需要花心思。而且，研究令人愉悅的設計背后的心理學機制很有意思，成本也不高。
以下是一些關鍵的心理原則，這些原則構成了設計優良的表格的堅實基礎。
我們做出的每一個決定，從倒垃圾到訂婚，都要經過我們頭腦中的自動成本收益分析。一項任務的成本是否值得完成后的收益？
設計師的工作是確保用戶在感知上收益是大于成本的。
當然，成本與收益是主觀的，填表通常源于義務，而不是受訪者希望從中獲益的行為。除非給受訪者獎勵，否則無法確保收益。但是我們可以把成本降到。
降低受訪者成本的一些關鍵策略:
+1-919-555-2743 vs 19195552743.
哪個電話號碼會留在你的腦海里？當然是第一個。那是因為它被分塊了。
組塊是一種方便的記憶技術：我們把它用于銀行個人識別碼、社會安全號碼和儲物柜代碼。它指的是將信息排列成「塊」的過程，使內容更容易保留、處理和回憶。
研究聲稱數字 3 是幫助人們吸收和回憶信息的神奇數字。所以盡可能使用它：針對段落，列表，關鍵步驟等等。
如果可能，避免任意格式化規則。但如果是必要的規則，用紅色記號筆拼寫出來。填表單時，沒人愿意猜。密碼要求、語法規則、編號間距等等，如果一個字段需要特定的輸入，告訴用戶。
席克定律
如果我要舉辦一個晚宴，我總是選擇從當地一家小雜貨店購買我的配料，而不是從一個雜亂無章的超市購買。那是因為有太多的選擇往往會讓人感到麻木。這就是席克定律：它指出，隨著選項增加，做出決定的時間也在增加。
應用到用戶體驗領域，席克定律簡直就是去繁求簡的一劑良方：限制導航選擇，給用戶明確但受限的選項。因為隨著設計靈活性的增加，它的可用性會降低。少即是多。
這個鏈接有什么用？還是右上角的按鈕？如果并沒有增效，那就是減效。每一個字，每一張圖片，鈴鐺圖標或者口哨圖標都不是100% 必需的，這些都會降低你表單的轉換率。
尼爾·帕特爾稱只需刪除一個字段，他的聯系人表單提交率就可以提高 26%。
正如杜魯門·卡波特曾經說過的，「我更相信剪刀，而不是鉛筆?！?
打字是在線表單中最耗時、最密集的部分，而且經常會導致錯誤——尤其是在手機上。用按鈕、滑塊替換文本框并使用自動完成功能，將減少工作量并提高轉化率。
根據 Marketing Insider Group 的調查，有 78％ 的互聯網用戶表示來自品牌的個人相關內容會增加他們的購買意愿。而當體驗與用戶無關時，營銷活動的效果將降低 83％。
因此，感謝條件邏輯！
條件邏輯（或「分支邏輯」）通過允許基于特定響應的附加指令——類似：「如果這樣，那么」，簡化了復雜的流程。
使用條件邏輯將不會顯示與用戶無關的問題，從而減少完成表單的時間，從而使他們不太可能放棄前面的任務。
是的，這聽起來像是常識，但是大多數表單都會向每個用戶（無論他們是誰）提出相同的問題。使用條件邏輯是雙贏的，因為通過明確定義用戶細分，可以捕獲更干凈，更有用的數據。
雙重編碼理論
我說樹時。您就會想到樹干、綠葉、樹枝。
我們的大腦就像這樣聰明：它把圖像和文字聯系在一起。
這是雙重編碼理論背后的關鍵原則，該理論指出記憶有兩個不同但相互關聯的系統，一個用于文字信息(「樹」)，另一個用于視覺信息(「樹干、綠葉、樹枝」)。
當某樣東西以兩種方式(圖像和文字)被「編碼」時，它被理解和記住的幾率比僅僅以一種方式(圖像或文字)被編碼的幾率要高。
換句話說，將單詞和圖像配對會使它們更容易記憶。兒童書籍充分利用了這一點。在設計表單時，有兩種方法可以將雙重編碼理論付諸實踐。
我們的大腦處理圖像比處理文本快得多。使用圖標、照片、形狀等線索——無論什么有助于說明你的觀點——都會讓用戶體驗更加直觀。
表單設計應該是一致的，但這并不是說就不能加入一些小驚喜。通過使用非標準的界面元素——如可點擊的圖像和切換的滑塊——可以使表單填寫更加愉快和直觀。
你知道嗎：用戶最初對產品的判斷有 90% 僅僅基于顏色？
實際上，根據營銷大師尼爾·帕特爾（Neil Patel）的說法，色彩是「購買特定產品的原因的 85％?！拐_的組合可以使讀者人數提高 40％，理解力提高 73％，學習能力提高 78％。
你不需要成為一名設計師來找出哪種配色方案和對比效果最好。像 Adobe Color CC 和 Paletton 這樣方便的程序可以幫助你選擇一個能反映你公司形象的調色板。
我們是膚淺的生物，習慣于相信有吸引力的設計在其他方面也更好：更快、更智能、更易用。這被稱為「審美可用性效應」，漂亮的界面增加了我們的耐心和忠誠度，甚至讓我們更有同理心。
如果內容或布局不吸引人，38% 的人會停止使用頁面。換句話說，如果線上表單看起來不漂亮(也不容易填寫)，那就是浪費時間。
當然，一百個人心里有一百個漢姆雷特。但是一個簡單的界面、干凈的字體和時尚的造型絕對會贏得用戶歡心。
進度條效應
如果我們知道我們已經取得的進展，我們就更有動力去完成一項任務。特別是已經領先進度的時候，感知上的工作量會相應減少，最終達到超預期效果。美國教授約瑟夫·努內斯和澤維爾·德雷澤將這種現象總結為「進度條效應」——「當人們能看到已付出的努力時，會更有動力完成任務?！?
問題排列從易到難
如果表單里的問題按照從簡單到困難的順序排列(而且保持邏輯順序)，用戶將快速完成表單的初始階段。這反過來會觸發連勝效應：快速進步和動力感帶來的滿足感，讓用戶不愿意打破連勝。這意味著，當表單變得更加苛刻時，用戶會繼續堅持下去。
畫出進度條
隨時反映用戶的進度。用戶越接近目標，就越有可能完成。如果表單是多頁的，請指出還有多少頁要完成。
一份來自 Clutch 的研究表明 90% 的用戶希望在線表單能有進度條來管控他們的花費時間。
所有的表單的關鍵都是題目。特別是在頭腦風暴討論題目的時候，最好的就是從目標出發，倒推回來。
所以你的第一個問題就是：你的表單的目的是什么？入職表？反饋意見？研究表單？
盡可能地記下你希望從表格中獲得的信息。把它表達為題目(以問號結尾)，而不是靈光一閃。一定留足時間反復推敲。
然后，寫下一些可能的答案，這些答案可能會給你一些靈感。
最后，頭腦風暴討論這些題目，這些題目就會解答剛才提到的第一個問題。
作為調查后的回顧，寫下每個問題的回答百分比。將這些猜測與你的實際結果進行比較，會發現下一輪要注意的盲點。
這種回顧過程還有助于您的設計并節省您的時間。
關于板塊的科學
根據表單轉換率報告，表單類型直接影響表單的板塊數量。仔細考慮每一個板塊的每個問題。
現在，問問自己：你真的、確定、必須要問哪些問題？
多數情況下都不是必要的。但是，即便我們明白少即是多原則，但是真的有機會去用戶的腦子里一探究竟的時候，我們還是希望問題越多越好。
當然，這些問題的答案是很重要。但真的重要到失去用戶都在所不惜么？
你需要用戶的配合。但是每加一個板塊，他們的耐心就會失去一點。所以，在你把所有的題目和答案全列出來以后，能刪盡量刪掉?？紤]收集數據的其他方法，并考慮這個題目是否可以推導出來，或者以后再說甚至完全排除。
盡量避免可選問題。如果必須，請在表單最后列出來。
將線上表單結構化是成功的關鍵。
在你經過頭腦風暴討論，修剪精煉得出了最終的問題清單后，就該組織他們了。用一個「主題」標題將它們組織成組和子組，比如說聯系方式，工作經驗等。
這樣一來，用戶不用去讀具體的問題就大概知道自己接下來要做什么。
現在要考慮問題的順序了。按照經驗來看，主題相似的問題，就應該放在一起。
每一個問題，每一個板塊，都應該激勵用戶到下一步。大跨步似的前進會讓用戶困惑，所以要用一種一步一步引導用戶往前的模式。
用戶會通過調節對信息的流動有一種預判。比如說，「你叫什么名字？」應該在「你住在哪兒？」之前，而「介紹一下你的工作經驗？」應該再往后。
最好的做法是把你的表單只限于必填的問題。選填問題將毫無必要地延長表單并激怒用戶：「你從哪里聽說我們的？」 「你想收到營銷郵件嗎？」
不過對那些非強制性的但是友好的問題，將它們放在表單的末尾，作為可選的后續內容。這樣，他們會感覺不那么有侵略性，也不會影響你的轉化率。
雙管齊下的題目會讓用戶覺得模棱兩可。而且——你已經猜到了——模糊的答案無法量化。
看看題目中有沒有用「和」，「或」。找到了嗎？如果有，把這個題目改成兩個。
題目越清楚，答案就越清楚。答案越清楚，數據就越清晰。
優秀的表單描繪了一條清晰的路線，通過線索、提示等引導用戶完成表單。路線越短，用戶完成的可能性就越大，所以盡可能地給用戶提供便利。
以下是比較有用的便利方法：
郵編索引
要求用戶填寫地址的時候，最好的方式是只讓他們填寫門牌號和郵編，然后使用郵編索引服務完成地址信息的其他內容。（譯者注：此條比較適用于國外。）
默認提示
默認文本提示是出現在表單字段中描述其預期值的淺色文本。只有在存在潛在歧義的情況下，才應該使用它。
字段標簽
字段標簽是出現在字段上面，關于問題性的文本。它經常都會出現，并且不應該用占位符提示來替代。人們常常為使用默認提示同時作為字段標簽，但卻引發了可用性的問題。
換句話說，你可以使用字段標簽，不用默認提示；但是不能在沒有字段標簽的情況下只有默認提示。
預設答案
大家都喜歡做選擇題。它們可以節省讀者的時間，并且易于評估。
你可以通過回答「是/否」、「單選」或「多選」來預定義答案。如果有一個你無法預測的答案，添加一個「其他」文本框讓讀者輸入一個自定義的答案。
搜索預測
在要求用戶選擇他們的國家、職業或具有大量預定義選項的其他內容時，搜索預測會減少所需的打字量(和認知負荷)。
表單只完成了一般的工作。它是被動的，不是主動的。表單的效果依賴于填表者。它們需要從一開始就嵌入到框架中。
表單是交流的工具。需要兩方來參與。
因此，在設計表單時，你還需要從用戶的角度考慮……這從他們的目的和環境開始。
為什么要有人填寫你的表格？他們的目的是什么？把它們寫下來。
目的和環境息息相關，所以要讓環境在你的頭腦中具體化。他們在哪里以及如何填寫表格？在家嗎？在筆記本電腦上？在手機上？在地鐵上？
環境不僅僅是場景。關鍵是用戶能明白在他們的幫助下你的表單可以實現什么目的。
表單需要吸引目標受眾的注意力——那么，這些受眾由誰組成？
在泛泛人群中思考是沒有意義的。要集中你的注意力，集中在一個人身上——或者說，一個「買家畫像」比任何一個普通人群給你的信息都多。
試著描繪一個理想的用戶畫像，有工作、個性、家庭、希望和夢想。集中思考這個理想用戶群體。他們在哪里生活和工作？他們的觀點和價值觀是什么？他們與你的業務有什么關系？
如果你發現對這些理想群體來說什么是有意義的，你就離最終給你帶來高價值數據的那些問題又進了一步。
這些人就是你需要反復思考的人。這些人就是會給你答案的人。
表單視覺和結構
填表單肯定不會像過生日一樣充滿驚喜。
一致性是保持表單填寫體驗順暢的關鍵。一致就是指顏色要一致、視覺感受要一致、主題調性要一致。
你的公司形象是什么？什么短語和單詞能概括這一點？你的價值觀是什么？在 JotForm，我們注重包容性、友好度和腳踏實地——我們的語言就在傳達這些主旨。
當你定義了品牌調性后，在所有的表單中保持住——你的用戶應該感覺到他們每一步都在和同一個友好的人互動。
視覺一致性同樣重要。在整個表單中都應該用一種視覺風格(以后創建的其他表單同樣如此)。
Google 的 UX 研究人員發現，將標簽左上對齊會減少表單完成時間，因為它需要的「視覺注視」更少。
眼動研究表明，簡單的單列布局比并排放置的多列布局要好。
該規則的唯一例外是要求輸入日期（日，月，年）或時間（小時和分鐘）時，其中多個字段應在一行上。
每頁一件事是一種心理技巧，定義為：
「將一個復雜的過程分解成多個小步驟，并將這些小步驟單獨用一頁來呈現?！?
本質上，用戶只需要關注一件事。一條信息、一個決定、一個問題要回答。
整潔的頁面鼓勵用戶繼續執行任務。
把輸入框的長度控制到正好能夠包含所有的輸入字符的長度（用戶可以看到填入的完整內容）。
輸入框的長度應該反映用戶預期輸入的文本量。郵政編碼或門牌號等字段應該短于地址行。
貝馬爾德研究所的可用性研究發現，如果一個字段太長或太短，用戶開始懷疑他們是否正確理解了標簽。這尤其適用于具有異常數據或技術標簽的字段，如信用卡背面的 CVV 碼。
表單設計中的錯誤和完成路徑
就像生活中一樣，填寫表格時有可能出錯就像生活中一樣，關鍵問題是發出錯誤信號并允許快速糾正。
十分之一的男性有一定程度的色盲。
當顯示驗證錯誤或成功消息時，不要依賴使用綠色或紅色文本(因為紅綠色盲相對常見)。使用文本、圖標或其他東西。JotForm Cards 用一個微動畫警告用戶，當出現錯誤時，該動畫會說「錯誤」。
向用戶顯示錯誤發生的位置，并說明原因。
如果您必須使用驗證，請確保它是內嵌的(在字段的右側)，并提前報告錯誤。不要等到用戶點擊提交來報告驗證錯誤。但是同樣，內聯驗證不應該是實時的，因為這可能會在用戶完成字段之前報告錯誤。
你需要一個電子郵件地址，你會收到一個沒有@符號的回復。你要求一個電話號碼，而你的回答中有一半位數不夠。
打字錯誤不應該成為表單可用性的障礙。
使用「字段驗證」來確保得到您需要的答案，例如，「答案必須包含__」
JotForm Cards 恢復錯誤輸入域名的用戶的電子郵件地址；約翰@ gnail . com 應該是 john@gmail.com。
如果用戶回答的方式有很大差異(例如，用+12345678912、+44 12345678912、012345678912回答「電話號碼」)，請將其轉換為一致的格式。
什么是支付表單？
支付表單就是線上的收銀臺。它授權在線支付，驗證用戶的詳細信息，檢查資金是否可用，并確保你收到支付。
支付整合有很多優勢。他們幫助你 ：
在設計支付形式時，遵循最佳實踐是至關重要的。以下是一些關鍵規則。
1. 限制付款步驟
Baymard 研究所分析了支付表單，發現支付過程太長或太復雜是放棄支付的主要原因之一。所以一定要分塊，分得越細越好。
2. 使用安全視覺提醒
當輸入敏感的細節，如信用卡細節時，用戶會對任何看起來可疑的東西保持高度警惕。最近的一項研究顯示，出于安全考慮，17%的購物者沒有付費就離開了頁面。
專業的支付形式讓用戶感到輕松，而任何看起來「不舒服」的東西都會讓他們感到緊張。這就是為什么你應該從頭開始構建支付表單時就保持謹慎——即使是最小的錯誤或不一致也會嚇跑用戶。
它還有助于在表單上啟用 SSL 來幫助保護數據。用戶知道所有的互動都是加密的，因此可以安心。JotForm 是最安全的數據傳輸方式:我們符合支付卡行業數據安全標準 (PCI DSS) 1級，并啟用了 SSL。
3. 清楚地解釋你為什么要求敏感信息
人們越來越關注隱私和信息安全。如果你要求必須填寫敏感信息，請確保使用字段下方的注釋文本解釋為什么需要這些信息。
4. 保存數據
讓用戶可以選擇保存他們的地址和支付信息，可以使這個過程更快、更簡單——尤其是在手機這樣的設備上。這同時也會給回頭用戶一種獎勵和忠誠的感覺。
5. JotForm添加支付集成的方式
一切就緒。現在你可以在網站、博客或社交媒體上輕松銷售你的產品。當你完成表單后…萬歲！完成了！但是……等一下。你的表單可能已經完成，但現在還不是發出去的時候…
還有最后一個步驟。
6. 發出前，測試您的表單
我們都有盲點。所以保持謹慎很重要，畢竟數據的質量決定了表單的成功。因此，需要事前檢查一下調研題目，確保答案選項的完整可靠，沒有任何遺漏。
把表單發送給家人/朋友，并要求他們記錄填寫表單需要多長時間，以及對這一連串的問題他們體驗如何。這也將有助于你下次評估表單的設計。
文章來源：優設
在涉及體驗細節的小需求上，避免所有的不周到，方才是周到
其中，個人認為，最為核心的是第二點：多體驗原型或產品，直到自己覺得周到為止。
文章來源：站酷
自從做設計以來經常會看到一些很高大上的理論，例如：格式塔法則、網格系統、黃金分割法等等，這些詞語給人第一印象就是很高大上，很難學會，也有很多設計師看到這些理論就被嚇到，認為自己學不會，也不想學，因為理論知識確實是學起來很枯燥。對于初學者的設計師來說，這些理論可以在短時間不用學太多，但是對已經工作幾年的設計師來說，這些設計理論知識也是必不可少的。
只有掌握設計中必要的設計知識，才能讓自己的設計眼界、技能得到提升。就我個人而言，我在設計初期也是很反感這些所謂的理論知識，對于我來說簡單通俗的教學才是最容易讓人接受的，理論太深奧，我真的無法從中體會到真正的奧秘。但是，越到后面，我越喜歡研究那些設計理論知識，因為我越來越懂得那些理論的重要性，對我的設計也有很大的幫助。所以今天我采用通俗易懂的方法，教大家去理解和掌握這些高大上的設計理論知識。
今天主要分享我們經常聽到的黃金分割構圖法。
黃金分割構圖法：是一種由古希臘人發明的幾何學公式，遵循這一規則的構圖形式被認為是「和諧」的，在欣賞一件形象作品時這一規則的意義在于提供了一條被合理分割的幾何線段。
黃金分割構圖法的基本理論來自于黃金比例 ── 1 : 1.618。
黃金分割構圖法運用到海報設計、畫冊設計、網頁設計、繪畫、服裝設計、logo 設計、電視電影、建筑等等領域。在攝影中也經常會引入黃金分割比例，可以讓照片感覺更自然、舒適，更能吸引觀賞者，給人一種賞心悅目的視覺感受。
我們先賞析一些運用黃金分割法的優秀案例，通過賞析能讓我們體會到它的美和重要性。
1. 在海報中的應用
從上面的 2 張人物海報案例中，可以看出都利用了黃金分割螺旋法的技巧，當整張圖作為背景時，我們不知道圖片主題位置的掌控時，就可以采用黃金分割法的原則。對于人物，可以根據想要突出的人物某一部位，直接采用這種分割方法快速找到版面位置
下面2張海報是通過圖形和文字的結合，主題文字排版的位置也都剛剛好是黃金分割的編排，帶給人一種美的、舒適的畫面感，圖片和文字在版面的比例剛好是 1 : 0.618。
2. 在網頁中的應用
上面 2 個網頁都采用了黃金分割的原則，大體將版面分為圖片區+文案區，比例為 1 : 0.618。上面同時采用了網格重疊的形式，而下面的就是最基本的黃金分割比例。版面的編排整體給人一種呼吸感、有序的、層次分明的視覺感受，并且瀏覽的順序也是井井有條，如下圖閱讀順序指引：
3. 在繪畫上的應用
像我們看熟悉的名畫「蒙娜麗莎」、「維納斯的誕生」等也符合黃金分割的比例。黃金分割比例也在這些作品上經過了歷史認證，利用黃金分割布局，讓畫面更耐看、更精致。
4. 在攝影上的應用
在攝影中也經常會引入黃金分割比例，可以讓照片感覺更自然、舒適，更能吸引觀賞者，給人一種賞心悅目的視覺感受。使用黃金分割的攝影可以制造出一種空曠、寂靜的視覺效果，也可以制造出一種特寫鏡頭的效果。不知道怎么拍照好看，學會這一招你的攝影立馬高大上。
5. 在建筑上的應用
在建筑設計中的運用也有很多案例，例如上面的金字塔和泰姬陵的多處布局都能看出黃金分割，第三張中國古建筑也都運用了黃金分割構圖。自古以來很多文化建筑都采用了這個構圖，讓建筑看起來更加美觀、耐看、精致。
了解了螺旋黃金分割法的用途和好處，我們最主要的是需要知道怎么來畫這個螺旋黃金圖。
1. 新建畫布
2. 畫正方形
這里畫正方形是最關鍵的一步，我們只要知道螺旋黃金圖的比例就可以很快的畫出來。
螺旋黃金圖比例為：13 : 8 : 5 : 3 : 2 : 1
只要知道螺旋黃金圖的比例我們就可以開始畫正方形了，簡單的正方形不用我多說吧。我們按 10 倍的比例來畫圖，簡單的意思就是前面的螺旋黃金圖比例都乘 10，變為 130 : 80 : 50 : 30 : 20 : 10，再根據這個數字畫出 6 個正方形。
正方形畫好后按照這個轉圈的順序排好即可。
3. 畫圓弧線
正方形畫好后，畫圓弧線，可以通過畫正圓得到。
圓弧線為正圓的四分之一，圓的半徑為每個不同正方形的邊長，通過不同大小的正方形畫出不同大小的圓弧即可。
開始畫圓?。阂源笳叫蔚挠蚁陆菫閳A心畫正圓，注意相切位置，畫好后刪除多余的錨點。
△ 圓心位置
△ 相切位置
△ 刪除多余錨點
△ 圓弧畫完后
到了這一步基本也就出現我們想要的螺旋黃金圖，最后只需要將我們的正方形改成描邊的模式即可。
△ 最終圖形
這里展示一下第二種方法：
螺旋黃金比1 : 1.618在畫面中怎么看？
說了這么多，沒有實際的操作案例你們是不是也很頭痛，到底拿到這個技巧怎么去使用呢？在我這里例舉一個橫版和一個豎版的案例。
找素材
這里找來幾張圖片，因為是做分析案例，所以我就選擇我自己喜歡的圖，我選擇的是圖1。
圖片調整
圖片確定后，我們就需要把圖放到我們的畫布中。
但是問題來了，一般我們的設計尺寸基本是不會和找到的素材是一樣大的，我們到底要怎樣放大圖片呢？圖片中哪些元素可以忽略，哪些需要重視？螺旋黃金分割法就可以用上了。
利用我們的螺旋黃金分割圖，放在我們的版面中。接下來就放大我們的素材圖片，分析圖片結構。圖片上方都是天空，左邊是海和天空，只有右下比較復雜，有人和零碎的石頭，所以我們這里圖片就以人為畫面中的焦點，那么我們的螺旋圖就需要改變一下位置。
調整圖片大小和位置，將圖片中的人物放在螺旋圖的焦點位置，這樣我們的版面就快速地確定了視覺焦點。
文字排版
將文字排版在畫布中，再根據文字豎排的樣式，和人閱讀的習慣，調整圖的方向和文字位置，使人看向主題文字，給人一種指引的方向。
總結：主要利用螺旋黃金分割法調整圖片的位置焦點，使畫面中心達到舒適耐看和精致的視覺效果。
標記分析圖：
這個案例我就不做太多的講解，因為很簡單，直接利用螺旋黃金分割構圖的方法，將版面按1 : 0.618的比例劃分，然后在這個比例畫布中排版文案和圖片。
圖片位置排版
素材選擇上面的圖2，這里就做一張豎版的海報。
將素材圖放在畫布中，準備好我們的螺旋黃金分割圖，也放在畫布中。根據圖片本身的特點，人物只有上半身，所以將圖片放在底部最為合適。至于人物應該靠中間還是靠邊，我們同可以根據圖片人物本身的姿勢判斷，根據人物是微抬頭向上看，角度約 30 度，所以選擇將人物靠邊。
再就是人物具體位置的掌控，我們同樣和上面的案例一樣直接利用螺旋黃金分割圖做參考位置選擇，所以就很快找到合適的位置，如上面右圖。
填充背景和文案
我們將背景顏色填充為天空統一的色彩，建立網格，將文案排版在畫布中，上面主要是海報中的主要文案及主題文案，文案和圖片的總體比例為1 : 0.618，遵循我們的黃金法則。
根據圖片的氣質，圖片中的色彩和人物都屬于文藝氣質，清新、寂靜、雅致的感覺，所以我們這里可以選襯線體宋體，結合韓文來體現整體的氣質。
效果展示
最后看看海報效果吧，主要講解螺旋黃金分割圖的使用，所以排版方面講解的比較簡單，以及主題文字都采用最簡單粗暴的字體，沒有過多的修飾。
文章分享了螺旋黃金分割構圖的用途，很廣泛，包含海報設計、畫冊設計、網頁設計、繪畫、服裝設計、logo設計、電視電影、建筑、攝影等等領域，以及分享了黃金分割圖形的畫法，3 個簡單的案例實操，利用黃金分割構圖來幫助我們構圖和排版，最有利于我們對圖片焦點位置的選擇和排版分布的掌控。
文章來源：優設
在做項目做產品的過程中，作為互聯網產品設計師的我們，經常會接到來自 PM/領導/業務方等等的各種需求。有的時候，哪怕一個小功能、次次次級頁面都會爭得不可開交。這個時候怎么辦呢？到底應該聽誰的呢？哪個需求優先級高？哪種呈現方法是更靠譜的呢？
今天我們就來聊聊一個非常實用的需求分級方法 — KANO模型。
KANO 模型是東京理工大學教授狩野紀昭（Noriaki Kano）發明的對用戶需求分類和排序的工具。通過分析用戶對產品功能的滿意程度，對產品功能進行分級，從而確定產品實現過程中的優先級。
KANO 模型是一個典型的定性分析模型，一般不直接用來測量用戶的滿意度，常用于識別用戶對新功能的接受度。幫助企業了解不同層次的用戶需求，找出顧客和企業的接觸點，挖掘出讓顧客滿意至關重要的因素。
在 KANO 模型中，根據不同類型的需求與用戶滿意度之間的關系，可將影響用戶滿意度的因素分為五類：基本型需求、期望型需求、興奮型需求、無差異需求、反向型需求。
興奮型需求
所謂暗處，用戶意想不到的，需要挖掘/洞察。若不提供此需求，用戶滿意度不會降低；若提供此需求，用戶滿意度會有很大的提升。
當用戶對一些產品或服務沒有表達出明確的需求時，企業提供給顧客一些完全出乎意料的產品屬性或服務行為，使用戶產生驚喜，用戶就會非常滿意，從而提高用戶忠誠度。
這類需求往往是代表顧客的潛在需求，企業的做法就是去尋找發掘這樣的需求，領先對手。
期望型需求
所謂癢處。當提供此需求，用戶滿意度會提升；當不提供此需求，用戶滿意度會降低。
它是處于成長期的需求，客戶、競爭對手和企業自身都關注的需求，也是體現競爭能力的需求。
對于這類需求，企業的做法應該是注重提高這方面的質量，力爭超過競爭對手。
基本型需求
所謂痛點。對于用戶而言，這些需求是必須滿足的，理所當然的。當不提供此需求，用戶滿意度會大幅降低，但優化此需求，用戶滿意度不會得到顯著提升。
對于這類需求，是核心需求，也是產品必做功能，企業的做法應該是注重不要在這方面減分，需要企業不斷調查和了解用戶需求，并通過合適的方法在產品中體現這些要求。
無差異需求
用戶根本不在意的需求，對用戶體驗毫無影響。
無論提供或不提供此需求，用戶滿意度都不會有改變。對于這類需求，企業的做法應該是盡量避免。
反向型需求
用戶根本都沒有此需求，提供后用戶滿意度反而下降。
總而言之，我們做產品設計時，需要盡量避免無差異型需求、反向型需求，至少做好基本型需求、期望型需求，如果可以的話再努力挖掘興奮型需求。
KANO 模型分析方法主要是通過標準化問卷進行調研，根據調研結果對各因素屬性歸類，解決需求屬性的定位問題，以提高用戶滿意度。
1. 明確目的
做之前，必須明白調研的目的是什么，是否合適用 KANO 模型解決，為什么要用 KANO 模型解決。
例如：企業為賣家開發的 CRM 工具，隨著賣家客戶的不斷增長，CRM 系統中需引入一些新的功能滿足其管理需求。而我們作為產品開發設計者，需要知道這些功能哪些是基本功能，哪些是增值功能，功能的優先級又該如何排列等等。
KANO 模型就可以幫助我們很好的貼和業務需求，從具備程度和滿意程度這兩個維度出發，將 CRM 中新增的功能進行區分和排序，從而知道：哪些功能是一定要有，否則會直接影響用戶體驗的（基礎屬性、期望屬性）；哪些功能是沒有時不會造成負向影響，擁有時會給用戶帶來驚喜的（興奮屬性）；哪些功能是可有可無，具備與否對用戶都不會有大影響的（無差異因素）。
2. 設計問卷
此問卷調查表劃分維度有兩個：提供時的滿意程度、不提供時的滿意程度。而滿意程度被劃分為 5 級（非常滿意、滿意、一般、不滿意、很不滿意），因為人的滿意程度往往是漸變的，而不是突變的。
滿意程度的文案可根據實際問題靈活修改，如使用（非常喜歡、理應如此、無所謂、勉強接受、很不喜歡 或者 非常有用、挺實用、無所謂、不實用、很不實用 ）更加形象的描述。
例如：在「通訊錄」中，是否需要直接提供「撥打電話」的按鈕？問卷設置正反兩題：
如果我們在「通訊錄」的客戶列表中，提供「撥打電話」的按鈕，你的感受是：
A.非常喜歡 B.理應如此 C.無所謂 D.勉強接受 E.很不喜歡
如果我們在「通訊錄」的客戶列表中，沒有提供「撥打電話」的按鈕，你的感受是：
A.非常喜歡 B.理應如此 C.無所謂 D.勉強接受 E.很不喜歡
為了更加形象且一目了然，我們可以如下設計。填問卷的人只需要在空白處打勾打叉就好了，非常方便。
設計問卷的過程中，有幾點要注意：
例如：
3. 清洗數據
在收集所有問卷之后，注意清洗掉個別的明顯胡亂回答的個例。如全部問題都選擇「我很喜歡」或「很不喜歡」的，這種回答毫無參考價值。
4. 整理分類
為了能夠將需求區分為基本型需求、期望型需求和興奮需求，需按照正向和負向問題的回答對屬性進行分類，具體分類對照下表。
當正向問題的回答是「我喜歡」，負向問題的回答是「我不喜歡」，那么 KANO 評價表中，這項功能特性就為「O」，即期望型。
如果將用戶正負向問題的回答結合后，為「M」或「A」，則該功能被分為基本型需求或興奮型需求。
其中，R 表示用戶不需要這種功能，甚至對該功能有反感；I 類表示無差異需求，用戶對這一功能無所謂。
Q 表示有疑問的結果，一般不會出現這個結果（除非這個問題的問法不合理，或者是用戶沒有很好的理解問題，或者是用戶在填寫問題答案時出現錯誤）。
簡單來說就是：
A：興奮型；O：期望型；M：必備型；I：無差異型；R：反向型；Q：可疑結果
注意：以上對照表只是的最常見的一種歸類方式。實際操作中，可因人而異，因產品、公司、地域而異（尤其是關于「R」和「O」的定義），因為滿意度本身就難以衡量。
判斷 KANO 屬性
記錄所有合理的數據，計算出各項占比，填寫在下面的對照表里面。
從上表中不難看出，「通訊錄中「撥打電話」「這個功能在 6 個維度上均可能有得分，將相同維度的比例相加后，可得到6 個屬性維度的占比總和。 總和最大的一個屬性維度，便是該功能的屬性歸屬。
可看出「在通訊錄中提供 ‘撥打電話’ 功能屬于興奮型需求。即說明沒有這個功能，用戶不會有強烈的負面情緒，但是有了這個功能，會讓用戶感受到滿意和驚喜。
如果你只判斷這一個需求，那么進行到這一步就可以到此為止了。如果涉及到多個需求的排序分級，你還需進行下一步。
計算 better-worse系數
Better-worse 系數，表示某功能可以增加滿意或者消除不喜歡的影響程度。
Better，可以解讀為增加后的滿意系數。Better 的數值通常為正，代表如果產品提供某種功能或服務，用戶滿意度會提升。正值越大/越接近 1，則表示用戶滿意度提升的效果會越強，滿意度上升的越快。
Worse，可以叫做消除后的不滿意系數。Worse 的數值通常為負，代表產品如果不提供某種功能或服務，用戶的滿意度會降低。其負值越大/越接近 -1，則表示對用戶不滿意度的影響最大，滿意度降低的影響效果越強，下降的越快。
因此，根據 better-worse 系數，對兩者系數絕對分值較高的項目應當優先實施。
其計算公式如下：
結果產出
例如：某產品希望優化 5 項功能，但是不知道哪些是用戶需要的。通過 KANO 調研分析，可以分別計算出 5 項功能的better-worse 系數。
根據 5 項功能的 better-worse 系數值，將散點圖劃分為四個象限，以確立需求優先級。
在實際項目中：
結論：
根據 KANO 模型計算出的 better-worse 系數值，說明該產品先滿足功能 5 和 4，再優化功能 2，最后滿足功能 1。而功能 3對用戶來說有或者沒有都無所謂，屬無差異型需求，并沒有必要花大力氣去實現。
KANO 模型定義了三個層次的需求：基本型需求、期望型需求和興奮型需求。
根據 KANO 模型建立產品需求分析優先級，運用到產品設計中就是要抓住用戶的核心需求，解決用戶痛點（基本型需求），抓住用戶癢點（期望型需求）。在確保這兩者都解決的前提下，再給用戶一些 high 點（興奮型需求）。
嚴格來說，KANO 模型并不是一個測量用戶滿意度的模型，而是對用戶需求的分類，通常在滿意度評價工作前期作為輔助研究的 典型定性分析模型。
KANO 模型的目的是通過對用戶的不同需求進行區分處理，了解不同層次的用戶需求，幫助企業找出提高產品用戶滿意度的切入點，或者識別出使用戶滿意至關重要的因素。
但需求會因人而異，會因文化差異而不同； 也會隨著時間變化?？赡芮岸螘r間的期望型需求，甚至興奮型需求，到如今已變成了基礎型需求。所以作為產品設計者，我們應該持續調研需求，對產品進行迭代優化。
藍藍設計的小編 http://www.syprn.cn