資源描述：
《UI界面設(shè)計指南ppt課件.ppt》由會員上傳分享，免費在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫。
1、①個亡哋迣鎅佷蔂“_愛到勖后涭ㄋ傷）ㄣ傻ふ篪洧嬡①2⒊開幕拱手讓愛ゝゝ從此隱身wǒ、和孤獨重歸于好。天會黑、人會變。~卟璃丶卟柒└堅持↘丅呿偽妝┐ゝ◆甩甩頭，吥洅笏你的噯失戀德、標(biāo)簽聆聽細(xì)唱。莪旳苡蒍-Ｉ顆Xin→呮ゐ你Ｈ等你 愛：－Ｏ愛過人傷過心蕞后、吶①茨灬果凍{洞}、嗒咘溜Ю那遺矢de圊舂
2、ゞ硪シ卟哭°\（￣oo,￣）/潴潴愛你壹萬年噯の→淚花↘╳×鬼啲氣質(zhì)七個小夢想花淚無痕╰╮離不開℃你燦爛的笑容?！饱叨葌涡淚無痕灬№*嘀嘀︿芣咻°ペ淚ペ╃靈魂╰付出真芯丶未必能嘚到噯哥、兜里有煙容顏再美，終是夢そ乀*.淚崖ㄣ嬡╰つ冬日戀塵寶寶⊙親個``灬嘲諷給段
3、落ソ劃下句點。`惗。Study溡光，缺點讓愛下地獄燈火不見闌珊﹋你是我無法觸及的傷痛↓煙熏妝‘遮不住殤﹌半夢半醒之間&怪屾旳梛籩……昰愛散落在巴黎鐵塔下の櫻花〃也許、還噯你√譕淚らづ寳唄愛ぷ讉莣ズ∨、￣劇蔠。咱捫、冭傻小℡绱ジ@E可么℃噯綪就是灬傷痛ヅ夢里婲〆徦情徦噫徦薀柔親你℃紅唇·^前期壹熟悉業(yè)務(wù)需求理解風(fēng)格定位用戶消費者？業(yè)務(wù)員？管理者？特性表單多？圖片多？基調(diào)嚴(yán)肅？活潑？商務(wù)？簡約？貳優(yōu)化信息層級簡化交互步驟，使用戶以盡量少的步驟完成任務(wù)。交互借鑒根據(jù)產(chǎn)品特性，參考已有的優(yōu)秀交互方式。用一個樹形結(jié)構(gòu)來理解什么是信息層級：鏈接的層數(shù)被稱為深度（z軸），
4、最底層頁面包含的頁面總數(shù)被稱為鏈接的廣度（x軸）?？v向（y軸）很多情況下都只有一層，放的多都是一些消息提醒和快捷方式。廣度：以淘寶為例，最底層頁面就是他的首頁，包含的頁面綜述非常豐富，可以看到從廣度來講覆蓋面是非常大的。深度：從鞋包配飾，到女鞋，到單鞋，到單鞋的各種類型。區(qū)別叁PCWeb端VS.移動/手機端信息層級結(jié)構(gòu)操作方式交互方式信息層級結(jié)構(gòu)PCWeb端：更注重深廣度的平衡。手機端：由于設(shè)備限制，廣度減弱，信息深度更為明顯。但這將成為過去時，隨著垂直滾動在移動端的推廣，某些APP廣度大大提升，深度相對減弱。PC上我們可以用面包屑路徑或者各種導(dǎo)航清晰的表現(xiàn)
5、出層級結(jié)構(gòu)，讓用戶不在復(fù)雜的層級機構(gòu)中迷路。而在移動設(shè)備上顯示區(qū)域有限，沒有足夠的地方用來放這樣的路徑，更多時候只能用back。減少結(jié)構(gòu)層級、精簡交互步驟的方法（移動端）并列快捷方式顯示關(guān)鍵信息減少點按并列將并列的信息顯示在同一個界面中，減少頁面的跳轉(zhuǎn)。最典型的例子就是Win8，在同一個界面中就能展示出天氣／郵件等應(yīng)用的信息。Nextday：Calendar里面分別為按年，月，周，日的展示方式，點擊下面的時間線，內(nèi)容直接在當(dāng)前頁面切換，沒有轉(zhuǎn)跳?？旖莘绞揭詉os7為例，在任意界面只要向上滑動都能從底部呼出一個快捷菜單。，在任意界面只要向上滑動都能從底部呼出一
6、個快捷菜單，可以設(shè)置wifi和手電筒等。淘寶手機：不管你在哪家店鋪在看什么寶貝，只要點右下角的“淘”就能出現(xiàn)和主頁導(dǎo)航一樣的快捷菜單，不用backback一層一層的回去。顯示關(guān)鍵信息以豆瓣電影的購票流程為例，在“選擇影院”這個界面中除了顯示出影院名稱，還顯示出了“最低價”xx元起，以及余下場次，還有是否可以購票這些關(guān)鍵信息。這使用戶在選擇影院的同時也能看到最低價，不用挨個影院點進(jìn)去看，加快購買效率。減少點按ios7關(guān)閉后臺程序，只需要用手指輕輕往上一滑走就關(guān)閉了。操作方式PCWeb端：靠鼠標(biāo)指點，可進(jìn)行精確、復(fù)雜的操作。手機端：尺寸靠手指觸屏，精確度較差的手
7、勢操作。善用區(qū)域若點擊目標(biāo)尺寸過小，要達(dá)到精確觸控，用戶需要從指心操作變?yōu)橹讣獠僮?。使用指心操作通常會整個覆蓋操作目標(biāo)，讓用戶難以接收視覺反饋，無法知曉操作是否有效。而不得不用指尖進(jìn)行操作時，又出現(xiàn)了一個新問題：這種操作方式非常慢，且吃力。尺寸小，內(nèi)容常擠在一起，用戶容易觸碰附近目標(biāo)，導(dǎo)致誤操作。手指太大，目標(biāo)尺寸太小，一根手指的寬度大概能覆蓋兩個目標(biāo)的寬度。如果不按壓到錯誤的位置，就會導(dǎo)致錯誤的操作。食指容易出錯，常用的拇指就更容易出錯。小的點擊目標(biāo)會導(dǎo)致大問題因此必須將點擊目標(biāo)的尺寸做大一點，利于用戶點擊。究竟需要多“大”才合適呢？——通過UI設(shè)計規(guī)范來
8、制約。Hard區(qū)：常用，但不希望太容易觸到（誤觸會帶來麻煩）的目標(biāo)一般把編輯按鈕放在右上角，即明顯，又能避免因為誤碰而導(dǎo)致界面突然改變。交互方式(例：選擇日期)PCWeb端：鼠標(biāo)指點，可在視覺不適的情況下，操作仍然相對合適。手機端：手指觸屏，當(dāng)視覺不適時，操作基本也不適了。（選項少的情況）（選項多的情況）（確認(rèn)刪除）（勾選）布局排版肆我們的眼睛怎么看，決定了如何規(guī)劃屏幕空間兩種最常見的網(wǎng)頁布局模式F模式：除了頂部展示區(qū)外，其他的內(nèi)容會顯得更平淡。如果增加平淡區(qū)的吸引，可以加入一些大圖標(biāo)、卡片式的內(nèi)容組件等，讓內(nèi)容更有趣。（人眼焦點捕捉）1235671/2-導(dǎo)
9、航3-LOGO4–重要內(nèi)容（產(chǎn)品、辦理）45/6–次
