技術(shù)資訊
淺析“Rich”設(shè)計模式
2009-03-12 09:04:00
但凡設(shè)計師都對簡潔的設(shè)計情有獨鐘,我們不喜歡復(fù)雜,卻也不能不會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富互聯(lián)網(wǎng)應(yīng)用程序)比IA(Internet applications)多在哪?
更快、更直接的互動、更仿真、更流暢的體驗、更cool、更好玩、更易安裝、更容易傳播、更安全…更容易使用戶迷惑、更復(fù)雜、更容易不切實際、更難部署、更高開發(fā)成本…
——可見,多出來的既有優(yōu)點也有缺點。
我們假設(shè)B=f(U,E),即行為(Behavior)是一種以用戶(User)與環(huán)境(Environment)為變量的函數(shù)(function)。
我們想要通過交互設(shè)計創(chuàng)建一個符合邏輯的流程以及在其中進行的符合意料的行為,但是我們不能直接控制用戶,我們需要通過交互、界面設(shè)計等,找到有效控制環(huán)境的方式。因此,我們要仔細的研習(xí)下更“rich”的控制與體驗并不斷探索。以RIA為例,這種探索包括了解其應(yīng)用類型與常用模式,了解其設(shè)計挑戰(zhàn)與風(fēng)險,在設(shè)計其應(yīng)用時注意揚長避短,并學(xué)會評估由此形成的效應(yīng)。
應(yīng)用類型與常用模式
RIA從應(yīng)用上可以做為:
? 單獨的軟件、widget(脫離瀏覽器在桌面上運行)
? 網(wǎng)站的某些部分(在瀏覽器中有效地運行)
? 添加到傳統(tǒng)的網(wǎng)頁的“豐富組件”(來導(dǎo)航或互動)
且目前已有以下幾種類型的應(yīng)用:
? 信息/參考應(yīng)用:網(wǎng)絡(luò)/本地資源的整合,搜索,多媒體,用戶參與…
? 資源瀏覽/編輯應(yīng)用:瀏覽,閱讀,檢索、分類,協(xié)作,發(fā)布…
? 電子商務(wù)應(yīng)用:購物,數(shù)據(jù)庫瀏覽…
? 實用應(yīng)用:提示,過濾,幫助,向?qū)А?
? 娛樂應(yīng)用:游戲…
? 營銷應(yīng)用:廣告…
先將這些應(yīng)用中RIA的模式窮舉一下:
再將這些模式分解:
? 交互——每一種模式都以一種交互開始。
懸浮、鼠標(biāo)滑過、點擊、釋放、快捷鍵、拖拽、移動、選擇、定焦、調(diào)整大小…
? 操作:
查找——“我需要的時候能找到信息”
動匹配、載入內(nèi)容、縮小選擇、及時搜索、精確搜索、動態(tài)過濾、細節(jié)縮放、隨需刷新、懸停出現(xiàn)的詳細信息、原位替換、可調(diào)整大小的模塊、滾動的模塊、模塊擴展…
動作——“在界面情境中我能夠采取行動”
拖拽模塊、當(dāng)頁編輯、內(nèi)置文字編輯、內(nèi)置標(biāo)記編輯、內(nèi)置的自定義編輯、直接的靜態(tài)編輯、評價評級、彈出或滑出的自定義編輯、網(wǎng)格單元編輯、記憶選擇、自動保存、記憶配置…
驗證——“我能提前預(yù)防錯誤發(fā)生”
內(nèi)置驗證、驗證后建議、氣泡提示、計數(shù)(如用在文本框的字符限制)、即時預(yù)覽…
消息——“我能及時的溝通”
? 界面呈現(xiàn):界面的更新
可用的、已用的、指示、忙碌的指示、進度指示、內(nèi)置狀態(tài)、光標(biāo)狀態(tài)、漸隱漸現(xiàn)、對比度、動態(tài)目標(biāo)、顯示焦點、燈箱特效、高亮、褪色、擴展、淡入淡出、翻轉(zhuǎn)、移動、折疊、幻燈片特效、動畫…
設(shè)計風(fēng)險
關(guān)于RIA設(shè)計容易出現(xiàn)的問題與應(yīng)用風(fēng)險,幾年來已有很多專家總結(jié),在此僅承接上述模式分類概況幾點:
信息瀏覽與查找是否需要用戶更多的注意力和鼠標(biāo)操作,如:點擊、拖拽、滾動?一個頁面是否弄得太亂了?是否在界面上濫用了豐富的交互形式?組件與整體頁面是否協(xié)調(diào)?視覺上是否體現(xiàn)出了層次關(guān)系?新的交互模式是否改變了用戶使用傳統(tǒng)網(wǎng)絡(luò)的習(xí)慣?用戶可能看不出RIAs和傳統(tǒng)網(wǎng)站的不同——但其實沒有后退按鈕了?沒有彈出提示窗口了?
那么我們在設(shè)計時就要注意建立一些原則盡量規(guī)避風(fēng)險:
1:將控件及其功能可視化,使用戶對控件的位置及其作用容易理解。保持操作一致性及與其他類似網(wǎng)站/桌面應(yīng)用程序的一致性。
2:提供明顯的返回途徑或確保后退按鈕可用。后退按鈕通常被視為錨點,一種大眾用戶的取消方法。
3:變化適當(dāng)。界面中有更新或微型狀態(tài)變化時,確保人們注意到這些變化:
選擇適當(dāng)?shù)膭討B(tài)效果和顏色變化吸引注意。
變化應(yīng)該發(fā)生在人們在看的區(qū)域及附近。
不要同時更新多處,用戶的注意力跨度過大以至于感覺混亂。
4:當(dāng)界面上的變化不及時時,提供及時的信息反饋;善用提示更新的方式。
5:不要在一個頁面塞滿內(nèi)容,騰出空間給新內(nèi)容。
6:在(概念)設(shè)計階段不要做太多混合應(yīng)用,做好可復(fù)用的設(shè)計。
7:提前規(guī)劃無障礙設(shè)計。RIA中的可用性往往比較困難,比如使用移動設(shè)備訪問可能無法正常顯示(即使使用iPhone),因此可能需要準(zhǔn)備其他版本。
一致性的標(biāo)準(zhǔn)來規(guī)范設(shè)計
對于設(shè)計標(biāo)準(zhǔn),有兩件事一定要明確。一,仍然是以用戶為中心進行設(shè)計,二是要想清楚rich在哪里可以增加價值。因此評估時要盡量對目標(biāo)用戶測試全方位的互動體驗,對于高概率的變化與更新建立詳細的標(biāo)準(zhǔn)。比如,我們要規(guī)范“懸停出現(xiàn)詳細信息”這一模式,就需要說明當(dāng)需要在界面情境中(文字段落、圖片等)查看詳細信息時,彈出氣泡太快或太慢都可能降低用戶體驗,因此要注意規(guī)范到對于氣泡的彈出要相比鼠標(biāo)觸發(fā)有0.3s的延遲;鼠標(biāo)移開或有點擊行為時彈出的氣泡立即消失。
如前所述,當(dāng)RIAs為我們提供了提升體驗的巨大機會,如何設(shè)計更“rich”的控制與體驗還需要不斷積累探索。
原文:http://cdc.tencent.com/?p=954
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務(wù)——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿足預(yù)期到走向卓越
- [2023-04-11 09:17:49] H5頁面設(shè)計開發(fā)——移動端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務(wù)支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項目
- [2021-03-05 10:34:45] 移動互聯(lián)時代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計
- [2020-12-16 16:55:32] 建設(shè)一個常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2018-07-18 09:29:40] 網(wǎng)站建設(shè)中的交互設(shè)計模式
- [2008-05-09 14:02:00] 《Designing Interfaces》讀書筆記(2)設(shè)計模式
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計解決方案 機械行業(yè)網(wǎng)站設(shè)計解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計解決方案 科技企業(yè)網(wǎng)站設(shè)計解決方案 電子家電網(wǎng)站設(shè)計解決方案 食品行業(yè)網(wǎng)站設(shè)計解決方案 集團公司網(wǎng)站設(shè)計解決方案 企事業(yè)單位網(wǎng)站設(shè)計解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計解決方案 健身運動網(wǎng)站設(shè)計解決方案 美容與化妝品網(wǎng)站設(shè)計解決方案 建筑設(shè)計行業(yè)網(wǎng)站設(shè)計解決方案 物流行業(yè)網(wǎng)站設(shè)計解決方案
TAGS關(guān)鍵字
企業(yè)網(wǎng)站為什么要備案 網(wǎng)站優(yōu)化 青島網(wǎng)站建設(shè)基礎(chǔ)知識 蘋果系統(tǒng) 互聯(lián)網(wǎng) 版面布局 舒適的界面 手機端的網(wǎng)站 網(wǎng)站推廣 集團公司網(wǎng)站建設(shè) 扁平化設(shè)計 青島SEO 青島做網(wǎng)站多少錢 搜索引擎 集團性網(wǎng)站 微信營銷的優(yōu)勢 輪胎網(wǎng)站設(shè)計 響應(yīng)式設(shè)計 程序開發(fā) 青島好的網(wǎng)站優(yōu)化公司 php程序 網(wǎng)站建設(shè),手機網(wǎng)站 青島黃島、紅島網(wǎng)站建設(shè)公司 H5定制設(shè)計 營銷型網(wǎng)站建設(shè) 企業(yè)建站 高端網(wǎng)站設(shè)計 頁面設(shè)計 膠南網(wǎng)站建設(shè)公司 青島IT資訊