《UI設(shè)計》課件-圖標(biāo)設(shè)計_第1頁
《UI設(shè)計》課件-圖標(biāo)設(shè)計_第2頁
《UI設(shè)計》課件-圖標(biāo)設(shè)計_第3頁
《UI設(shè)計》課件-圖標(biāo)設(shè)計_第4頁
《UI設(shè)計》課件-圖標(biāo)設(shè)計_第5頁
已閱讀5頁,還剩60頁未讀, 繼續(xù)免費閱讀

付費下載

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

`USERINTERFACE

DESIGN

`UI視覺設(shè)計USERINTERFACEDESIGNOVERVIEW2020回顧圖形的調(diào)整圖形的不同角度、尺寸和比例,都會影響圖標(biāo)最后呈現(xiàn)的效果,需要我們在制作過程中保持對圖形優(yōu)化的態(tài)度,通過持續(xù)調(diào)整和對比找到最合適的結(jié)果。USERINTERFACEDESIGNOVERVIEW2020多種操作方式實現(xiàn)同一種效果,可以有非常多的操作方法,殊途同歸。雖然軟件只是實現(xiàn)設(shè)計的工具,但對工具的理解越全面越好,很多時候我們都可以嘗試使用不同的方法來實現(xiàn)相同的效果,而不用太拘泥于一種固定的形式。USERINTERFACEDESIGNOVERVIEW2020圖形元素圖形元素是將出現(xiàn)在空間基中的視覺元素。在傳輸數(shù)據(jù)時,為了清晰起見,應(yīng)選擇圖形元素。視覺元素有以下四種:點(Points)線(Lines)面(Surfaces)體(Volumes)USERINTERFACEDESIGNOVERVIEW2020功能圖標(biāo)線性圖標(biāo)的特征目前市面上的線性圖標(biāo)以2px、3px最為主流。因為圖標(biāo)線條的寬度越大,可展示的細(xì)節(jié)就越少,但是圖標(biāo)的表現(xiàn)力越強(qiáng)。線性常為”默認(rèn)“面性常為”選中“USERINTERFACEDESIGNOVERVIEW2020USERINTERFACEDESIGNOVERVIEW2020了解設(shè)計準(zhǔn)則USERINTERFACEDESIGNOVERVIEW2020/第二章/理解視覺感知USERINTERFACEDESIGNOVERVIEW202001設(shè)計準(zhǔn)則的來源

什么在影響我們的感知?影響1影響2影響3交付的設(shè)計所有設(shè)計準(zhǔn)則都基于人類心理學(xué):人們?nèi)绾胃兄W(xué)習(xí)、推理、記憶,以及把意圖轉(zhuǎn)換為行動我們感知很大程度是我們期望感知到的,而有三個因素會影響我們的預(yù)期,也影響我們的感知了解什么在影響我們的感知,先請看以下的圖上述圖,是什么?你看到的取決于告訴你看什么當(dāng)感知系統(tǒng)預(yù)先準(zhǔn)備看的是建筑物的形狀時,你就看到了建筑物的形狀,幾乎察覺不到建筑物之間的白色區(qū)域。當(dāng)感知系統(tǒng)預(yù)先準(zhǔn)備看文字時,你就看到了文字,幾乎注意不到字母間的黑色區(qū)域。R.CJames繪據(jù)說從兒童的視角來看,看到了8條海豚你們看到了什么?

經(jīng)驗

影響感知我們對某一事物的先前經(jīng)驗會”引導(dǎo)”我們對它的感知覺。這種傾向性會使得我們"先入為主"我們通過社會經(jīng)驗來理解和延伸自己的體驗表情類肢體語言類請問是哪個字母H還是字母A?R.CJames繪R.CJames繪當(dāng)聽到我告訴你們這是一條斑點狗,在林蔭下到處嗅嗅,此時你再看還能回到第一次看到這個畫面時候的潑墨散點的感覺嗎

環(huán)境

影響感知外部環(huán)境影響感知。如上下文語義,色彩、動效對視覺感知的影響就非常明顯。感官之間的感知互相影響。比如說,我們聽到的能影響我們看到的,反之亦然。解密視錯覺|馬赫帶和亮度對比錯覺/p/25720633?group_id=827796943773237248各種反饋方式,讓用戶了解目前的環(huán)境工具箱:這里有剪刀嗎?工具箱有螺絲刀嗎?心理學(xué)史上最知名的一個實驗“看不見的大猩猩”,這個實驗告訴我們,看到不等于看見。在“看不見的大猩猩”實驗中,有50%的人看不到人群中的大猩猩,根據(jù)實驗結(jié)果表示,那些沒有看到大猩猩的人,實際上目光停留在大猩猩身上一秒以上。這在心理學(xué)中叫“無意視盲”,目標(biāo)

