壹、前言

介面（Interface），顧名思義是指系統(tǒng)和使用者之間進(jìn)行交互和訊息交換的媒介，例如用提款機(jī)提款時(shí)，操控面版及金融卡即是與人操作間的介面。所謂的數(shù)位教材介面即是指學(xué)習(xí)者進(jìn)入教材，與電腦互動(dòng)以使用操作教材的交流溝通管道。在數(shù)位教材裡，教學(xué)內(nèi)容所代表的是設(shè)計(jì)理念，另需要透過(guò)教材呈現(xiàn)設(shè)計(jì)的形式，才能具體表達(dá)教材，而風(fēng)格與介面設(shè)計(jì)更是教材呈現(xiàn)工作中的首要項(xiàng)目，教材的 介面設(shè)計(jì) 好壞，常會(huì)影響著學(xué)習(xí)者能不能可以正確操作教材、用起來(lái)順不順暢、讀起來(lái)好不好看、讀起來(lái)是否清楚等重要關(guān)鍵。希望藉由本文可讓你瞭解數(shù)位教材設(shè)計(jì)的介面設(shè)計(jì)之重點(diǎn)，以提高學(xué)習(xí)效果。

貳、介面設(shè)計(jì)的重要性

因?yàn)閷W(xué)習(xí)者使用教材時(shí)無(wú)法感受腳本、電腦呈現(xiàn)幕後所執(zhí)行的程式碼，因此介面往往是最直接面對(duì)學(xué)習(xí)者的部分。在數(shù)位教材的介面，常可看到輸入裝置提供給學(xué)習(xí)者操作的界面，比方說(shuō)按鈕、開關(guān)、音控、互動(dòng)等，而教材回饋給學(xué)習(xí)者的包括顯示的方式、顏色、大小、文字、排列、音效等。

介面設(shè)計(jì)通?？砂滩募軜?gòu)呈現(xiàn)流程、教材裡所提供之教學(xué)功能、學(xué)習(xí)者操作教材之控制功能與工具、以及畫面上之螢?zāi)慌虐嬖O(shè)計(jì)。在介面設(shè)計(jì)時(shí)，最好遵守KISS：Keep it Simple and Stupid原則，以減輕學(xué)習(xí)者的障礙。比方說(shuō)若將按鈕圖像設(shè)計(jì)得過(guò)於抽象，會(huì)產(chǎn)生操作上的困擾。另外應(yīng)避免過(guò)多的字?jǐn)?shù)，以免認(rèn)知負(fù)載，也應(yīng)盡量避免色彩明度鮮豔刺眼，以免影響閱讀性。而導(dǎo)引學(xué)習(xí)者方向及其所在位置是介面設(shè)計(jì)重要的功能之一，藉由清楚一致的教材架構(gòu)，導(dǎo)覽學(xué)習(xí)者有方向性的瀏覽以獲得內(nèi)容資訊。

參、數(shù)位教材介面設(shè)計(jì)參考準(zhǔn)則

在開發(fā)數(shù)位教材時(shí)，我們主要可參考五大項(xiàng)介面設(shè)計(jì)的基本原則，以作為教材設(shè)計(jì)規(guī)劃及細(xì)部安排時(shí)的參考依據(jù)。

一、整體設(shè)計(jì)應(yīng)符合學(xué)習(xí)理論與概念：舉 例來(lái)說(shuō)，若銀行行員欲學(xué)習(xí)如何操作終端機(jī)使用方法，可將教材介面模擬成行員的辦公桌面與電腦環(huán)境，來(lái)學(xué)習(xí)操作終端機(jī)的知識(shí)技能。另外我們?cè)峒叭祟悓W(xué)習(xí)之 記憶模式，所以在設(shè)計(jì)教材時(shí)，應(yīng)減輕短期記憶的負(fù)擔(dān)，並強(qiáng)化長(zhǎng)期記憶的保存，以便學(xué)習(xí)者輕鬆學(xué)習(xí)。舉例來(lái)說(shuō)，教材架構(gòu)應(yīng)具有邏輯性，以減輕記憶負(fù)擔(dān)。

二、應(yīng)有適度之學(xué)習(xí)控制功能：介面設(shè)計(jì)應(yīng)容許學(xué)習(xí)者掌控動(dòng)作的執(zhí)行，而非全部由電腦掌控。例如，給予學(xué)習(xí)者可以放大、縮小、前進(jìn)、後退、暫?；蜢o音等可掌控教材畫面的動(dòng)作。然而給予控制權(quán)之功能多寡應(yīng)根據(jù)學(xué)習(xí)者的類型及其能力而定，並非所有教材都適用，例如新手較專家之操作功能則應(yīng)較簡(jiǎn)易。

三、教材畫面之排版配置：學(xué)習(xí)者的能力伴隨著經(jīng)驗(yàn)、知識(shí)與年齡的不同，對(duì)教材的操作與學(xué)習(xí)閱覽上也會(huì)有所差異。例如針對(duì)年齡較大的學(xué)習(xí)者，可能會(huì)有視力衰退或電腦操作的問(wèn)題，所以在介面設(shè)計(jì)時(shí)可以採(cǎi)用放大字體或明確輔助引導(dǎo)的呈現(xiàn)方式。另外也可多利用視覺與文字隱喻， 這是因?yàn)榇蟛糠謱W(xué)習(xí)者會(huì)從以往的經(jīng)驗(yàn)背景裡找尋解讀新事物的線索，並進(jìn)一步的產(chǎn)生聯(lián)想，因此設(shè)計(jì)時(shí)應(yīng)善用隱喻將去傳達(dá)介面設(shè)計(jì)欲表達(dá)的教學(xué)內(nèi)容概念。舉例 來(lái)說(shuō)，可利用一個(gè)家的圖之視覺隱喻方式來(lái)傳達(dá)學(xué)習(xí)者可以回到首頁(yè)之概念、利用地圖的文字隱喻方式來(lái)傳達(dá)學(xué)習(xí)者可以連結(jié)到目前所在位置的概念。

四、說(shuō)明文件與輔助功能：教材設(shè)計(jì)者可考慮採(cǎi)取以下幾種方式提供協(xié)助，比方說(shuō)在啟動(dòng)教材主題之前，電腦自動(dòng)載入說(shuō)明文字或測(cè)試應(yīng)有之外掛程式；或是在教材內(nèi)容中提供相關(guān)資訊的說(shuō)明或小幫手功能；另外常見的是提供有關(guān)教材的書面使用說(shuō)明文件與學(xué)習(xí)手冊(cè)。

五、一致的設(shè)計(jì)：教 材介面除了考量功能面與使用面外，也應(yīng)注意學(xué)習(xí)者的視覺舒適感受。整體的美感設(shè)計(jì)應(yīng)涵蓋色彩色調(diào)搭配、多媒體呈現(xiàn)、文字字型與大小，及風(fēng)格一致與賞心悅目 的圖像等等。最後舉凡功能列位置、視窗操作方式，與色彩圖片運(yùn)用等，都需做一致性的規(guī)範(fàn)，例如我們可以固定設(shè)計(jì)教材的重點(diǎn)字顏色若為藍(lán)色，而有藍(lán)字加底線 則是具有超連結(jié)之功能。。

在實(shí)際進(jìn)行設(shè)計(jì)時(shí)，你將會(huì)發(fā)現(xiàn)這些原則很難滿足所有教材的需要，因此必須視狀況設(shè)計(jì)及取捨，活用出新的指導(dǎo)原則。筆者將常用之介面設(shè)計(jì)規(guī)範(fàn)整理成下表，以方便實(shí)際設(shè)計(jì)時(shí)一一思考。