網站UI設計--設計模式

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