我們生活在資訊繁雜的社會,尤其是在網際網路時代,人們開始通過網路開始接觸越來越多的資訊,那麼,如何獲取/傳遞有效而準確的資訊將非常重要。在網頁互動設計中,我們提出:資訊獲取和傳達的過程必須是簡潔清晰,自然易懂。這樣使用者才能夠有效的獲取這些資訊,並迅速作出決定。
1.什麼是「簡潔自然,清晰易懂」?
簡潔清晰:使資訊最簡化
「少即是多」。提倡使用最少的元素來表達最多的資訊。如果資訊繁雜,將使使用者承擔大量的資訊負擔,造成資訊過載,影響效率,不能幫助使用者解決問題。
自然易懂:使用使用者語言
使用者獲取資訊的方式多樣,並且對資訊的理解程度也各有不同,所以使用使用者平時使用和理解的表達方式去傳遞資訊,更可以被使用者所接受。
2.資訊表述的種類與設計原則
在網頁互動設計中,用於傳達給使用者以有效資訊的方式有多種,其中包括:頁面布局,互動文字,介面色彩,影象與圖示,聲音等。
1)頁面布局
介面中的資訊布局,會直接影響使用者獲取資訊的效率。所以,一般介面的布局因功能不同考慮的側重點不同,並且會讓使用者有一種「區塊感」,方便使用者對資訊的掃瞄性瀏覽。
2)互動文字
互動文字指產品介面涉及互動操作中需要使用者理解並反饋的所有的文字:包括標題、按鈕文字、鏈結文字,對話方塊提示、各種提示資訊、幫助等。這些文字直接影響使用者在互動過程中對預期的理解,好的互動文字設計,可以提高使用者完成任務的效率。
①表述的資訊盡量口語化,不用或少用專業術語;
②表述語氣柔和、禮貌,避免使用被動語態,否定句等;
③簡潔、清楚的表達,文字較多要適當斷句,盡量避免左右滾屏,折行。
④對於同種操作的互動文字,操作行文字保持統一性。
⑤字型使用預設/標準的字型,大小以使用者的視覺清晰分辨為主;
3)介面色彩
人眼一共約能區分一千萬種顏色,所以使用者與介面中顏色的關注度非常的高,有效的使用色彩區分資訊的級別,分類等,有助於使用者對資訊和操作產生關聯,有效減少使用者的記憶負擔。
①根據不同的產品使用「場景」,選擇其合適的顏色。如,管理介面經常使用藍色。
②考慮顏色對使用者的心理和文化的影響。比如,黃色代表警告,綠色代表成功等。
③避免介面中同時出現3種以上的顏色。
④顏色的對比度明顯,如在深色的背景中使用淺色的文字。
⑤使用顏色指導使用者關注到到最重要的資訊。
4)影象圖示
相對於單純的文字,影象以及符號化的圖示更加符合使用者的認識習慣。往往表述一種資訊,一張或者乙個標識更能讓不同使用者理解與接受。適當的使用與符號化的圖示,會讓使用者很自然的建立起認知習慣。
①表意清晰,明確,有高度的概括性與指向性,讓使用者能夠快速的聯想到對應的功能和操作。
②同類或同一緯度的資訊,在形式和色彩風格上盡量保持一致性;
③僅在突出重要資訊,使用者可能產生理解偏差的情況下使用。避免濫用。
④盡量與互動文字結合使用。
5)聲音
在網頁的互動設計中,用於聲音的資訊表述方式相對與視覺來說不是很多。一般應用於提示,提醒,幫助等資訊的表述。此類資訊表述讓使用者通過聽覺獲取反饋,更加的直接與有效。
①表述清晰,語氣親切,不生硬,有禮貌。
②使用符合使用者認知習慣的聲音。如,使用敲門聲提示好友來訪資訊等。
③使用不讓使用者反感(如:恐怖,噁心,煩躁)的聲音。
④在使用者可預知的情況下發出聲音。
4.小結
對於不同的資訊表述方式,我們都要求設計師在表達資訊的時候做到簡潔清晰,自然易懂,盡量讓使用者覺得這是自然而然,而且又是清晰明了的資訊。就像小溪流水一樣自然,就像軍人命令一樣明確。這樣才會讓使用者快速,準確的完成任務。
互動設計實用指南系列 0 我們眼中的互動設計
互動設計 interaction design,縮寫 ixd 或者 iad 是定義 設計人造系統的行為的設計領域。人造物,即人工製成物品,例如,軟體 移動裝置 人造環境 服務 可佩帶裝置以及系統的組織結構。互動設計在於定義人造物的行為方式 the interaction 即人工製品在特定場景下的反應...
互動設計實用指南系列 12 避免出錯
乙個 簡單 和 複雜 的例子 在我和開發人員溝通乙個專案需求的時候,他們頻頻慨嘆mockup的設計所考慮情況之細緻,很多程式要實現的預判和 非基礎功能點 讓開發人員望而卻步不情願去實現。相比較設計師為了讓使用者避免出錯而絞盡腦汁去設想和考慮,開發人員更傾向於直接給到乙個只能容許的操作行為,其他非法請...
互動設計實用指南系列 8 深廣度平衡
圖1從右側這家店的櫥窗裡,我們能迅速分清哪些是租房資訊哪些是售房資訊。因為店家很貼心的將房產資訊進行歸類,並且在視覺上做了一些劃分,讓我們對資訊能一目了然。借這個小案例引出我們今天要分享的話題 深廣度平衡。其實 深廣度 本身並不是乙個單一的概念。在 的資訊架構中,有一種組織結構叫做樹形結構 首頁視為...