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