影響感知我們的目標(biāo)會過濾我們的感知:與目標(biāo)無關(guān)的東西會被提前過濾掉,而不會進(jìn)入到意識層面(注意過濾模型)。目標(biāo)使我們的感知系統(tǒng)對某些特性敏感:當(dāng)我們自尋找某件物品時,大腦能預(yù)先啟動我們的感知,使得它們對要尋找的東西變得非常敏感。所有設(shè)計準(zhǔn)則都基于人類心理學(xué):人們?nèi)绾胃兄W(xué)習(xí)、推理、記憶,以及把意圖轉(zhuǎn)換為行動用戶界面(UI)面向的對象就是人類經(jīng)驗環(huán)境目標(biāo)過去的我們的經(jīng)驗,先入為主上下文語義聲音/動效目標(biāo)使我們的感知系統(tǒng)對某些特性敏感設(shè)計準(zhǔn)則的來源

什么在影響我們的感知?符號02在設(shè)計學(xué)的領(lǐng)域,“非語文訊息”指的是圖形與影像。簡稱為“圖像”。在人機(jī)互動(HCI)的領(lǐng)域中,圖標(biāo)在互動界面上扮演者重要的角色。圖標(biāo)本身屬于一種圖像化符號。具有傳達(dá)語義的意義。界面設(shè)計,處理“

訊息”圖標(biāo)設(shè)計是界面設(shè)計實現(xiàn)視覺化階段的重要體現(xiàn)圖標(biāo)的符合解碼需要用戶和設(shè)計師對圖標(biāo)有共同的理解,才能完成信息的傳達(dá)用戶設(shè)計師訊息經(jīng)驗和認(rèn)知共同Instagramicon流變圖形界面中圖標(biāo)在方寸像素之間來說明它所包含的復(fù)雜對象。因此需要適當(dāng)去除圖形的雜音信息。保留圖標(biāo)中讓用戶關(guān)注應(yīng)該被關(guān)注之處,而不是信息量越大越好。圖形圖標(biāo)符號學(xué)的理論可識別可記憶喚起共同經(jīng)驗認(rèn)知“分享”的圖標(biāo)設(shè)計Android

IOS比喻,由“本體”,“喻體”,”喻詞“構(gòu)成暗喻,屬于比喻的一種,通過暗示方式表明類比意思Metaphor隱喻——圖標(biāo)常用方法1993面世的Windows3.11的界面圖標(biāo)(上)1996年發(fā)布的OS/2Warp4中,3D的圖標(biāo)(軸側(cè)圖設(shè)計,于最后附錄),只有16色(下)2000年的BeOSR5,幾乎是劃時代的多媒體操作系統(tǒng),雖然最后還是慘敗在設(shè)計學(xué)的領(lǐng)域,圖形符號分類:具象的符號:具體形象的,如一個清晰的人、樹、車等抽象的符號:沒有具體形象的繪畫,抽出事物共同的形象,能讓人辨識其概念或意義的強(qiáng)制的符號:什么都不像的符號,人類賦予它意義。如“三角形”賦予“尖端”的意義,從“尖端”可以聯(lián)想“科技”,從“科技”可以聯(lián)想“現(xiàn)代感”。把這種什么都不像的符號賦予一個意義的動作是一個“強(qiáng)制”行為,在符號學(xué)中,便是“隱喻(metonym)”。比喻手法,不直接點明是比喻,用一個詞或短語指出常見的一種物體或概念以代替另一種物體或概念,從而暗示它們之間的相似之處。索緒爾符號學(xué)圖來自精思巧形《從符號學(xué)角度解讀標(biāo)志設(shè)計》注:“指示義”和“內(nèi)涵義”是符號學(xué)里的說法*指示義的符號來源主要是:形狀特征、圖形特征*內(nèi)涵義的符號來源主要是:功能特征圖標(biāo)設(shè)計的流程/適用于一切風(fēng)格圖標(biāo)/需求:做一個關(guān)于鐘的啟動圖標(biāo),該如何開始呢?1、從實際出發(fā)抽取本質(zhì)、化繁為簡步驟:找一張合適的參考圖片根據(jù)項目需求進(jìn)行合理的刪減,不合適或不符合的功能的可以進(jìn)行刪除照現(xiàn)實抄就好了木、皮紋、紙、金屬左攝影圖右設(shè)計圖圖標(biāo)設(shè)計的流程/適用于一切風(fēng)格圖標(biāo)/2、從現(xiàn)有圖形系統(tǒng)出發(fā)被人們熟知被人們認(rèn)同避免引起歧義手機(jī)應(yīng)用的“首頁”圖標(biāo)設(shè)計,請對比QQ、微信、新浪微博圖標(biāo)設(shè)計的流程/適用于一切風(fēng)格圖標(biāo)/3

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論