淺析“Rich”設計模式

來源:互聯網
上載者:User

 但凡設計師都對簡潔的設計情有獨鐘,我們不喜歡複雜,卻也不能不會rich。
  先來看下“rich”在字典裡的意思:
   (1) having an abundant supply of desirable qualities or substances;
   (2) of great worth or quality;
   (3) very productive;…
  可見,“rich”即暗示比滿足普遍需要或期望的要多。
  那麼以RIA為例,來看下RIA(Rich Internet applications富互連網應用程式)比IA(Internet applications)多在哪
  更快、更直接的互動、更模擬、更流暢的體驗、更cool、更好玩、更易安裝、更容易傳播、更安全…更容易使使用者迷惑、更複雜、更容易不切實際、更難部署、更高開發成本…
  ——可見,多出來的既有優點也有缺點。
  我們假設B=f(U,E),即行為(Behavior)是一種以使用者(User)與環境(Environment)為變數的函數(function)。
  我們想要通過互動設計建立一個符合邏輯的流程以及在其中進行的符合意料的行為,但是我們不能直接控制使用者,我們需要通過互動、介面設計等,找到有效控
制環境的方式。因此,我們要仔細的研習下更“rich”的控制與體驗並不斷探索。以RIA為例,這種探索包括瞭解其應用類型與常用模式,瞭解其設計挑戰與
風險,在設計其應用時注意揚長避短,並學會評估由此形成的效應。

應用類型與常用模式

  RIA從應用上可以做為:
  •  單獨的軟體、widget(瀏覽器外用在案頭上運行)
  • 網站的某些部分(在瀏覽器中有效地運行)
  • 添加到傳統的網頁的“豐富組件”(來導航或互動)

  且目前已有以下幾種類型的應用:
  •  資訊/參考應用:網路/本地資源的整合,搜尋,多媒體,使用者參與…
  •  資源瀏覽/編輯應用:瀏覽,閱讀,檢索、分類,協作,發布…
  •  電子商務應用:購物,資料庫瀏覽…
  •  實用應用:提示,過濾,協助,嚮導… 
  •  娛樂應用:遊戲…
  •  營銷應用:廣告…

  先將這些應用中RIA的模式窮舉一下:

  再將這些模式分解:
  • 互動——每一種模式都以一種互動開始。
   懸浮、滑鼠滑過、點擊、釋放、快速鍵、拖拽、移動、選擇、定焦、調整大小…
  • 操作:
   尋找——“我需要的時候能找到資訊”
   自動匹配、載入內容、縮小選擇、及時搜尋、精確搜尋、動態過濾、細節縮放、隨需重新整理、懸停出現的詳細資料、原位替換、可調整大小的模組、滾動的模組、模組擴充…

   動作——“在介面情境中我能夠採取行動”
   拖拽模組、當頁編輯、內建文字編輯、內建標記編輯、內建的自訂編輯、直接的靜態編輯、評價評級、彈出或滑出的自訂編輯、網格單元編輯、記憶選擇、自動儲存、記憶配置…

   驗證——“我能提前預防錯誤發生”
   內建驗證、驗證後建議、氣泡提示、計數(如用在文字框的字元限制)、即時預覽…

   訊息——“我能及時的溝通”
  • 介面呈現:介面的更新
   可用的、已用的、指示、忙碌的指示、進度指示、內建狀態、游標狀態、漸隱漸現、對比、動態目標、顯示焦點、燈箱特效、高亮、褪色、擴充、淡入淡出、翻轉、移動、摺疊、投影片特效、動畫…

 

設計風險

  關於RIA設計容易出現的問題與應用風險,幾年來已有很多專家總結,在此僅承接上述模式分類概況幾點:
  資訊瀏覽與尋找是否需要使用者更多的注意力和滑鼠操作,如:點擊、拖拽、滾動?一個頁面是否弄得太亂了?是否在介面上濫用了豐富的互動形式?組件與整體
頁面是否協調?視覺上是否體現出了層次關係?新的互動模式是否改變了使用者使用傳統網路的習慣?使用者可能看不出RIAs和傳統網站的不同——但其實沒有後退
按鈕了?沒有彈出提示視窗了?
  那麼我們在設計時就要注意建立一些原則盡量規避風險:
  1:將控制項及其功能可視化,使使用者對控制項的位置及其作用容易理解。保持操作一致性及與其他類似網站/傳統型應用程式的一致性。
  2:提供明顯的返回途徑或確保後退按鈕可用。後退按鈕通常被視為錨點,一種福士使用者的取消方法。
  3:變化適當。介面中有更新或微型狀態變化時,確保人們注意到這些變化:
   選擇適當的動態效果和顏色變化吸引注意。
   變化應該發生在人們在看的地區及附近。
   不要同時更新多處,使用者的注意力跨度過大以至於感覺混亂。
  4:當介面上的變化不及時時,提供及時的資訊反饋;善用提示更新的方式。
  5:不要在一個頁面塞滿內容,騰出空間給新內容。
  6:在(概念)設計階段不要做太多混合應用,做好可複用的設計。
  7:提前規劃無障礙設計。RIA中的可用性往往比較困難,比如使用行動裝置訪問可能無法正常顯示(即使使用iPhone),因此可能需要準備其他版本。

一致性的標準來規範設計

  對於設計標準,有兩件事一定要明確。一,仍然是以使用者為中心進行設計,二是要想清楚rich在哪裡可以增加價值。因此評估時要盡量對目標使用者測
試全方位的互動體驗,對於高機率的變化與更建立立詳細的標準。比如,我們要規範“懸停出現詳細資料”這一模式,就需要說明當需要在介面情境中(文欄位落、
圖片等)查看詳細資料時,彈出氣泡太快或太慢都可能降低使用者體驗,因此要注意規範到對於氣泡的彈出要相比滑鼠觸發有0.3s的延遲;滑鼠移開或有點擊行為
時彈出的氣泡立即消失。

  如前所述,當RIAs為我們提供了提升體驗的巨大機會,如何設計更“rich”的控制與體驗還需要不斷積累探索。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.