Toggle navigation
- Déjà vu -
HOME
RESUME
PORTFOLIO
UI & UX
Tolka
Timeline
Brand & Others
Wan-huaPlaying
Playwork
Others
時間軸網頁互動性研究
設計種類
Design Research
論文研究
林育成
程式修改
林育成
指導老師
陳立杰
製作時間
2014.03~2015.06
近幾年來,靜態的資訊圖表已日臻成熟,而動態的資訊圖表、互動式資訊圖表則正在發展當中。而關於互動式歷史資訊圖表,目前只有少部分的服務提供了適合的操作功能。因此,本研究欲探討使用者對於互動式歷史資訊圖表之版型方向與操作功能之偏好。
<研究用橫向網頁>
<研究用直向網頁>
<論文連結>
研究目的
本研究主要探討以下幾點:
(1)比較橫式與直式的互動式歷史資訊圖表於橫向螢幕之使用偏好。
(2)比較同時使用滑鼠左鍵、滑鼠滾輪和鍵盤方向鍵與只使用觸控螢幕操作互動式歷史資訊圖表之偏好。
(3)比較多種移動方式於不同版型與使用不同媒介操作互動式歷史資訊圖表之使用習慣與使用性。
研究流程
文獻探討
在確認完研究的方向後,先尋找相關的文獻資料,包含近五年內的期刊、論文等,了解前人對於這領域的研究建議與目前技術的限制。主要的文獻種類如下:
*資訊互動設計:了解資訊設計、互動設計的基本原則。
*網站設計:了解網站設計的構成元素、設計原則。
*資訊圖表:了解資訊圖表的種類與特性、表現形式,並進一步了解歷史資訊圖表的相關文獻。
前期調査
在閲讀文獻的同時,蒐集目前網路上的15個有關互動式歷史資訊圖表的案例作分析,並以此為基礎,製作前期調査的問卷與實驗。前期調査的結果,依照版面規劃、時間軸方向、移動性功能等分類作整理。再依據結果,選擇版面最複雜、方向最常見、移動性功能最多的案例作下一步的研究實驗樣本。
— 案例蒐集 —
— 版面規劃 —
<只有時間軸>:擁有最基本的元素,包含一定數量的事件、時間性的數字或文字、互動式介面大多數皆為此設計風格版面。
<主視窗與時間軸>:主視窗區塊顯示事件的詳細資訊、時間軸區塊則顯示歷史區間的事件點。
<主時間軸與綜觀時間軸>:時間軸區塊顯示部分的歷史區間與事件,綜觀時間軸區塊則顯示全部的事件點,少部分為此種版面。
— 時間軸方向 —
橫向版面
直向版面
由近到遠的3D
— 移動性功能 —
拉動時間標示框
點擊綜觀時間軸
拖曳時間軸
滾輪捲動
換頁按鈕
方向鍵切換事件
點擊前後事件按鈕
研究用網頁
實驗所使用的樣本參考模型為
Tiki-Toki時間軸服務
的網頁介面,是橫向、版型有主時間軸與綜觀時間軸的網頁。移動性功能上,除了原本的拉動時間標示框、拖曳綜觀時間軸、拖曳時間軸、滾輪捲動、方向鍵切換事件、點擊前後事件按鈕等外,增加了換頁按鈕的功能。同時,確保在任何操作媒介上(包含一般的滑鼠與鍵盤控制、桌上型觸控螢幕、智慧型手機手機等),各個功能皆能正常地使用。另外,再將原本的網頁從橫向改成直向,進一步透過實驗探討直向時間軸的優缺點。
<研究用橫向網頁>
<研究用直向版面網頁>
使用性測試
使用性測試主要分為二個階段。第一階段,受測者依照任務指示操作4種不同組合的互動式歷史資訊圖表網頁,組合如下:(1)以滑鼠左鍵、滾輪與鍵盤方向鍵控制橫向時間軸、(2)以滑鼠左鍵、滾輪與鍵盤方向鍵控制直向時間軸、(3)以觸控螢幕控制橫向時間軸、(4)以觸控螢幕控制直向時間軸,了解使用者對於版型與操作媒介的偏好。
第二階段,由受測者選擇其中一種模式作進一步的使用性測試,了解各個互動性功能的優缺點,包含(1)拖曳主時間軸作短距離移動、(2)使用滑鼠滾輪捲動、(3)按主時間軸上的移動按鈕作短距離或連續性移動、(4)拖曳綜觀時間軸的標示框、(5)點擊綜觀時間軸上的時間點位置直接移動、(6)使用鍵盤上的方向鍵切換事件、(7)在事件上點more後,使用小視窗底部的左右按鈕切換事件。
測試結果如下:
時間軸方向
在使用橫向螢幕時,30位受測者中有28位(共92%)較偏好使用研究用的橫向網頁。原因如下:
(1)橫向比較直覺。
(2)習慣由橫式左至右的表示方式。
(3)直式觸控較符合滑手機的習慣。
(4)操作比較輕鬆。
(5)橫向排序清楚。
操作媒介
操作媒介上,30位受測者中有15位偏好使用滑鼠、鍵盤方向鍵控制,15位偏好使用觸控螢幕控制,二種媒介各占一半。大多受個人習慣、喜好、直覺性等影響。
移動性功能
移動性功能中,依照不同的使用情況整理如下:
(1)長距離移動:
「拖曳綜觀時間軸的標示框作」佔70%、
「點擊綜觀時間軸上的時間點位置」佔65%。
(2)短距離移動:
「拖曳綜觀時間軸的標示框」佔78%。
(3)單一事件切換:
「點擊前後事件按鈕」佔92%。
未來研究建議
互動式歷史資訊圖表的發展空間仍舊非常的廣,本研究僅針對操作移動功能、版型方向搭配不同操作媒介之習慣、使用性以及喜好作探討。期許未來的研究可往以下之建議作深入的探討:
互動功能
建議可以深入探討其他功能,如:搜尋功能、事件分類、移動時的小動畫或是針對縮放功能與「時間軸區塊與綜觀時間軸區塊」中綜觀時間軸區塊之使用作比較。
操作媒介與使用螢幕
建議可以與手勢感應的操作媒介作結合與探討其互動性功能,以及針對在使用智慧型手機、平板電腦等設備之情況下作探討。
介面與版型規劃
期待未來的研究能試著找出適用於直向互動式歷史資訊圖表的條件,或針對前提調査中所提到的版面規劃作深入討論。
基本元素設計
建議可以針對整體時間軸之設計、時間刻度之呈現、指出當下事件的時間標示、事件點之圖示...等探討是否影響使用者的的感知與資訊吸收。