對于很多設計師來講在設計界面過程中往往會忽略掉很多的細節，比如卡片的排版、文字的排版、各種狀態的反饋等等，特別是剛入行的設計師在做頁面時往往是直接拿到競品的頁面搬運到自己產品上，這種做法理論上不會讓自己的頁面出錯，但是很多人往往忽略了一點，就是別人這么設計的目標是什么，是否會匹配自己的設計目標，如果不了解這些貿然的去搬運設計，那么時間久了會養成一個不好的習慣，需要設計師去進行設計時可能就會遇到很多難點，作為初級設計師或者剛入行的設計師，前期可以去進行搬運設計，但是一定要了解別人為什么這么做。
接下來將分享12個設計上的小技巧，大部分在日常設計中都會遇到，了解到這些設計細節，可以讓我們的界面更加高效、易用、美觀提升用戶體驗。
一、快捷交互
二、提升交互路徑
三、問題前置
四、提升可讀性
五、點擊引導
六、注意飽和度
七、禁止特殊字體
八、按鈕也要有層級
九、圖標保持一致
十、利用對比
十一、圖文疊加
十二、注意遮罩透明
我在做界面時可以時常利用交互手勢去幫助用戶提升操作效率，避免繁雜小操作步驟
左側為什么錯？？
左圖中針對單條消息的操作匯聚到了icon內，對于用戶理解成本比較高，當用戶想要去刪除或者屏蔽消息時需要通過聚合入口才能完成操作，大大的提升了用戶操作成本。
建議正確做法～～
我們可以在類似的消息場景或者其他列表形式的場景中，添加一些交互手勢，隨著手機系統的更新，用戶的操作習慣已經被各大產品培養的非常成熟，并不用擔心用戶無法操作的情況，增加手勢有弊端也有優勢，右圖中手勢增加了用戶首次使用的學習成本，但是降低了高頻功能的操作成本，這個理論上是可以接
受的。
實際產品中的運用
利用拇指定律把關鍵的操作入口元素等，放置右側提升用戶操作效率。
左側為什么錯？？
左圖中把按鈕放置了模塊左下側，這樣是不利于用戶進行操作，當然如果整個模塊的熱區都是同一個，這樣并沒有什么問題，用戶點擊卡片區域任何位置都能夠完成下一步操作，如果出現一個模塊內存在多個熱區入口，而用戶想要到達目標必須通過按鈕點擊才能進入，那么左圖中的排版位置就會提升用戶的操作時間。
建議正確做法～～
當一個頁面內出現多個相同模塊或者一個模塊出現多個熱區入口時，按鈕點擊區域有限，我們設計時就可以利用拇指定律進行排版，如右圖中布局，將按鈕放置右側可以便于用戶在右手操作時快速到達目標，因為國內使用右手的人數遠遠大于左手用戶，所以我們需要滿足大部分的體驗，合理利用拇指定律。
相關定律：費茲定律、拇指定律
實際產品中的運用
對于我們來講很多東西是簡單的，但是不乏會有一些用戶是陌生的，對于他們來講可能會有填寫成本。
左側為什么錯？？
左圖中理論上并不是錯，我們經常設計表單時都會用的提示話術，但是我們需要考慮更多維度的東西，對于我們來講填寫這種表單非常簡單，例如個別用戶，可能會臨時忘了郵箱格式，又或者輸入手機號時多填了一位數等等情況，用戶錯誤一次操作步驟就會多一步，反之就是降低使用產品時的體驗。
建議正確做法～～
如右圖中，我們設計時可以更改提示的話術，幫助用戶把問題前置，當用戶看到提示郵箱時就會按照格式去填寫，通過把手機號的位數拆分，讓用戶更好的記憶數字，這樣無論對產品還是用戶都沒有任何損失，反而能降低錯誤頻率。
實際產品中的運用
無論是頁面還是模塊，用戶在閱讀時是已掃讀的方式進行瀏覽，我們需要保證頁面的文字元素具備一定的規律，以此來提升閱讀效率。
左側為什么錯？？
左圖中可以看到，文字與輸入框放在同一列進行展示，這樣一方面不利于后續的文字擴展，通常這種表單填寫的頁面，在頁面中都是具有很大的空間位置，這樣排布會造成視覺上的不規律和擁擠，降低了篩選效率，當然如果是模塊區域很小的情況下，可以適當的進行使用。
建議正確做法～～
右圖中我們把文字與輸入區域上下排布，雖然文字長短不一，但依據對齊原則在豎列情況看是具備對齊規律的，有效的提升信息篩選效率。
實際產品中的運用
我們在做系統功能模塊時需要注意添加功能點擊引導，用戶對此類消息模塊認知上會默認不可點擊，因此需要我們加以引導。
左側為什么錯？？
我們常見的消息模塊內容為兩種，一種是互動類消息即用戶與用戶，另一種時是系統消息即產品推送的內容，前者基于用戶習慣而言用戶已經沒有使用成本默認是可以進行點擊交互，后者因為部分產品會把系統消息作為展示的形式給用戶，但是有些產品的系統消息卻是可以點擊交互，這就導致了用戶認知上出現了混亂，左圖中像系統通知功能通知其實從視覺上看，并不具備點擊欲望，因此可能會對用戶造成錯誤的理解。
建議正確做法～～
當我們在設計時需要注意，若消息列表中存在系統類消息并且可以進行交互，在設計時可以添加向箭頭、紅點提示等方式告知用戶可以點擊，如果該功能有數據指標，這種方式也同樣能賦能產品指標。
實際產品中的案例
目前市場上產品幾乎都有深色版本，我們在設計時深色版本的顏色時需要注意飽和度的高低，同樣的飽和度在黑色背景上會比白色背景上更加亮，這跟人的視覺感官有很大的關系，因此我們在做黑色版本時需要注意是否調整飽和度。
左側為什么錯？？
在黑色背景中使用過高的飽和度會刺激眼睛，很多深色版本都是從白色模式通過反向顏色直接調整，而彩色元素會直接運用到深色中，那么就會造成一個問題，因為我們習慣在白色模式下看顏色，忽然切換到黑色中看彩色刺激程度非常高“就像黑夜中忽然打開手電筒”，對眼睛的傷害很高。
建議正確做法～～
我們在設計深色版本時可以根據產品主色降低飽和度，包括圖標等元素，以此來緩沖對用戶視覺感官的刺激，目前很多大廠的處理方式是直接在彩色元素上添加一層黑色透明遮罩進行處理，這樣無需在添加更多的顏色規范。
實際產品中的案例
在設計模塊或者頁面時不建議使用特殊字體來突出文字層級，這樣會導致視覺不統一，以及開發成本增加。
左側為什么錯？？
左圖中灰色字使用了特殊字體，看起來雖然好看，但在實際開發中會導致開發成本增加，我們產品一般使用的是系統字體，若使用特殊字體需要讓開發同學添加對應字體包，這樣會導致我們的產品包的內存過大，除非產品中默認一直使用該特殊字體，這樣才有使用的價值。
建議正確做法～～
一般系統字體就能夠滿足我們的設計需求，在UI設計中我們可以通過不同的字體粗細來調整文字層級，這樣能夠保證視覺更加統一，減少產品包大小。
實際產品中的案例
在設計時需要注意多個入口在同一位置時，需要把它們進行層級劃分，避免影響用戶決策
左側為什么錯？？
圖中可以看到，兩個面性按鈕非常明顯的在模塊中，當用戶在瀏覽頁面中很容易出現困惑，到底需要點擊哪個才能購買預定，因為兩個都是面性無法快速進行定位入口，這樣不僅影響用戶決策效率，還會影響產品點擊率。
建議正確做法～～
建議設計類似模塊中時，無論是pc還是移動端都需要對入口進行結構劃分，這樣能夠使用戶在瀏覽頁面時快速定位到入口，提升決策效率，做體驗是解決用戶的思考時間。
實際產品中的案例
在UI設計中使用圖標時，要保持一致性，確保他們共有相同的視覺風格，相同的重量，填充和描邊。不要混搭。
左側為什么錯？？
可以看到左圖中的圖標并不統一，線性里面摻雜著面性點綴，這在UI設計中嚴重違背了一致性的原則，會導致我們的頁面不夠嚴謹專業。
建議正確做法～～
在設計圖標時，首先要保證圖標風格一致，其次在這個基礎上保證圖標的描邊粗細、視覺占比重量、顏色等，不要出現混搭風格。
實際產品中的案例
在設計頁面模塊時，可以多利對比度的方式來體現設計的表現力，鮮明直接的色值能夠直接表達事物的性質以及特點，通過對比，也能夠更加清晰的強調設計中的重點，這樣給用戶的印象會更深刻，同樣會給產品帶來一定的趣味性。
左側為什么錯？？
左圖中單看視覺也沒問題，只是在表現上圖標與背景融入到一塊了，導致視覺表現力較差，在設計中如果符合產品風格的前提下，我們可以避免這種方式，這種方式雖然具有視覺效果但不夠強，對用戶的記憶點不夠深刻。
建議正確做法～～
設計到類似的模塊時我們可以利用對比的關系，以此突出視覺元素，通過顏色焦點引導用戶關注，強化用戶印象同時還能增加頁面的視覺表現力和氛圍感。
實際產品中的案例
在設計圖文疊加的卡片或者頁面時，我們需要注意不同明度的圖片上，文字識別是否有阻礙，一般情況會通過遮罩方式避免這個情況。
左側為什么錯？？
左圖中在深色圖片下字體的可讀性是沒有問題的，但當出現文字底部區域的圖片相對復雜時便會影響識別，第二種情況當圖片明度過高時文字同樣無法識別，試想一下，一張白色調性的圖片上放文字，那基本無法看清，嚴重影響閱讀體驗。
建議正確做法～～
在界面設計時如果遇到類似的卡片，建議在文字區域添加漸變遮罩的方式，以此保證文字的識別度，或者添加純黑色透明遮罩進行處理，這樣可以兼容不同環境的圖片與文字的重疊，保證基本的閱讀體驗。
實際產品中的案例
UI設計中經常會遇到彈窗，彈窗是需要配合頁面遮罩來讓用戶進行專注操作，不同的遮罩透明度所帶來的專注度也不同。
左側為什么錯？？
左圖中我們看到，遮罩的透明度過低，我案例設置的是17%，此時彈窗內容與頁面內容結構上區分并不是很明顯，一般彈窗是用來讓用戶跳脫頁面內容，從而瀏覽彈窗內容，轉變用戶目標，當彈窗無法聚焦時便很難達到目標，并且視覺上層級更加混亂。
建議正確做法～～
右圖中案例我把透明度調整到了37%，我們此時再看彈窗很容易就忽略頁面內容，因為灰色越高，遮擋度越高，用戶跳脫感就越強，這樣我們可以讓用戶專注彈窗內容，同時視覺結構上也區分很明顯。
實際產品中的案例
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
UI新手設計學習100問，顧名思義，主要是通過100個常見問題解決初學者在學習UI設計初期的困惑，比如什么是UI設計？設計的目的是什么？UI設計需要學會什么必備技能？UI設計又有什么常見的學習方法等等。
為什么用問答的形式？這是受一個朋友的創作啟發，讓我確定了以這種形式來創作，這樣更易于大家理解和學習。另外這個欄目的內容，我也將會盡自己最大的精力，從百度百科、維基百科以及國內外的設計書籍中一邊查一邊寫，努力制作成一本UI設計新手學習的知識手冊，解決新手初學者的種種困惑，給他們提供一個學習的知識樹和進度條。
這個欄目會有多少字，多長更新完？我已經完成了第一章大部分內容，目前已經撰寫了約5000字，平均每個問題800字，以我目前創作內容的篇幅看，這份專欄應該在10萬字左右，相當于一本300頁左右的實體書籍。至于完結時間，除了需要參考百度百科和維基百科，還要翻閱各種設計書籍和查找資料，我個人預計時間3個月，不過如果大家喜歡，我就會加快腳步！
我在2022年轉型到知識付費以后，認識了太多的設計師朋友，也建立了自己的社群。其中讓我印象最深的有這么一類用戶群體，他們很早就在大學期間為了學習UI設計，花了很多錢報了各種培訓班，但最后的結果卻不如人意。很多培訓班太注重于軟件技能的操作，而忽略UI設計其實是一門學科，如果學生知其然不知其所以然，那么即便學會了Sketch、Figma這些工具，他們也不知道學了UI設計到底能有什么用，未來又該如何去規劃自己的職業生涯。
這些朋友里面，留給我印象最深的，是一個剛畢業的女孩。她給我說，貸了兩次款，畢業后還是不知道UI設計到底能干啥，現在勉強找到一份設計的工作，每個月還要還著貸款走。我當時把這個朋友免費邀請到我的私董會星球了，讓她去看我講的書、錄的課程，期望能給她帶來一絲溫暖和希望。
其次在我最早開始建立社群的時候，有一個探友在站酷看到我的產品拆解以后，跑來加我，然后給我說：“我一直質疑培訓班老師的講課內容，因為我覺得設計這門職業，如果只學會軟件，那是不夠的，肯定需要學習一些設計原則和理論。所以當我看了你的產品拆解以后，我很受啟發，我覺得學會這些設計理論特別重要?！?br />
這些真實的故事，讓我印象深刻，也讓我開始反思，造成這種現象的原因是什么。所以這個專題的內容，在很久之前就藏在我的心里了。我想去做一個UI設計的知識樹，給那些準備學習UI設計以及正在從業的設計師們提供一個清晰、可視化的學習體系，從而幫助他們從一個宏觀、系統的角度去勘察這個行業，發展趨勢是什么、是否值得入行，從0到1又需要哪些步驟。
這個專題，主要為這幾類朋友而創作。第一，正在上學，準備想學習UI設計的大學生；第二，剛畢業準備報班學習UI設計，或已經從培訓班剛畢業出來的應屆生。第三，雖然已經從事UI設計三五年，但對UI設計還是一知半解，混混霍霍做設計的職場設計師。
最后，這個專題是我的第一個付費內容，我將會免費分享30個內容，如果你覺得有價值，可關注我們獲取全部內容。
目前我把這個專欄拆分為四塊內容，分別是認識UI、就業前景、學習方法和如何求職四個章節。
第一章是認識UI，我會從設計的目的、UI設計的定義和分類開始讓初學者對UI設計有一個初步的了解。（這個部分的內容也許適用于80%的UI設計師，雖然很多設計師已經從業了多年，但對UI設計還是一知半解。）
第二章是就業前景，通過UI設計當前的工作內容、薪資收入和職業發展等維度告訴初學者UI設計的就業趨勢，降低就業選擇風險。
第三章是學習方法，我想給初學者提供一個學習知識樹和能力晉升模型，只有知道最終要去哪里，自己當前又在哪里，應該如何努力，他們才能像玩游戲一樣，每天對知識的汲取都充滿動力。
第四章是如何求職，通過拆解企業對UI設計師的招聘需求，抽絲剝繭地讓初學者理解求職的本質和方法。
這是初步擬定的目錄，非最終交付目錄。其次這份專欄我將會篩選30個左右的問答免費給大家分享試看。
1. 認識UI
什么是設計？（已完結）
設計的目的是什么？（已完結）
設計和藝術的區別？（已完結）
UI設計是什么？（已完結）
UI設計有什么分類？（已完結）
UI和UE、UX的區別？（已完結）
UI設計和平面設計的區別（已完結）
UI設計和電商設計有什么區別？（已完結）
UI設計有什么價值？
國內UI設計的發展歷程
2. 就業前景
UI設計師現在的就業前景怎么樣？
哪些公司和行業需要招聘UI設計師？
UI設計師飽和了嗎，還值得選擇嗎？
失業的UI設計師越來越多，還能選擇UI設計嗎？
UI設計師的工作流程是怎樣的？
UI設計師主要負責什么工作內容?
新手UI設計師的薪資收入一般在哪個水平？
UI設計師的薪資收入晉升模型
UI設計師會經常加班嗎？
UI設計師的工作壓力大嗎？
UI設計師職業發展路線圖是怎樣的？
UI設計師是不是過了30歲就會過氣？
技術崗位未來是否一定要朝著管理崗發展嗎？
一二三線城市的環境對UI設計師就業和成長有影響嗎
談不上對UI設計特別熱愛，但覺得UI設計工資高，可以選擇這個行業嗎？
學會UI設計可以創業或做自由設計師嗎？
3. 如何學習
UI設計師需要學習什么內容？
UI設計師需要掌握哪些必備技能？
UI設計學習的步驟是什么？
需要多久才能成為一個優秀的設計師?
除了設計，UI設計師還需要培養什么職業技能？
學習UI設計的常見方法
UI設計可以自學嗎？
自學UI設計有什么難點和挑戰？
審美能力不好，可以學好UI設計嗎？
UI設計需要學習什么軟件?
學會軟件一般需要多長時間？
UI設計需要買蘋果電腦嗎？
用Photoshop可以設計UI嗎？
UI設計需要看什么設計書籍？
有哪些免費學習的教程網站？
錄播課程和設計培訓班有什么區別？
有那些物美價廉的付費課程推薦？
選擇設計培訓班需要注意什么？
培訓班學完以后就能成為UI設計師了嗎？
培訓班對找工作有幫助嗎？
UI設計師需要美術相關專業嗎
什么樣的專業更適合UI設計？
學歷對UI設計師的學習有影響嗎？
設計臨摹對新手UI設計師有什么幫助？
設計臨摹有什么技巧和方法？
設計臨摹的作品可以加入個人作品集嗎？
一名好的UI設計師應該具備什么素質？
優秀的設計師都有什么好的設計習慣？
4. 如何求職
企業招聘UI設計師的流程是什么？
企業招聘UI設計師主要考核標準是什么？
企業愿意招聘新手UI設計師嗎？
新手UI設計師應該選擇什么樣的企業？
去不了大廠，新手設計師是不是就沒前途？
創業團隊、小公司值得新手UI設計師去嗎?
UI設計師的求職流程是什么？
UI設計師求職需要準備什么資料？
簡歷設計對UI設計師重要嗎？
如何設計一份優秀的作品集？
新手UI設計師有什么求職技巧？
學歷低對UI設計師的求職有沒有影響，如何規避？
沒有工作經驗怎么辦，能找到工作嗎？
一直找不到工作怎么辦，是不是應該放棄UI設計？
設計是什么？為什么需要設計？UI設計這個行業又是怎么誕生的？UI設計師的工作內容具體是什么？非科班畢業的大學生適合從事設計行業嗎？這個行業需要學習多久才能成為一名優秀設計師？作為此次專題的開篇內容，我們在這個章節將會抽絲剝繭向大家介紹UI設計的由來、定義、分類和價值，幫助大家快速對UI設計這門學科有一個宏觀的了解。
我們先看百度百科對設計的定義。設計，是指設計師有目標、有計劃地進行技術性的創作與創意活動。維基百科認為，所謂設計，即“設想和計劃，設想是目的，計劃是過程安排”，通常是指有目標和計劃的創作行為及活動。
著名的美國設計理論學家維克多·帕帕奈克認為，設計是為構建有意義的秩序而付出的有意識的、直覺上的努力。他認為設計有兩個步驟。第一步：理解用戶的期望、需要、動機，并理解業務、技術和行業上的需求與限制。第二步：將這些知道的東西轉化為對產品的規劃（或者產品本身），使產品的形式、內容和行為變得有用、能用、令人向往，并且在經濟和技術上可行。
簡單總結一下，設計是有目的的，有計劃的、滿足用戶的期望的行為。比如企業需要設計一個官網進行對外宣傳，網站的設計就屬于有目的、有計劃的工作，而宣傳則是企業的核心需求。
為什么我們需要先了解“設計”的概念？這是因為UI設計只是設計的一個細分領域，設計的種類非常多，設計在許多領域都有應用，涉及的方面也比較廣泛。只有初步了解這個宏觀的大概念，我們才能更清晰地看清楚UI設計的本質，從而為我們的學習進行指導。
參考文獻：
百度百科-設計
維基百科-設計
《步步為贏：交互設計全流程解析》- 董尚昊
我們先看世界上第一所完全為發展設計教育而建立的學院包豪斯對于設計的三個基本觀點。
①設計是藝術與技術的新統一；②設計的目的是人而不是產品；③設計必須遵循自然與客觀的法則來進行。
包豪斯提出“以解決問題為中心”的設計理念。他們認為設計是為了解決問題，不論是設計一個水壺，還是一款手機應用軟件，設計師都是在為他人服務，在幫使用者解決問題。這個設計理念深深地影響了設計界。設計是理性和感性的結合，并以解決問題、滿足人們的需要為目的。
中國現代設計和現代設計教育的重要奠基人之一、美國設計教育最高學府——美國藝術中心設計學院教授王受之在他的著作《世界現代設計史》中寫過這樣一句話：“設計是為他人服務的活動。”
日本當代國際級平面設計大師藝術總監原研哉在《設計中的設計》一書中也有類似的表達：“設計的實質在于發現很多人都遇到的問題然后試著去解決的過程。”
綜上所述，設計的目的是用設計方案來滿足用戶的需要，而不是單純產出設計師認為美觀的方案。這是設計過程中最重要的指導原則之一。如果不理解設計的本質，我們在以后的商業設計中就很容易陷入一個怪圈，我覺得這個界面這樣設計得非常好看，但客戶卻讓我去臨摹另外一個我認為很普通的產品界面，客戶覺得那個才是他想要的。
參考文獻：
《步步為贏：交互設計全流程解析》- 董尚昊
我們看看維基百科對藝術的介紹。藝術是指憑借想象力、經驗等綜合人為因素的融合與平衡，以創作隱含美學的器物、環境、影像、動作或聲音的表達模式。而百度百科則對藝術沒有明確的定義。藝術是一種社會現象、社會事物，屬上層建筑中的社會意識形態，其次也指向各種技術活動，比如畫、雕刻、建筑等活動。
藝術的目的可以分為無動機的及有動機的兩類。無動機的藝術是指那些本來就是人類不可或缺一部分的藝術，這類的藝術超越個人，或是不是為某一特定目的所創作。有動機的藝術是指那些因為特定目的產生的藝術。可能是為了政治的變革、表達特定的感情、陳述個人心理，或是作為一個交流的工具。
原研哉在《設計中的設計》對設計和藝術也發表了自己的看法。
藝術說到底是個人意愿對社會的一種表達，其起源帶有非常個人化的性質，所以只有藝術家自己才知道其作品的來源。而設計，則基本上不是一種自我表達，它源于社會。設計的實質在于發現一個很多人都遇到的問題，然后試著去解決的過程。
簡單總結，設計和藝術有很多重疊的部分，兩者最本質的區別是設計的本質是滿足需要，包含更多的商業述求，而藝術的目的是表達藝術家對世界的看法，不受外界的約束。為什么要弄懂這兩者的區別，這是因為在商業設計中或許不會給你有太多充足的時間去完成完美的稿子，而是要以甲方或企業的設計目標為主、商業設計，不是藝術，而是要通過設計滿足甲方的需求。
參考文獻：
維基百科-藝術
《設計中的設計》- 原研哉
由前UI設計屬于近代興起的設計分類，這是隨著科技的快速發展才催生出來的新興行業。目前對于UI設計的定義，目前國內有兩種流派。
第一種，UI設計包含界面設計（Graphical User Interface，簡稱GUI）、交互設計（Interaction Design，簡稱IxD）和用戶體驗設計（User Experience Design，簡稱UX）。
我們先看百度百科對UI設計的定義描述。UI是User Interface(用戶界面)的簡稱，是指對軟件的人機交互、操作邏輯、界面美觀的整體設計。UI是一個廣義的概念，可以通過以下三個層面來理解UI的概念。
首先，UI是指人與信息交互的媒介，它是信息產品的功能載體和典型特征。比如以視覺為主體的界面，強調的是視覺元素的組織和呈現，包含圖形、圖標、色彩、字體等，這就是我們常說的視覺表現層，用戶從視覺就可以直接感知的部分。在這一層面，UI就是用戶界面，也是國內普遍對UI設計的認知。
其次，UI是指信息的采集與反饋、輸入與輸出，這是基于界面而產生的人與產品之間的交互行為。在這一層面，Ul可以理解為User Interaction，即用戶交互，需要通過界面對功能的隱喻和引導用戶來完成對應的操作。因此，UI不僅要有精美的視覺表現，也要有方便快捷的操作，以符合用戶的認知和行為習慣。
最后，UI的高級形態可以理解為User Invisible（中文：看不見的）。對用戶而言，在這一層面UI是“不可見的”，這并非是指視覺上的不可見，而是讓用戶在界面之下與系統自然地交互，沉浸在他們喜歡的內容和操作中，忘記了界面的存在。其實這就是用戶體驗，不僅僅是界面，而是以用戶為中心進行界面結構、行為、視覺層面的設計。
從百科的對UI設計的定義可以看出，UI設計包含了界面設計、交互設計和用戶體驗設計，這也是國內眾多UI設計書籍中的對UI設計的定義。比如在《術與道：移動應用UI設計必修課》、《視界·無界：寫給UI設計師的設計書》、《UI設計精品必修課》等國內設計書籍都有類似的觀點。甚至有這么一個很流行的比喻：如果把一款軟件產品比作一個美女的話，視覺就是一個美女的化妝和打扮，交互就是一個美女的五官位置及骨骼體態，用戶體驗就是美女是否善解人意、功能貼心、易用好用等。
第二種，UI設計、交互設計和用戶體驗設計是獨立的學科，他們雖然有很多重疊部分，但交互設計和用戶體驗設計不屬于UI設計，甚至UI設計等同于界面設計。
在Joel Marsh的《用戶體驗設計：100堂入門課》這本書中，作者舉了個例子：“UI和UX（用戶體驗設計）是兩種不同的工作。如果有的公司有‘UI/UX’這一職稱，那說明這家公司根本不了解什么是UX，或者他們想花一份錢就讓人做兩份工作。要當心?！?br />
在《這才是用戶體驗設計：人人都看得懂的產品設計書》里，作者認為界面設計包括信息層和呈現層。UI設計的范圍比界面設計要小得多，通常僅關注虛擬產品的信息呈現，而且較少涉及藝術向的視覺設計。信息層則由交互設計師負責，待界面上要呈現的信息架構和具體信息明確后，UI設計師才開始設計工作。其次UX設計師主要關注上層設計，而UI的工作非常細，比如如按鈕、字體的設計。
這種觀點也是目前國內多數企業和設計師對UI設計的定義，UI設計就主要是負責界面設計的工作，尤其指移動端產品界面，比如APP、智能設備等。
結合以上兩種流派對UI設計的定義，我認為，從視覺層面，UI設計可以定義為用戶界面設計，不管是web端、移動端還是其他智能設備，凡是涉及到用戶界面的設計，都可以歸納為UI設計；從交互層面，UI設計還需要思考界面對功能的隱喻和引導，從而幫助用戶完成對應的操作；從體驗層面，UI設計需要從視覺、色彩、行為和交互等方面為用戶提供優秀的體驗，讓用戶可以和系統自然地交互，沉浸在他們系統操作中。
總之，一名優秀的UI設計師，絕非只是畫好圖標、完成界面設計這樣的基礎工作，而是從整個產品的用戶體驗出發，從視覺到實際操作，為用戶提供最友好的使用體驗。理解這個概念，我們才能確立真正的學習目標和職業定位，朝著一名優秀的UI設計師而努力。
參考文獻：
百度百科-UI設計
《術與道：移動應用UI設計必修課》- 余振華
《視界·無界：寫給UI設計師的設計書》- 王涵
《UI設計精品必修課》- 常麗 李才應
《用戶體驗設計：100堂入門課》- Joel Marsh
《這才是用戶體驗設計：人人都看得懂的產品設計書》- 李磊
從用戶人群劃分，像淘寶、美團這樣以個人消費者（Customer）使用為主的產品，稱為C端產品，屬于最常見的UI設計，稱為C端UI設計；而像有贊、微盟這樣的以服務企業（Bussiness）的產品，稱為B端產品，這就是B端設計師的由來，目前市場對B端UI設計師的需求比較大。
從使用設備劃分，從事電腦端設計的稱為WUI（Web User Interface），也就是網頁設計師，從事移動端設計的稱為GUI（Web User Interface，圖形處理設計師），是我們普遍理解的UI設計師。
從設計對象劃分，UI設計可以分為電腦界面、APP界面、平板、智能手表、車載導航設備、智能電視界面、可穿戴設備界面、醫療及各種數碼機床等自動化控制界面和微型嵌入式設備界面等類型。
從交互方式劃分，UI設計可以分為GUI和VUI，GUI就是我們上文提到的圖形處理設計師，而VUI（Voice User Interface）則是通過語音交互的界面設計，比如小度、天貓精靈。
從行業劃分，UI設計師可以分為不同行業的設計師，比如從事醫療產品的UI設計師，從事人工智能的UI設計師。
簡單總結，未來隨著各種智能設備、人工智能、AR的發展，將會誕生出更多細分行業的UI設計師，不管是現在最火爆的B端設計師，還是車載設計師，未來面對日新月異的科技發展，只有理解UI設計的本質和方法，才能應付越來越多的不確定性。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
這是一篇醞釀了比較久的內容了，來講解 B 端設計規范和組件庫的分享。這幾年網上出了不少類似的分享，雖然都寫得很全，都還是覺得不夠滿意，缺了一點點細節。
所以我自己出一版，希望能幫助你們一次性解決這些問題。
B 端項目設計中，設計規范和組件庫是一個繞不過去的檻。作為專業的 B 端設計師，必須有自己完成設計規范和組件庫的能力。
所以，首先我們要先理清楚什么是設計規范和組件庫。
設計規范是項目設計中要遵守的要求、細節、準則，規定了諸如色彩、字體、柵格、間距、圓角等要素的規則，這些內容都是可以在大量設計元素中應用的細節。
換句話說，設計規范就是提取在項目中會廣泛使用的要素，并進行統一制定的過程，防止設計師在設計過程中隨意發揮，導致項目統一性的崩壞。
組件庫，是通過梳理項目中應用到的按鈕、開關、滑塊、日歷、下拉菜單等控件、組件的設計樣式、狀態、交互規則，再將它們統一復用到項目的不同頁面中去。
嚴格意義上來說也是設計規范的一部分，是基礎規范的進一步延伸，但還是單拎出來講。因為組件庫的應用不僅僅是設計統一性的問題，還融合了 ”組件化“ 的編程思路在里面。
組件化：將復雜系統拆分成不同功能獨立的模塊并重組的過程，且每個模塊包含對應的狀態和屬性。
對于程序員來說，一個項目就是若干功能模塊的合集，往往是先開發這些功能模塊，再搭建對應的完整頁面，而不是看一個頁面開發一個頁面。
所以制定完善的組件庫，除了提升設計質量外，還可以很好的提升開發效率，推進項目進度。
設計規范和組件庫的搭建，就是一個由下至上的設計鏈路，通過對細節的制定來實現最終的項目表現層。可以借助廣為流傳的分子原理來理解：
任何成熟的 B 端項目都應該具備自己的設計規范和組件庫，雖然有很多小團隊在前期推進項目時，因為各種問題沒有搭建或落地設計規范，但并不代表他們在招人的時候沒有要求。
在今天搭建 B 端項目規范時，新手還有一個普遍的問題：
項目規范和開源框架的規范有什么區別，如果選了一套開源框架做設計，設計師不就不用做規范了？
初級設計師會這么想并不奇怪，因為以 AntDesign 為首的開源框架做的實在是太完善了，不僅囊括了整套的 Web 色彩系統，還有各類常用的、不常用的交互組件。
它們不僅僅提供了相關的設計源文件，也給開發提供了對應的代碼和接口，方便程序員應用?？雌饋砦覀冎灰雌唇M件就可以和開發無縫銜接了……
這顯然是不可能的，正是因為開源框架太全面，可以產生無數種可能，我們才更應該整理自己的項目規范。就像我前面已經提到過的，設計規范是種 ”限制“，而不僅僅是設計風格的簡單沉淀。
比如，不管你選了哪套開源框架，它提供了多少種色彩，你的項目都應該有自己的項目主色，適當的輔助色彩，而不可能把它的整套配色都應用進去。所以，即使顏色沒有跳出原有色彩系統，也要篩選出你用到的顏色進行記錄。
再比如，開源框架的很多控件，都提供了好幾種樣式和方案，并不是讓你全部都用進去，而是選擇自己覺得合適的。所以你每個控件中選擇的方案，也需要做記錄，統一后續的頁面設計。
前面只是記錄選擇，都還比較簡單，而最關鍵的問題在于，開源框架的組件不可能完美符合項目的全部需求。必然要在原有的基礎上作出大量細節的優化，或者創建出新的業務組件出來，所以設計師還是要把這些內容整理出來。
開源框架，就是給我們提供了一個比較全面的設計范圍，讓我們站在別人的肩膀上做選擇，提高設計規范的制作效率，而并不是讓我們直接躺平，復制黏貼就可以了。
同時，設計規范和組件需要在軟件中進行運用，我們也同樣不能直接使用官方提供給我們的組件庫展開自己的項目設計，要根據自己項目的規范獨立進行搭建和使用。
下面，我們就要根據設計規范的內容，來講解如何結合并使用即時設計、Figma 的相關功能。
之所以 UI 設計軟件能取代 PS 獨立發展，就是因為 UI 設計中包含大量需要復用和批量修改的功能。而這些功能和設計規范有非常大的聯系，也是 UI 設計中項目規范能被落地實踐的重要保障。
但因為 Figam 和即時等次時代 UI 設計軟件提供了越來越多的功能，用來支持設計規范的實踐，且這些功能可以相互交叉、重疊、組合，導致很多人在前期學習中會被軟件功能繞暈，導致很多人沒有理解這些功能意義和價值，更不知道如何在項目中具體實踐。
所以，我們先將這些功能整體理解一遍，再逐一來對它們的使用規則和應用場景進行拓展。
樣式功能是用來記錄圖層樣式設置的功能。簡單點理解，就是記錄圖層右側的屬性設置的功能。正常我們選擇一個基礎圖層，軟件右側的屬性面板會將圖層樣式拆解成若干的類別，包括填充、描邊、字體、陰影、模糊。
而樣式功能，就是幫助設計師對不同的樣式類別進行記錄和復用的過程，它會直接將該分類內的相關參數值記錄下來，并進行命名，方便后續的調用。
響應式功能是讓圖層隨上級編組尺寸變動而自適應的功能，方便我們在修改組件的大小時不用重新調節里面的元素細節。
例如設計一個卡片，可以通過響應式的設置，讓頭部的元素左右對齊，下方的文本區域自動拓展，保持卡片的內間距不變。
或者頁面右下角懸浮按鈕，也可以通過響應式設置始終處于頁面底部，這樣我們在增加頁面高度的時候不用重新設置該元素的 Y 軸位置。
自動布局功能，是通過前端布局思路來設置元素布局方法自動排版功能，是 Figma 開發的最重要的功能，也是讓 Sketch 不再成為 B 端設計首選的核心因素。
它的主要功能如根據內容自動完成尺寸變更，并列排版和順序的變更等。
自動布局可以極大的提升設計效率，正因為自動布局的出現，才讓項目組件庫可以真正被運用和落地實踐起來。
組件功能在不同軟件有不同的叫法，如 Symbol、Component、Kits 等，主要是將指定的圖層或編組生成一個新的編組單位（類似智能對象），在后續設計中進行復用。
例如設計一個按鈕、開關，我們只要將它們生成為組件，就可以在后續設計中快速從組件庫里拖拽到設計頁面中，不用重新畫一遍，并且支持批量修改。
在組件應用中，生成的第一個組件也叫父級組件，其它調用它的組件都是它的子組件，這是一個非常清晰的從屬關系。如果我們修改父級組件的內容，所有子組件都會被統一修改。
組件的應用除了這種最基礎的應用以外，還包含了很多特殊的功能，如將低級組件合并成一個高級組件的嵌套，或者 Figma 前兩年發布的變體（Vriants），可以將一個組件的不同狀態聚合到一起，通過屬性面板來切換相關的狀態。
組件功能是 UI 類軟件最復雜的功能，它不僅本身設置很豐富，同時也可以結合樣式、響應、自動布局，讓本來死板的組件變得更靈活可控，應對復雜的設計環境。
在軟件中，記錄樣式就是在對應的屬性面板上 “創建” 并 “命名”，就將對應設置數據轉化成一個指定名稱的記錄，方便我們記憶和調用。
比如，填充色中使用了兩種色彩相近的色彩和不同透明度，我們就可以使用中文命名來區分，其中 #2B6DCF 80% 叫 輔助色，#2B93CF 90% 叫 主色。
創建完成的填充色記錄，就會在對應的屬性樣式列表中出現，之后就可以在對應圖層的屬性中關聯該記錄了。
之后，所有關聯到該記錄的圖層屬性，都可以快速應用該記錄內的參數。如果我們在樣式的列表中修改該記錄的數值，那么所有關聯到該記錄的圖層就會一起被修改。
一定要牢記，目前的主流 UI 工具中，樣式是根據不同屬性類型記錄的。比如一個字體圖層，它的填充、字體、描邊、投影，是可以創建不同的樣式記錄的，各不影響。
而軟件 Sketch 的樣式邏輯，則是根據圖層類型來記錄的，比如矩形和字體，會記錄該圖層下所有樣式屬性的參數，且該記錄只能應用在同類的圖層上（而 XD 只能記錄色彩和字體樣式…）。
這種做法雖然理解起來容易，但是會導致樣式數量大幅度增加。尤其是在字體上，變動填充、描邊都要設置一個新的樣式，這在實際項目中的靈活性是非常差的。
而即時設計、Figma 則不考慮圖層類型，只關注屬性類型。類似前端的樣式表中 “類（Class）” 的應用，每個類有不同的樣式參數，只要定義了類的命名和屬性、參數，那么不同 Div （即圖層）就可以自由組合這些樣式記錄了。
比如色彩 color、陰影 shadow、描邊 board 各定義了1、2、3 三種樣式類，那么就可以像下方案例中自由組合：
<Div Class = “ color2 shadow1 board3 ”> </div>
<Div Class = “ color1 shadow3 board2 ”> </div>
所以，樣式功能可以幫助我們在前期快速搭建基礎視覺規范內容，將規范中的配色、字體、投影、模糊等參數整理進樣式表中，方便我們后續的快速調用和統一修改。
響應式是我們前面做過很多期分享的課題了，基于 BootStrap 的完整響應式功能確實非常強大，可以通過柵格布局來實現豐富的響應方式。
雖然 UI 軟件中也提供了 ”響應式“ 這樣的功能，但它可以實現的效果非常有限。用一句話概括就是：
“圖層基于父級畫板 Frame 的匹配邏輯”
比如我們先創建一個畫板，然后再置入相關的圖層，那么這些圖層就可以啟用響應式規則。包含間距固定、居中對齊、等比縮放這三種響應規則。
間距固定的意思，就是圖層基于父級畫板的某間距數值是固定的，不管畫布尺寸怎么變動，圖層和畫布的對應間距都是保持一致的。比如常規的某一方向間距固定。
比如在模塊上的標題欄，就可以將欄目設置成一個 Frame，然后標題相關元素左間距對齊，更多圖標右間距對齊，之后變更標題欄的寬，圖層的對齊關系就是不變的。
而設置左右、上下間距同時對齊，則是圖層會隨畫布的尺寸變動修改自身的寬高來滿足。
居中模式則是圖層根據畫布的大小進垂直、水平方向的對齊，忽略間距數值。
最后一個縮放的設置，用起來和兩側間距對齊很接近，也是放大縮小畫布圖層會跟著一起變動，但它響應的邏輯是依據比例，而不是間距。這個設置在實際項目中很難派上用場。
過往的設計軟件中，父集尺寸變更，下級元素只能機械的執行縮放效果。而響應式設置就是避免這種僵硬的效果，向真實的網頁適配方式看齊。
同時，這種父集對齊的邏輯是可以進行嵌套使用的，比如剛才的標題欄，可以將這個畫板再置入到整個卡片畫板之下，并對 “標題欄畫板” 創建頂部對齊，左右間距對齊，那么該畫板本身的尺寸不管怎么變動，頭部標題欄頂部位置固定，寬度間距和父集統一，標題欄下方的元素也會左右對齊。
所以，將一個畫板中的元素響應方式設置好，可以節省我們很多時間，不用再因為父集元素尺寸修改而一個圖層一個圖層修改下級元素的尺寸和位置。
在后續生成組件前，我們就要優先完成畫板下方的響應設置，這樣就能確保該組件支持靈活的調節和布局。比如用上方的卡片，就可以快速搭建一個表盤頁面的基本框架，我們要做的就是拖拽畫板到一個合適的尺寸即可，無需調節下級圖層。
但需要注意的事，即時設計和 Figma 觸發響應式的設置是元素需要處于畫板 Frame 之下，而不是編組 Group 中， Sketch、XD 因為沒有 Frame 的概念，所以使用編組就可以應用響應式設置，這個區別一定要牢記。 同時，響應式雖然可以完成很多高效的適配，但是它的局限性是無法打破的，例如無法實現 3 列以上的卡片列表等間距放大，或者隨寬度增加生成新列下方卡片補位。
自動布局 Autolayout 作為一個自動排版功能，使用場景包含兩類，父子級響應和依序排列。它們有各自的生成條件。
首先需要一個矩形圖層作為背景，并將其它下級圖層置入到矩形背景中去，全選后點擊 “自動布局“ 按鈕即可生成父子級響應。如果圖層沒有完全置入矩形中或沒有相交，那么就會生成一個依序排列的自動布局出來。
創建自動布局會生成一個新的 “特殊編組”，用來收納下級圖層，它在圖層列表中會有新的圖標。
父子級響應布局中，背景的矩形圖層會被自動移除，樣式被繼承到自動布局的編組上，針對該編組層的屬性設置，就等同于原先的背景矩形設置（和畫板 Frame 圖層邏輯一樣）。
這類布局最常應用于按鈕控件上，可以讓按鈕的寬度隨文本寬度變化。
但光靠創建這個效果顯然是無法完整解釋自動布局的，我們就必須從前端的邏輯，來理解這種包含父子層級的元素如何實現自動布局。
首先就是前端環境中，很多控件、組件本身的尺寸是無法直接寫死的，它們是隨內容自動調節的。而自動布局右側的設置面板中的田字格一欄，旁邊會有寬度和高度設置，默認都是 “自動 Auto”，這就是說它們會隨內容寬高進行響應。
比如上方的按鈕，它實現的邏輯就是：
按鈕寬 = 元素內容寬 + 左右間距
按鈕高 = 元素內容高 + 上下間距
這種情況是父層級基于子層級的響應，應用于無法確定父級圖形尺寸的場景，如按鈕、標簽、單元格、瀑布卡片等。
但前端中的不確定性并不是只有這一種，還可以反過來，子圖層大小不確定，需要它們去響應父級圖層的尺寸變更。
比如一些文本卡片，會應用在不同的頁面中，且根據應用的場景會有寬高的調節，所以需要下級的文本區域可以跟隨上級尺寸響應。
我們就需要把父級布局設置成 “固定寬/高”。還要選中子圖層，在它的自動布局選項中選擇 “自適應”，來滿足這個相反的需求。
如果子圖層沒有設置自適應，那么它就不會直接隨著父級圖層變更自己的尺寸。但還是有針對子元素的響應設置 —— 對齊模式。
在父級布局設置中，有一個網點模塊，可以設置下級圖層的對齊模式。當下級圖層不處于自適應模式時，則對齊可以修改下級元素的對齊方向，即前面響應式設置中的 “間距固定”。
前面我們演示的案例都只有一個子圖層，如果出現多個子圖層的話，自動布局也可以幫我們進行調節，除對齊外還包含子圖層排列方式、分布方式，而這就是依序排列的布局模式。
排列方式就是多個子圖層橫排還是豎排的設置。
分布方式，則是這些子圖層布局的位置怎么定，默認包含固定間距和自適應兩種。
固定間距即子元素排列的間距保持一致，在右側的輸入框中可以設置間距數值，也可以結合對齊模式來設置整體的對齊方向。
而自適應，則是在父級區域內進行等分，這個等分的邏輯比較特別，需要左右各有一個子圖層靠到頭，新增的圖層在這個基礎上進行 “等間距分布”。
依序排列的優勢，除了把現有的子圖層快速布局以外，還可以用拖拽、鍵盤調整元素順序。或者從外部拖動某個圖層到該區域中，就可以插入序列，成為下級圖層之一。
前面兩種布局模式，可以解決各種 UI 設計中的細節設置問題，理解起來也并不難，只要自己去操作一下就能學會。而真正讓人頭疼的，是自動布局可以相互嵌套，并混合這兩種模式，在復雜的頁面設計場景和組件模塊中靈活應用。
下面我們通過一個模態對話框 Modal Dialog 案例來進行說明。這個對話框會包含3種不同的寬度規格，且對話內容不確定，可能會字數很多包含很多行的高度。
想要用自動布局實現一個滿足需求的對話框，我的建議是先學會拆分里面的下級模塊，通過完成下級模塊的設置后再進行最終的合并調節。
在這個對話框中， 包含三個模塊，頂部標題欄、中間內容區域，底部操作欄。
首先從頂部標題欄開始，我們隨意創建個 280px * 44px 的矩形，然后再置入標題和圖標到矩形中。之后全選它們創建成自動布局，然后設置父層級內間距，且改成寬度固定、分布自適應，就可以獲得一個可以隨意修改寬度的標題欄了。
然后就是內容區域，本質上就是一個文本區域，所以我們拖拽一個文本區域出來，設置好對應的參數和填充一點文本即可。
而底部操作欄，則在一開始做好兩個按鈕（可以使用自動布局做）和背景以后，就可以進行合并，只是父級元素上的設置要改成固定寬度和右對齊，并設置布局間距（按鈕間距）。
這三個模塊完成以后，我們再選中它們進行自動布局合并，把它們設置成豎排模式，再添加背景色和排列間距，就可以實現出一個正常的對話框效果。
到這一步，如果我們修改對話框整體的寬度，或者輸入多行的文本，都無法達到預期的效果，所以還要在這個基礎上進一步的調整。
首先是寬度適應，我們要先將最上級的自動布局改成 “固定寬度”，然后將下級圖層都改為 “自適應”，這樣我們增加組件的寬，下方布局就會立即響應，且推導到更下級的圖層中。
為了滿足文字寬度隨父級響應，高度影響父級高度，就要將頂部的自動布局改成 “高度適配”，再將下級的文本改成 “寬度自適應”、“自動高度”，然后，我們就可以隨意拖動這個自動布局的寬，和添加任意的文本內容了。
完成這個基本的版本以后，我們再根據項目需要的三個寬度，直接將它復制成 3 份，每份直接設置對應的寬度出來，就可以作為后續的 “原始組件” 在項目中進行快速引用了。
在這個案例中，我們前后嵌套了若干層的自動布局，每層自動布局的上下級會有各自的響應關系，需要我們逐一進行確認。并且，細心的同學應該也發現，這里面有很多設置似乎和前面的響應式設置非常類似，那把一些下級布局從一開始就做成響應式的編組行不行？
答案是可以的…… 響應式設置和自動布局，本質上都是為了節省我們操作時間而設計的功能，我們要從實際設計的對象出發，選擇合理的功能來實現最終的效果。而不是只能使用自動布局，或者只能使用響應式。
也不要因為了解了響應式包含了非常強大的自適應功能，而認為項目中任何組件、頁面，都要全由它們組成。在需要頻繁優化頁面內容、調整設計需求的項目里，過度嵌套的自動布局會讓設計文件的 “熵” 值無限增加，會產生更多復雜的、沒有效率的問題。
相信引用過 Ant、TDesign 等組件庫文件進行設計的同學應該都深有體會……
至于怎么用才好，沒有標準的答案，就需要未來大家自己去積累相關經驗了。
有了前面響應式和自動布局的認識，我們就要進入到組件功能的具體應用上了。
組件的創建，首先要選中對應的設計元素，可以是單個圖層，也可以是編組、自動布局層，然后點擊生成組件按鈕就可以創建出一個 “原始” 組件。
在即時設計中，這個組件叫 “引用組件”，從該組件復制、引用出來的副本叫做 “實例組件”。它們具有明確的從屬關系。
在這個關系中，引用組件是完全可編輯修改的，只要修改它就可以統一修改關聯的所有副本樣式。
但由引用組件創建出來的副本，卻不能任意編輯，我們不能修改它下級圖層的尺寸、位置、順序。但是，副本的編組大小、圖層色彩、文字內容往往會有很多特殊的調節需求，所以目前主流的 UI 軟件都支持了副本組件的尺寸修改、色彩編輯和文本內容編輯，讓組件的使用更靈活。
以上就是組件使用的最基本邏輯，更進一步，組件作為一個編組，所包含的下級圖層的邏輯都會被保留下來，例如樣式設置、響應式設置、自動布局邏輯。如果一個編組原本就已經創建好了這些規則，那么當它被創建成組件，不管是引用組件還是副本，都會繼承這些設置。
比如上一小節中的通知彈窗案例，設置好自動布局再創建成引用組件以后，生成的副本就可以靈活的進行調整和修改文本內容。
除了樣式、響應、自動布局外，組件也可以包含組件。我們前面說過，按原子核的結構來講，一個復雜的組件是由若干基礎元素和控件組合而成。比如上方這個案例，就由多個模塊、文本區域和按鈕組成。
如果我們提前將按鈕、圖標等創建成引用組件，那么最終整個大的編組再創建成引用組件也是沒有問題的，原來的組件格式并沒有被抹消。
但有個細節值得注意，就是一個引用組件下方包含的組件只能是 —— 副本。如果剛才我們將按鈕創建成引用組件，那么上級編組再創建的引用組件就會自動將這些按鈕轉換成副本，并在畫布周圍生成新的引用組件。
所以這個順序也預示了，組件的嵌套是由下而上的，我們需要先創建低級的引用組件，再用它的副本逐步去組合更復雜的引用組件。這在后面的章節會進一步做出說明。
創建引用組件，除了在畫布中它的描邊色彩不一樣，圖層中的圖標改變了以外，還會出現在一個新的位置中 —— 組件管理面板。
任何創建的組件都會被生成到左側的組件欄目面板中，只要從那里拖拽就可以置入當前畫布中，方便我們調用和查看。
看起來雖然很簡單，但是需要我們管理的細節卻很多。首先就是這個列表是一個包含層級關系的樹樁結構目錄，是允許我們對組件的層級進行結構自定義的。
當我們創建一個引用組件的時候，如果它處于一個畫板中，那么創建后它會在組件面板中保留該組件的默認文件路徑：
頁面 Page / 畫板 Frame / 組件 Compoent
如果我們在不同頁面和不同畫板中創建引用組件，那么該面板的目錄一定是特別混亂無序的。所以為了創建出符合正常分類使用習慣的組件目錄，就要做出調整。
首先就是建議在項目文件中創建一個獨立的頁面 Page 用來存放引用組件，任何新增的引用組件我們都需要將它置入到該頁面中。且不要將引用組件直接置入到畫板中，這樣它就不會生產包含畫板的層級出來。
然后，我們就可以在文件命名中，使用正斜杠 Slash 符號 “/” 作為層級劃分依據。比如下面的案例，包含相同上級結構的組件會被聚合到一個目錄層級中：
這種命名結構帶來的另一個好處，就是處于同一個目錄層級下的組件，在屬性面板中可以進行快速的切換。尤其是一些相近的組件要做替換不用再在樹樁列表中重新找一遍，直接通過下拉菜單替換即可。
使用命名方式來梳理組件列表，完成有邏輯性、清晰的組件目錄，可以極大地提升組件的利用率和效率。但命名必然不是一邊創建組件一邊憑感覺命名的，而是一開始就要在外部完成的，例如通過思維導圖的方式制定出結構大綱，才能保證最終效果符合預期。
組件的應用中，除了不同組件的引用外，過去最讓我們頭痛的就是同一個組件的不同狀態。比如一個簡單的按鈕，就包含非常多的類型，默認、懸浮、按壓、點過、禁用、讀取等等。
為了在項目中可以使用組件的不同狀態，就需要我們在命名上下功夫，比如：
就是用前面提到的右側下拉菜單，來完成同一組件的不同狀態切換。理論上這么實現是沒有問題的，但在實踐過程中，不僅組件列表的數量要大大增加，且下拉菜單第一步只改狀態顯得非常局促……
所以，從 Figma 開始推出了變體 Variants 功能，來更好地應對同一組件不同狀態的高效應用。目前該功能已經在線上 UI 設計軟件中普及。
在即時設計中，只要創建了引用組件，那么選中它后右側就會有 “變體” 一欄，點擊它就可以針對該組件創建出變體效果。
變體中原來的組件一分為二，并不是完全生成出一個全新的組件，而是在這個組件的概念下創建了一個新的狀態出來，在組件列表面板中沒有生成任何新的內容。
但是當我們再添加一個該組件的副本以后，就會發現它的右側多了一個條目和下拉菜單，通過這個下拉菜單就可以切換剛才變體內的不同組件。
比如我們在變體內選中兩個組件，在右側變體的下拉菜單中可以點擊修改命名，將它們分別改成 “默認” 和 “選中”，再修改對應的樣式。然后再應用同一個副本，就可以看見下拉菜單的內容也替換成了“默認” 和 “選中”，通過選擇不同的文字，就可以切換成對應的組件樣式。
這個功能可以很方便的切換組件的不同狀態，但如果它僅僅支持到這一步，那確實和使用命名編組的方法沒有本質區別。真正讓變體產生價值的，就在于同一組件的多屬性、多狀態支持。
還用按鈕舉例，比如一個按鈕包含 3 種樣式：純文字、純圖標和文字加圖標，再包含 3 種狀態：默認、懸浮、點擊，還有淺色和深色模式……
也就意味著，按鈕包含樣式、狀態、色彩三種屬性，每個屬性中的值可以相互結合，那么總共就要設計出 18 個對應的按鈕出來。
如果我們使用變體每個樣式命名一個名字，那么下拉菜單有12個選項選起來也是很頭疼的。所以，變體允許我們自定義組件屬性和值，幫助我們更好的歸類和選擇組件樣式。
所以，在變體面板中，我們可以在更多選項中選擇添加分類就添加對應的屬性內容，添加出 3 個分類后，通過雙擊修改它們的名字為 ”樣式“、”狀態“、”色彩“。
有了屬性，變體下方的組件命名就會根本變更。如下圖所示，默認一次顯示屬性值，雙擊則可以查看對應的屬性名和值。
即變體的基本命名語法為 —— 屬性1 = 對應類型, 屬性2 = 對應類型, 屬性3 = 對應類型。
我們就可以通過這種語法方式完成對上方按鈕的統一命名，如：
然后，將這些組件統一添加到同一個變體下，之后創建的副本，就可以在右側變體面板中進行多維度的選項操作了。
具體的變體設置，分類、值的設置，可以自己在軟件中摸索，我就不演示了。這里再額外提一個功能，就是對值的設置上，還可以應用 “布爾” 的規則，即選項中只包含 “是” 或 ’否“。
如果我們在色彩的值中只使用 ”是，否“、”yes，no“、”開，關“ 等反義詞，那么副本變體選項中就會啟用開關按鈕，來替代原本的下拉菜單，提升操作的效率。
變體的使用可以很好的減少組件面板中組件的數量，提升組件狀態切換的效率。如果一個組件創建變態后被嵌套在另一個組件之下，那么這個復合組件也可以快速修改下級組件的變體類型。
雖然變體功能看起來非常強大，但它并不能適用所有場景，因為修改起來影響的要素過多。它更適用于基礎的控件和組件類型。如果針對復雜組件，尤其是包含多層組件嵌套的場景，往往使用命名的方式會比使用變體更有效率，這就需要大家自己在項目中積累經驗做判斷。
通過前面的功能，就可以完成組件庫的對應設置了，你可以在這個項目文件中調用這些組件完成項目。
但實際項目中，組件庫的使用可不能被局限在一個項目文件里，我們往往會創建很多個項目文件，來設計不同的流程、版本、模塊。于是，這些不同的文件都需要調用同一個樣式和組件庫。
所以，要讓包含規范的文件能被其它文件引用，就需要我們在組件面板中，點擊設計庫按鈕，在彈窗中點擊 ”發布“，將它創建成一個設計資源庫。這樣，我們在別的文件中再次打開這個面板，就可以看到這個資源的開關，點擊開關后，該文件就能調用里面的樣式和組件了。
在項目中，需要先新建團隊并邀請相關成員，然后再創建設計資源庫，那么其他設計師才可以引用該資源來完成相關頁面的設計。
至于每次原文件更新并落實到引用的其它文件這些細節操作，就需要大家自己去實踐了。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
度咔是百度短視頻生態首款面向泛知識創作者的視頻剪輯工具，致力于降低泛知識類作者的創作門檻，助力生產優質的作品。
隨著產品的功能迭代，體驗的逐步更新，產品依勢也需要打造更好的運營氛圍和品牌印象來建立用戶口碑、提升轉化。對此，設計側針對度咔產品進行了全面的思考和分析，通過重新定義度咔運營視覺語言，明確產品調性，幫助用戶更新品牌認知。
一、品牌框架搭建
產品的運營視覺不只是單純的畫面展示，其背后都有更加明確的設計理念和手段，但運營視覺語言并不是千篇一律的，首先需要明確自身定位，突出產品獨特性。
設計初期，我們針對同類型產品與用戶類型進行了大量分析，在用戶人群劃分上度咔更具有針對性，目標用戶是口播自媒體、知識類創作者。但不像專業剪輯軟件門檻那么高，度咔更多的是通過特色產品功能幫助作者去降低剪輯門檻，業務主要通過征稿和教程的運營活動來提升用戶認知，帶動日活。
由此，我們梳理出度咔的品牌框架圖。以度咔「專為口播自媒體打造的剪輯工具」產品定位作為切入點，依據其自身定位和度咔區別于同類產品的特色功能，我們提煉出“便捷”、“智能”、“專業”產品核心關鍵詞。
二、定義度咔運營視覺語言
在前期創意階段，我們通過大量的競品調研、創意發散、概念嫁接等創意手段，找到時下大字為主導的版式創意。簡潔明確的版式結構，適當的畫面留白，使各元素在版面中形成具有條理清晰、富有節奏的視覺關系。這種邏輯方式，為運營視覺的高效、科學、嚴謹性提供了極大的便捷，同時也對應了度咔便捷、智能、專業的品牌感知。
對品牌定位、業務訴求、產品功能進行整合后，我們搭建以構成、配色、元素為主的視覺語言框架。
與時下大字為主導的版式創意相結合，建立以大字排版，強構成感為主的視覺語言基調。通過大量的風格測試不斷完善視覺基調并投入到項目中，同時規范運營功能排版，搭建元素庫，通過設計手法，達到專業與簡潔的平衡，統一的視覺基調和品牌色強化用戶對品牌認知。
1、重塑視覺基調：
1）統一風格
度咔以往的運營視覺趨于參差，導致整體視覺有較為強烈的割裂感，煥新后的視覺變得更加直率簡約，以簡潔的視覺風格保證內容傳遞的高效性。拋棄了諸多裝飾元素，取而代之的是硬網格，保持視覺整體和諧統一感，同時也傳遞出度咔便捷、智能、專業的產品調性。
我們對運營頁面進行了布局重構，采用白色底的背景突出文字信息，使得內容信息傳達更加明確，突出核心內容。在各類場景中，我們通過品牌色彩、圖形、符號的滲透，強化度咔品牌印記。
2）主題延展
根據業務訴求，保持主題性征稿活動的特色——在強化功能點的運營活動中采用3D元素和彌散漸變背景，如夏日主題將度咔符號與泳圈做3D創意結合，增添活動氛圍感。
2、品牌色煥新：
1）建立度咔品牌色應用規范。增強品牌識別性和記憶點。
首先搜集符合產品調性的顏色情緒版，選取整體偏明亮，識別度高的新品牌藍色。對比原來偏紫的品牌藍，現在升級后的藍色更顯專業智能，且更具有電子意味。
在一個科學有效的色彩系統里，往往包含至少兩種色彩：主色+輔助色，兩者互相搭配組合成產品體系的整體色彩感受，減少用戶在產品體驗中對反復出現的主色的視覺疲勞。
我們將藍色賦予了統一的品牌認知感受，并且將藍色加入到橙色里，生成了度咔特有的藍橙色系。橙色在度咔的色彩系統中起著至關重要的作用，為產品帶來積極，活力的感受，同時深黑和灰色創造結構、表達邊界、建立信息層次。
以基礎征稿活動為主的頁面使用度咔標準藍；在需要強主題和活動氛圍的頁面加入輕量的彌散漸變色彩。
3、提升效率：
1）元素庫搭建
建立度咔元素庫，規范化運營活動主視覺圖形原創性和創意性，沉淀設計資產。
由于后期運營活動多處用到3D元素，對3D的質感進行了規范統一。輕量化的3D風格更加注重極簡主義理性美學。
考慮到運營頁面的通用性，避免3D材質的喧賓奪主，材質風格以簡單通用為主，顏色以品牌色為基礎，采用光感通透的玻璃材質，加入環境光感。明朗，透傳度咔的品牌氣質。
四、總結
本次通過度咔運營視覺語言的搭建，無論從產品本身還是設計側，在數據和效率上都有明顯的提升。而設計作為和用戶最近的一方，在平衡各方訴求后呈現給用戶一個全新專業感十足的產品，進一步向用戶傳達品牌感知，助力創作者發現更多美好。
感謝閱讀，以上內容均由百度MEUX團隊原創設計，以及百度MEUX版權所有，轉載請注明出處，違者必究，謝謝您的合作。申請轉載授權后臺回復【轉載】。也歡迎加入MEUX,視覺/交互/運營設計師，可投簡歷至MEUX@BAIDU.COM (注明信息獲取來源如：站酷）
關于我們：
MEUX,百度移動生態用戶體驗設計中心，負責百度移動生態體系的用戶/商業產品的全鏈路體驗設計。服務的產品包括百度APP、百度搜索、百度百科、百度貼吧、百度商業產品等。MEUX以「簡單極致」為設計理念，創造極致用戶體驗的同時賦能商業，推動設計行業的價值和影響力，讓生活因設計而更美好。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
借此機會和大家交流一下項目背后的思考，共同進步！
我將從以下幾個方面進行講解：
01 對于理念的思考
02 關于風格的思考
03 關于背景的思考
04 關于材質的思考
對于本次設計，需求方是沒有給主題限制的，那作為設計師的我就從自身現階段的生活去發現主題、尋找靈感。 從深圳到成都創業，將近一年的時間，我發現成都的天氣總是陰沉沉的：
充足的陽光變得非常稀缺，對于成都人來說，如果有陽光的時候，都會去外面坐坐，曬曬太陽！ 這一年，“光”對我說是一種期盼的事物：
基于這個生活細節，我就把主題定成了“追光空間”而我對于“追光空間”的理解就是：光感、純凈、靈動
后面的執行也是基于這個理念進行思考創新的！
有了主題，就可以基于主題去思考設計風格了。
其實主題圖標的設計其實已經有很多年頭了，尤其是“app”這個概念流行開始，各大安卓手機品牌就有了自己的主題商店，用戶可以根據喜好下載自己喜歡的主題圖標。 我們在網上搜索主題圖標，可以看到很多作品，其中不乏有非常優秀的主題作品，但是當觀察的量到達一定程度后，會發現市面上的主題圖標風格還是比較相似，大部分還都是屬于二維圖標（下圖源自網絡）：
即使是一些質感很強的圖標，很多也是鼠繪出來的，也不算是3D風格（下圖源自7years）：
包括我們去年給小米做的幾套主題，也都是偏2維風格的
基于這樣的現象，我們是否可以嘗試將3d風格與主題圖標進行融合呢？雖然不能說是第一個這么做的，但至少在市面上出現的這種結合還是相對較少，所以也可以算是一種小的創新。
在構想風格的時候，我的底層邏輯就是找到未被發現的切入點，如何理解呢？
如果是3d風格與電商活動結合，已經相對常見了（下圖源自網絡）：
如果是3d風格與游戲視覺結合，也經常會看到（下圖源自網絡）：
但是如果是3d風格與主題圖標結合并且落地使用，那還是相對比較少的，這就是我在思考風格時候的一點心得：
希望可以給同行們一點啟發，拋磚引玉，希望市面上可以看到更多的3d風格的主題圖標！
這次的主題和以往不一樣，我們每做一個圖標需要延展4個尺寸：
有一些寬的、有一些高的，如果我們只放一個圖標，那么會比較空曠，不夠飽滿，所以我們必須在背景上加一些圖案或者紋理，使整體更加飽滿精致。
背景紋理怎么做呢？我們希望它有細節但又不能過于搶眼，于是把目光鎖定在了基礎形狀上面，比如方形、圓形、三角形等等：
鎖定基礎形之后，就需要在基礎形之上融入更多的設計思考，比如風格的結合，因為整體是3d風格，所以背景也可以是3d化的基礎形白膜：
除此之外，我們需要將圖形進行構成設計，以不同的節奏和位置使其產生不同的美感，把基礎美多維度的釋放出來，比如矩形的基礎元素進行構成設計：
這樣，就可以做出不同的背景圖案，以此來解決需求目標。
設計師一定不要輕視基礎，不管是技法層面還是審美層面，往往優秀的設計都是無數個“基礎”堆出來的，先掌握基礎，才能用“基礎”釋放更大的能量！
其實本次的材質，也不算難，沒有用到特殊材質，主要有兩個關鍵點可以分享交流！
關于燈光
燈光我們使用的是日光燈，從軟件操作層面沒有任何技術含量，但是對于基礎審美會有一定的門檻，尤其是對于明暗交界線、光影對比的理解！
燈光的不同位置和大小會導致光影質感的不同：
燈光曝光：
質感太平:
物體與背景區分度不夠:
同樣的物體，不同的燈光角度和大小就會有不同的質量等級：
只有這種基礎審美達標后，我們才能繼續往后延伸。
關于材質
對于材質，最初我們嘗試用最簡單的漫射材質，但是發現缺少光澤度和細節，于是又嘗試在外部加一層玻璃材質，形成一圈透明質感和細節：
后面大部分的圖標都采用這種形式進行延展！
以上就是這次項目背后的一些思考
共勉！
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
導語
近年三維表現已經越來越多的融入到各種商業設計當中，在電商、品牌、UI、影視等各個領域都有廣泛的運用。其中一個關鍵因素是C4D這款軟件的出現，大大降低了3D設計的學習門檻。
C4D相對于專業性更強、功能較為復雜的3DMax、Maya、ZBrush等軟件，界面更加簡潔友好，對于沒有接觸過3D的的小白，學習成本更低。配合Octane、Redshift等渲染器，可以很快做出強視覺表現力的效果。憑借這種操作友好、易出效果的特性，C4D很快成為了近年最流行的3D設計軟件之一。
本文結合作者自身的經驗整理了一波自學的思路和技巧，希望能在大家學習C4D的過程中有所幫助。
前言
相信很多沒有三維設計基礎的小白，剛接觸到C4D時會有無從下手的感覺，面對各種形形色色的命令菜單和工具面板，內心是這樣的：
其實大可不必擔心，不同方向的設計師可以有不同的側重點，只要掌握自身職業需要的模塊，并不需要學會所有的功能。追求大而全反而難度大效率低，容易產生挫敗感從而被勸退。
所以這里建議的C4D學習思路是：結合自身的職業方向，先明確要學習的側重點，集中精力突破，然后再根據新的需要逐步學習更多即可。
學習過程則大體上分為入門、上手、實戰三個階段。
Part 1. 入門
1.1 明確學習方向
C4D大體可以分為建模、渲染、角色、動畫、運動圖形、動力學這幾個模塊，每個模塊都可以看成是獨立的知識體系，往下又有更具體的細分。真要全面仔細鉆研的話，需要投入很多的時間精力，這也是讓很多初學者無從下手甚至望而卻步的原因。
所以除了建模和渲染是繞不開的基本模塊，我們可以將另外幾個看成是比較具有針對性的模塊，具體需要著重學習哪一部分，則需要先明確最適合自己的學習方向：
比如你是電商設計師，平時的工作內容主要是制作各種產品高大上的渲染圖以及推廣視頻，那除了基本的建模與渲染，還可以著重學習運動圖形，做出各種酷炫的商業廣告視頻；
如果你是IP設計師，則需著重學習角色模塊，在完成靜態角色的建模渲染后，綁骨骼刷權重也是必須掌握的知識點，才能做出豐富的動作和表情，讓角色生動起來；
總之，不同職業方向，甚至項目的不同時期，都有不同的學習側重點，這里需要每個人自己去判斷。
建模和渲染則是最常用的兩個模塊，無需有職業方向的針對性，都應該在前期優先學習，并且做到基本掌握甚至熟練運用。
常規的步驟是先學習建模，再學習渲染；不過建模比較枯燥，渲染則是最出效果也是最提升學習信心的環節，我認為根據個人喜好，先學渲染再學建模，反而是更推薦的學習順序。
1.2 選擇學習資源
選擇學習資源方面，目前網絡的免費教程十分豐富，依靠教程的學習足以讓你初期快速的上手，新手在選擇教程方面盡量以體系較為完整，演示時軟件版本較好的原則，如英文水平較好建議去外網看看各路大神的教程，原汁原味的學習；另外考慮到外網資源的機翻和獲取難度的原因，這里主要推薦一些國內網絡能獲取自學資源：
建模
建模方面在學習階段主要注重C4D的工具使用和基礎技巧，這里推薦幾個免費教程。
1、https://www.bilibili.com/video/BV1Cb411T7Dc?p=1&vd_source=018f00780190d4b9c79b5abbdb3be276
2、https://www.bilibili.com/video/BV1PZ4y1s7vm?p=1&vd_source=018f00780190d4b9c79b5abbdb3be276
渲染
渲染以OC渲染器為例，這是現網能找到比較完整的免費教程，學習后可以直接上手出圖。
1、https://www.bilibili.com/video/BV1ur4y1T72V?p=39&vd_source=018f00780190d4b9c79b5abbdb3be276
2、https://www.bilibili.com/video/BV1f4411V7qh?p=1&vd_source=018f00780190d4b9c79b5abbdb3be276
動力學
動力學可以由淺入深，從基礎的常用動態手法及運動原理開始入手，以小實例練習的方式慢慢轉向大場景的動態設計學習。
1、https://www.bilibili.com/video/BV17f4y127uv/?spm_id_from=333.788.recommend_more_video.1&vd_source=018f00780190d4b9c79b5abbdb3be276
2、https://www.bilibili.com/video/BV1ZA411w7qC/?spm_id_from=333.337.search-card.all.click&vd_source=018f00780190d4b9c79b5abbdb3be276
更多綜合性實戰教程
各大網站都能找到不少實戰案例的教程，根據需要可以找到更多。
1.https://www.bilibili.com/video/BV177411P7d1?p=1&vd_source=018f00780190d4b9c79b5abbdb3be276
2.https://www.bilibili.com/video/BV1AY4y1G7Nc?p=1&vd_source=018f00780190d4b9c79b5abbdb3be276
1.3 軟硬件配置相關
打團下副本之前，還得先準備一下裝備；這里簡單對于萌新學習前的軟硬件要求做一些說明和推薦。
渲染器選擇
C4D目前可選主流的渲染器有octane、阿諾德、Redshift、vray、自帶渲染器（不推薦）。主流渲染器各有優缺點，綜合下來筆者推薦萌新選擇OC渲染器，原因是學習資源多，學習難度低，渲染效果優、渲染速度快等優點。
以下是各渲染器的對比，萌新們可權衡自身的情況進行選擇：
電腦配置
在PC電腦方面，以筆者正版OC4.0渲染器為例，顯卡選擇N卡，型號以20系列以上最好，顯存4G以上（有經費的可以入手今年的40系列顯卡）；其他配置看自己的經濟情況而定，如CPU方面單核性能越強對于渲染效率和c4d默認渲染器的加速越快，內存推薦64G以上，另外在電源上如果已經配備了20系列以上的顯卡建議選擇900W以上的，除了顯卡和CPU這兩個核心硬件其他的配置主要看個人情況而定，對電腦不懂的優先看電商平臺的整機方案，主要以顯卡和cpu為參考依據，其他的配置可浮動選擇。
在蘋果電腦方面，筆者并不推薦以3d工作為主的設計師選擇蘋果電腦，主要原因是主流渲染器的選擇較少，另外C4D插件各方面的支持也遠不如PC方便和豐富（如有特殊原因，可以優先選擇M1芯片的電腦或者配備N卡獨顯的蘋果電腦）。
軟件版本
C4D軟件版本推薦使用最新版本或者R23以上版本，隨著廠商的更新換代，有些以前只有插件能完成的功能慢慢完善在新版本上，新版本帶來的便捷功能可提高萌新的出圖效率并免去舊版本沒有兼顧的功能導致的學習成本浪費問題。
另外在OC渲染器上的版本問題盡量以當前版本能兼容的最新OC為主，當然，需要你的顯卡需要和OC版本是匹配的情況下。
1.4 好記性不如爛筆頭
收藏和觀看的教程多了，容易看了后面的忘記前面的，或者沒有實際上手印象不深。這里我嘗試過最好用的方法可以總結為一句話，就是俗話說的“好記性不如爛筆頭”。
對于一些關鍵的知識點，或者很有用的上手練習案例，可以在自己學習或者練習后，將關鍵步驟以在線筆記的形式自己整理一遍。
這樣做有兩個好處，一是能大大加深你對知識點的印象，不易遺忘；二是即使真的隔了很長時間有所遺忘，只要調出對應的文字筆記，就能很快重新想起對應知識點，比起重新翻出視頻教程，邊拖進度條檢索再看一遍，效率高得多。
比如我之前在學習渲染體積光效果（丁達爾效應）時，總是掌握的不扎實，學過就忘，下回再用到時，基本相當于又要翻出視頻教程再看一遍，效率很低。但是將關鍵知識點整理成筆記后，不單對這個知識點記得很牢，甚至能在不重新翻看筆記和教程的條件下，熟練的以教程中提到的三種不同方式做出體積光。
筆記鏈接：https://note.youdao.com/s/Lwt42DsG
以下是我整理的部分筆記庫，感覺在筆記庫里的知識點才算是比較掌握了的。
1.5 多搜集優秀案例
除了掌握工具，多看優秀案例以提升自己的設計思維和審美也很重要，只有看的優秀案例夠多夠好，將自己的設計眼光、審美水平、思考方式向大神們的靠攏，才能做出好的作品。
這里推薦幾個我覺得的很贊的3D類網站：
Artstation：http://www.artstation.com；
Sketchfab：https://sketchfab.com/feed；
Behance 3D：https://www.behance.net/galleries/3d-art；
Dribbble 3D：https://dribbble.com/search/3d；
Part 2. 上手
2.1 熟能生巧多練習
上手階段，充分的動手練習是必不可少的。
這里的練習也分為兩種，一種是跟隨教程案例做出一樣的效果，一種則是結合自己感興趣的題材設定一個主題或場景，將學習的知識點融會貫通，在自己的命題作品里實際應用起來。兩種練習的方式也是相輔相成，在積累足夠多的教程案例練習后，更推薦按照自己的想法來創作。
比如我會將自己感興趣的漫畫題材，在C4D里作為一個場景練習，融合進平時學的一些知識點。
《頭文字D》場景
《海賊王》場景
因為用的是自己感興趣的內容練習，所以做起來也上手很快，知識點也記得很牢，推薦大家可以試試。
2.2 善用插件提效率
1.Forester-植物生成插件
輕松生成各種類型的植物和部分巖石，各項小參數的調整方便個性化的調整，另外有便捷的動力系統可以輕松制作風吹植物的效果，結合OC渲染器的克隆功能搭建大場景非常輕松，適合在做動態設計的時候快速生成搭建場景。
2.QuadRemesher-四邊面重拓補
有時候我們工作中會遇到三角面模型，對于新手來說轉換成四角面模型可以選擇這款插件輕松轉換成你想要的四角面而且還有便捷的參數可以調整。
3.PolyCircle-挖洞插件及Nitro4D NitroCap-封洞插件
在日常建模的工作中經常需要給模型開洞及封洞的操作，雖然靠布線調整也可以實現，但是插件的效率更便捷，所以推薦這兩款插件分別對應的模型開洞及模型封洞的功能，另外注意在C4D軟件R26之前都是必備的插件，但如果你軟件版本是R26以上版本，那么自帶整合了這樣的工具，不需要額外安裝插件了。
4.CodeVonc Proc3durale-鏤空腐蝕溶洞效果插件
這是一款風格化的效果插件，可以配合噪波制造出獨一無二的風化、鏤空、分解動畫、甚至是流體動畫的效果，在產品設計及品牌動態視頻中運用廣泛。
（圖來源于網絡侵刪）
5.TerraformFX-地形插件
這塊地形插件，可以讓你輕易搭建自然環境，制作次時代的虛幻場景，操作簡單，可以在Cinema 4D 中生成、動畫和逼真的地形。在幾秒鐘內創建非常詳細的山脈、峽谷和沙漠。直觀的非破壞性工作流程可以輕松創建和自定義地形。
（圖來源于網絡侵刪）
Part 3. 實戰
在入門的學習和上手的練習之后，相信很多人都會對C4D有了初步的掌握。這時更重要的當然是將這些學到的知識點運用到實際項目當中，這樣的實戰操作才能讓你的知識體系更有針對性，并且實際項目命題固定、要求更高，完成后的提升才會更大。
這里分享幾個在完成基礎的學習與練習后，我們用C4D做的實際項目。
3.1 QQ小游戲-春節會場
小游戲會場是從QQ春節活動的主會場進入，通過限時抽獎以及游戲任務等形式，引導用戶參與活動，從而提升業務增長和助力品牌傳播。
在前期設計推導階段，我提煉了三個設計關鍵詞，并對應發散出一些相關元素：
一是游戲：這是凸顯平臺特色和趣味性的元素；
二是福利：這是強化用戶參與活動的動機；
三是春節：春節活動不可少的是體現節日氛圍的元素；
根據這些元素畫了三個方向的概念草圖，分別以游戲機、扭蛋機、街機作為主要載體。
最終我們選擇了通過破窗的形式將Q猛虎結合進場景中的方向一，展示游戲和奪寶元素，讓用戶感知福利的同時，也體現小游戲平臺的特色和趣味性。
創意上是參照超級瑪麗這種經典的橫版過關形式，也將中國傳統建筑中的紅墻金瓦、松樹、福袋這些元素融入在了畫面中。
游戲機場景及其他主要元素建模
場景白模及空間構成設定
角色及福袋動態的制作，這里主要用到了角色及動力學模塊相關的一些知識點。
渲染完成后的主視覺，Q猛虎在游戲機上往前奔跑，不斷獲得福袋并蹦出金幣、紅包實際UI中的應用效果
實際UI中的應用效果
另外將主視覺中的“松樹”，延展成了松、竹、梅、蘭這四種具有傳統中國風的植物，作為輔助元素運用到頁面中，保持整體調性的統一。
部分主要頁面總覽
3.2 QQ紅包-節日封皮
節日紅包封皮是傳遞用戶關懷的重要手段，作為QQ紅包的一部分，我們希望讓用戶有更新穎的感知和更深刻的共鳴。
相對于常規的插畫手繪風格，我們希望嘗試用3D的方式做一些新的探索。
在構思中秋節的紅包封皮時，首先圍繞“中秋”進行關鍵詞發散
再選取其中桂樹、玉兔、明月等這幾個適合構建場景的元素，構建成一個立體化的場景
將一些元素抽象化，結合3D手法，加入更有意境的表達
最終完成的效果，整體也是塑造一個比較有中國風和意境的場景
新年封皮也是用同樣的方式完成，像剛才中秋的桂花樹一樣，這里也將錦鯉也做了一些抽象化的表達，比如魚的眼睛是寶石質感，魚的身體是黃金質感，傳遞一種新年好運、財運連連的感覺。
最終完成的效果，QQ和banyQ坐在錦鯉背上，手上拿著銅錢串在吊錦鯉，寓意新年大吉大利、錦鯉附體。
新版封皮的使用量對比舊版有了較大提升，可以看出用戶對新版封皮的喜愛程度還是很高的，目前的節日封皮也是按照新風格持續延展中。
Part 4. 結語
以上就是本文的全部內容，希望能幫助大家在學習C4D的過程中有所幫助，總結下來就是多看多練多運用。對文中提到的插件感興趣的朋友，也可以通過附上的鏈接去官網了解更多詳細介紹。若是大家有更好的學習建議，也歡迎在評論區留言一起討論。
作者：騰訊ISUX
鏈接：https://www.zcool.com.cn/article/ZMTUxNDU4MA==.html
來源：站酷
我們都在研究好的設計，感嘆優秀的產品帶給我們的尖叫，但我們或許從未思考過，糟糕的用戶體驗設計也會給用戶帶來很大的傷害。這個產品體驗欄目的靈感來自于喬納森·沙利亞特的《設計的陷阱：用戶體驗設計案例透析》這本書。在本書的介紹里，有這么一句話——設計能殺人、使人憤怒、使人傷心。讀到這句話的時候，讓人驚愕，讓人不可思議，但這就是事實，這就是糟糕的用戶體驗設計會導致的后果。「體驗陷阱」的第一期，就讓我們來看看那些被忽視的文章編輯器對用戶體驗的影響有多糟糕。
文章編輯器是一個產品最基礎的構成部分，不管是前臺還是后臺，編輯器都是一個非?；A的功能。比如一個產品需要發布新的資訊內容，在后臺就一定需要有一個文章編輯器才能實現這個功能。
文章編輯器在各大網站、APP產品里都非常常見，特別對于以內容生產為主的社區、平臺，比如像站酷網、人人都是產品經理、知乎、頭條、網易這些平臺，文章編輯器是一個非常基礎又必不可少的功能。
1. 有用性
文章編輯器要能實現內容的發布，當用戶從本地或在線文檔（比如騰訊文檔、飛書、石墨等）復制內容進去時候，可以輕松實現二次編輯，比如插入圖片、調整標題樣式等。
2. 易用性
編輯器的界面、功能，要能滿足多數用戶的期望，比如支持多張圖片上傳、第三方音頻/視頻鏈接，以及整個操作過程中使用起來愉悅、友好。
3. 容錯性
當用戶出現操作錯誤的時候，系統能夠及時給用戶提示，比如圖片上傳進度、圖片尺寸大小限制、必填項勾選等等。容錯性對用戶體驗的影響特別大，如果用戶在使用過程中不清楚哪個地方犯錯不能繼續操作，用戶對系統就會陷入焦慮。
1. 站酷
站酷網是全國最大的設計師平臺，吸引了國內眾多優秀的設計師和設計知識創作者，但是他們的文章編輯器，體驗下來卻非常糟糕。接下來讓我們來看看這個糟糕的文章編輯器，給用戶帶來了多大的體驗傷害。
當我開開心心地把一篇在騰訊文檔寫好的內容復制到站酷編輯器的時候，在對標題進行格式調整的時候，全局樣式竟然會同步更改，比如想把「標題」更改為「標題1」的樣式，整篇文章就會一起更新，這讓人摸不著頭腦。不過我沒放棄，經過多番嘗試，才發現需要在標題上下各加一個Enter，這樣才能設置成功（我是一個BUG解決天才）。
當文章篇幅撐過編輯器的默認高度以后，這個時候就會出現一個非常糟糕的體驗，你找不到編輯器的工具欄。比如你想上傳圖片或者修改內容，你都不知道工具欄去哪里了，這個時候用戶徹底迷失，變得異常焦躁。解決這個問題的唯一辦法是——把編輯器全屏。
創過第一關以后，全屏的編輯器又出現一個非常糟糕的體驗。那就是當你去調整某一段文字的時候，比如加一個換行，這個時候編輯器的光標就會像幽靈一樣跑到底部，你只能重新找到剛才的原位置，你以為是眼花再試一次之后，光標再次出現在底部，簡直讓你懷疑人生。
當你從頭部開始上傳圖片的時候，和調整字段一樣，光標又會像幽靈一樣跑到底部，這個時候，你還得去找之前的位置，才能繼續上傳。不過經過多番的嘗試，我又破解了站酷編輯器的設計密碼，原來可以從底部開始倒著傳圖片，那該死的光標，就不會跑到底部去了，這個秘訣讓我提升了很高的效率，我真感慨自己的的智商：）
從站酷的編輯器可以看出，他們違反了尼爾森十大原則的系統性可見原則和防錯原則。第一，在用戶的內容高度超出編輯器默認高度以后，編輯器的工具欄消失不見，這其實是一個功能BUG，不但沒有修復也沒有提示用戶使用全屏操作，用戶徹底迷失；第二，在用戶調整內容換行的時候，光標會像幽靈一樣跳到底部，這也屬于功能的BUG，沒有修復也沒有系統提示，最后導致用戶在內容發布階段就變得垂頭喪氣，最終浪費了無數寶貴的時間。
拓展閱讀：
尼爾森十大可用性原則第一條，系統可見性原則，保持界面的狀態可見，變化可見，內容可見。讓用戶知道發生了什么，在適當的時間內做出適當的反饋。
尼爾森十大可用性原則第五條，防錯原則，比出現錯誤信息才提示更好的，是通過更用心的設計來防止這類問題發生。在用戶選擇動作發生之前，就要防止用戶混淆或者錯誤選擇。對產品進行不同的操作、重組或特別安排，防止用戶出錯。
2. UI中國
UI中國的文章編輯器，雖然不支持從騰訊文檔、飛書文檔直接復制過去的格式，但編輯器設計得非常清爽，給用戶的第一印象非常好。但是，就在用戶開開心心準備發布一篇精心準備的文章時候，噩夢來了。
UI中國的服務器非常不穩定，所以當用戶上傳圖片的時候，圖片的加載進度特別慢。其實慢一點也能接受，但是當進度條達到100%以后，圖片始終還是無法載入，有時候需要等幾秒，有時候等10幾秒最后換回來的一串錯誤代碼——Error during file upload。這個時候用戶還有耐心，也許就是服務器偶然發生故障，于是再次重新上傳，但收到的還是同樣的結果。
為了解決這個問題，我以為是圖片的尺寸或大小出現了問題，但經過查閱，并無任何問題，完全是官方的尺寸規范以內。最后通過數次的嘗試，我總算摸到一點點規律，當一張圖片反復上傳出現亂碼的時候，那就先去傳其他的圖片，最后再返回上傳這張圖片，運氣好的時候就解決了，運氣不好的話，你就休息一下再來上傳。我只能感慨自己實在太聰明了。
從UI中國的編輯器可以看出，他們和站酷一樣，違反了尼爾森十大原則的第五條原則，防錯原則。在用戶上傳圖片出現錯誤以后，并沒有給用戶及時的中文提示（99%的設計師看不懂Error during file upload這串英文代碼，毫無意義），導致用戶在使用過程中產生焦躁、憤怒的情緒，浪費了無數寶貴的時間。
3. 微信公眾號
微信公眾號是知識創作者最常用的工具了，但事實上對于新手來說，它的設計非常不友好。我還想起當我第一次操作公眾號發布文章的時候，當我把內容都編輯好以后，我找不到「發布」的按鈕。我很難理解「群發」的功能，特別是當我在下拉列表發現竟然還藏著一個「發布」按鈕，我以為那就是發布。但當我開開心心準備分享我的推文時候，我在自己的公眾號卻怎么也找不到這篇文章。
最后我只能重新編輯一次，但問題還是沒有解決。群發到底是什么意思？當我點擊以后「群發」以后，又出現了群發、定時群發和分組群發的按鈕，我實在難以理解這幾個按鈕有什么不同，我現在又應該選擇什么。我猶豫不定，害怕犯錯，又不知道如何解決，最后只能求助朋友。
微信公眾號在「發布文章」這個環節的設計，完全違背了交互心理學上的席克定律，給用戶太多、不清晰的選擇，增加了用戶的學習和消耗成本，對于公眾號新手來說，簡直就是一次噩夢。其次也違背了尼爾森十大原則的第十條，人性化幫助原則，沒有給新手解釋清楚「群發」和「發布」的區別，也沒有對核心功能做出對應的文字解釋，讓用戶在操作的過程中產生數次焦躁，最終只能求助于他人。
拓展閱讀：
席克定律是指人的信息傳遞時間與刺激的平均信息量之間呈線性關系。簡單一點我們可以理解為：人面臨越多的選擇，所要消耗的時間成本越高。
尼爾森十大原則第十條，人性化幫助原則，幫助性提示最好的方式是：①無需提示；②一次性提示；③常駐提示；④幫助文檔。
4. 脈脈
脈脈作為擁有1.1億用戶的職場社交獨角獸，為用戶提供的專欄編輯器，用戶體驗差到讓人絕望。
脈脈使用的編輯器，屬于十年前最早一批的編輯器，不管是功能還是樣式，都非常掉身價，和他們的品牌調性不匹配。它們不支持從騰訊文檔、飛書復制過去的文章（Markdown格式），所以我每次都需要調整格式才能和源文檔格式一致，極大增加了編輯成本。這也是我最后放棄脈脈更新的原因，他們流失了一個內容創作者。
在用戶上傳圖片以后，他們沒有做自適應配置，整個編輯器無法看到圖片的完整內容，用戶根本不知道自己上傳的圖片是否正確。更糟糕的是，當你想等比例調整圖片的大小，圖片就完全扭曲，讓用戶進一步崩潰。
點擊上傳圖片以后，還需要用戶點擊「上傳」，才能真正實現圖片上傳，增加了用戶的操作步驟。其次已上傳的圖片不能取消選中，如果想要取消當前圖片，只能再次上傳一次圖片。
最糟糕的是，文章竟然不支持自動或手動保存，想象一下當你花費了1個小時好不容易編輯好的文章，最后因為不小心關閉瀏覽器導致文章丟失了，這就是使人憤怒的設計，這幾乎把用戶使用的欲望徹底剿滅了，永遠不會再回來。
脈脈的編輯器設計，嚴重違反了尼爾森十大原則中的多條原則，比如撤銷重做原則、防錯原則、容錯原則等，可以說是非常糟糕的設計，這樣的編輯器幾乎可以毀滅任何一個內容創作者的心情。
拓展閱讀：
尼爾森十大可用性原則第三條，撤銷重做原則，給用戶更多自主操作權，當用戶在使用產品過程中產生錯誤的操作時，應提供更多的解決方案，例如撤銷或重做等功能。
尼爾森十大可用性原則第九條，容錯原則，幫助用戶從錯誤中恢復，將損失降到最低。如果無法自動挽回，則提供詳盡的說明文字和指導方向，而非代碼如404等。
5. 135編輯器
135編輯器作為國內最大的編輯器頭部產品，他們幾乎把編輯器可能有的功能都設計了，比如導入文章、語音合成、模版、一鍵排版等等。但是這個功能如此豐富的編輯器給新用戶的體驗則留下糟糕的印象。
135編輯器的功能非常強大，這就像一個2003年半的Word辦公軟件，一眼望去，都是數不清的功能。這樣的設計導致了新手不知道如何開始，他們的按鈕權重幾乎都一樣，比如新建、關閉、導入、微信復制等等，沒有重點突出核心功能。
人在操作軟件時候的記憶屬于短期記憶，一般只會保留5-7秒，這便是心理學上最出名的7±2效應。在新手首次使用該軟件的時候，面對幾十上百個的功能，根本不知道如何下手。用戶需要學習的成本非常高，甚至當你編輯好文章以后，你都不知道如何把文章同步到微信公眾號，因為「微信復制」這個按鈕沒有重點突出，從字面意思也無法獲取真正的意思。這也違背了人類運動的預測模型費茨定律，如果你想小孩子也簡單輕松的能關掉房屋的開關，那么你的開關就應該大一點，明顯一點。
其次過度商業化把這款編輯器的用戶體驗毀滅了，幾乎80%的功能都需要加入VIP會員，然后你需要反復關閉窗口，操作路徑變得又長又繁瑣。試問，一個新用戶在使用一款陌生的編輯器的時候，需要關閉幾十次廣告，你覺得他還有耐心去使用嗎？
拓展閱讀：
7±2效應就是指人的短期記憶容量在7±2的數量之間浮動，也就是說，用戶最多同時處理5～9個信息。
費茨定律是人類運動的預測模型，主要用于人機交互和人體工程學。該定律預測光標或手指從一個起始位置移動到最終目標所需的時間（T）由兩個參數決定，即光標或手指到目標的距離（D）和目標的大?。╓）。
6. 國內某知名CMS系統
這是一個國內非常出名的開源CMS系統，目前已停止更新維護，不過國內的企業網站估計有50%都是基于這個系統搭建。做過外包設計的朋友都知道，經常會聽見客戶說系統難用，那么為什么難用，我們先來看看這些商業項目中管理后臺的編輯器有多糟糕。
點擊添加內容后，直接跳轉到一個新窗口，這個新窗口還把當前屏幕都遮住了，這不得不讓用戶需要把這個窗口縮小才能復制內容。這個設計最讓人頭疼的是當你的桌面應用打開過多時候，你根本不知道這個內容窗口在哪里，讓人感到無比焦躁。
編輯器的的樣式、功能就幾乎可以忽略不計了，因為這畢竟是一款開源的系統，而且官方都已經停止更新了。如果你從騰訊、飛書文檔直接復制內容進去，文本格式就是錯亂的，這和脈脈一樣，這幾乎需要在編輯器里重新調整格式才行，這嚴重提升了用戶的使用成本。這對于很多兼職為公司負責更新網站的用戶來說，簡直就是一場災難。過去有太多次用戶對編輯器的問題提出了很多次，包括不懂使用、增加功能等，總之，這些開源系統的編輯器，對很多用戶來說就是一場噩夢。
通過數款大廠產品的體驗總結，我們發現，對于文章編輯器這個非常基礎但又必不可少的功能，其實帶給用戶的體驗非常糟糕。類似的糟糕體驗，其實還數不勝數，我們這一期就不再展開。最后我們對此次的體驗陷阱做一個簡單的總結。
我認為，造成如此糟糕的編輯器體驗的原因有兩個，第一個，大部分的產品團隊完全不重視編輯器這個功能。在很多產品、設計，包含程序工程師看來，這就是一個非?；A簡單的功能，所以他們對編輯器非常輕視，也許開發出來的產品團隊自己都沒有親身測試發布過，才會導致有如此多明顯、讓人憤怒的BUG。然而他們根本不知道這樣的設計對用戶的實際體驗影響有多么糟糕。
第二個，產品團隊完全沒有遵循最基礎的設計原則意識。國內大部分產品設計師對設計基礎原則、理論都非常忽視，甚至覺得這些純理論的指導原則毫無意義。這也是設計這門學科在國內發展的真實寫照，但我們從這些體驗陷阱可以看出，一個沒有遵循設計基礎原則的產品，體驗下來，是多么的糟糕，多么的讓人絕望。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
微信鍵盤發布啦！擁有12億用戶的移動端巨無霸微信發布微信鍵盤了！就在本周一，預熱近兩年的微信鍵盤終于發布，這款微信之父張小龍口中的——不搜集任何隱私的輸入法工具，總算揭開了他的神秘面紗。廖爾摩斯第一時間全面體驗了微信鍵盤，通過三天的使用，我也成了微信鍵盤的腦殘粉，這篇接近3600字的拆解，將會告訴你，這個地主家的小兒子，為什么又帥有才！
作為一款工具類產品，需要更注重產品的用戶使用體驗，所以此次產品拆解主要基于尼爾森十大可用性原則和常見的設計基礎理論，比如格式塔原則、費茨定律等。我將會分為基礎功能、個性化功能和個人隱私三個部分進行拆解。
1. 基礎功能
1.1 鍵盤管理
鍵盤是輸入法最基礎的功能，根據每個用戶不同的操作習慣，微信鍵盤為用戶提供六種類型的鍵盤，分別是九宮格、全鍵盤、筆畫鍵盤、手寫鍵盤、五筆鍵盤和雙拼鍵盤。在五筆鍵盤和雙拼鍵盤中，還為用戶提供了多種偏好設置，比如86五筆方案、98五筆方案等。
設計思考
相比行業頭部老大哥搜狗輸入法，微信鍵盤的類型相對還比較單薄，比如像搜狗輸入法還支持生僻字鍵盤、拍照轉文字等特色功能，不過作為一個V1.0.0版本，這也遵循了如今產品設計的主流設計模式，小步快跑，快速迭代。
1.2 鍵盤輸入框
「輸入框」是用戶實際操作和使用的功能，這是最基礎、最重要的功能。微信鍵盤的輸入框界面風格非常簡潔，和IOS默認鍵盤風格相近，目前僅有一款默認皮膚。
1.2.1 長按技巧
長按「拼音鍵」，可選擇更多相關字符，比如數字、大小寫等。其中長按「JKL」拼音鍵，可切換至「單手模式」；長按「中英文」鍵，可切換至「手寫模式」，非常方便。
1.2.2 智能刪除復原
這個小技巧使用起來特別方便，在我們刪除一段文字的時候，經常會出現誤刪的情況，微信鍵盤設計了一個非常巧妙的功能，按住「刪除鍵」左拉可以刪除文字，往右則可以把刪除的文字復原，提高了產品體驗的容錯性。
1.2.3 上滑輸入數字符號
這個功能需要在系統設置開啟，在鍵盤輸入的時候，只需要上滑「拼音鍵」，就能直接把拼音鍵對應的數字拖到輸入框，節省切換數字鍵盤的操作步驟。
1.2.4 特殊符號
「特殊符號」不僅包含了常見的10種類型，橫排26鍵的設計更能讓用戶直觀地找到自己需要的字符，使用起來體驗非常友好。相比搜狗輸入法超過20種的符號類型，微信鍵盤簡潔的設計為用戶提供了更高效的選擇，帶來了更友好的體驗。
設計思考
少即是多。相比搜狗輸入法的大而全，在特殊符號這個細節的設計，微信鍵盤讓我愛不釋手。首先應用了7±2效應，在用戶的短期記憶里，降低記憶負荷。其次也應用了席克定律，減少用戶的選擇，降低消耗的時間成本，從而提升用戶體驗。
1.3 偏好設置
1.3.1 語音轉文字
從識別語言觀看，微信鍵盤支持普通話、粵語、英語、四川話和上海話，筆者親自體驗一番，發現識別準確率還挺高的（貴陽話，和四川話接近，超過80%準確率）。
1.3.2 聲音和觸感
「聲音和觸感」指的是用戶使用鍵盤按鍵的聲音和觸感。這里有一個非常貼心的設計，當用戶手機靜音的時候，打開聲音開關按鈕會提醒用戶當前處于靜音模式，無法聽到按鍵聲音。這就是尼爾森十大原則的防錯原則，在用戶出現操作錯誤之前，通過設計提示提前避免，你可以想象如果沒有這樣的提示語，如果你的手機不小心靜音了，你就會懊惱為啥鍵盤沒有聲音，這個軟件是不是出問題了（筆者親身經歷）。
1.3.3 顯示設置
微信鍵盤支持用戶可設置鍵盤候選字的大小，這里也有一個非常貼心的設計，當用戶調整字體大小以后，如果想要恢復默認大小，只需要把滑動組件拖動到已經標記的默認起點就可以了，這應用了尼爾森十大原則的易取原則，用戶無需記住默認大小設置，如果想恢復，拖動標記的起點即可。
1.3.4 模糊拼音及其他
「模糊拼音」主要針對拼音基礎欠缺的用戶，提供模糊的拼音設置，從而提高輸入效率。其次微信鍵盤還提供「首字母自動大小寫」、「雙擊空格輸入句號」和「智能添加空格」等偏好設置，用戶可根據自己的操作習慣進行設置，獲取更便捷的體驗。
2. 個性化功能
個性化功能主要指微信鍵盤最特色的「拼寫Plus」功能，這也是微信鍵盤發布以后給用戶最大的驚喜。
2.1 智能推薦
「智能推薦」是微信結合自己強大的生態設計的一個功能，在用戶輸入文字的時候，系統會自動判斷文字的類型，比如輸入一本書的名字，系統就會提示是否需要向好友發送這本書籍。從內容類型看，包含了音樂、視頻、讀書、小程序、視頻號和公眾號。這個功能在用戶的聊天場景中，實在太方便了，比如作者過去要給好友分享自己的公眾號，還需要去公眾號搜索、轉發，如今只需要輸入「設計大偵探」的名字，就可以向好友直接發送，減少了數步操作路徑，極大提升了溝通效率。
2.2 表情推薦
表情是微信聊天場景中必不可少的一個元素，甚至有很多用戶特別喜歡收藏表情，它可以用于各種聊天場景，活躍聊天的氛圍。微信鍵盤的表情推薦，通過用戶輸入的詞語，可以自動識別可能需要發送的表情，無需用戶收藏，就可以為用戶自動生成。這個功能非常贊，特別像筆者這樣從不收藏表情的用戶，當突然需要輸入一個表情活躍一下氣氛的時候，我只需要輸入一個「大家好」，微信鍵盤就能為我提供數十種表情，滿足我的需求。
2.3 智能拼寫
「智能拼寫」是指當用戶輸入某個詞語時候，系統為用戶精準匹配候選詞，提高輸入效率。筆者嘗試了輸入「梅西」，幾乎可以根據智能匹配輸入一段完整的文字。而微信生態更為恐怖的是，它會自動結合當前的話題標簽，用戶可直接跳轉至話題的視頻號動態，一鍵查看更多信息，讓用戶徹徹底底對微信生態的服務上癮。
2.4 拼寫檢查
「拼寫檢查」是指系統會根據用戶在輸入文字的時候及時發現錯別字，一鍵精準改錯。這個功能設計得非常貼心，能讓用戶及時看到書寫錯誤，降低因錯別字帶來的煩惱。
2.5 常用語
過去在微信聊天的時候，為了提高輸入效率，我會把很多反復發送的文字復制到備忘錄或微信收藏，這能提升我一定的溝通效率。但相比微信鍵盤的常用語功能，我以后就會直接放棄之前的兩個形式了。這個功能實在太方便了，比如每一次粉絲添加我的時候，我都會需要介紹一下我們公眾號的內容，現在我只需要輸入前3個字，這段話就可以直接出來了，極大提升我的溝通效率。
2.6 單手模式
「單手模式」是指用戶可根據自己的慣用手或場景設置輸入模式，前面我有提到過，長按「JKL」拼音鍵，可切換至單手模式。
2.7 手寫找字
「手寫找字」是一個支持同時手寫多字的輸入模式，這個功能對于我們父輩一代的用戶特別適用，他們多數人還未習慣用拼音拼寫，更喜歡用手寫的形式去輸入，而支持寫多字的模式可以極大提升拼寫效率。
2.8 小結
什么是以場景為中心的設計，微信鍵盤的設計團隊告訴我們，這就是以場景為中心的設計。過去設計者總是在思考如何去定義人們使用的系統和應用程序，而“以場景為中心”的概念，則強調要以人的需求為中心，系統和應用程序要去幫助人們滿足他們的需求。看看微信鍵盤設計團隊結合如此多真實場景的設計，可見設計師真的需要具備場景思維，才能設計出讓用戶尖叫的體驗。
3. 個人隱私
3.1 清空個人詞典
微信鍵盤提供了「清空個人詞典」的功能，這有點不可思議。不過微信鍵盤的創立之初，微信之父張小龍就說過，微信將上線屬于自己的專屬輸入法，其目的并不是為了搶奪輸入法市場，而是為了更好的保護用戶的隱私。不過該功能大家要謹慎使用，一旦清空，你所累積的個人詞匯就會清空，將會影響你的輸入體驗。
3.2 幫助反饋
針對微信鍵盤使用的技巧和常見問題，微信鍵盤也設計了幫助反饋文檔，為用戶解決使用過程中的困惑。很多產品設計師或許覺得這樣的模塊可有可無，但這其實這就是尼爾森十大原則的人性化幫助原則，通過幫助文檔為用戶解決軟件使用困惑。
3.3 隱私與權限
“我們非常重視你的隱私安全。我們謹遵最小、必要原則，僅依《微信鍵盤隱私政策》獲取你使用微信鍵盤的功能所需的你的信息，不會額外獲得你的其他信息”。這是隱私與權限頁面的一句話，足以見得微信鍵盤的定位如上文所言，只做一款單純的輸入法軟件，不侵犯用戶的隱私。
作為一個才上線發布V1.0.0版本的輸入法產品，微信鍵盤真的給了我太大的驚喜。
從產品的易用性來看，無論是交互，還是界面，都嚴格遵循了尼爾森十大原則的標準。這個產品設計中最基礎的設計理論模型，事實上，太多的工具類產品都沒有遵循它的設計原則，我們常常說一款工具難用、不好用、設計不好，就是這些操作細節沒有考慮進去。而微信鍵盤，在我目前的使用操作過程中，暫時沒有，易用性非常高。
從產品的創新性來看，微信鍵盤不僅滿足了一個鍵盤輸入工具的基礎功能，而且結合了自身強大的生態環境設計了「拼寫Plus」這樣非常創新的功能。它幫助我實實在在地提升溝通效率，比如一鍵推送我的公眾號、和粉絲溝通的常用語等等，甚至破天荒的可以直接在聊天輸入框分享我喜歡的歌曲、書籍、電影、視頻號等，換做以前真的不敢想象原來這些功能可以通過一個輸入法軟件實現。
我已經徹底成為微信鍵盤的腦殘粉了，即便某狗的輸入法顯示我已累計輸入超過4百萬字，但微信鍵盤給我使用的尖叫感，真的讓我不可思議，就像那洶涌的潮水，一波又一波襲來，讓我尖叫！
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。
你有想過你的孩子一邊喝六個核桃，一邊聽樊登讀書嗎？如果沒有，這是因為你不知道樊登讀書的銷售場景有多豐富，他們和六個核桃就設計了一個聯名套餐，售價429元。
你有想過你的辦公場地可以加入一個讀書角，讓員工每天讀書學習嗎？如果沒有，這是因為你不知道樊登讀書有一個服務叫數字閱讀空間，它可以讓你的員工一鍵掃碼即可閱讀學習。
你有想過樊登讀書2023年會解讀什么書嗎？如果你想知道，你可以購買他的「未來書單」，他都為你設計好了，不僅有52本實體書，還會給你一份未來書單專屬認證的學員徽章。
如果不去拆解樊登讀書，你根本不知道這個產品可以把讀書這個原本枯燥乏味的學習形式變得這么有創意，絕對超出你的想象。
樊登，作為前央視的主持人，在2013年創辦了樊登讀書會以后，發展不到10年，APP會員數已經突破了6000萬，年營收超過10億，全國線下樊登讀書運營中心超過2000家，成為了知識付費行業的一個獨角獸。這樣一個讀書產品，到底有什么魅力，能讓用戶對它如此著迷，樊登又是如何找到他的書中黃金屋，本期設計大偵探，為大家帶來樊登讀書的產品拆解，讓我們一看究竟。
一、導讀
1. 內容結構
全文11158字，分為六個部分，分別是導讀、產品畫像、讀書服務、內容服務、會員服務和設計總結，你可以通過下面的思維導圖對本文內容結構有全面的了解。
2. 適合人群
第一類，UI/交互設計師，可以跳出執行層，去思考樊登讀書的產品設計策略，提升產品分析能力；
第二類，產品經理/運營，通過全面的產品設計拆解、策略推導，獲取產品設計參考；
第三類，知識付費行業從業者，通過對樊登讀書的全面拆解，獲取競品設計參考。
3. 分析模型
我們主要運用三種模型對產品的功能、設計進行拆解，由于沒有權威的官方數據，所以我們更多以推導的形式去思考樊登讀書為什么這樣設計。
第一個，增長模型。由戴夫·麥克盧爾提出，包含用戶獲取、用戶激活、用戶留存、獲取收入、用戶推薦，分別對應用戶生命周期中的5個重要環節，主要用于分析產品的功能價值。
第二個，上癮模型。由尼爾·法埃爾提出，通過對上千種習慣類產品的調研，總結出一款產品如果要讓用戶習慣、上癮，可以按照觸發、行動、多變的酬賞和投入四個步驟去設計，主要用于分析產品的功能價值和推導產品的策略設計。
第三個，社會心理學。主要結合西奧迪尼的社會心理學《影響力》六大說服力原則——互惠、承諾和一致、社會認同、喜好、權威和稀缺，去推導產品設計的用戶心理設計，主要用于推導產品的策略設計。
二、產品畫像
在本節，我們將會通過樊登讀書官網、百度百科、易觀千帆和七麥數據等資料網站，讓大家對樊登讀書有一個初步的了解。
1. 產品介紹
樊登讀書成立于2013年，是前央視主持人樊登創辦的知識付費品牌。樊登讀書APP是一款為用戶提供書籍精華解讀（非電子書）、精品課程教授、社群學習等知識服務的軟件，致力于為3億國人養成閱讀習慣。根據樊登讀書2022年三季度的社會責任報告顯示，樊登讀書目前會員數突破6000萬，音視頻累計播放超45億人次，用戶收聽總時長超8.1億小時，是知識付費行業的頭部品牌。
2. 商業模式
樊登讀書以讀書點亮生活為價值主張，旨在幫助3億國人養成閱讀習慣，目標用戶群體有C端大眾消費者以及B端企業客戶。樊登讀書作為一個知識付費平臺，吸引了眾多知識創作者加入，主要為用戶提供內容生產、出版合作、線上電商和線下書店四塊業務，其次通過線下加盟代理的模式，目前在全國已經建立超過2000家城市運營中心。樊登讀書的盈利模式非常豐富，除了最基礎的會員VIP服務，還有課程、訓練營、聽書和電商等增值服務，年營收在2021年就超過10個億。
3. 用戶畫像
樊登讀書的用戶群體男女比例均衡，女性占比54.67%，男性占比45.33%；年齡以24-30歲居多，占比40.21%，其次為31-35歲，占比26.36%；樊登讀書的用戶消費能力較強，中等以上消費者占比71.09%；用戶以三線城市最多占比23.20%，一線城市僅占8.93%，其中廣東省最多，山東和河南省位居前三。
4. 信息結構
樊登讀書的菜單欄主要分為「首頁」、「樊登講書」、「免費視頻」和「我的」四個一級欄目?！甘醉摗挂訲AB切換的形式向用戶展示不同的子欄目內容，非常夯實；「樊登講書」是范登讀書的王牌欄目，可以收聽樊登每年講解的52本書；「免費視頻」是一個短視頻欄目，主要截取樊登講書視頻的精華內容，通過沉浸式的體驗，提升用戶使用產品時長；「我的」就是用戶中心，主要儲存用戶的讀書數據，可以查看歷史讀書記錄、訂單和購買歷史等內容。
5. 重要迭代記錄
樊登讀書的首個APP版本發布于2015年2月16日，截止到10月28日，APP版本已經更新至V5.56.0版本，平均1年更新次數為33次。
版本迭代重要記錄
2015年12月，發布V3.0.1版本，Slogan為「成功人士有聲閱讀神器」；
2017年8月，發布V3.9.0版本，Slogan升級為「幫助3億國人養成閱讀習慣的學習型社區」；
2018年4月，發布V3.9.16版本，品牌形象全新升級，加入知識課程等內容；
2018年7月，發布V3.9.22版本，樊登讀書會更名為樊登讀書；
2018年10月，發布V3.9.26版本，Slogan升級為「讀書點亮生活」；
2020年5月，非凡精讀館公測上線，為用戶帶來更多專家解讀書籍；
2021年7月，發布V5.18.0版本，上線李蕾慢讀欄目；
6. 產品生命周期
根據易觀千帆數據顯示，截止到2022年7月，樊登讀書月活躍用戶人數115.94萬，注冊用戶超過6000萬，年營收早在2021年就超過10億。明年即將年滿十歲的樊登讀書，目前處于產品生命周期的成熟期，當下聚焦于商業變現和用戶增長。
7. 競爭圖譜
和聽書類APP相比，樊登讀書月活躍用戶人數排名第19，喜馬拉雅1.3億月活躍用戶人數全網第一；和讀書類APP相比，樊登讀書排名第四，起點讀書月活躍用戶人數1762.70萬全網第一。
三、讀書服務
「讀書服務」是樊登讀書最核心的服務，是實現商業變現最重要的方式。從講書人去拆分，樊登讀書設計了樊登講書（火車頭）、李蕾講經典（前央視主持人，自帶流量和曝光度）和非凡精讀（匯聚各行業精英大咖）三個版塊。從知識學習的場景拆分，樊登讀書設計了「課程」和「書城」兩大版塊，如今的樊登讀書，已經成為一個非常豐富的知識付費學習平臺，不僅有各種知識付費、職業培訓課程，還有訓練營、系統課，以及有聲書和實體書銷售等業務，內容非常夯實。從用戶群體去拆分，樊登讀書還設計了企業共讀營、線下翻轉課堂和數字閱讀空間這些面向企業的讀書服務，把讀書賦能給企業，為他們提供提供綜合性的讀書解決方案，以建立學習型組織為目標。
1. 個人IP
樊登讀書以「樊登」這個超級IP作為火車頭，每年講解52本書為底層服務內容，現在加入了「非凡精讀」和「李蕾講經典」兩個內容欄目。這兩個欄目，不僅可以豐富平臺的內容，還可以彌補樊登一年只講52本書的數量缺陷，從而滿足更多用戶的需求。
1.1 樊登講書
「樊登講書」是樊登讀書的王牌欄目，是吸引用戶收聽和付費的主要內容。樊登以每年為用戶講解52本書和提煉45分鐘書籍精華為賣點，幫助那些沒有時間讀書、讀不懂書的人培養閱讀習慣。從內容分類看，「樊登講書」主要分為心靈、個人成長、親子家庭、人文歷史、商業財經、社科新知、健康生活和作者光臨9個欄目。其中親子家庭是最熱門的內容之一，育兒的書籍是樊登最吸引用戶的內容，樊登還擁有育兒專家的頭銜。
1.1.1 講書詳情頁
①「講書」有三種傳播形式，默認為音頻，其次還有視頻和文稿，非常豐富，用戶可以在頭部自由切換。每一本書就像一個產品、一個主題，除了收聽講書內容，還支持下載音頻和思維導圖，其次還加入了增值服務，比如實體書購買和訓練營（根據這本書的主題設計）。
②講書詳情介紹分為解讀時間軸、評論話題、薦語、你將獲得、作者簡介和精彩選段六個部分。這里的內容結構設計得非常好，「解讀時間軸」是把講書的內容拆分，讓用戶快速獲取講書的結構；「評論話題」是為了增加用戶互動，以評論領禮品的形式提升用戶活躍度；「薦語」和「你將獲得」，是為了吸引用戶閱讀，讓用戶知道這本書對自己有什么幫助；「精彩選段」把這本書的一些名言警句以圖片海報的形式設計出來，吸引用戶分享傳播。
③「文稿」的設計體驗特別好，和其他音頻產品相比，樊登讀書的文稿像是參考了微信讀書這樣的閱讀產品。用戶可以劃線，可以發表想法，劃線最終會生成筆記儲存在用戶中心，還可以把劃線的內容生成海報分享，為平臺拉新引流。
1.2 李蕾講經典
李蕾是前央視主持人，2021年加入樊登讀書。圍繞「李蕾」這個個人IP，樊登讀書設計了「李蕾講經典」欄目，每年為用戶解讀52部經典名著，包含世界名著、國風經典、名人傳記和中國現代經典。在商業變現的設計形式方面，樊登讀書把「李蕾講經典」作為一個獨立的欄目，用戶需要單獨購買VIP會員才能收聽。
1.3 非凡精讀
「非凡精讀」是樊登攜手80+各領域大咖為用戶深度解讀好書，樊登讀書作為一個讀書平臺，鏈接了其他優質領域的大咖，為用戶提供更豐富的內容。
非凡精讀的欄目首頁分為金剛區（鎮館之寶、聽書指南、好書共讀和全部書籍）、本周新書、最近在讀、為你推薦、今日限免、精選書單、非凡主講人和口碑好書八個部分，書籍類型包含個人成長、家庭經營、心靈療愈、人文經典等內容，其次「非凡精讀」的內容也需要用戶單獨購買VIP會員才能收聽。
2. 課程
樊登讀書充分利用知識付費的消費場景，吸引了眾多知識付費KOL加入平臺，為用戶提供豐富的知識付費課程。根據官方數據統計，目前平臺已經有198門課程，包含個人成長、親子家庭、人文歷史、商業財經、社科新知、聲音劇、有聲書、新父母和樊登專區9個欄目。
課程欄目首頁的設計，主要包含金剛區、熱銷課程、課程合集、限免節目、最近在學和專屬為你推薦六個內容。在銷售方式上，課程是以單個付費的形式銷售，定價在100-300元之間。
2.1 樊登課程
樊登不僅講書，還設計了很多的課程，比如樊登講《論語》、可復制的領導力這些以代表作設計出來的課程。樊登課程的欄目首頁包含了精選好課、限免試聽、熱銷周邊和學習園地四個內容。
2.2 技能培訓
樊登讀書還吸引了眾多職場知識創作者的加入，為用戶提供職場技能培訓課程，比如7天求職實戰訓練營、個人IP打造課、0基礎抖音商業化實操課等，課程形式有錄播課也有系統課，定價也不便宜。
2.3 訓練營
相比課程和講書，訓練營是一個動態的系統課程服務，是解決用戶學習的最后一公里。當用戶聽完書以后，事實上只是勾起了用戶的學習興趣，如果要想把知識吃透，還需要深入學習。「訓練營」就是為了解決這樣的痛點而設計的，不僅可以幫助用戶解決學以致用的痛點還增加了新的變現形式。其次訓練營的內容形式非常豐富，不僅包含常見的打卡返現活動，還有系統班、私教課，變現能力非常強。
2.3.1 打卡返現
「打卡返現」是訓練營比較常見的一個活動形式，活動規則是用戶需要繳納保證金才能參與學習打卡，如果全勤，可以退回保證金，反之保證金將會被扣除。這個服務，對于用戶的活躍度提升有很大的幫助，其次以全勤退還保證金為噱頭，但事實上能拿回保證金的用戶很少。
2.3.2 小課程
「小課程」是指培訓時間在3-7天左右的訓練營，比如7天《焦慮自救手冊》行動營（199元）、3天《分享閱讀》線上啟動營（9.9元）。這類小課程是樊登讀書訓練營的核心內容，屬于短頻快的業務，商業變現能力極強。
2.3.3 系統課
「系統課」是指培訓時間在15天以上的訓練營，比如21天《爆款視頻號》訓練營（售價1980元）、家庭教育實戰講師認證營（售價8980元）這樣的課程。系統課是屬于高利潤產品，定價均在1500元以上。
2.4 新父母
「新父母」是樊登讀書聯合「新教育研究院」共同發起的欄目，用戶人群是30-45歲這個用戶群體，旨在通過正確的教育理念幫助傳統的父母找到全新的教育方法，和孩子建立和諧、健康的親子關系。整個欄目首頁主要分為入門必修、父母進階和副業變現三個內容?！溉腴T必修」為父母提供了新父母五門必修大課，售價590元；「父母進階」是實戰特訓營，通過直播授課、小班實操教學，幫助父母快速掌握育兒難題，售價898元；「副業變現」是系統課，通過31天的系統學習，幫助有意向在親子育兒領域發展副業的父母通過專業的培訓成長為一名實戰講師，售價8980元。
2.5 知識副業
樊登讀書提供7種形式的知識副業，分別是樊登小店、知識主播、知識顧問、翻轉師、社群運營官、溝通力講師和兼職客服。其中翻轉師、社群運營官和溝通力講師這三個需要付費報名學習的崗位，目標人群以自由講師、教師、企業培訓者為主，為樊登讀書源源不斷補充講師資源。
2.5.1 樊登小店
樊登小店就是樊登讀書入門級的分銷商，用戶可以零成本申請加入。每個用戶都可以擁有自己的一個小書店，可以通過建立自己的社群或朋友圈進行書籍分享，用戶下單后，出版社直接發貨，店主賺取銷售提成。
2.5.2 知識主播
知識主播就是負責樊登讀書的電商直播，通過直播帶貨，實現副業收入。知識主播可以免費報名，分為兼職主播和全職主播。
2.5.3 知識顧問
知識顧問就是為用戶解決知識困惑的咨詢師，本質是樊登讀書的銷售。用戶可免費報名，樊登讀書提供系統的專業培訓。
2.5.4 翻轉師
翻轉師是樊登讀書·雨知教育的核心服務，課程體系分為六大板塊，目標人群是自由講師、教師、企業培訓者等，最終幫助他們成為樊登讀書的授課講師、知識主播和知識顧問。翻轉師是付費的系統培訓，定價5686元。
2.5.5 社群運營官
社群運營官屬于一個付費的系統培訓，定價3980元。這個服務主要針對在校學生、全職寶媽、自由職業和朝九晚五的上班族，通過21天的系統培訓學習，掌握社群運營的知識和技巧，其次也有機會成為樊登讀書簽約的樊登讀書運營官。
2.5.6 溝通力講師
溝通力講師也是付費服務，價格沒有公開。溝通力講師主要是通過學習樊登的《可復制的溝通力》課程，最終有機會成為樊登讀書溝通力團隊的簽約講師機會。
2.5.7 兼職客服
兼職客服就是主要幫助樊登讀書處理客服的工作，只要用戶有時間，都可以報名申請參與。
3. 書城
3.1 有聲書
「有聲書」包含了樊登專區、情感家庭、心靈療愈、小說文藝等內容，為用戶提供更多的聽書選擇，不過相比喜馬拉雅、微信聽書這樣以開通VIP會員付費收聽的模式，樊登的有聲書直接以單本書籍售價，而且單價不低，均價在19-39元之間。
3.2 心選商城
「心選商城」是樊登讀書官方為用戶提供的一個在線購買實體書和周邊產品的平臺，從書籍數量看，內容包含了兒童科普、兒童繪本、職場進階、心靈治愈、人文社科等類型，非常夯實；從商品類型看，除了書籍，心選商城還支持各種周邊、聯名商品的購買。和傳統的書城相比，心選商城的內容設計非常創新。
3.2.1 三本好書
「三本好書」的本質是一個組合套裝，但是樊登讀書用書單的形式來設計，不僅增加了銷售量，還為用戶設計了充足的購買理由。在「三本好書」的介紹里，文案是這樣的描述——多讀一本書，解決更多生活中的問題；多讀一本書，收獲更多的歸屬感、幸福感；多讀一本書，更深度拓展和提升思維認知，可謂情懷滿滿，讓用戶產生了強烈的購買欲望。
3.2.2 樊登未來書單
「樊登未來書單」定價2199元，屬于高利潤產品，它主要有三個賣點，第一，每月會把當月樊登即將解讀的4本書籍提前郵寄給用戶，讓用戶可以搶先讀；第二，贈送樊登專屬證書、52本書的思維導圖實體卡片、1本專屬定制未來書單禮記和微信專屬社群，不僅擁有精美的實物禮品，還能享受專屬社群，突出尊貴感；第三，以選書、讀書、用書和“寫”書四個環節的服務幫助用戶每周讀透一本書、實現跨越式增長為賣點，為「未來書單」增加了「學習」屬性，從而讓用戶感覺自己買的不是書單，而是成長。
4. 企業服務
4.1 企業讀書
「企業讀書」面對的是企業用戶，以讀書學習為切入點，幫助企業員工建立讀書習慣，協助企業打造學習型組織?！钙髽I讀書」是一個綜合性的讀書解決方案，由內容、工具和服務構成。在內容端，為企業提供樊登讀書超過800+優質內容，還可以為企業量身定制書單；在工具端，為企業員工提供一個滿足多場景學習的高效工具，企業還可以通過PC管理端查看企業員工的讀書數據，實現數字化管理；在服務端，為企業提供專家團隊1V1支持服務，賦能企業組織線下活動，最終幫助企業員工建立閱讀習慣。
4.1.1 企業共讀營
「企業共讀營」是通過優質書單和共讀工具，讓員工在21天社群的督促和專家指導下，一起共讀，通過聽、學、教、練和評五個步驟幫助員工學習讀書，打造全流程的閉環訓練場景，旨在幫助員工養成讀書的習慣，為組織營造讀書氛圍。
4.1.2 線下翻轉課堂
「線下翻轉課堂」是由專業引導師帶領學員共同解構一本書，幫助學員理清邏輯結構、重點知識，深化實際場景應用，在交流互動中營造良好的讀書氛圍?！妇€下翻轉課堂」就像一次企業員工拓展活動，以讀書溝通為主題，充分調動員工的學習熱情，增強團隊學習氛圍，豐富企業員工生活。
4.1.3 數字閱讀空間
「數字閱讀空間」就是在企業辦公場地可利用的空間里面，通過硬件設備作為載體，將圖片、文字、音視頻等內容置入，讓員工掃碼就可以收聽，同時通過這樣的設計，為企業打造閱讀的氛圍。
4.2 開放平臺
樊登讀書已經把讀書做成了標準化的產品，支持接入網頁、小程序、APP、車載等終端，打造了一個通過接入樊登讀書API就可以實現合作的第三方開放平臺。目前樊登讀書有針對教育、銀行、出行等行業設計了解決方案，創意驚人。
5. 總結
從讀書服務我們可以看出，樊登讀書是一個非常有創意和變現能力超強的產品。不管是面對C端大眾消費者，還是面對B端企業用戶，他都可以把「讀書」賦能到到不同的場景和主題中。比如「新父母」這樣的欄目，就是抓住了眾多傳統的父母對孩子教育沒有正確方式的痛點，讓用戶看著就難受、看著就羞愧、看著就恨不得立馬開通會員學習。
其次樊登的商業變現形式設計，非常有層次感。以「新父母」這個服務為例，首先為你推薦基礎課程，如果用戶的自律性不夠或者無法理解，它又設計了訓練營，二次變現。更厲害的是，它為讀書賦予了“副業變現”這個屬性，然后通過8980元的系統課，幫助那些全職或想做副業賺錢的媽媽用戶群體進行系統培訓，層層推進。這樣的設計方式，甚至在企業端也復制了一套，變現能力驚人。
四、內容服務
「內容服務」是幫助產品實現用戶留存和激活的關鍵方式。樊登讀書如今已經把「免費視頻」作為APP的一級欄目，通過1-2分鐘的精華片段播放，可以有效提升新用戶的激活率，最終成為付費用戶；其次樊登讀書還有精彩豐富的線下線下活動。
1. 免費視頻
「免費視頻」是一個短視頻欄目，內容主要從樊登講書的視頻提煉出精華片段剪輯成1-2分鐘的短視頻。這個欄目設計得非常好，第一，把一個長達45分鐘的讀書視頻拆分出來以后，不僅可以降低閱讀成本，還增加了碎片化閱讀的形式，降低用戶讀書的時間成本，可以極大提升用戶的讀書時間；第二，一個免費視頻對新用戶來說，就是一次免費試聽，通過對精華內容的提煉，對用戶的激活有非常大的幫助；第三，免費視頻同時可以作為高質的短視頻素材，分發到抖音、視頻號、小紅書和知乎等平臺，幫助平臺傳播引流。
2. 活動
樊登讀書的「活動』是用戶運營的主要方式之一，活動分為線下活動和線上活動兩種形式。樊登讀書的活動主題非常豐富，不僅可以直接分享平臺的熱門書籍，比如《非暴力溝通》、《職場焦慮》、《陪孩子終身成長》等，還可以結合樊登自己創作的系列書籍為主題，比如《可復制的職場溝通力》等，內容的邊際成本非常低，可不斷復制。樊登讀書在全國擁有2000多家城市運營中心，每一次活動，其實就是一次分享傳播和新用戶激活，另外樊登讀書的活動不是免費參加，很多活動都需要付費報名參與，變現能力非常強。
2.1. 沐光公益
沐光公益是樊登讀書創立的公益品牌，主要為落后的偏遠山區孩子們建立愛心圖書室，幫助孩子們建立閱讀習慣。他的捐贈規則是當用戶捐贈的光束足夠多，樊登讀書就會為欠發達地區捐贈一座“沐光書屋”。用戶可以通過兩種方式為山區的孩子們進行捐贈，第一種是在樊登讀書APP每聽完一本書就會產生一束光；第二種就是通過在樊登讀書的直播間購買書籍，捐獻一束光。這樣的活動設計，結合了公益，更容易打動用戶，重新讓用戶更愿意多讀書，提升用戶活躍度。
3. 眼界
「眼界」是由上?？苿摻逃头亲x書聯合打造的一個內容欄目，從2022年9月15日到2023年1月31日，每周更新一期專題內容，目前已更新六期。從這個欄目可以看出，樊登讀書不僅僅是一個聽書產品，而是成為一個有深度的教育學習平臺。未來類似這樣高質量的欄目相信會越來越多，這會對品牌的宣傳、公信力以及用戶的留存起到非常大的幫助。
4. 發現
「發現」這個版塊，藏得比較深，在「用戶中心」的「常用工具」。但這個版塊的內容非常夯實，它就是一個社區，有熱點新聞、視頻、文章、活動、書友等十余個欄目。從內容設計看，這個欄目有很多想象空間，比如目前內容的生產形式是以媒體號發布，用戶還可以關注，未來樊登打造自己的讀書社區嗎？由于資料有限，并不知道未來這個欄目會怎樣定位和規劃。
5. 總結
從內容服務的拆解，我們可以看出樊登讀書的未來發展空間非常大。首先短視頻的設計會極大提升用戶使用產品的時間，讓產品有更多的可能性。其次通過「發現」這個版塊的設計推導，也許未來樊登讀書會朝著一個讀書社區發展。
五、會員服務
「會員服務」是樊登讀書實現用戶留存和傳播拉新的重要方式。樊登讀書的會員服務非常豐富，而且有很多創新點。樊登讀書設計了四種VIP會員卡，分別是樊登講書、非凡精讀、李蕾講經典和心選黑卡，享受不同的會員權益服務；在用戶運營方面，為用戶提供專業完善的學習分析工具，記錄用戶的學習時長，其次還有每日簽到、成長福利和小書童服務；在用戶福利方面，還為用戶設計了禮品卡、聯合福利、聽書卡和車主福利；最后為了吸引用戶分享推廣，還設計了邀請好友和組隊讀書兩種方式。
1. VIP會員卡
1.1 樊登講書
樊登講書的VIP會員售價388元一年，擁有內容（可收聽樊登講書欄目所有內容）、功能（支持音頻、視頻和文稿）、服務（專屬書童服務）、折扣（購買課程享受折扣）和親友（1人購買多人免費聽）五大特權。
其次樊登讀書還設計了一個多聽多送卡的會員升級服務，售價488元，鼓勵已付費的會員進行會員升級。升級以后可贈送下一年的樊登講書年卡，每周聽1本書可贈送7天VIP時間，不限時間積累，贈滿1年即可獲得下一年VIP。
1.2 非凡精讀
非凡精讀會員定價388元一年，購買后可以暢聽非凡精讀800+本優質書籍資源，服務內容主要是每周更新3本好書、5張14天樊登講書親友卡和每月發放價值超300元的學習福袋。
1.3 李蕾讀經典
李蕾講經典定價也是388元一年，購買后可以暢聽李蕾講經典的所有內容，還擁有5張李蕾講經典親友卡以及400+分鐘配套朗讀節目。
1.4 心選黑卡
心選黑卡是心選商城的會員VIP，定價99元一年，購買后，可以享受最低9.2折的購物折扣，還擁有專屬的黑卡月券和社群。
2. 用戶運營
2.1 成長福利
樊登讀書根據用戶每天讀書的時間記錄詳細的讀書數據，包括累計學習天數、累計學習時長等，這里的交互體驗設計得非常友好，用戶可以直接滑動日歷查看過去半年的讀書時間，非常方便。
2.1.1 勛章
勛章分為五大類，分別是小試牛刀（門檻低，用戶通過完善資料、評論和分享即可獲得）、學無止境（門檻略高，根據學習時間來頒發勛章）、推薦達人（鼓勵用戶分享拉新）、讀書小隊（根據書單任務設計）和限量勛章（根據用戶忠誠度設計，分為相伴1周年、2周年和3周年等），可以看出設計得非常用心。
2.2 學習歷史
「學習歷史」就是用戶學習數據看板，樊登讀書會把用戶每周的學習數據都記錄下來，包括當周學習時長，歷史學習時長等，其次還提供測試、筆記、想法、下載記錄和閱讀記錄等功能。
2.2.1 學習數據
「學習數據」的統計維度非常細，為用戶生成今日、本周以及歷史學習時長記錄，根據用戶的閱讀習慣生成「聽書偏好指數」。其次還設計了一個影響指數，也就是如果用戶分享給好友以后，「學習數據」也會統計好友的讀書時長，生成用戶的影響聽書時長，設計得特別有創意。
2.2.2 測試
當用戶聽完一本書，為了幫助用戶更好的理解這本書的知識，樊登讀書設計了一個測試答題的環節。用戶答完題以后，不僅可以查看答案解析，還可以生成朋友圈海報分享，傳播拉新。
2.3 每日簽到
用戶可以通過每日簽到領取積分，以7天為一個周期，連續簽到積分加倍，積分可以在商品購買時候進行抵扣。在任務中心，樊登讀書設計了不同的小任務，以極低的行動成本鼓勵用戶進行分享、讀書和評論從而贏取積分。
2.4 小書童
小書童的設計非常巧妙，它并不是一個智能AI客服，而是讓用戶添加企業微信客服，這其實是把用戶留存和銷售場景移植到微信上，從而實現用戶激活和復購。
3. 用戶福利
3.1 禮品卡
「禮品卡」是一種線上的虛擬VIP卡，用戶可以購買贈送給好友，售價388元，其實就是樊登講書的VIP。樊登讀書把禮品卡設計成了一種裂變形式，官方會給用戶贈送限時的禮品卡（一般為7天），好友領取以后，用戶還可以獲得3天的VIP時長，傳播拉新能力非常強。
3.2 聯合福利
「聯合福利」就是樊登讀書通過學習的場景鏈接了其他第三方品牌，以聯名的形式向用戶推出聯合服務?？梢哉f，樊登讀書把讀書學習和場景的鏈接，發揮到了極致，比如六個核桃×樊登讀書聯名套裝，你可能想不到還有這樣的套餐，一邊喝六個核桃，一邊聽樊登讀書。
3.3 領聽書卡
「領聽書卡」這個用戶權益主要是回饋教師和醫護這兩個行業的用戶群體。樊登讀書設計得特別巧妙，如果你是這兩類用戶，你可以填入個人信息進行申請；如果你不是，你可以分享給你的老師或朋友（職業為教師和醫護），這樣的設計簡直讓用戶很難有抵抗力，讓用戶主動為產品拉新。而且聽書卡只有1個月的福利，免費試聽結束后極大可能轉化為付費會員。
3.4 車主福利
「車主福利」也是一個樊登讀書和其他行業完美鏈接的活動形式，樊登讀書通過和一些汽車品牌進行深度合作，直接以車載應用的形式載入到汽車設備，用戶在駕車的時候可以直接收聽樊登讀書的內容，多場景提升用戶黏度，讓用戶隨時隨地都能收聽。
4. 用戶推廣
4.1 邀請好友
「邀請好友」的設計特別簡單，但是海報的文案非常打動人，通過很多名言警句和熱門書籍生成的海報，直接轉發給好友或發布在朋友圈，有新用戶注冊付費以后，老用戶則可以領取聽書時長。
4.2 組隊讀書
「組隊讀書」的活動規則很簡單，所有人都可以發起組隊，三人成組開始聽書，完成任務以后可以獲取積分。這個活動對用戶的拉新和提升活躍度有很大幫助，老用戶為了獲取更多的積分，邀請到越多的新用戶，組隊獎勵就會翻倍。
5. 總結
從會員服務的拆解我們可以看出，樊登讀書的用戶運營和營銷形式設計得非常豐富。為了增加用戶的投入成本，他們設計了非常專業完善的學習統計工具，通過勛章、測試、每日簽到形式鼓勵用戶每天聽書、學習。其次還引導用戶添加「小書童」，通過1V1、高頻的鏈接，和用戶建立關系，實現激活和復購。在營銷形式方面，以領書卡為例，如果你是老師，你可以直接領取，而如果你不是老師，那你可以分享給你的老師，這樣的拉新方式，非常值得學習。
六、設計總結
1. 極致的單點突破
樊登讀書可謂是一個單點突破的典型案例。樊登在《講好一本書》中分享過他的創業歷程。最初用戶就是不想讀、沒時間看、讀不懂，他們愿意給樊登交錢讓他讀給他們聽。所以樊登從成立樊登讀書開始，就以每年52本經典好書為主要賣點，解決用戶沒時間讀書、讀不懂書這個痛點，單點突破，最終打造了樊登這個超級火車頭，把講書這件事，做到極致，才有了今天超過6000萬會員的樊登讀書會。
2. 天馬行空的創意
樊登讀書在內容層的設計可謂天馬行空。它不僅把讀書設計了一個標準化的產品，支持消費者隨時收聽、學習。而且升級成了一個塊芯片，可以即插即用，比如讀書開放平臺，支持多設備、多場景的對接，讓樊登讀書和其他行業進行更深入的鏈接。甚至一個普通心選商城，樊登讀書都能設計出三個書單、未來書單這樣的創意服務。
3. 豐富的變現形式
樊登的商業變現形式實在太豐富了，就像齊天大圣的72變，在任何環節，都能讓用戶為知識掏腰包。你可能想象不到你的孩子可以一邊喝六個黑桃一邊聽樊登讀書，又或者你的全職太太正在通過樊登讀書的系統訓練營正在學習如何通過副業變現，甚至當你聽完《焦慮自救手冊》手足無措的時候，你發現原來還有王丹老師為你設計了一個走出焦慮的行動營。
作者：設計大偵探
來源：站酷
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
// 前言
良好的互動氛圍是社區產品的核心，貼吧作為一款近二十歲的社區產品，設計師秉承年輕包容的產品理念，始終在探索屬于貼吧的特色互動形態，在這過程中，希望通過互動系統設計方法，升級貼吧互動體驗，培養用戶心智，形成良性互動鏈路，最終提升用戶活躍。
一、探索互動系統的設計方法
較為簡單的互動形態為作者生產內容，瀏覽者為喜歡的內容點贊、回復，甚至私信創作者，這些互動行為會激勵創作者繼續生產內容。
基于以上互動形態我們搭建了循環互動系統，創作者為瀏覽者供給內容后，我們需要在互動環節引導互動行為發生，在觸達環節優化互動信息觸達，在反饋環節引導參與互動反饋，從而形成正向循環。結合實際的項目經驗我們發現互動系統運轉離不開“信息更易懂”、“路徑更順暢”、“玩法有驚喜”這三個要素。
二、尋找貼吧互動設計機會點
貼吧的角色是由創作者—樓主、瀏覽者—吧友組成，良好的產品運轉模式為：創作者向瀏覽者生產供給內容，瀏覽者對其互動激勵。但貼吧多年來互動鏈路中斷，導致從互動到供給無法形成正向循環。
1.特色場景洞察問題
貼吧的場景及形態廣泛，與其他產品有所不同，具有內容形式多樣、瀏覽場景獨特、互動類型廣泛、回復邏輯精細、互動玩法多元等特點，通過走查上述特色場景發現諸如鏈路中斷、功能缺失、結構混亂、內容丟失等問題。
2.下探設計機會點
基于以上問題的共性，我們可以從中總結出核心體驗斷點：
a.看不懂：回復列表內容結構不合理、收藏后看不懂更新的樓層內容；
b.看不到：Push通路不穩定無法觸達用戶、大多用戶關閉推送push；
c.沒意思：贊、回復等互動方式老舊，刷貼、簽到行為重復，沒有特別的玩法。
下面會使用上述總結的互動系統設計方法，對貼吧現存問題進行體驗升級，提高用戶的互動積極性。
三、 互動系統設計方法應用舉例
1.信息更易懂
貼吧的回復場景多，邏輯復雜，創作者與瀏覽者在看到對方的回復后，內容展示需要易讀易懂，彼此才會有意愿回復反饋。
a.查看列表—優化結構
查看評論列表的舊體驗存在回復對象錯亂、內容缺失的問題，新體驗根據語境自由展現原貼、樓層、樓中樓三層結構，承接上下文關系，降低用戶理解成本，并將其復用在查看點贊、查看@ 等場景中。
b.查看詳情—精準定位
點擊列表頁后的精準定位也是易懂的關鍵，我們對內容被折疊、定位不準舊體驗問題進行優化，新體驗默認展開原貼及樓層內容，細化點擊貼子、樓層、樓中樓后的定位邏輯，幫助用戶精準看到想看到的內容。
c.繼續消費—延長步長
用戶從回復列表進入查看詳情頁后，舊體驗只展示當前的評論樓層，看不到上下文內容。新體驗在定位樓層前后增加樓層內容，同時通過“查看之前樓層”和“加載之后樓層”方式繼續瀏覽，延長步長。
2.路徑更順暢
產品的推送Push向用戶推送感興趣的信息，需要穩定的觸達用戶且有意愿打開，才能達到召回用戶目的。
a.打開推送開關—場景引導
舊體驗引導開啟push場景缺失，方式過于生硬，新體驗選取貼吧高頻互動場景，在用戶簽到后、回復后、發布后選擇合適形態展現引導，提高推送通知打開率。
b.展示推送—有吸引力
舊體驗互動push內容表述凌亂，新體驗將push內容結構化，以“用戶昵稱+動作+互動對象”的結構展示推送內容，并強化互動用戶的頭像，適當展示互動詳情，吸引用戶點擊。
3.玩法有驚喜
貼吧點贊、回復等互動方式存在多年，缺乏新穎性，用戶互動心智疲軟，急需通過輕量、有趣的創新玩法，刺激瀏覽者互動。
a.新增動態表情
結合貼吧元素，補充單擊、長按、雙擊的遞進互動點贊方式，給予用戶感官刺激，提升點贊爽感。
結合時效性運營活動，增加高考、勞動節、618活動點贊，營造驚喜感。
首次私信提供貼吧IP表情，助力用戶關系破冰。后續私信增加開香檳、丟炮竹以及丟炮竹炸滑稽雙向互動玩法，持續提升用戶互動意愿。
b.新增潮流表態
虛擬形式是近幾年受用戶喜愛的潮流表態玩法，探索虛擬形輕互動方式，互動后通過私信觸達，并沉淀社交貨幣資產，進而引導雙向互動。
// 小結
文本搭建的“信息更易懂”、“路徑更順暢”、“玩法有驚喜”互動系統設計方法，已將其運用在貼吧的特色互動體驗升級中，并取得正向數據和用戶反饋，希望該項目的設計方法及經驗能為大家提供參考。
作者：百度MEUX
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
藍藍設計的小編 http://www.syprn.cn