提交需求
賽事與廣告咨詢合作,請(qǐng)?zhí)顚懶枨蟊韱危覀儠?huì)在第一時(shí)間與您聯(lián)系!
新手UI設(shè)計(jì)師必須知道的設(shè)計(jì)規(guī)范。
對(duì)于學(xué)習(xí)UI設(shè)計(jì)找不到方法沒有任何經(jīng)驗(yàn)或者想自學(xué),想入門UI設(shè)計(jì),平面轉(zhuǎn)UI,繼續(xù)提升自己的都可以加入我們的UI設(shè)計(jì)學(xué)習(xí)交流群434953627,獲取十年資深UI設(shè)計(jì)資源,群內(nèi)資源共享。
前兩天有讀者問我,應(yīng)該如何區(qū)分初級(jí)交互設(shè)計(jì)師和高級(jí)交互設(shè)計(jì)師?有很多指標(biāo)作為參照,最直觀的問題可以歸結(jié)成有沒有出過交互規(guī)范。交互涉及到邏輯性,心理學(xué),視覺設(shè)計(jì)等多個(gè)領(lǐng)域,具體到項(xiàng)目需要把控細(xì)枝末節(jié),同時(shí)也具備歸納總結(jié)提煉的功力堪稱完美。
每天充斥著各種會(huì)議,需求溝通,整段的時(shí)間都少之又少,再不會(huì)歸納總結(jié)可能覺得每天都在打醬油吧。曾經(jīng)有句經(jīng)典對(duì)白,不會(huì)做視覺規(guī)范的設(shè)計(jì)師只能算是個(gè)美工。設(shè)計(jì)師看到「美工」這兩個(gè)字眼,就像開發(fā)工程師看到「bug」一樣會(huì)瞬間燃起斗志,交互的范疇同理適用。
先有產(chǎn)品,后有規(guī)范?
這就像是先有雞還是先有蛋一樣,眾說紛紜。規(guī)范顧名思義在經(jīng)歷了不同產(chǎn)品模塊,不斷迭代的過程中,對(duì)于產(chǎn)品設(shè)計(jì)者和開發(fā)者來說都需要一個(gè)實(shí)施標(biāo)準(zhǔn)來說服對(duì)方。當(dāng)陷入到拉鋸戰(zhàn),雙方站在天平的兩端都沒有答案的時(shí)候,急需標(biāo)準(zhǔn)化的東西來推進(jìn)產(chǎn)品發(fā)展。
同時(shí)在不斷迭代的歷程中,很多模塊為了保住功能做了一些修改,這些小的修改積累到一定程度就會(huì)對(duì)產(chǎn)品整體的一致性方面提出挑戰(zhàn)。
產(chǎn)品中的需求功能點(diǎn)不斷完善的過程中,涉及到業(yè)務(wù)流程的場景也會(huì)豐富起來,很多的組件適用于不同場景也成為產(chǎn)品中必不可少的一部分。統(tǒng)一的對(duì)這部分已經(jīng)積累下來的真實(shí)組件形成規(guī)范有利于開發(fā)和再利用。
所以先有產(chǎn)品,后有規(guī)范更為合理。
規(guī)范從哪兒開始?
交互規(guī)范分為web端和移動(dòng)端以及其他配合產(chǎn)品使用的設(shè)備端,比如iwatch等。web端規(guī)范需遵循諸如一致性,連續(xù)性,用戶可操控性的交互原則,熟悉windows和Mac的操作方法。相對(duì)于移動(dòng)端以及其他設(shè)備端口需要熟悉平臺(tái)本身的交互設(shè)計(jì)規(guī)范。
iPhone 交互設(shè)計(jì)規(guī)范 material design交互規(guī)范 iwatch 交互設(shè)計(jì)規(guī)范
熟悉了平臺(tái)規(guī)則,來建立產(chǎn)品自己的規(guī)范體系吧。
劃分規(guī)范體系
規(guī)范是產(chǎn)品系統(tǒng)化的產(chǎn)出,從大的方面產(chǎn)品的整體框架層面說起,包括標(biāo)題欄、頂部導(dǎo)航、底部操作欄等,共同部分包括各類信息提示和組件,到產(chǎn)品各個(gè)模塊相關(guān)的業(yè)務(wù)組件等。
整體框架規(guī)范
界面規(guī)范 標(biāo)題欄 頂部導(dǎo)航 底部操作欄 頁面跳轉(zhuǎn)邏輯
提示信息規(guī)范
預(yù)先信息提示 操作類提示 謹(jǐn)慎類信息提示 警示類信息提示 懸浮類信息提示
因?yàn)楫a(chǎn)品類型不同,組件列表在這里就不一一列出了,大家可以嘗試總結(jié)一下。交互規(guī)范對(duì)每種組件進(jìn)行詳細(xì)描述,包含三部分內(nèi)容:
構(gòu)成元素,控件由哪些元素組成(文字,icon,操作按鈕等等)。 使用場景,控件應(yīng)用于哪些場景,什么時(shí)候會(huì)使用到,觸發(fā)條件等。 細(xì)節(jié)說明,描述控件具體內(nèi)容,在不同場景中如何呈現(xiàn),特殊場景描述等。
小結(jié)
規(guī)范是形成體系化的標(biāo)準(zhǔn),制定標(biāo)準(zhǔn)需要遵循4方面原則。
統(tǒng)一性和標(biāo)準(zhǔn)性,導(dǎo)航結(jié)構(gòu)一致、響應(yīng)方式一致、文案表達(dá)方式保持一致、信息提示一致、功能名稱保持一致。 信息清晰,導(dǎo)向明確,主次布局合理、邏輯清晰、導(dǎo)航層次清晰。 反饋及時(shí)有效,用戶操作及時(shí)反饋、準(zhǔn)確、簡單、直白、具有導(dǎo)向性,don’t make me think。 防止錯(cuò)誤,不可修復(fù)操作及時(shí)提示,預(yù)防糾正錯(cuò)誤,錯(cuò)誤頁面可及時(shí)返回,掌控權(quán)留給用戶。
UI設(shè)計(jì)學(xué)習(xí)交流,資源共享群434953627,加群領(lǐng)取資源
密碼登錄
大牛,別默默的看了,快登錄幫我點(diǎn)評(píng)一下吧!:)
登錄 立即注冊(cè)