漢字是來自自然的語言，有著生動的內涵和規律，筆畫的點轉橫折，勾勒并呼應品牌的內在魅力，在積累和沉淀的這些作品中，通過漢字的美學理念表述著品牌獨特的形式風格，以上作品，一起來交流吧！
© 版權所有，未經允許不得私自使用！
感謝關注
賀冰凇視覺藝術
原文地址：站酷
作者：賀冰凇
轉載請注明：學UI網》賀冰凇品牌漢字卷！
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
根據不同內容進行視覺呈現，可以在不改變布局結構的前提下，帶來差異化的感官體驗。主題化設計就是在背景層和元素層進行視覺發揮，不改變原生結構，被眾多產品進行設計發揮。
比如優酷 APP 在視頻播放頁面，視頻窗口下方區域會根據影視作品特征進行主題化設計。會在背景、圖標、按鈕和選擇器等元素上面進行主題化設計，情感化的設計更能帶給用戶共鳴感，提高用戶對產品的感官體驗。
空狀態的設計從生硬的文字提示延伸到情感化的表達，運用更加視覺感的形式帶給用戶良好的感官體驗。
最近在體驗酷狗音樂時，初次進入播放頁無歌曲時，采用黑膠 CD 作為空狀態展示。當用戶操作分享時則會以精美的配圖來強化空狀態，帶給用戶反饋的同時，也提高了播放頁的視覺感。情感化的設計更能與用戶產生共鳴，增加用戶對產品的好感度。
用戶在進行功能操作時，除了底層需求層面的反饋以外，反饋設計的視覺感也是至關重要的。好的設計可以加強用戶對產品的好感度，讓功能操作也能賞心悅目。
最近使用荔枝 APP 進行錄音時，輕擬物的錄音機設計印象深刻。在錄音過程中磁帶進行動效轉動，帶來場景化的真實感體驗，停止錄音時也會停止轉動，動態的及時反饋提高用戶使用體驗。輕擬物動態設計不僅強化了視覺感，動態及時反饋也是非常不錯的設計表達。
產品的流量區域屬于眾多功能爭相曝光的區域，在這個方寸之間的設計發揮，體現出了設計師的能力。如何將有限的資源發揮到極致，帶給用戶更多的功能體驗，需要產品設計師多在交互層面探索。
最近在使用酷狗音樂聽歌時，底部標簽欄上方的播放狀態區域給用戶提供了播放/暫停和切歌等操作，可以左右滑動來進行延伸功能切換。用戶可以選擇默認狀態進行歌曲之間的操作，也可以向右滑動以顯示歌詞為主，方便用戶在聽歌時觀看歌詞。在方寸之間通過滑動交互承載了多重功能，滿足用戶更多操作體驗，提高用戶對產品的使用體驗。
針對一些重點功能的按鈕設計，在按鈕造型、配色、圖標風格、微動效等方面都在不斷強化，以此來提高功能的關注度。
荔枝 APP 在錄音模塊中，為了突出錄音按鈕的存在感，結合了動態 IP 來進行強化。IP 形象從右下角出現與消失的動態效果，提高了錄音按鈕的關注度，俏皮可愛的形象也增加了設計的趣味性。
產品除了在使用體驗層面不斷優化以外，主要還是需要傳遞服務價值。服務的升級可以提高用戶的認同感，情感化的設計可以輔助服務的可視化呈現。
自如在“家?？ā蹦K中，頂部視覺區域通過動態禮儀進行升溫設計。每次進入都會有人偶形象打招呼，顯得非常懂禮貌，使得用戶感受到被尊重，提高了親和力。通過動態形象進行禮儀表達，不僅提高了欄目的關注度，也讓用戶感受到這是一款有溫度的產品。
用戶反饋是打造優質產品的關鍵，如何提高用戶反饋的意愿至關重要，設計師都在不斷的思考和嘗試。
自如 APP 在采集用戶反饋時，設計了底部彈出的形式，詢問用戶是否愿意推薦自如。從絕不到強推設置了 0-10 分，當用戶選擇 9 分或以上時直接提交，低于 9 分可以描述原因。相對于比較隱藏式的用戶反饋設計，這種打分制的形式用戶操作更加便利，不會占用過多時間，用戶參與的意愿也會更高。
注冊應該算是用戶比較排斥的操作，但也是不得而為之的事情。通過情感化的設計降低用戶的排斥感，在趣味體驗的環境中完成注冊，可以帶給用戶更好的使用體驗。
最右 APP 在注冊時，進入注冊界面 IP 形象以打招呼的形式出現，當用戶輸入密碼時則會雙手蒙住眼睛。IP 情感化設計帶來了更多趣味性表達，以此推動了更加人性化的設計體驗。
分類設計采用純文字的表達顯得比較單一，也有一些產品會結合圖標或者圖形設計進行裝飾，以此來強化關注度和視覺感。
最近在使用肯德基 APP 點餐時，發現縱軸導航的分類設計結合了品類圖標，提高了瀏覽辨識度。運用圖標來強化可視化設計，提高用戶點餐時對于品類的辨識度，也能強化當前欄目和默認品類的差異。小小的改變不僅優化了視覺感，也能帶給用戶更好的感官體驗。
對于運動類產品來說，運動后的數據展示對于普通用戶而言顯得比較生硬，理解度來說不夠直觀。可視化的設計提供了更好的解決方案，看圖比看文字更直觀易懂。
One More 提供了簡潔直觀的訓練數據預覽，通過可視化的形式展示訓練后增強的肌肉部位，以及通過肌肉顏色變化體現訓練的強度。通過人體結構結合訓練強度進行可視化表達，不僅可以提高用戶查看訓練數據的關注度，也能提高數據的理解度，增強用戶使用產品的體驗度。
個性化設計可以滿足不同用戶的使用需求，也能體現出產品的差異化服務。提高設計的差異，帶給用戶更加人性化的體驗至關重要，無論是感官體驗層面還是功能操作層面，只有帶來不一樣的體驗才能提高用戶的黏性，增加用戶對產品的好感度。
今天給大家分享的這 10 個優秀案例，希望可以開啟大家的設計新思路，在常規解決方案的基礎上延伸出不一樣的設計創新。
原文地址：黑馬家族（公眾號）
作者：黑馬青年
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
又到了一年一度的龍蝦季，龍蝦最好吃的時候是6月、7月、8月，這三個月是龍蝦長得最為強壯，個頭大，肉質豐滿，也是最好吃的時候，碼字的時候想想這肉感口水都快流出鍵盤了，我先去舔下吃完龍蝦的餐盤先。
沒有一只龍蝦能活著離開廚房，同時也沒能逃過設計師的鼠標和創意之手。接下來就帶大家分享關于龍蝦類型的設計，滑到最后有彩蛋哦！
、
看了這么多不僅是嘴饞，作為設計師的你們是不是手癢也想自己用龍蝦創作一把，于是我在吃完龍蝦后，拍了下面的這個場景。
突然想到國內《神話》電影中成龍有一場類似的場景，于是與《權利的游戲》海報中的風格結合下，雖然畫風有點暗黑。
但是如果從小龍蝦的角度來看，這幾個月對它們來說是個災難，這也是作為龍蝦最后的倔強。
雖然一想龍蝦挺慘，但作為國人夏季夜宵時必備的龍蝦，實在控制不住十三香、蒜泥、冰鎮、蛋黃各種口味刺激食欲的味蕾，吃貨的本性再次打敗了剛剛對龍蝦稍有些留存的感性
原文地址：修先森撩設計（公眾號）
作者：修先森
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
2020 年 9 月上線，大概用了一年的時間，在核心功能上就已經與 Figma 對齊，而在這一年半里，他們還做到了很多不同且明顯有考量國內用戶習慣的特色功能，下面，就挑幾個我比較感興趣的點展開聊一下。
輕松管理素材、實現高效復用
有 Figma 在先，做資源社區已經成了在線設計工具的標配，而「即時設計」從一開始，就額外給出了一種與眾不同的資源形式——資源庫，用于提高組件庫、圖標、插畫等素材的復用性。
與其他工具「選好資源——創建副本至工作臺——打開文件復制所需元素」的流程不同，資源庫類型的資源，只需一鍵「引用」，即可將對應資源保存至進編輯頁面左下角的「資源庫」，然后做設計時可以一鍵拖拽復用。
同時，資源庫的內容會和廣場上公開的資源保持同步，發布者新增、修改、刪除內容，引用者都可以實時更新，雖然暫時只允許官方發布資源庫，但實用價值可見一斑。
另外，即時設計的資源庫不僅能保存廣場中的設計資源，還可以把編輯區域所有可見內容，包括個人收集的常用圖片素材等，一鍵上傳并保存，在任何一臺電腦上登錄賬號就能隨時使用，相當于給了你一個不限容量且所見即所得的設計云盤。
比起像 Figma 一樣平鋪展示所有文件的“粗放模式”和團隊的一級項目管理，即時設計增加了可以自由嵌套，不限制層級的文件夾管理功能，同時，還適配了拖拽和列表移動的操作。
而對于單個文件的管理，即時設計也根據國內用戶習慣進行了優化，通過「跟進文件」，可以將你自己近期需要處理的文件專門整理到「正在跟進」頁面，快速查看。
針對團隊的協作需求，即時設計還做了一個「文件狀態標簽」，可以給文件打上自定義的標簽內容，比如進行中、評審中、已完成，既能直觀了解項目情況，又能進行篩選，有效地提升了團隊用戶對接效率。
從這些點里，相信大家都能能看得出，即時設計團隊對一些細節需求的洞察能力，而且在很多方面都做了足夠多的思考。
導入 Figma、Sketch、XD，導出 Sketch
為了滿足設計師的遷移需求，即時設計支持了 Figma、Sketch、XD 三種主流文件格式的導入，同時，它還是最早支持 Sketch 導出的設計工具。
除了上面提到的，還有很多能看出有特別考量的功能，可以一鍵導入個人字體包的云端字體庫，可以遠程預覽設計稿并打點評論的手機 App、微信小程序，自定義多彩主題……
雖然插件市場還沒開放，但也有了不少吸引人的第三方合作插件，比如「字由」、iconfont、IconPark 等等，都是在 Figma 里不曾有過的體驗。
創新能力，我們自然是有的，而且還很足，國內不管是龐大的用戶基數，還是獨特的軟件環境，也都會讓我們的國產工具得到更加特別的發展。
本土工具的自主研發之路還很長，但「即時設計」無疑是開了一個好頭，而且步子邁得昂首挺胸，我也相信，他們有能力，之后給出更多的驚喜，支持國產，不妨一起期待一下~
即時設計：https://js.design
原文地址：功夫體驗設計（公眾號）
作者：彩云Sky
轉載請注明：學UI網》為什么說是時候選擇這個工具了
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
在產品設計中動效很常見，一個好的動效方案在提升用戶視覺和心境體驗的同時，還的的確確解決了很多其他設計問題。
好的動效設計總是在比擬現實，所以當我們思考為頁面添加動效時，不應該感性的隨心所欲的發揮自己的創意激情，而應該像科學一樣，有一些基本的方法原則指導來我們，以此提升動效可用性。
今天主要分享一下在數字產品中動態設計的13個基本原則，希望對大家有所幫助。
▍緩動 ?
現實世界中絕大多數物體都不會突然運動，再保持勻速，最后突然停止（機械類運動除外）。而是緩慢加速或緩慢減速，這就是緩動。
緩動幾乎適用于產品中任何元素的出現或離開、以及部分圖數據加載等。
滑動內容
圖表加載
在加載信息時，我們可以對信息歸類分組，并按順序依次延遲內容出場時間。這就是延遲與偏移，可以清晰的表達內容之間的關系。
在二維平面，如果信息很多，為了避免信息過載，我們可以將不重要的信息，或負面操作放置在前景內容后面，這就是疊加。用來模擬現實紙張疊放，創建出二維平面中的前后空間感。
當我們點擊某個內容時，我們通過改變內容中某個主要元素（用于視覺引導的過渡元素）的輪廓并移動，這樣可以將用戶自然的帶入下級頁面，這就是蒙版。通過保留過渡元素的識別性，創建出無縫過渡，降低用戶跳轉頁面時可能產生的迷失感。
現實世界大多數物體運動軌跡都是弧線，所以當位于角落的元素移動時，我們調整運動軌跡呈弧線，可以讓元素運動更加流暢自然，這就是弧型。
注意：下面案例中元素上移是從左下往右上的弧線，但回來不是原軌跡返回，而是將弧線對稱反轉（類似拋物線），從右上往左下。
如果一個主要操作中包含其他操作，在用戶與其互動時我們可以直接將元素分離出來，這就是克隆。再通過模擬現實世界中液體分離，可以清晰的表達出內容的包含關系。這類設計常見于底部的舵式導航按鈕，點擊后出現一系列功能圖標。
將兩個元素的屬性進行關聯，通過影響其中一個元素的屬性，去影響另一個元素，這就是父子級綁定。給兩個元素創建了一個隱形的傳動軸，呈現一種用戶正與內容進行實時可控的互動方式。
下圖是通過小圓圈的旋轉屬性影響中間數值。
當某個元素存在先后兩種樣式時，我們可以給元素路徑設置動態，使其形狀從起始狀態逐漸變化到結束狀態，這就是轉換。從起點到終點的無縫過渡，清晰自然的表達出任務結束。
在一個二維空間中，一屏展示的內容有限，當觸發另外一個二維空間時，為了減少頁面跳轉，我們借助中間層并降低不透明度，或把背景模糊，這樣可以將它們同時放在一起展示，這就是遮罩。幫助我們理解當前空間與原本空間之間的關系。
當看二維平面有些乏味的時，我們可以給頁面賦予三維空間的深度，像真實世界的物體有厚度一樣，用來表達該頁面存在其他可以互動的側面。這就是多維度，解決原本二維平面沒有深度的問題，也帶來更強的位置感。
線上產品中：
【嗶哩嗶哩】有做下圖中類似的3D頁面翻轉效果（我一時忘記在哪個模塊，有知道的同學可以留言告訴我，謝謝）。
【紅板報】有做翻頁效果，感興趣的同學可以去看下。
金融和運動類產品中數字很常見，每次加載數字時，我們可以賦予數字動態變化，這就是數值變化。作用不僅僅是傳達出數字的動態性質，更重要的是強化數字與用戶的綁定關系（類似上秤后上漲的數字告訴你又“強壯”了。嗯？繼續努力），讓用戶更加積極的維護數據變化。
界面中元素的運動速度并不是始終一致，當有多個元素時，為了建立良好的層次結構，我們可以讓重要的可交互的元素運動速度更快，非交互元素運動速度更慢。（也可以根據設計目標反過來處理）這就是視差，將用戶視線引導到可交互元素上，同時讓非交互元素保持動態一致性。
頁面中，我們始終在處理內容的展示與空間轉換，為了能看到更多內容細節，我們讓內容支持縮放來模擬相機變焦。為了能體現內容與內容在空間上的關系，我們模擬攝像機推進和拉遠，這就是縮放與推拉，帶來了更多的深度與空間體驗以及無縫轉換。
縮放
推拉
原則用于參照，在理解原則的基礎上去打破。這樣，動態設計將給我們帶來了更多可能性。
盡管一些效果在當下實現上任然有著較高的成本，但相信隨著技術的發展，在將來的產品設計中會看到越來越多讓我們驚艷的設計解決方案，只是在這個過程中還需要我們共同努力鴨！
參考文獻：
https://medium.com/ux-in-motion/creating-usability-with-motion-the-ux-in-motion-manifesto-a87a4584ddc
作者：幺零三
轉載請注明：學UI網》UI動效設計原則
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
刪除邏輯是怎樣的？
無法找回：是否需要二次確認設計、以及展示刪除后結果）
可以找回：是否需要展示如何找回的說明？
刪除對象：
是單個、批量還是全部？
刪除方式：
手動刪除：點擊刪除還是滑動刪除？
自動刪除：何時開始？是否展示剩余的時間
刪除狀態：
包刪除成功提示、刪除失敗提示、刪除過久的提示
數據的處理是怎樣的？
信息/邏輯是否會發什么變化、是否自動保存進度/記錄、是否影響后續鏈路里的邏輯處理
中斷方式：有意、無意中斷的處理都是怎樣的？
中斷程度：后臺繼續運行還是徹底退出后臺？
軟/硬件變化時的處理：
包括耳機的連接與切斷、電話的來電與掛斷、網絡的中斷與恢復
顯示是否有邊界值？
包括最小值、最大值、到達特定閾值
顯示是否有時效性？
內容過期時怎么顯示？到達某個閾值時怎么顯示？內容不存在的顯示？
其他考慮點：
· 顯示格式：如日期時間的數據格式：2022.05.01 2022-05-01
· 顯示分辨率：各種分辨率下如何顯示，最大，最小考慮極致情況
· 顯示樣式：是否對齊組件？需要統一？是否有差異化設計
加載前中后該如何顯示？
包括默認狀態的顯示、初始狀態的顯示、加載中的顯示、加載過長的顯示、加載成功的顯示、加載失敗的顯示、加載為空的顯示等等。
加載方式：
手動加載還是自動加載？優先加載哪些內容（文本或圖片）？
加載范圍：
展示數量是多少？一次性全量展示還是分頁加載展示？
push機制：
推送內容說明、全量用戶還是局部用戶、推送的時間/周期/次數等都是怎樣的？
push交互：
跳轉：原頁面刪除、無法進入、push過期時該如何處理？
返回：返回到哪里？
· 當期操作進度、記錄是否保存？
· 是否需要展示退出說明、原因？
· 退出程度：
是當前頁面、某段流程、退出后臺運行、殺死后臺、還是手機關機？
· 默認排序是怎樣的？正序還是倒序？哪個選項優先
· 排序維度是怎樣的？按時間/銷量/質量/數量/評分/信用等等排序
· 是手動刷新：如下拉刷新、點擊刷新
· 還是自動刷新：何時開始刷新？是否提前告知用戶？是否提前自動保存操作記錄
· 緩存機制是怎樣的？包括緩存對象、數量、范圍
· 緩存位置是哪？手機本地、服務端
· 緩存的清理是怎樣的？自動清除還是手動清除
好了，以上就是一些常見的交互機制，希望你在輸出交互方案、產品為文檔時有所幫助，避免漏掉一些內容，減少和開發的相愛相殺。
原文地址：和出此嚴（公眾號）
作者：和出此嚴
轉載請注明：學UI網》了解這9種交互機制，不怕跟開發相愛相殺了~
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
1.1音樂故事
我大概2011年左右了解到網絡上有一種音樂概念叫“古風”，用到了很多民族、東方古典、戲曲元素，創作人員大部分都是業余音樂愛好者或者音樂專業學生，在acg論壇、貼吧、微博、分貝網、yyfc、5sing發布作品和交流。后來有一定影響力的創作團隊開始舉辦線下演出，古風圈開始吸引更多年輕人 。2018年在北京召開中國國風音樂發展研討會，包括古風圈的墨明棋妙等。國風音樂有更多的可能性，那么它是如何制作出來呢？
1.2音樂制作流程
音樂制作從盈利性上分為商業音樂制作和非商業音樂制作，區別在于商業音樂的制作目標之一為盈利；非商業音樂不用做商業用途，制作目標因人而異。
制作流程如下：
1）策劃和制作人有區別，制作人除了完成策劃的內容，音樂素養更高，會在制作上提出更有建設性的修改意見。策劃更多情況下只負責確定制作人員和項目進度跟進。
2）作曲、作詞、編曲的先后順序根據制作人員不同會改變，內部達成共識即可。
3）樂器實錄指在錄音室錄制樂器音軌，非必須環節。如果不選擇實錄表現，則用音源代替。4）編曲給出的分軌文件就是由音源表現。
5）和聲的編寫有時是作曲、編曲負責，有時也由歌手發揮，順序不一定排在主旋律錄制后。
6）混音如果涉及同張專輯的多首歌曲，需要母帶師介入完成整體調整。
1.3用戶群體
獨立音樂人：包括在校音樂專業學生或者已工作的業余音樂創作者。希望通過音樂表達自我，記錄生活，結識朋友，提高演奏及創作能力，因此帶有弱社交目的。
音樂團體：社團、樂隊、團隊、工作室、制作組。
音樂制作委托方：有制作適合自身音樂的需求，包括策劃、導演、制片、制作人等。
2. 痛點及情境
2.1痛點
從制作音樂的契機分為自發制作和委托制作，其中涉及到幾個角色：自發制作者、委托方、受托方。
自發制作者（音樂人）：
1）音樂人之間缺少了解，難以構建信賴關系
2）很難找到相似風格的音樂人互相交流
3）想找能長久合作做音樂的朋友或團隊
自發制作者（樂隊/社團）：
1）想找能長久做音樂的拍檔
委托方（企劃負責人/比賽舉辦方）：
1）企劃對音樂人的特化需求（對風格、完成度的需求）
2）比賽的題材限制，音樂人工種的篩選
受托方（音樂人/團隊/工作室）：
1）受托方對素材的特化需求（對風格、題材的需求）
2）受托方對企劃的信任從何建立（對企劃介紹、企劃進度、作品數量、作品質量的需求）
2.2使用情境
一名在校大學生Y在為自己導演的短片尋找合適的配樂，因為周圍沒有音樂學院，班上同學也沒有這類技能，她找到了國風音樂圈這個APP，通過搜索風格縮小范圍，隨手點進一個音樂人主頁去翻閱他的作品和參與過的企劃，通過企劃推薦又找到了其他的音樂人及團隊。Y創建了自己的企劃，填寫短片的介紹，上傳樣片。
3.競品分析
3.1競品優缺點
分析5sing音樂人&騰訊音樂人&豆瓣音樂人&網易音樂人。
優點：
1）經營時間久，積累了很多小眾音樂人；
2）音樂更新頻率高；
3）有比較多的消音伴奏；
4）有beat（一種音樂素材）交易、詞曲交易。
缺點：
1）對某些工種分類缺失，導致相應工種曝光度很低，合作時不能第一時間建立信賴關系；
2）最近web端增加了音樂身份篩選，但依舊有些混亂，聽眾不適合放在音樂人中篩選，編曲和制作人有相似度，但職能完全不同；
3）在申請入駐時，無法選擇多個流派。
優點：
1）下屬音樂平臺多，可以搜索到很多作品；
2）有詞曲出售。
缺點：
1）沒有促成音樂制作工種間合作的功能（不清楚入駐后是否有該功能）。
優點：
1）音樂風格分類很廣泛；
2）根據聽眾關注列表來推薦，能幫助相近喜好的聽眾找到感興趣的音樂人。
缺點：
1）部分音樂人自定義的頁面布局板塊混亂；
2）沒有音樂人間交流合作的功能。
優點：
1）網易會推出一些音樂策劃項目，促成創作者間合作；
2）網易云音樂個性化推薦增加音樂人曝光度；
3）有創作者社區；
4）有beat、詞曲交易。
缺點：
1）對身份的分類太少，只有制作人、作詞、作曲、編曲、演唱。
3.2總結
幾個平臺對音樂人來說，都沒能給出一條流暢的制作鏈，音樂人簽署授權協議后，和平臺的聯系變強，但和合作者的聯系幾乎就和聽眾與之的距離差不多。音樂人有向部分人展示demo或beat的需求，還無法滿足。有平臺促成社區，效果待觀察。
4.流程及功能
4.1流程
根據第2部分的情境分析出流程如下：
選擇合作者流程
4.2功能結構
尋找合作者功能結構
5.頁面展示
故事的開篇：開始尋找合作者
5.1招募
若已有合作者，可在創建企劃/團體時添加成員。發起人有修改企劃信息的權限，可以轉讓企劃或退出企劃，若發起人未轉讓直接退出，則企劃結束，所有成員都會看到該結束狀態。流派風格可以多選，在主頁最多展示5項。
招募有時限，可以避免太多廢棄招募占據招募首頁。創建完成后，可以添加已有的合作者為企劃成員。發起人可以選擇企劃來發布招募。
動效說明：這里展示的是策劃（制作人）點擊+號進入創建企劃頁面的過程。文字出現時配合圖標的彈性變化，微微下沉再恢復。切換頁面時速度曲線為漸緩。
動效說明：這里展示的是添加已有成員進企劃名單。選擇工種。選項框展開有彈性變化。選項拉到底時，會有位置偏移再回彈。選好以后的工種滾動入場。
5.2搜索
音樂人搜索的需求包括按個人、按團體、按作品、按企劃。根據音樂制作的流程，得到對個人的篩選條件最主要為工種。按作品篩選的下級篩選條件是流派風格。按企劃篩選的下級篩選條件是題材。按團體篩選的下級篩選條件是流派風格、題材。
5.3標簽和身份
標簽在搜索、主頁展示、作品展示都有著視覺分流的作用。該應用中涉及到的標簽包括：流派風格、工種 、題材。
流派風格標簽
用戶身份按結構分為個人和團體，按需求分為委托方和受托方。
按結構分，個人：策劃/制作人/監制、作詞、作曲、編曲、歌手、樂器演奏、混音/母帶、畫師、視覺設計、PV師；團體：樂隊、工作室/團隊、比賽舉辦方。個人身份間可以多選組合。團體身份不可和個人身份多選組合。
按需求分，委托方：策劃/制作人/監制、比賽舉辦方；受托方：作詞、作曲、編曲、歌手、樂器演奏、混音/母帶、畫師、視覺設計、PV師、樂隊、工作室/團隊。
結合兩個維度，得到4種身份類型：個人委托方、團體委托方、個人受托方、團體受托方。
以下是關于身份的幾點考慮：
畫師/視覺設計/PV師
狹義的音樂制作本身不包括宣傳（如封面設計、海報設計、PV/MV制作），所以畫師、視覺設計、PV師等工種視具體情況會刪減。
樂隊
考慮到組建樂隊主要為樂器演奏者和歌手兼任作詞、作曲、編曲，所以在團體中把樂隊單獨列出來的，權限和工作室、團隊一樣。
音樂聽眾
一開始整理用戶身份的時候，對音樂聽眾這個身份的取舍思考過。保留的原因是這個應用主要面向音樂制作人員，但音樂制作也是一個交流的過程，不單與音樂專業人士，與聽眾的交流也是必不可少的。去掉的原因是聽眾這個身份的門檻較低，如果在用戶中占比過多，就失去了做音樂制作交流平臺的意義。
工種標簽
身份與工種的關系：身份有時對應一個工種，有時對應多個工種形成的集合。如身份A->策劃，身份B->作曲/編曲/混音。
題材標簽
5.4主頁
除了用戶主頁，企劃也有主頁。在企劃主頁的簡介中，會展示企劃的父子級關系圖，幫助音樂人了解該企劃的發展。企劃關系由發起人編輯。音樂人也可通過查看推薦的相似企劃尋找感興趣的項目。在個人主頁還會推薦相似的音樂人、相關企劃，團體主頁推薦相關音樂人（團體成員）、相似團體團體和相關企劃。
動效說明：以選擇的企劃的頭像和名稱作為轉場銜接。招募列表數據項快速退場。企劃主頁作品列表快速入場。加關注按鈕在卡片信息完整出現后再入場，提示用戶可以關注該企劃。
6.總結
作為系列的第一篇，介紹了國風音樂圈的項目背景、用戶群體，針對用戶分析其痛點并描述出尋找合作者的使用情境。以音樂人制作交流圈為切入點，分析相關競品。有了參考后給出流程和功能結構圖。從尋找合作者開始講起，展示招募模塊及涉及的設計點。
原文地址：黑馬家族（公眾號）
作者：黑馬青年
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
業務背景
以我們 CCO 體驗設計團隊為例，主要服務阿里體系的消費者、商家、經濟體等業務領域。隨著業務不斷擴大、用戶角色多、體驗復雜、設計師人力有限、定制化需求不斷增加，設計面臨嚴峻挑戰。
1、業務多：30多個產品應用
2、角色多：覆蓋消費者、客服小二、服務管理、業務運營、中臺管理、客戶 6大類用戶群體。
3、體驗復雜：設計師需兼顧用戶和客戶兩個視角。
從組織上，85% 設計師縱向支撐業務，15% 設計師橫向做標準化，反哺業務設計師。標準化實質解決的問題是保障基礎體驗一致性。
標準化怎么做
核心通過頁面梳理、抽象、分發、衡量，保障基礎體驗一致性。
案例實戰
以數據可視化場景為例，講述如何做標準化。
1、業務現狀
共有11個應用，涉及89個頁面。
2、問題
體驗不一致：各個工作臺頁面架構、組件、樣式野蠻生長，缺少規范導致體驗不統一。
低效：部分場景缺失，組件重復建設，大量定制；溝通協同內耗大，成本高。
3、策略
體驗統一：框架、組件、樣式。
提效：代碼化、工具、交付機制。
4、體驗統一
包括框架、組件、樣式。
框架
(1) 現有頁面收集
(2) 用戶場景分析
(3) 頁面歸類
結合用戶看數內容（例：概覽、分析、詳情）和交互形態（例：平鋪、下鉆），對頁面進行歸類。
(4) 確定典型布局
通過統計高頻復用形態，確定典型布局。
組件
(1) 頁面結構分析
組件的收斂，需要先對頁面分析，確定模塊層內容。例：模塊包含頁頭、篩選、圖表、表格。
(2) 模塊層分類
橫向收集全部業務，將模塊層分類。細分模塊擴展形態，放到對應的簍子里。
(3) 模塊專項治理
接下來，需要對每一個模塊進行專項治理。比如圖表模塊，再拆再抽象成指標、圖表、單選、多選 4類場景。場景里再對主體和變體（也就是擴展形態）分類。
樣式
(1) 確定優化內容
圍繞視覺凌亂，要做的便是完善設計語言。設計師需要結合自身技術底層，補充缺失規范。例如布局、色板、字體、動效。
(2) 確定組件范圍
通過統計高頻復用組件，確定需要梳理的組件范圍。
(3) 布局
圖例位置：線上有9種，通過從業務場景按閱讀順序劃分，最終收斂成2種。
組件高度：真實線上情況，只能看2個指標，高度規范缺失。
需要根據用戶分辨率調研，提煉典型分辨率。比如用戶是win系統，包含菜單欄、任務欄等默認高度，再減去本身頁面頁頭等默認高度，得到 3 檔。確定組件建議默認行高 240px。
軸標簽旋轉角度：現狀有順/逆時針兩種，通過分析標簽類型，結合閱讀順序、軸與標簽親密度，確定默認角度為順時針。
(4) 色板
通過場景梳理，確定不同組件使用的色板類型及缺失色板。
補充語義色板：從業務里抽象2類場景，指標和柱/餅/環場景，定義顏色。例如帶正面語義，用綠色，比如升、已到崗、正常。帶負面語義，用紅色，比如降、曠工、失敗。
(5) 字體
結合自身業務場景問題，從場景、版權、風格、識別、極值共5個維度選擇字體。
舉例場景一，縱向數據場景里，將市面上數據競品用到的字體都橫向鋪開嘗試，做排除法。比如din沒版權，蘋方非等寬字體，普惠102識別性弱。
舉例場景二，在核心數據呈現中，helvetica 品牌風格弱，普惠在1億以上極值過寬。
最終我們根據自身業務場景特征，用普惠和普惠102，運用在對應場景里。并同前端提煉規則。
(6) 動效
首先，需要確定動效價值，明確動效需要解決的問題。這里圍繞舒適度、活力、層級、反饋來講。
通過動效場景鏈路分析，確定優化范圍。
加載動效：圍繞讓用戶認知過程更為自然。通過組件橫向梳理、抽象圖形、組合樣式的思路，輸出方案。比如這里共梳理17種組件類型，抽象成9類，包括點、線、面、餅、環、柱、文本、圖標、詞云，再進行組合產出方案。
出場動效：通過業務分析、提煉場景、優化效果。比如這里共提煉 3類場景，有通用、監控、輿情。圍繞過渡不自然、卡頓、缺少情感化表達來優化效果。
瀏覽動效：通過提煉場景，來強化元素之間的層級與空間關系。比如單個組件、聯動、下鉆場景下，圍繞點擊感知弱、重點不突出、缺少懸停態來優化效果。
沉淀速度參數：將優化動效場景的速度參數，同前端約定規則沉淀組件庫。
5、提效
包含代碼化提效、工具提效、機制提效。
整體思路
從設計組內到技術產研的提效過程。
提效面向用戶依次是：組件設計師、業務設計師、前端、產品。
搭建目前還在進行中，這里主要從交付-工具-代碼化來分析。
交付內容
1、業務設計師：sketch/figma物料 (樣式、組件、區塊、模板、規則 )
2、業務設計師：kitchen工具（樣式、組件、區塊、模板）
3、組件工程師：組件規范/組件官網
交付機制
新需求：通過評估復用性、抽象、內審、沉淀物料。
現有業務：通過頁面梳理歸類、抽象、內審、沉淀物料。
6、衡量
從物理到行為層，包括樣式、組件、框架、組件交互 共4個維度。通過一致性評分衡量標準化覆蓋的好壞。
總結
回歸課程，在B類業務里，服務多個產品、多用戶角色、體驗復雜的場景下，在定制化+標準化團隊陣型里，標準化實質解決的問題是保障60分基礎體驗一致性。
總結：B端體驗標準化包括物料的產出、交付以及衡量標準。
產出：包括框架、組件、樣式的收斂來梳理、抽象頁面。
交付：面向2類用戶群體，業務設計，需交付物料和工具。組件工程師，代碼化需提供組件規范，組件線上化需助力組件官網的建設。
衡量：一致性評分包括樣式、組件、框架及組件交互。
原文地址：AlibabaDesign（公眾號）
作者：CCO 設計
轉載請注明：學UI網》如何做B端體驗標準化：以數據可視化場景為例
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
任何技巧都不是萬能的，用在合適的地方可以錦上添花，用在錯誤的地方就是災難，所以大家對自己的設計需求要有正確的評估，一切以得到好的效果為最終目的。
原文地址：蔥爺（公眾號）
作者：蔥爺
轉載請注明：學UI網》5個超酷的標題設計技巧，So easy!
少即是多。極簡主義的概念可以用這句足夠極簡的話進行總結。而且它不僅僅是一種設計理念，更是一種生活理念，甚至于是一種系統的思維方式，而不僅僅視作為一種「更干凈」的視覺風格。
在設計當中，極簡主義是呈現內容的諸多藝術概念之一，應用范疇非常廣。極簡主義是使用盡可能少的素材和色彩，以有限的形態和元素，來呈現信息。
在數字產品設計當中，極簡主義，是一個相當考驗技術的門類，如何從「簡單」跨越門檻，走到到「極簡」，其實并不容易。
今天的文章，是一篇「相對極簡」的「極簡主義設計指南」，掌控好下面的 5 大要素，應該就能夠很好地拿捏這種風格。
每一個要素下面都有一些頗為具有代表性的設計范例，這些作品的參考價值還是蠻高的 ~
有沒有聽說過「白紙綜合癥」？當你在畫畫或者創作的時候，面對著空無一物的白紙，陷入焦慮的情緒的狀態，就是「白紙綜合癥」。
這種狀態廣泛存在，這種病癥很多人都有，尤其是設計師。而當你在設計風格簡約的作品的時候，需要你學會擁抱白紙，面對留白，因為「留白」也是一種元素。
相反，在極簡主義的設計當中，過多的視覺元素會讓整個設計顯得不堪重負，降低可用性和易讀性。
留白的使用方法很多，但是最主要的方式，是讓留白以外的元素，僅保留必須的部分，把留白視作為一個必須的模塊，考慮如何保持可見的元素和留白之間的整體平衡。
留白當然不一定是白色，也可以是其他的顏色，你還可以搭配各種不一樣的配色方案和組合。
色彩和留白的結合是很自然的選擇，兩者能夠更好地賦予設計以更強的情緒和個性化的視覺，制造整體氛圍。
但是值得注意的是，除了留白使用一種顏色之外，其他元素的色彩也盡量不要用得太多太花。簡單的色彩搭配更容易營造出對比，在不復雜的配色體系下，制造出出色的視覺效果。
盡量將主要配色控制在 1~2 種，對比色能夠營造出更強的戲劇感和視覺張力。
「一圖勝千言」是被說爛了的老話，但是這句話怎么說都是對的。單張圖片能夠承載的信息量是巨大的。不過一樣的，插畫在極簡主義設計當中的應用也是相當講究的。
通常而言，你需要將插畫當作重要的視覺焦點來使用，讓它周圍有足夠多的留白，這樣能夠保持極簡設計應有的呼吸感。
這個時候，經典的排版布局方式就可以發揮極大的作用，左右布局、上下布局、中心式布局等等等等，不用復雜的花樣，就可以制造出讓人驚喜的效果。
當然，記得控制好元素和整體布局之間的空間比例。
當然，配色、圖片和留白都說了，剩下就是文本的部分了。文本在極簡主義設計當中的使用方式也有一些事項值得注意。
文本排版在極簡主義設計當中的玩法當然也很多，實驗性的文本排版和布局設計是很多設計師提升極簡設計的視覺觀感的一種有效的方式，結合一些比較獨特的配色或者效果，都可以。但是無論哪種，在「想法」上要保持極簡——不要想在一個設計中承載過多的排版方式和元素，你最好著力表現一種「理念」，或者一種排版風格，呈現某一種的氣質，千萬不要摻雜太多的想法。
此外，相對傳統的字體設計也同樣可行，適當地運用一些個性化的排版技巧，就可以了。
從包豪斯和瑞士現代主義設計開始，圖形元素就很好地同極簡主義設計結合到一起。
你可以充分發揮你的創造力，使用獨特的圖案來提升極簡設計的視覺效果，也可以從其他已有的設計當中汲取靈感，提取元素，應用到你的構圖和元素當中。
圖形與圖案其實可以玩的花樣很多，如果不是作為視覺主體的話，其實適當的裝飾即可。作為視覺焦點存在，強化形式感就好，不必要弄的太過于繁復。
極簡主義設計并不復雜，重點在于你怎么簡化整體設計，如何將有限的元素打磨好，控制留白和主次，從而以較少的內容呈現出豐富的效果。當然，在把握的核心要義之后，多研究一下成功的案例，其實你也可以做很好。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
藍藍設計的小編 http://www.syprn.cn