網(wǎng)站UI設(shè)計(jì)--設(shè)計(jì)模式
日期 : 2021-10-09 19:48:19
模式對于我們的生活是至關(guān)重要的。人類再自然界中使用模式來幫助他們狩獵、種植和逃生。這些模式現(xiàn)在對于我們是不可見而仍然存在。他們傳達(dá)了我們的期望。當(dāng)我們聽到轟隆隆的雷聲時(shí),就會理解暴風(fēng)雨將至。當(dāng)應(yīng)用程序被人稱贊很直觀時(shí),就意味著它遵循了底層模式。模式提供了一種與用戶交流的方式,而不必從頭開始解釋所有的一切。模式給我們提供了預(yù)測的意識和能力,它可以把有意義的設(shè)計(jì)與視覺噪聲隔離開。
在開始設(shè)計(jì)過程時(shí),第一個(gè)推動(dòng)力是提出具有創(chuàng)意和完全原創(chuàng)的思想??蛻粝M阉麄冏约号c競爭對手區(qū)分開,即使他們經(jīng)常推出與競爭對手類似的方案。設(shè)法通過添加更多的特性以及使設(shè)計(jì)更浮華來超越另一件產(chǎn)品最終會取悅于客戶,但是會使用戶受損。我們需要同時(shí)考慮用戶和客戶的目標(biāo),然后盡可能以最佳的方式提出我們的解決方案。我們不應(yīng)該從頭開始,而是以我們受眾的集體精神為基礎(chǔ)。我們可以把大多數(shù)應(yīng)用程序歸類為某些結(jié)構(gòu)。
在開始設(shè)計(jì)過程時(shí),第一個(gè)推動(dòng)力是提出具有創(chuàng)意和完全原創(chuàng)的思想??蛻粝M阉麄冏约号c競爭對手區(qū)分開,即使他們經(jīng)常推出與競爭對手類似的方案。設(shè)法通過添加更多的特性以及使設(shè)計(jì)更浮華來超越另一件產(chǎn)品最終會取悅于客戶,但是會使用戶受損。我們需要同時(shí)考慮用戶和客戶的目標(biāo),然后盡可能以最佳的方式提出我們的解決方案。我們不應(yīng)該從頭開始,而是以我們受眾的集體精神為基礎(chǔ)。我們可以把大多數(shù)應(yīng)用程序歸類為某些結(jié)構(gòu)。
- 創(chuàng)建:當(dāng)人們需要?jiǎng)?chuàng)建新內(nèi)容或者修改現(xiàn)有的內(nèi)容時(shí),要使用正確的結(jié)構(gòu)。例如,寫博客、加插圖、編碼、圖片編輯、圖解
- 過程:當(dāng)人們需要以結(jié)構(gòu)化的方式提供信息時(shí),要使用正確的結(jié)構(gòu)。例如,產(chǎn)品配置、裝配或安裝;注冊表單;報(bào)稅、結(jié)賬‘;預(yù)訂旅程。
- 信息:當(dāng)人們需要瀏覽、比較、理解信息時(shí),要使用正確的結(jié)構(gòu)。例如,地圖、新聞閱讀器、儀表板、媒體播放器、在線商店等。右邊的圖突出顯示了一些常見的模式,當(dāng)前的Web應(yīng)用程序通過它們提供功能。建立這些模式用于現(xiàn)實(shí)信息和提供功能的最佳實(shí)踐。像用戶在自然界和路牌中所熟悉的模式一樣,這些屏幕顯示了用戶今天所熟悉的模式。你的目標(biāo)用戶可能已經(jīng)使用了大量帶有這些模式的應(yīng)用程序。這些屏幕模式定義了在開始設(shè)計(jì)時(shí)可以采用的基本布局和方法。通過理解用戶的主要任務(wù)和他們的總體目標(biāo),可以在設(shè)計(jì)過程中及早選擇正確的結(jié)構(gòu)。這把設(shè)計(jì)限制于普遍認(rèn)可的模式如果你正在設(shè)計(jì)應(yīng)用程序入口,那么偏離已知的入口模式可能使你的工作進(jìn)展受挫。但這并不意味著你沒有機(jī)嘗試新的入口模式,堅(jiān)持使用用戶熟悉的模式很重要,這些限制提供了強(qiáng)大的力量,可以讓我們設(shè)計(jì)師重點(diǎn)關(guān)注設(shè)計(jì),而不會醉心于添加太多的選項(xiàng)。通過選擇一種合適的模式,我們可以集中精力迭代其他的細(xì)節(jié),并且把更多的時(shí)間專門用于創(chuàng)建優(yōu)秀的i體驗(yàn)。
- 使之真實(shí):今天的許多界面都具有超現(xiàn)實(shí)的外觀,并且有時(shí)表現(xiàn)得非常真實(shí)。像APPLE這樣得公司不僅會在它們自己得應(yīng)用程序中推行這種界面,而且會建議設(shè)計(jì)師采用這種方法為像IPAD這樣的設(shè)備設(shè)計(jì)下一代界面。這種附加的物理維度既有優(yōu)點(diǎn),也是缺點(diǎn)。在界面中使用真實(shí)物體的隱喻可以給用戶提供一種輕松的方式來學(xué)習(xí)如何使用應(yīng)用程序。最著名的計(jì)算機(jī)隱喻是桌面,它來源于第一款A(yù)pple Macintosh中的圖形界面(GUI),它自身有基于Xerox于20世紀(jì)70年代中期創(chuàng)建早期界面。文件夾、垃圾箱和紙堆都是用戶熟悉的元素,并且比電腦高手用戶將輸入用于導(dǎo)航的命令快捷鍵更容易理解。用戶將很好地理解如何使用真實(shí)的垃圾箱,因此他們可以合乎邏輯地設(shè)想電腦中垃圾箱的功能。使用來自現(xiàn)實(shí)世界的熟悉紋理和物體也給可能令人厭煩的應(yīng)用程序增添了一些樂趣。例如,帶有一些逼真的縫紉效果的皮革鑲邊將筆記本應(yīng)用程序增加美感,它還有助于宣傳產(chǎn)品。在選擇要購買的應(yīng)用程序時(shí),界面通常只會”打包“用戶所看到的內(nèi)容。在比較多個(gè)筆記本應(yīng)用程序時(shí),最有可能吸引用戶的是看起來最像筆記本,并且具有所有細(xì)微細(xì)節(jié)的應(yīng)用程序。
- 界面設(shè)計(jì)準(zhǔn)則:下面列出了一些設(shè)計(jì)界面的常規(guī)準(zhǔn)則。
- 有目的平衡樣式和功能,不要只為了設(shè)計(jì)而設(shè)計(jì)。
- 把元素進(jìn)行分組,創(chuàng)建一種視覺層次結(jié)構(gòu),并通過堅(jiān)持一種結(jié)構(gòu)在每一層指導(dǎo)流程。
- 保持一致。如果用戶理解一種交互或元素,他們應(yīng)該能夠把這種知識轉(zhuǎn)換成類似的元素(一個(gè)稱為”繼承“的概念)
- 不要使用戶感到不知所措。使多余的事物(比如動(dòng)畫和醒目的懸停效果)保持最少。
- 在交互式元素 與非交互式元素之間應(yīng)該有清晰的區(qū)別(可視的功能可見性)。
- 按鈕應(yīng)該看起來像按鈕,而不應(yīng)該混人界面中。
- 使視覺元素保持高效。從像素中獲得最大的價(jià)值。對像文字大小和顏色這樣的方面進(jìn)行限制;相反,可以使用某些顏色使重要的元素更為突出。
- 照顧辨色困難和視力受損的用戶的需要: 遵循最佳實(shí)踐,比如給鏈接加下劃線以及使用符號(在合適時(shí))。●這里列出的準(zhǔn)則僅僅是準(zhǔn)則,如果另一種方式更有益于用戶,則可忽略