平臺一致性的問題
按鈕的位置非常重要
為什么"確定"按鈕在右側(cè)效果更好
按鈕放置在角落還是放在一起？
結(jié)論
大家好，我是西瓜～
這次我們聊一個(gè)設(shè)計(jì)知識點(diǎn)，這個(gè)知識點(diǎn)平日會被設(shè)計(jì)師忽視，因?yàn)樗^于默許，但我們應(yīng)該知道的是，很多默認(rèn)的東西也是有自身的知識結(jié)構(gòu)支撐，久而久之被人忽視了。
大家應(yīng)該都見到過彈窗、表單里的"確定"和"取消"按鈕吧，這兩個(gè)按鈕大家還記得會放在頁面中的哪個(gè)位置嗎？"確定"按鈕是完成任務(wù)的主要操作，而"取消"按鈕是輔助操作，它主要的作用是用于返回到起點(diǎn)屏幕而放棄任務(wù)。那么，根據(jù)它們的功能，最佳的按鈕順序是什么？"確定"按鈕應(yīng)該放在"取消"按鈕之前還是之后呢？
可能這時(shí)候很多設(shè)計(jì)師會按照習(xí)慣，選擇遵循一致性，采用一些常見的組件樣式進(jìn)行操作。雖然這看起來似乎是解決問題的方法，但實(shí)際上并非如此。這并沒有回答哪種位置對用戶更有效以及為什么，單純遵循已有組件并不足以讓設(shè)計(jì)師有更好的思維和主動思考的意識。
"一致性"是設(shè)計(jì)師中常用的一個(gè)詞。然而，這常常也被用作一個(gè)借口，讓設(shè)計(jì)師不深入思考用戶面臨的設(shè)計(jì)問題，如果一個(gè)設(shè)計(jì)師都不知道為什么一致性的規(guī)則存在，那么遵循這種設(shè)計(jì)慣例又有什么意義呢？
如果某種設(shè)計(jì)慣例對用戶來說是有害的，那么設(shè)計(jì)師是否應(yīng)該盲目遵循它，僅僅因?yàn)橐非笠恢滦裕矿w驗(yàn)極差的設(shè)計(jì)樣式和結(jié)果是否應(yīng)該因?yàn)樵O(shè)計(jì)師希望迎合大家都默認(rèn)的設(shè)計(jì)一致性而繼續(xù)存在？這其實(shí)本質(zhì)就是個(gè)問題...
現(xiàn)在網(wǎng)上有很多組建和參考，都被設(shè)計(jì)師天天借鑒和廣泛使用，因?yàn)樗鼈冞m用于用戶。但關(guān)鍵在于，設(shè)計(jì)師永遠(yuǎn)不應(yīng)該滿足于墨守成規(guī)的選擇設(shè)計(jì)的一致性，將其作為做設(shè)計(jì)的唯一理由，我們關(guān)鍵還是要理解為什么應(yīng)該以某種方式而不是其他方式來設(shè)計(jì)用戶界面。
這時(shí)候有的設(shè)計(jì)師可能會主張通過賦予操作按鈕更多的視覺重量和清晰明了的標(biāo)簽來突出界面中的操作按鈕，而不是僅關(guān)注按鈕的位置，雖然操作按鈕的視覺重量和標(biāo)簽是需要考慮的重要設(shè)計(jì)方面，但它們并不是唯一的方面。
真正一名有思想，會獨(dú)立思考的設(shè)計(jì)師會綜合考慮每個(gè)設(shè)計(jì)方面對用戶的影響，而不只是關(guān)注其中的一個(gè)方面，對于設(shè)計(jì)師來說，最難的是確定主要操作和次要操作的最佳放置方式。這就是我為什么關(guān)于"確定"/"取消"按鈕的位置進(jìn)行說明的原因。
當(dāng)我們在使用設(shè)計(jì)組建框架前進(jìn)行考慮時(shí)，你可能會開始明白哪個(gè)位置會對用戶效果更好一些，我們可以通過分析設(shè)計(jì)對用戶的影響來解決這個(gè)問題。
有些設(shè)計(jì)師認(rèn)為，將主要操作放在左側(cè)，在次要操作之前，對用戶來說更好，因?yàn)樗渣c(diǎn)擊所需時(shí)間更少，這看起來好像有點(diǎn)道理，但我們不能忽視一個(gè)問題，即在選擇要執(zhí)行的操作之前，用戶會查看所有選項(xiàng)，這意味著大多數(shù)用戶不會在不查看旁邊的次要操作按鈕的情況下盲目地點(diǎn)擊主要操作按鈕。
他們將首先看到左側(cè)的主要操作，然后再看右側(cè)的次要操作，然后他們會將視線轉(zhuǎn)回主要操作按鈕進(jìn)行點(diǎn)擊。這里總共涉及到三個(gè)視覺注視點(diǎn)，在多個(gè)方向上分散了用戶的注意力。
與將主要操作放在左側(cè)相比，將主要操作放在對話框的右側(cè)，將次要操作放在左側(cè)，用戶只需注視每個(gè)按鈕一次，并在主要操作按鈕上結(jié)束。這樣一來，視覺注視的數(shù)量就減少了，并且在一個(gè)方向上產(chǎn)生了更流暢的視覺流動。
用戶只關(guān)注每個(gè)按鈕一次，并最終停留在主要操作按鈕上，將主要操作放在左側(cè)可能會使用戶更容易點(diǎn)擊，但從用戶的心理過程和視覺注視速度來看，將主要操作放在對話框的右側(cè)實(shí)際上更快。
當(dāng)用戶點(diǎn)擊“取消”操作按鈕時(shí)，他們期望的是產(chǎn)品不進(jìn)行任何操作，而是將他們返回到起始屏幕位置，因此，"取消"按鈕的功能類似于"返回"按鈕。
當(dāng)用戶點(diǎn)擊“確定”操作按鈕時(shí)，他們期望產(chǎn)品進(jìn)行按鈕所表示的操作，并將他們帶到下一個(gè)屏幕。因此，"確定"按鈕的功能類似于"下一步"按鈕，將次要操作按鈕放在左側(cè)，將主要操作按鈕放在右側(cè)，可以與用戶期望的"后退"和"下一步"按鈕功能相匹配。
這類似于分頁按鈕的放置方式，將用戶帶到下一頁的按鈕位于右側(cè)，將用戶帶回先前頁面的按鈕位于左側(cè)。這種按鈕位置的安排是有效的，因?yàn)樗c用戶從左到右的閱讀和導(dǎo)航方向相吻合，其中右側(cè)是前進(jìn)方向，左側(cè)是后退方向。
對話框中的"確定"和"取消"按鈕應(yīng)該遵循類似的交互模式，因?yàn)樗鼈兊墓δ茴愃朴诜猪摪粹o，另外這種左右方向模式也是用戶熟悉的。將主要操作放在右側(cè)，將次要操作放在左側(cè)，可以使對話框按鈕對用戶更易于理解和使用。
將按鈕放置在對話框的右下角更容易被用戶點(diǎn)擊，因?yàn)檫@符合【古騰堡圖表】。在古騰堡圖表中，右下角區(qū)域是終端區(qū)域，用戶在掃視后的最終目的地。
將按鈕放在終端區(qū)域可以使用戶在視覺掃描時(shí)看到他們最后需要執(zhí)行的主要操作，這不僅改善了視覺流動，還改善了任務(wù)流程。用戶在掃視過程中不會錯(cuò)過主要操作按鈕，當(dāng)他們經(jīng)過時(shí)，他們的目光會停留在上面，從而可以立即點(diǎn)擊它。
掃視對話框并采取行動變得更快更容易，因?yàn)橛脩舻哪抗庾罱K會落在主要操作按鈕上。
我們需要考慮另一個(gè)問題，那就是我們應(yīng)該將按鈕放在角落還是放在一起，當(dāng)將主要操作和次要操作放在對話框的角落時(shí)，這與左右導(dǎo)航方向相吻合，這是很好的映射。然而，由于"確定"和"取消"按鈕并不是導(dǎo)航按鈕，因此并不需要遵循方向映射，有時(shí)候這樣做可能帶來更多的弊端。
較大的視覺分離使得比較操作變得困難，并將一個(gè)操作與另一個(gè)操作隔離開來 如果產(chǎn)品頁面即將執(zhí)行用戶無法撤銷的關(guān)鍵操作，那么用戶可以看到"取消"按鈕和"確定"按鈕是很重要的。在這種情況下，"取消"按鈕的功能可能類似于"上一步"按鈕，但它更重要，因?yàn)樗洚?dāng)安全按鈕以防止任何更改。
將"取消"按鈕放置在最左下角的危險(xiǎn)在于，由于兩個(gè)按鈕之間的視覺分離較大，可能會導(dǎo)致用戶忽略它。將"取消"按鈕與"確定"按鈕放在一起可以讓用戶更輕松地在一次注視中查看和比較這兩個(gè)操作，以選擇最佳操作。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
先問你一個(gè)問題。
拼多多、淘寶、京東這三家購物平臺，你認(rèn)為它們的區(qū)別是什么？
或者換個(gè)方式問你。
買電器你去哪個(gè)平臺？
買衣服你去哪個(gè)平臺？ 買垃圾袋你去哪個(gè)平臺？
是不是有了答案了？
沒猜錯(cuò)的話， 大部分人的答案是：買電器去京東、買衣服去淘寶、買垃圾袋去拼多多。
你看，這就是一個(gè)購物心智模型，你的心里對這三家平臺已經(jīng)產(chǎn)生了固有的心智，如果讓你去京東買衣服，你會不會覺得，有些別扭？
沒錯(cuò)，這就是心智模型。
百度百科對心智模型的定義是：
“深植我們心中關(guān)于我們自己、別人、組織及周圍世界每個(gè)層面的假設(shè)、形象和故事。并深受習(xí)慣思維、定勢思維、已有知識的局限。”
關(guān)鍵詞是：故事、習(xí)慣、局限。
淘寶一開始就我們講了一個(gè)故事，一個(gè)萬能的集市，我們習(xí)慣在上面買衣服，但是也產(chǎn)生了局限性，那就是，當(dāng)我們想買大額電器的時(shí)候，還是會選擇京東。
我個(gè)人對心智模型的理解是：
我們內(nèi)心深處對一個(gè)事物的看法。
空口聊天多沒意思，下面舉個(gè)例子。
這是一尊陶俑，第一眼你覺得她像什么？
是不是覺得像米老鼠？
為什么？
因?yàn)樘召傅念^上的發(fā)髻和米老鼠標(biāo)志性的耳朵很像。
如果你從沒見過米老鼠，你還會覺得她像米老鼠嗎？
一定不會。
這就是心智模型，你對頭頂?shù)拇髨A形的心智是“米老鼠”，所以一旦你看到類似的形狀，米老鼠的形象就會浮現(xiàn)出來，這個(gè)發(fā)髻的形狀和你心里對米老鼠的形象產(chǎn)生了匹配。
對心智模型有沒有一點(diǎn)印象了？
下面我們接著聊。
我不想用具體的界面來聊，那樣的話太散，我認(rèn)為要想理解一個(gè)概念，最好還是從“面”的角度來說，所以下面我會舉一些商業(yè)上的案例來輔助理解。
心智模型有哪三種運(yùn)用方式？
第一種：創(chuàng)建新的心智模型
第二種：改變舊的心智模型
第三種：匹配現(xiàn)有的心智模型
可以理解成一件事情的新生、改變和延續(xù)。
下面咱們一個(gè)個(gè)來。
第一種：創(chuàng)建新的心智模型
難度指數(shù)：難啊。
記得《盜夢空間》里最難的是什么嗎？
最難的不是盜夢，而是植入一個(gè)想法。
創(chuàng)建新的心智模型有異曲同工之妙，都是讓別人內(nèi)心接收一個(gè)事物，需要刻意培養(yǎng)。
舉幾個(gè)例子。
當(dāng)年外賣剛開始的時(shí)候，家家搞補(bǔ)貼，很多時(shí)候幾乎不花錢就可以點(diǎn)外賣，后來這些福利沒有了，為啥？
因?yàn)辄c(diǎn)外賣的心智已經(jīng)培養(yǎng)好了，你離不開它了，所以平臺可以“不慣著你了”。
還有唯品會的正品低價(jià)、瑞幸一開始的星巴克平替，這些都是他們想要植入到用戶大腦中的心智。
為什么要費(fèi)勁植入一個(gè)新的想法？
因?yàn)橐坏┲踩肓耍秃茈y改變。
現(xiàn)在我身邊的很多朋友想買一些低價(jià)的品牌都會上唯品會，買咖啡會喝瑞幸，一旦用戶的習(xí)慣養(yǎng)成就很難改變，意味著什么？
意味著留存和轉(zhuǎn)化的成本更低了。
第二種：改變舊的心智模型
難度指數(shù)：也難。
《盜夢空間》里小李子的妻子被他植入了一個(gè)想法“你不在現(xiàn)實(shí)世界里”，當(dāng)他和他妻子回到現(xiàn)實(shí)世界后，他妻子仍舊認(rèn)為自己不在現(xiàn)實(shí)世界里，這個(gè)被植入的想法已經(jīng)根深蒂固，很難改變。
所以改變舊的心智也不簡單。
例如小米最初主打極致性價(jià)比，后來想往高端路線走，很難，大家心里已經(jīng)認(rèn)準(zhǔn)了小米就是“性價(jià)比之王”，也就是你的產(chǎn)品不僅要好還要便宜。
這就導(dǎo)致小米一漲價(jià)，大家就罵他們忘了初心……所以小米拆分出了紅米主攻性價(jià)比，小米往高端發(fā)展，但是仍舊很難。
拼多多的百億補(bǔ)貼也是一樣的道理，一開始的砍一刀深入人心，大家對拼多多的心智已經(jīng)成型：便宜，質(zhì)量一般。拼多多想改變這個(gè)心智，推出百億補(bǔ)貼，并承諾假一賠十，就是想告訴大家，我拼多多，也是有正品好貨的。不過，效果嘛，見仁見智。
第三種：匹配現(xiàn)有的心智模型
難度指數(shù)：相對簡單。
其實(shí)匹配現(xiàn)有的心智模型，是相對最簡單的方法，市場已經(jīng)幫你把用戶習(xí)慣培養(yǎng)好了，你直接使用，那肯定事半功倍，省時(shí)省力啊。
舉個(gè)例子，大家最近有關(guān)注小米的 13 Ultra 嗎？
小米和徠卡聯(lián)合研發(fā)的，主打徠卡調(diào)色的相機(jī)。
我有一個(gè)同事就直接把手里的微單換成了 13 Ultra ，因?yàn)榕恼兆銐蚝每炊冶銛y。
這里不是要推銷手機(jī)啊，是想讓你們了解 13 Ultra 是個(gè)什么東西。
然后給大家看看它的手柄（一個(gè)配角，可以拆卸）。
是不是有些熟悉？
和相機(jī)像不像？
這個(gè)手柄就是沿用了相機(jī)的心智模式。
小結(jié)一下：
心智模型有3種用法：
新建：創(chuàng)建新的心智模型
改變：改變舊的心智模型
延續(xù)：匹配現(xiàn)有的心智模型
下面聊聊，咱們怎么做才能更加匹配用戶的心智模型？
同樣的，我不會拿具體頁面來舉例，還是希望把思考方式分享給大家，而不是某一個(gè)頁面的設(shè)計(jì)。
要想匹配用戶的心智模型其實(shí)就三步：
了解業(yè)務(wù)、了解用戶、競品調(diào)研。
或者可以這么說， 在懂業(yè)務(wù)、懂用戶的基礎(chǔ)上，還要了解行業(yè)內(nèi)的通用做法。
1）了解業(yè)務(wù)
一定要了解業(yè)務(wù)，為什么？
因?yàn)楹玫脑O(shè)計(jì)方案千千萬，但是匹配你的業(yè)務(wù)的方案才是好方案，如果不了解業(yè)務(wù)，可能設(shè)計(jì)出來的方案就是自嗨，例如網(wǎng)上很多的dribble風(fēng)設(shè)計(jì)。
又比如說手機(jī)瀏覽器一般都把搜索框放到屏幕頂部，而夸克瀏覽器卻把搜索框放到了下面。
為什么？
因?yàn)榭淇讼胪品瓊鹘y(tǒng)的瀏覽器，想打造一款更年輕更好用的瀏覽器，把搜索框放到下面也是滿足他們的業(yè)務(wù)訴求，現(xiàn)在手機(jī)屏幕越來越大，搜索框放在下面手指操作更加方便。
所以，一定要先去了解業(yè)務(wù)。
拼多多和淘寶同樣都是電商平臺，可它們的用戶心智相差甚大，因?yàn)樽詈蠓桨冈O(shè)計(jì)是服務(wù)于最初的業(yè)務(wù)目標(biāo)的，業(yè)務(wù)不同，呈現(xiàn)的方案也不一樣，最后讓用戶形成的心智也不同。
2）了解用戶
為啥？給老人和小孩設(shè)計(jì)的界面能一樣嗎？
就拿顏色和文字來說。
小孩喜歡高飽和、豐富的顏色，而老人則需要考慮在各種場景下都能看得清楚信息的顏色。
小孩喜歡圓潤的卡通字體，而老人需要識別度更高的字體，更大的字號。
不同的用戶，采用的設(shè)計(jì)一定是不同的，只有了解了他們的喜好和痛點(diǎn)，才能做出符合他們心智模型的設(shè)計(jì)。
3）競品調(diào)研
為啥要競品調(diào)研呢？
因?yàn)楦偲泛臀覀兊漠a(chǎn)品類似，那么意味著用戶大概率重合度也高，甚至業(yè)務(wù)上都有一定相似度，那么意味著，競品的方案，大概率是經(jīng)過市場驗(yàn)證的符合用戶心智模型的方案。
你看，既然競品已經(jīng)給咱們打了個(gè)樣，為何還要自己悶頭造輪子呢？
咱們目的是解決問題，又不是為了證明自己很厲害。
但是，不要誤解，我不是說照著競品抄，而是取長補(bǔ)短，所以不僅要調(diào)研，還要分析，分析就是把競品的優(yōu)劣勢找出來，好的地方咱們可以酌情借鑒，不好的地方，咱們也要避個(gè)雷嘛。
好了，小結(jié)一下，要想匹配用戶的心智模型，一定要了解業(yè)務(wù)、了解用戶，還要做競品調(diào)研了解市場的通識性做法。
以上。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
一、弧形輪播的 Banner 圖設(shè)計(jì)
在移動端 Banner 圖通常以左右輪播居多，也有個(gè)別產(chǎn)品會在輪播形式上創(chuàng)新，比如上下輪播、分層輪播、漸隱輪播、Z 軸輪播等。
最近在體驗(yàn)態(tài)棒 App 時(shí)，其 Banner 圖采用弧形輪播的形式。利用弧度的形式展示商品提高了 Banner 位的利用率，有助于展示更多推薦商品，直觀的表達(dá)也使得商品更加突出。自動輪播類似于滾動的櫥窗，表現(xiàn)形式非常新穎，帶給用戶更好的感官體驗(yàn)。
二、默認(rèn)頭像的多種預(yù)設(shè)選擇
隨著產(chǎn)品感官體驗(yàn)的提升，很多產(chǎn)品在默認(rèn)頭像的設(shè)計(jì)層面變得更豐富，不一定需要用戶上傳照片，自定義的選擇也更靈活。
除了通過 IP 形象強(qiáng)化默認(rèn)頭像的視覺感以外，最近在使用智行火車票 App 時(shí)，其默認(rèn)頭像以矢量插畫風(fēng)為主。用戶進(jìn)行頭像設(shè)置時(shí)無需上傳照片，產(chǎn)品提供了多個(gè)默認(rèn)頭像，方便用戶根據(jù)自己的喜好作出預(yù)設(shè)。多種預(yù)設(shè)讓自定義選擇更靈活，也能讓默認(rèn)頭像更美觀，提升用戶對產(chǎn)品的好感度。
三、趣味性的心情打卡設(shè)計(jì)
對于職場人來說壓力是難以避免的，總會遇到一些煩心的事或者壓力，就會因此影響我們的情緒。我們要試著釋放壓力，治愈我們的情緒才能迎接美好的明天。
最近體驗(yàn)到一個(gè)幫你記錄心情，治愈心事的產(chǎn)品-歲歲。整個(gè)產(chǎn)品設(shè)計(jì)風(fēng)格清新可愛，看著就有種治愈感。可以對自己當(dāng)前的心情進(jìn)行打卡，類似于儀表盤一樣的心情打卡設(shè)計(jì)也是趣味性十足，表情設(shè)計(jì)風(fēng)格非常可愛，哪怕是不開心也能通過這樣趣味性的打卡形式而治愈。設(shè)計(jì)風(fēng)格觀賞性很高，值得大家體驗(yàn)。
四、五一主題氛圍設(shè)計(jì)
眾多產(chǎn)品都會在五一假期期間進(jìn)行系列主題活動，如何充分利用好當(dāng)前布局結(jié)構(gòu)，是產(chǎn)品設(shè)計(jì)師進(jìn)行設(shè)計(jì)發(fā)揮的關(guān)鍵。
在五一期間使用嘀嗒出行 App 時(shí)，多個(gè)主界面結(jié)合了五一主題氛圍設(shè)計(jì)，青春活潑的插畫風(fēng)渲染出歡快的節(jié)奏。整個(gè)界面被裝扮得非常有氛圍感，既傳播了主題活動，也帶給用戶非常新穎的視覺享受。
五、場景化的積分兌換設(shè)計(jì)
為了提高用戶黏性，通過簽到積分、消費(fèi)積分、任務(wù)積分等，再結(jié)合積分兌換提高用戶參與度，是提升黏性轉(zhuǎn)化的有效形式。
麥當(dāng)勞 App 在積分兌換的設(shè)計(jì)中結(jié)合了兌換套餐的實(shí)物照片，讓用戶對于兌換商品更有直觀感受。也可以切換不同積分兌換的差異，提高用戶參與積分的積極性。通過場景化的積分兌換設(shè)計(jì)，不僅提高用戶參與度，設(shè)計(jì)感官度也非常棒。
六、動態(tài)賣點(diǎn)強(qiáng)化關(guān)注度
需要強(qiáng)化功能的關(guān)注度時(shí)，除了在視覺表現(xiàn)層體現(xiàn)差異以外，動靜結(jié)合也能起到突出作用。
比如智行火車票 App 首頁設(shè)計(jì)中，以動效的形式演變賣點(diǎn)，以此突出酒店欄目。動效表達(dá)的形式形成動靜對比，以差異化的形式突出業(yè)務(wù)重點(diǎn)，提高用戶的關(guān)注度。
七、播放按鈕的品牌氛圍營造
越來越多的產(chǎn)品開始注重立足于品牌的設(shè)計(jì)，強(qiáng)化品牌曝光度和產(chǎn)品差異化，品牌基因的融入可以一舉多得。
最近在使用汽水音樂 App 聽歌時(shí)，播放按鈕暫停狀態(tài)背景會有氣泡漂浮，還原了汽水帶給用戶的視覺感。通過小小的動效表達(dá)不僅強(qiáng)化了品牌感，也提高了播放按鈕的點(diǎn)擊欲，帶給用戶不錯(cuò)的感官體驗(yàn)。
八、登錄設(shè)計(jì)中的動態(tài)背景
登錄已經(jīng)逐步成為體驗(yàn)產(chǎn)品的必備步驟，很多產(chǎn)品都需要用戶登錄才可以體驗(yàn)，如何提高用戶的登錄意愿度變得至關(guān)重要。
吃貨筆記 App 在登錄設(shè)計(jì)中采用動態(tài)背景增強(qiáng)視覺感，有種炫酷的感覺。動態(tài)背景結(jié)合炫酷的圖形設(shè)計(jì)，營造出不錯(cuò)的氛圍感，以此降低登錄帶來的排斥感，提高用戶登錄體驗(yàn)產(chǎn)品的意愿度。
九、導(dǎo)航結(jié)束的人性化設(shè)計(jì)
導(dǎo)航算是這個(gè)時(shí)代最便民的工具之一，讓大家的出行更便捷和安全。隨著導(dǎo)航產(chǎn)品的不斷完善，使用體驗(yàn)也越來越人性化。
五一期間使用高德地圖導(dǎo)航時(shí)，抵達(dá)目的地結(jié)束導(dǎo)航的設(shè)計(jì)中，會根據(jù)目的地屬性進(jìn)行場景表達(dá)。比如目的地是古鎮(zhèn)類景區(qū)，會以古鎮(zhèn)代表的圖標(biāo)設(shè)計(jì)替代默認(rèn)圖標(biāo)，也會顯示景區(qū)購票信息，方便用戶進(jìn)行購票和了解相關(guān)信息。結(jié)合場景打造人性化的設(shè)計(jì)，讓用戶時(shí)刻感受到產(chǎn)品的溫度。
十、不一樣的點(diǎn)贊設(shè)計(jì)
點(diǎn)贊設(shè)計(jì)已經(jīng)很普遍，通常以伸大拇指和愛心圖標(biāo)為主，點(diǎn)擊變化過程中也會結(jié)合動效和衍生設(shè)計(jì)。
最近在體驗(yàn)歲歲 App 時(shí)，在樹洞欄目中點(diǎn)贊設(shè)計(jì)采用動效結(jié)合卡通形象。點(diǎn)贊時(shí)以動效表達(dá)卡通形象送愛心的過程，呈現(xiàn)出不一樣的點(diǎn)贊效果，帶給用戶差異化的點(diǎn)贊體驗(yàn)。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
這個(gè)頁面第一眼最突兀的地方首先是“知道了”這3個(gè)字，因?yàn)樵谶@個(gè)界面中，橙色產(chǎn)品色，而突然出現(xiàn)的藍(lán)色會讓你覺得特別醒目，所以我們第一眼會看到這三個(gè)字以及這一行的內(nèi)容，這里只涉及到了UI層面上的視覺表現(xiàn)就可以將用戶的注意力吸引過來，但提示欄的視覺優(yōu)先級并不應(yīng)該設(shè)計(jì)的這么高。
這里的業(yè)務(wù)規(guī)則是，用戶必須將保險(xiǎn)內(nèi)容全部瀏覽完才可以進(jìn)入到下一階段，也就是說一共4頁內(nèi)容，如果你在擊下方的checkbox或者下一步時(shí)時(shí)，內(nèi)容沒有定位在4/4的分頁狀態(tài)時(shí)，就會被判定沒有閱讀完保險(xiǎn)內(nèi)容。但是這里的文案只是告訴用戶，請向下滑動瀏覽全部內(nèi)容。
底部有3個(gè)條款按鈕，在視覺表現(xiàn)上是3個(gè)統(tǒng)一樣式的幽靈按鈕，點(diǎn)擊后會出現(xiàn)彈窗讓用戶閱讀條款內(nèi)容，并在一定時(shí)間內(nèi)允許關(guān)閉，用戶點(diǎn)擊閱讀完后樣式不變，但這里的規(guī)則是必須閱讀條款且全部閱讀。
必須閱讀完三個(gè)條款與說明，才可進(jìn)入下一步。所以這里就會出現(xiàn)多種問題，比如用戶閱讀完保單內(nèi)容但沒有注意到中間的條款按鈕，在視覺沒有給出“必讀”的意符的情況下，用戶會先點(diǎn)擊下一步，但是被告知需要閱讀條款，用戶點(diǎn)擊閱讀完第一條條款，認(rèn)為自己已經(jīng)完成要求后繼續(xù)點(diǎn)擊下一步，但發(fā)現(xiàn)需要閱讀完三個(gè)條款才能完成要求。
這樣的交互與信息設(shè)計(jì)讓用戶在該頁面的操作效率大幅度下降，所以面對這種情況，我們是否可以用一些交互優(yōu)化的手段來解決這些問題呢？在選擇策略和方案之前，我們需要思考一些問題：
1.條款的必讀性、風(fēng)險(xiǎn)控制
2.效率與法律責(zé)任的權(quán)衡
3.面對多文本、文檔的操作、閱讀的便利性
其實(shí)這些問題一部分是業(yè)務(wù)規(guī)則，如果業(yè)務(wù)上的要求不是必須的那么在效率上的操作空間就會比較大。比如我們經(jīng)常看到的條款和說明的閱讀，幾乎沒有人會去全部一字不落的看完，但是為了讓用戶充分了解條款、協(xié)議的內(nèi)容，以防后續(xù)帶來的風(fēng)險(xiǎn)，現(xiàn)在產(chǎn)品的設(shè)計(jì)策略就是給用戶一個(gè)5秒的閱讀倒計(jì)時(shí)，倒計(jì)時(shí)結(jié)束前無法關(guān)閉彈窗，但說實(shí)話這種設(shè)計(jì)也是雞肋的很，不想看的人你給60秒也不會去看，想看的人不設(shè)計(jì)倒計(jì)時(shí)也會很仔細(xì)的看。所以現(xiàn)在很多產(chǎn)品也做了簡化處理，例如在這個(gè)保險(xiǎn)條款的交互方式中，我們也可以這樣設(shè)計(jì)。在底部直接將條款做成鏈接的形式，和checkbox一同做在一個(gè)欄里方便用戶操作，想看自己點(diǎn)，不想看就直接勾選后下一步即可。
關(guān)于風(fēng)險(xiǎn)揭示、知曉以及同意協(xié)議這個(gè)步驟有很多種做法，還有下方的3種例子：
1.將所有風(fēng)險(xiǎn)平鋪?zhàn)層脩艄催x并同意，這樣的方式比做在一個(gè)模塊里打鉤其實(shí)形式上是一樣的，因?yàn)槎伎梢匀x后確認(rèn)，一種同構(gòu)異型的做法。將風(fēng)險(xiǎn)需知面積展示的更多，希望用戶能對其重視，但是為了效率起見還是做了一個(gè)全選，也是在形式上尊重了“風(fēng)險(xiǎn)”。
2.用標(biāo)簽選擇的形式將合同、條款披露給用戶，這種形式在本質(zhì)上也和上面的差不多，甚至很多用戶可能不回去點(diǎn)第二個(gè)標(biāo)簽。
3.現(xiàn)在很多產(chǎn)品因?yàn)檎叩年P(guān)系都會在登錄頁面中加上用戶協(xié)議和隱私政策的說明，需要用戶自己去點(diǎn)擊，很多用戶都覺得在登錄前點(diǎn)擊該協(xié)議非常的麻煩，有時(shí)也會忽略，所以一些聰明的產(chǎn)品就在用戶點(diǎn)擊登錄后再彈出彈框讓用戶同意該協(xié)議。
最后，話又說回來，領(lǐng)導(dǎo)非讓用戶點(diǎn)擊完3個(gè)按鈕，才可以點(diǎn)擊下一步，該怎么設(shè)計(jì)呢？首先在視覺樣式層面，用常規(guī)的色塊、線條樣式的按鈕肯定是不行的，因?yàn)樵谶@里我們要考慮幾個(gè)點(diǎn)：
1.如何讓用戶知道這3個(gè)條款是必須點(diǎn)擊閱讀的
2.讓用戶知道只有全部閱讀完才可以進(jìn)行下一步。所以做成常規(guī)按鈕，用戶無法知道該點(diǎn)哪個(gè)，先點(diǎn)哪個(gè)，要點(diǎn)幾個(gè)。
那可以做成勾選嗎？也不行，感覺比做成按鈕還要離譜。
那我們可以考慮這樣做，在這個(gè)步驟中也無法單獨(dú)將閱讀條款列為一個(gè)界面，所以只能繼續(xù)在頁面下方用列表的形式讓用戶去閱讀。通過這樣的設(shè)計(jì)可以讓用戶明確我該點(diǎn)哪個(gè)，哪個(gè)還沒有閱讀，當(dāng)用戶沒有完成閱讀要求時(shí)，底部按鈕置灰。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
用戶體驗(yàn)設(shè)計(jì)流程
由于系統(tǒng)軟件糟糕的UI設(shè)計(jì)（菜單排布問題）所導(dǎo)致的誤操作，美國居民受到導(dǎo)彈襲擊的驚嚇
· 美國Forester的一項(xiàng)研究發(fā)現(xiàn)，針對UX投入的每1美元，能夠帶來2~100美元的收益。
· Amazon把按鈕文字從“注冊（register）”改成“繼續(xù)（continue）”之后，銷售增長了3億元。
· McAfee重新設(shè)計(jì)UI之后，客服電話減少了90%。· Airbnb的Mike Gebbia認(rèn)為，公司從接近失敗到獲得100億美元市值，最大因素要?dú)w功于UX
UX究竟在設(shè)計(jì)些什么
廣義的用戶體驗(yàn)設(shè)計(jì)，是包含了內(nèi)容功能設(shè)計(jì)，信息架構(gòu)設(shè)計(jì)，用戶界面設(shè)計(jì)，交互設(shè)計(jì)，視覺設(shè)計(jì)，語言設(shè)計(jì)，動效設(shè)計(jì)，音效設(shè)計(jì)，在一定程度上涵蓋了產(chǎn)品物理外觀設(shè)計(jì)（工業(yè)設(shè)計(jì)），平面/包裝設(shè)計(jì)，空間設(shè)計(jì)，服務(wù)流程設(shè)計(jì)等。它意味著一個(gè)高度交叉綜合的領(lǐng)域，涉及到人與產(chǎn)品系統(tǒng)或服務(wù)發(fā)生關(guān)系并產(chǎn)生體驗(yàn)的所有觸點(diǎn)。一般或狹義的UX Design，則主要作為與UI Design區(qū)分，多用于互聯(lián)網(wǎng)軟件（或消費(fèi)電子等）行業(yè)基于屏幕的設(shè)計(jì)，包含信息框架設(shè)計(jì)，用戶交互設(shè)計(jì)，可用性研究等。這里的UI Design偏重于視覺上的設(shè)計(jì)。而在現(xiàn)實(shí)中我們也經(jīng)常把UX等同于“交互”。
用戶體驗(yàn)設(shè)計(jì)的核心和本質(zhì)，就是研究目標(biāo)用戶在特定場景下的思維方式和行為模式，通過設(shè)計(jì)提供產(chǎn)品或服務(wù)的完整流程，去影響用戶的主觀體驗(yàn)。可見用戶研究在整個(gè)UX流程當(dāng)中的重要性。而認(rèn)知心理學(xué)（Cognitive Psychology）則是用戶體驗(yàn)設(shè)計(jì)的理論基礎(chǔ)和科學(xué)依據(jù)。它是一門研究認(rèn)知及行為背后之心智處理（包括思維、 決定、推理和一些動機(jī)和情感的程度）的心理科學(xué)。這門科學(xué)包括了廣泛的研究領(lǐng)域，旨在研究記憶、注意、感知、知識表征、推理、創(chuàng)造力，及問題解決的運(yùn)作。相關(guān)的還有人體工學(xué)（Ergonomics）與人因工程學(xué)（Human Factors Engineering），是研究人和機(jī)器、環(huán)境的相互作用及其合理結(jié)合，使設(shè)計(jì)的機(jī)器和環(huán)境系統(tǒng)適合人的生理及心理等特點(diǎn)，達(dá)到提高效率、安全、健康和舒適目的的一門科學(xué)。可用性（Usability）的概念最早出現(xiàn)于1979年，遠(yuǎn)比唐·諾曼在1993年提出的“用戶體驗(yàn)”概念要早。可用性的ISO定義是“用戶在特定環(huán)境下完成指定目標(biāo)的效果、效率和滿意度”(ISO 9241-11)，而用戶體驗(yàn)指“用戶與產(chǎn)品、服務(wù)、設(shè)備或環(huán)境交互時(shí)各方面的體驗(yàn)和感受”。可用性的范疇比用戶體驗(yàn)窄，它聚焦于任務(wù)完成。而用戶體驗(yàn)是外觀呈現(xiàn)、功能組合、系統(tǒng)性能和交互行為等因素的綜合結(jié)果。
上圖將用戶體驗(yàn)細(xì)分為工具性(Utility)、可用性(Usability)、合意性(Desirability)和品牌體驗(yàn)(Brand Experience)，最內(nèi)部的圓代表最基礎(chǔ)的用戶體驗(yàn)。
用戶體驗(yàn) / 產(chǎn)品設(shè)計(jì)的流程與方法
以用戶為中心的設(shè)計(jì)（User-Centered Design，簡稱UCD）概括了用戶體驗(yàn)設(shè)計(jì)的典型流程和方法學(xué)。以用戶為中心的設(shè)計(jì)思想非常簡單：在設(shè)計(jì)開發(fā)產(chǎn)品的每一個(gè)步驟中，都要把用戶列入考慮范圍。從前期的用戶研究需求挖掘，到后期的用戶測試設(shè)計(jì)驗(yàn)證，都要圍繞目標(biāo)用戶群來進(jìn)行。
在UCD設(shè)計(jì)流程的每個(gè)階段，都有多種不同的方法來幫助我們達(dá)到目的。
用研分析：
· 單獨(dú)訪談（Individual Interviews）：一對一的用戶討論，讓你了解某個(gè)用戶是如何工作，使你知道用戶的感受，想要什么和他的經(jīng)歷。
· 焦點(diǎn)小組（Focus Groups）：組織一組的用戶進(jìn)行討論，讓你更了解用戶的理解、想法、態(tài)度和想要什么。
· 關(guān)鍵利益人訪談（Stakeholders Interview）
· 情境訪談（Contextual Inquiry or Field Study）：走進(jìn)用戶的現(xiàn)實(shí)環(huán)境，讓你了解你的用戶的工作方式，生活環(huán)境等等情況。
· 日記研究（Diary Study）：日記研究可以讓用戶記錄自己的進(jìn)程，研究者以非打擾的視角探查用戶的體驗(yàn)。
· 問卷調(diào)研（Questionnaire Study）：利用網(wǎng)上或紙張的問題list對用戶進(jìn)行發(fā)放填寫，從而收集用戶對產(chǎn)品的需求建議。
· 任務(wù)分析（Task Analysis）：通過任務(wù)分析了解用戶使用產(chǎn)品時(shí)的目標(biāo)和操作方式，習(xí)慣（GOMS模型）。
· 用例分析（Use Case Analysis）
· 卡片分類（Card Sorting）、樹形圖測試（Tree Testing）：觀察用戶是如何理解內(nèi)容和組織信息，用來幫助你的產(chǎn)品更合理地組織信息。· 競品分析（Competitive Analysis）、標(biāo)桿分析法（Benchmarking）· 桌面研究（Desktop Research）、市場研究（Market Research）· 用戶角色模型（Personas）：構(gòu)建一個(gè)虛構(gòu)的人來代表特定目標(biāo)用戶群組，設(shè)計(jì)團(tuán)隊(duì)圍繞這個(gè)虛擬人物設(shè)計(jì)開發(fā)產(chǎn)品。
· 用戶體驗(yàn)旅程圖（User/Customer Journey Mapping or Experience Mapping）：從用戶角度出發(fā)，以敘述故事的方式描述用戶使用產(chǎn)品或接受服務(wù)的體驗(yàn)情況，以可視化圖形的方式展示，從中發(fā)現(xiàn)用戶在整個(gè)使用過程中的痛點(diǎn)和滿意點(diǎn)，最后提煉出產(chǎn)品或服務(wù)中的優(yōu)化點(diǎn)、設(shè)計(jì)的機(jī)會點(diǎn)。
· 態(tài)度研究（Attitudinal Research）和行為研究（Behavioural Research）
· 定性研究（Qualitative Research）和定量研究（Quantitative Research）
設(shè)計(jì)階段：
· 腦力風(fēng)暴（Brainstorming Ideation）
· 概念草圖（Concept Sketching）
· 思維導(dǎo)圖（Mind Mapping）· 交互流程（User Interaction Flow）
· 信息架構(gòu)（Information Architecture）：對功能內(nèi)容進(jìn)行高度概括的統(tǒng)籌規(guī)劃、設(shè)計(jì)安排。
· 情景與故事版設(shè)計(jì)（Scenario & Storyboard Design）：情景是指特定用戶如何使用產(chǎn)品完成特定目標(biāo)的簡短故事。故事板是連續(xù)的一系列草圖，用視覺的方式表現(xiàn)用戶如何使用產(chǎn)品，形式上類似漫畫分鏡。
· 線框圖（Wireframing）
· 低保真原型與高保真原型（Lo-fi & Hi-fi Prototyping）
· 紙質(zhì)原型（Paper Prototype）
· 視頻原型（Video Prototype）：通過視頻來演示用戶如何與產(chǎn)品系統(tǒng)進(jìn)行交互。
· 綠野仙蹤原型（Wizard of oz Prototype）：使用角色扮演來模擬用戶如何與產(chǎn)品系統(tǒng)進(jìn)行交互。
· 可交互原型（Interactive Prototype）
· 視覺設(shè)計(jì)（Visual Design）
· 設(shè)計(jì)模式（Design Patterns）、設(shè)計(jì)語言（Design Language）、設(shè)計(jì)規(guī)范（Design Guidelines）與設(shè)計(jì)體系（Design System）
· 標(biāo)注文檔（Design Spec）
· 動效設(shè)計(jì)（Animation Design）
· 參與式設(shè)計(jì)（Participatory Design）：將終端使用者或利益相關(guān)者帶入設(shè)計(jì)流程中。
· 共情/移情/同理心設(shè)計(jì)（Empathic Design）：將設(shè)計(jì)師帶入使用者情境中進(jìn)行觀察設(shè)計(jì)。
· 平行設(shè)計(jì)（Parallel Design）：對同一個(gè)產(chǎn)品進(jìn)行分開的設(shè)計(jì)，從而比較選擇一個(gè)最佳方案。
評估驗(yàn)證：
· 啟發(fā)式評估（Heuristic Evaluation）：由一組行內(nèi)專家依據(jù)尼爾森十大原則對產(chǎn)品進(jìn)行可用性檢查。
· 專家評審（Expert Inspection）
· 可用性測試（Usability Testing）：邀請用戶來試用你的產(chǎn)品，有任務(wù)性的完成測試，從而達(dá)到評估的目的。分為Moderated和Unmoderated，In-person或Remote。
· 組內(nèi)測試（Within-Subject Testing）與組間測試（Between-Subject Testing）
· 游擊式調(diào)研（Guerrilla Research）：便宜、快速地得到大致的用戶反饋。
· 問卷調(diào)查（Surveys）：利用網(wǎng)上或紙張的問題list對用戶進(jìn)行發(fā)放填寫，從而收集用戶對產(chǎn)品的反饋意見。
· CSAT（Customer Satisfaction Score）與NPS（Net Promoter Score）
· 眼動追蹤（Eye Tracking）和熱力圖（Heat Map）
· 點(diǎn)擊流分析（Clickstream Analysis）
· 產(chǎn)品漏斗（Product Funnel）和使用情況分析（Usage Analytics）
· 統(tǒng)計(jì)學(xué)分析（Statistical Analysis）
· A/B測試：在同一時(shí)間維度，分別讓相似的目標(biāo)人群隨機(jī)的訪問產(chǎn)品的不同版本，收集各群組的用戶體驗(yàn)數(shù)據(jù)和業(yè)務(wù)數(shù)據(jù)，最后分析、評估出最好版本，正式采用。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加藍(lán)小助，微信號:ben_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
看完本篇文章，你會學(xué)到以下內(nèi)容：
1、什么是詳情頁
2、詳情頁設(shè)計(jì)原則
3、詳情頁的構(gòu)成
4、詳情頁設(shè)計(jì)要點(diǎn)拆解
一、什么是詳情頁？
詳情頁向用戶展示一個(gè)對象的完整信息，主要用于信息瀏覽，允許對該對象發(fā)起編輯等操作。如電商的訂單詳情，OA的審批詳情等等。
二、詳情頁設(shè)計(jì)原則？
1、直接了當(dāng)
信息盡量平鋪展示，如沒有必要不要做隱藏折疊。
2、層次分明
按照接近原則，對信息分層分組展示，降低單個(gè)頁面內(nèi)信息復(fù)雜度。
3、化繁為簡
減少復(fù)雜結(jié)構(gòu)的使用，盡量使用相似的結(jié)構(gòu)和模塊，降低結(jié)構(gòu)差異對用戶進(jìn)行干擾，讓用戶聚焦信息本身。
三、詳情頁構(gòu)成
詳情頁由標(biāo)題、標(biāo)簽頁、圖片、文字詳情、按鈕、可視化、列表、表格、篩選、數(shù)據(jù)統(tǒng)計(jì)、進(jìn)度軸、標(biāo)簽構(gòu)成
詳情頁的特點(diǎn)：1、內(nèi)容雜，什么元素/模塊都可能出現(xiàn)。2、布局多，布局沒有套路，核心是做好內(nèi)容分塊和視覺引導(dǎo)。3、差異大，頁面與頁面巨大差異
四、詳情頁設(shè)計(jì)要點(diǎn)拆解
1.容器
由內(nèi)容由少到多劃分為原位展開、氣泡卡片、彈窗、抽屜、頁面。能優(yōu)先滿足內(nèi)容收納的同時(shí)，容易盡可能輕量。
2.布局
根據(jù)內(nèi)容從簡單到復(fù)雜可分為基礎(chǔ)樣式、標(biāo)題分組、色塊/分割線/卡片分組、錨點(diǎn)定位/標(biāo)簽頁、自由布局。核心是做好內(nèi)容分區(qū)、視覺引導(dǎo)符合用戶操作習(xí)慣。
布局注意事項(xiàng)：把用戶最關(guān)心的內(nèi)容放在最顯眼的地方
3.交互操作
交互操作可分為編輯（原位/氣泡/彈窗/頁面），查看詳情（內(nèi)容不多的話可以少用頁面容器，減少套娃），業(yè)務(wù)操作（層級清晰，符合用戶操作習(xí)慣）。
企業(yè)級B端產(chǎn)品具有行業(yè)壁壘高、業(yè)務(wù)復(fù)雜、服務(wù)角色多等特點(diǎn)，在大型迭代項(xiàng)目中，如何做好設(shè)計(jì)協(xié)同，把握設(shè)計(jì)一致性和還原度常常讓很多設(shè)計(jì)團(tuán)隊(duì)感覺無從下手，找不到切入點(diǎn)。在長期的項(xiàng)目實(shí)踐中我們發(fā)現(xiàn)，做好設(shè)計(jì)規(guī)范能規(guī)范可以幫助個(gè)人、團(tuán)隊(duì)以及整個(gè)企業(yè)提高效率和產(chǎn)出質(zhì)量，保障用戶體驗(yàn)統(tǒng)一。
那么，我們該如何做好體驗(yàn)標(biāo)準(zhǔn)化，保障基礎(chǔ)體驗(yàn)一致性？下面將和大家分享我們公司在構(gòu)建設(shè)計(jì)規(guī)范的實(shí)踐案例。
以我們設(shè)計(jì)團(tuán)隊(duì)為例，隨著業(yè)務(wù)不斷擴(kuò)大，定制化需求不斷增加，大型迭代項(xiàng)目做不好設(shè)計(jì)和開發(fā)協(xié)同，導(dǎo)致出現(xiàn)“體驗(yàn)一致性差”“設(shè)計(jì)效率低”“還原度不可控”等問題。如何有效解決這些問題呢？可以通過構(gòu)建設(shè)計(jì)規(guī)范，以保證一致性，實(shí)現(xiàn)工作提效。
從不同角度出發(fā)，構(gòu)建設(shè)計(jì)規(guī)范都能發(fā)揮積極的作用。
對企業(yè)來說：有利于實(shí)現(xiàn)產(chǎn)品經(jīng)理、設(shè)計(jì)和研發(fā)的輸出一致。設(shè)計(jì)側(cè)主動建立產(chǎn)品設(shè)計(jì)規(guī)范，很大程度上是為了做好設(shè)計(jì)管控，實(shí)現(xiàn)原型、設(shè)計(jì)稿到線上頁面統(tǒng)一的設(shè)計(jì)語言，從根本上提升設(shè)計(jì)質(zhì)量和還原度，提高用戶滿意度。
對個(gè)人來說：當(dāng)多個(gè)設(shè)計(jì)師共同協(xié)作同一項(xiàng)目時(shí)，由于設(shè)計(jì)理解不一致等原因，容易出現(xiàn)設(shè)計(jì)控件使用混亂等問題。若有詳細(xì)的設(shè)計(jì)規(guī)范作為引導(dǎo)，有利于實(shí)現(xiàn)產(chǎn)品各個(gè)模塊間的一致性。組件化的工具也能減少機(jī)械重復(fù)性的工作，讓設(shè)計(jì)師將更多精力投入到用戶研究和提升用戶體驗(yàn)上。
產(chǎn)品有不同發(fā)展階段，設(shè)計(jì)規(guī)范同樣也有，不同階段下的產(chǎn)品目標(biāo)和規(guī)范需要覆蓋的內(nèi)容都不盡相同。我們要既要避免做多，保證投入產(chǎn)出比最大化；同時(shí)也要構(gòu)建一個(gè)合理的規(guī)范迭代思路。
該階段的產(chǎn)品核心目標(biāo)是「驗(yàn)證產(chǎn)品或商業(yè)模型」，業(yè)務(wù)需求都是小步快跑、頻繁迭代。產(chǎn)品處于從0到1的野蠻生長狀態(tài)，存在著“先滿足功能，再優(yōu)化體驗(yàn)”的情況，導(dǎo)致該階段的產(chǎn)品體驗(yàn)往往不太過關(guān)。
搭建目的：通過定義原則，梳理關(guān)鍵頁面和流程，搭建基本的規(guī)范框架。既讓團(tuán)隊(duì)對產(chǎn)品有統(tǒng)一的設(shè)計(jì)價(jià)值觀和認(rèn)知判斷；從頁面到流程，又能對應(yīng)設(shè)計(jì)參照標(biāo)準(zhǔn)；同時(shí)業(yè)務(wù)可以在規(guī)定的框架下發(fā)展，不僅讓產(chǎn)品體驗(yàn)的根基牢固，而且不會限制功能設(shè)計(jì)自由。
搭建范圍：「全局說明」「頁面布局」「通用流程」
該階段的產(chǎn)品基本形態(tài)已穩(wěn)定，也形成了初步的模型結(jié)構(gòu)。后續(xù)迭代是在現(xiàn)有結(jié)構(gòu)的基礎(chǔ)上，進(jìn)行增加或優(yōu)化功能。雖然探索期定義了產(chǎn)品原則、布局和流程，但探索期產(chǎn)品的自由生長，會導(dǎo)致不少設(shè)計(jì)細(xì)節(jié)不一致，從而影響了產(chǎn)品整體的體驗(yàn)和效率。
搭建目的：通過回溯整理過往設(shè)計(jì)，沉淀優(yōu)化成完整的交互規(guī)范。再根據(jù)規(guī)范統(tǒng)一產(chǎn)品體驗(yàn)，進(jìn)一步優(yōu)化流程和效率， 讓整個(gè)產(chǎn)品體驗(yàn)達(dá)到相對穩(wěn)定的狀態(tài)。
搭建范圍：「全局說明」「頁面布局」「通用流程」「基礎(chǔ)組件」「業(yè)務(wù)組件」
好的設(shè)計(jì)規(guī)范有很多優(yōu)秀的例子，例如Google、Apple、Microsoft這些引領(lǐng)全球設(shè)計(jì)風(fēng)尚的公司，設(shè)計(jì)規(guī)范已經(jīng)上升為設(shè)計(jì)語言，指導(dǎo)旗下所有產(chǎn)品的設(shè)計(jì)。國內(nèi)做的優(yōu)秀的案例，比如Ant Design，Element，arco.design等，像這類的產(chǎn)品已經(jīng)實(shí)現(xiàn)了端到端的體驗(yàn)一致，把交互、前端和視覺的事情一并解決了，是值得學(xué)習(xí)的典范。這些優(yōu)秀的設(shè)計(jì)規(guī)范都包含以下幾個(gè)特點(diǎn)：靈活性，可擴(kuò)展性，系統(tǒng)性和標(biāo)準(zhǔn)性。
一般團(tuán)隊(duì)內(nèi)部構(gòu)建的設(shè)計(jì)規(guī)范都源于某一產(chǎn)品或者業(yè)務(wù)，因?yàn)橹饕菆F(tuán)隊(duì)內(nèi)部成員使用，追求的是投入產(chǎn)出比最大化。所以可在行業(yè)通用設(shè)計(jì)規(guī)范的基礎(chǔ)上，適度參考行業(yè)設(shè)計(jì)規(guī)范，能復(fù)用的直接參考，同時(shí)專注于業(yè)務(wù)本身，具有業(yè)務(wù)特性的再集合業(yè)務(wù)綜合考慮，使整個(gè)規(guī)范制定效率更高，科學(xué)性、指導(dǎo)性更強(qiáng)。
設(shè)計(jì)規(guī)范的執(zhí)行和推動主要分為四大步驟：
類型梳理：分析業(yè)務(wù)場景，整理和歸類組件，評估具體組件優(yōu)先級和迭代計(jì)劃；
全局說明：統(tǒng)一布局，色板，字體，常用樣式，規(guī)范設(shè)計(jì)語言；
抽象設(shè)計(jì)：將設(shè)計(jì)共性抽象出來，構(gòu)建組件通用方案；
效果驗(yàn)證：通過定性/定量數(shù)據(jù)追蹤效果，分析原因，迭代改進(jìn)；
收集現(xiàn)有設(shè)計(jì)頁面，分析業(yè)務(wù)場景，再參考行業(yè)通用規(guī)范的定義，整理和歸類組件，可以先羅列完整，再根據(jù)產(chǎn)品實(shí)際業(yè)務(wù)需要進(jìn)行增刪改。
全局說明：明確影響整站各個(gè)模塊、各個(gè)頁面設(shè)計(jì)的原則和規(guī)范，指導(dǎo)我們后續(xù)各種規(guī)范的定義和設(shè)計(jì)。包括統(tǒng)一布局，色板，字體，樣式等設(shè)計(jì)規(guī)則。
基礎(chǔ)組件：可參考行業(yè)通用規(guī)范中的基礎(chǔ)組件分類和組成，因?yàn)榇蟛糠只A(chǔ)組件都具有一定的通用性，站在巨人的肩膀上更高效。這里我們根據(jù)實(shí)際情況，將基礎(chǔ)組件分為導(dǎo)航，通用，數(shù)據(jù)展示，數(shù)據(jù)錄入，反饋5個(gè)大模塊，每個(gè)模塊下再細(xì)分各小類，構(gòu)成基礎(chǔ)組件的類目。
業(yè)務(wù)組件：根據(jù)業(yè)務(wù)需求，可以定義屬于自己的業(yè)務(wù)組件，這也是區(qū)別于其他通用行業(yè)組件庫的一個(gè)核心部分。
因?yàn)樵诖篌w量產(chǎn)品設(shè)計(jì)中，每個(gè)模塊都由不同的同學(xué)負(fù)責(zé)，這樣全局產(chǎn)品的把握就會降低，需要去補(bǔ)充全局規(guī)范說明去維持產(chǎn)品全局通用部分的一致性。包括布局，色彩規(guī)范，字體，樣式等；
抽象設(shè)計(jì)是設(shè)計(jì)規(guī)范中最核心，工作量最大，難度最高的一個(gè)環(huán)節(jié)。我們可以將它拆解成幾個(gè)部分，先做出基礎(chǔ)組件，再基于基礎(chǔ)組件和業(yè)務(wù)需求抽象設(shè)計(jì)業(yè)務(wù)組件，最后抽象成頁面模板。
基礎(chǔ)組件
組件庫的搭建，就一定要提到原子思維。道爾頓原子論認(rèn)為，物質(zhì)世界的最小單位是原子，原子是單一的，獨(dú)立的，不可被分割的，在化學(xué)變化中保持著穩(wěn)定的狀態(tài)。這個(gè)原子理論同樣適用于設(shè)計(jì)系統(tǒng)中。
其中，最小單位設(shè)計(jì)元素就是基礎(chǔ)組件。我們在做設(shè)計(jì)系統(tǒng)的時(shí)候希望當(dāng)你改動任何一個(gè)原子，你有自信其他所有依賴于這個(gè)原子的部件全部自動更新。只有滿足了這一點(diǎn)，設(shè)計(jì)系統(tǒng)設(shè)想中的效率、解放生產(chǎn)力才會真正實(shí)現(xiàn)。例如，在sketch中，分享樣式和嵌套符號的使用。
業(yè)務(wù)組件
在構(gòu)建完基礎(chǔ)組件后，可以根據(jù)業(yè)務(wù)需求，將使用頻率較高的組件進(jìn)行評估，抽象成業(yè)務(wù)組件。
一般業(yè)務(wù)組件可分成兩大類：
一類是由多個(gè)基礎(chǔ)組件組成的帶有業(yè)務(wù)需求復(fù)合組件，如：復(fù)合標(biāo)簽，快捷時(shí)間選擇器等；
另一類是針對特定業(yè)務(wù)場景的業(yè)務(wù)組件：如地圖，站點(diǎn)等；
頁面模版
在完成基礎(chǔ)組件和業(yè)務(wù)組件的構(gòu)建后，我們可以根據(jù)全局說明，利用組件搭建頁面模板。頁面模版不僅能有效的提升組件的使用效率，也能提供很好的組件使用示范效應(yīng)，加強(qiáng)設(shè)計(jì)說明和組件之間的結(jié)合。
組件質(zhì)量評估：從物理到行為層，包括樣式、組件、框架、組件交互 共4個(gè)維度。通過一致性評分衡量標(biāo)準(zhǔn)化覆蓋的好壞。
系統(tǒng)應(yīng)用層面的評價(jià)：
系統(tǒng)是否幫助業(yè)務(wù)提效；
當(dāng)業(yè)務(wù)不能直接應(yīng)用系統(tǒng)，能否靈活改動；
系統(tǒng)是否幫助業(yè)務(wù)變得更有競爭力、更創(chuàng)新；
迭代機(jī)制
當(dāng)我們完成設(shè)計(jì)規(guī)范的整體構(gòu)建后，對于新需求，通過評估復(fù)用性、通用性和優(yōu)先級，低級別的走定制設(shè)計(jì)完成交付。高級別的通過抽象設(shè)計(jì)、內(nèi)審、沉淀到組件庫中。
機(jī)制提效
在完成設(shè)計(jì)規(guī)范的構(gòu)建后，我們可以聯(lián)合產(chǎn)品經(jīng)理和前端工程師，幫助每個(gè)環(huán)節(jié)的人員快速搭建產(chǎn)出物，推動上下游機(jī)制提效。
例如，我們會基于設(shè)計(jì)規(guī)范，為產(chǎn)品經(jīng)理提供符合設(shè)計(jì)規(guī)范的Axure元件庫，產(chǎn)品經(jīng)理使用元件庫，可以快速搭建原型，產(chǎn)出prd，與設(shè)計(jì)師、開發(fā)的溝通也更加順暢。簡單的修改可以跳過設(shè)計(jì)師出圖這一步驟，直接和開發(fā)溝通，極大加快前期的節(jié)奏。甚至通過借助元件庫，產(chǎn)品經(jīng)理可以搭建出高保真原型，用于直接和用戶確認(rèn)或者給客戶進(jìn)行demo的演示。
基于設(shè)計(jì)規(guī)范，推動研發(fā)實(shí)現(xiàn)組件代碼化，通過設(shè)計(jì)標(biāo)準(zhǔn)化可以達(dá)到研發(fā)工業(yè)化。通過定義標(biāo)準(zhǔn)規(guī)范，提高流程、組件的復(fù)用率，開發(fā)側(cè)就可以制定相應(yīng)組件，形成前端腳手架，方便后期迭代的組件化使用，有效地避免不必要的分歧點(diǎn)和重復(fù)造輪子，同時(shí)減少上線前設(shè)計(jì)走查、測試的工作量，保證落地效果，提升生產(chǎn)力。
以上就是我們在構(gòu)建自己的企業(yè)設(shè)計(jì)規(guī)范的流程，最后，給大家展示一下，我們目前的企業(yè)設(shè)計(jì)規(guī)范和部分應(yīng)用情況。
今天帶來的是《交互設(shè)計(jì)沉思錄》第一部分的第二章「管理復(fù)雜性」。
主要講述的是交互設(shè)計(jì)師是如何理解&組織所獲取到的數(shù)字、文字?jǐn)?shù)據(jù)。
通過這些步驟&方法能夠幫助交互設(shè)計(jì)師更加清楚信息間的關(guān)系，建立很強(qiáng)的心智圖景。
其間也穿插了很多職能相關(guān)部分的對比，如「交互設(shè)計(jì)師與信息架構(gòu)師」「交互設(shè)計(jì)師與界面設(shè)計(jì)師」「交互設(shè)計(jì)師與電子工程師」。
作者：Viola_1241 來源：站酷網(wǎng)
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請加微信ban_lanlan，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
今天帶來的是《交互設(shè)計(jì)沉思錄》第一部分的第二章「管理復(fù)雜性」。
主要講述的是交互設(shè)計(jì)師是如何理解&組織所獲取到的數(shù)字、文字?jǐn)?shù)據(jù)。
通過這些步驟&方法能夠幫助交互設(shè)計(jì)師更加清楚信息間的關(guān)系，建立很強(qiáng)的心智圖景。
其間也穿插了很多職能相關(guān)部分的對比，如「交互設(shè)計(jì)師與信息架構(gòu)師」「交互設(shè)計(jì)師與界面設(shè)計(jì)師」「交互設(shè)計(jì)師與電子工程師」。
藍(lán)藍(lán)設(shè)計(jì)( www.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.73404.com.cn