紙上原型在計算機課程中的應用

葉常春　尹良澤

【摘要】計算機課程經常涉及抽象的工作原理。僅靠講解描述，學生很難理解這些原理，經常反饋說“太抽象，不好懂”。我們發現紙上原型是幫助學生掌握理解抽象的工作原理的好工具。紙上原型是通過在紙上繪圖和剪紙制作而成的紙質實體模型。紙上原型能起到化虛為實的作用，也就是把抽象的概念映射成具象的紙制品。除了擁有繪圖的表達力之余，紙上原型還能動態演示系統工作過程。紙上原型制作成本低、時間可控，門檻低，便于學生參與。本文描述了紙上原型在人機交互課程和計算機基礎課程中的應用，并指出了在其他課程中的應用機會。

【關鍵詞】紙上原型 工作原理 抽象 計算機課程

【Abstract】Computer Courses always include contents about abstract principles. Only by teachers describing and explaining these principles， students are hard to learn them， and they often give feedback that the principles are too abstract to be understood. We have found that paper prototypes are useful tools to help students to learn the principles. Paper prototypes are system models which are made by painting on paper and by paper-cutting. Paper prototypes can connect abstract concepts with concrete products. Not only are paper prototypes have as much power of expression as diagrams， but they are able to show the working progress of systems dynamically. It is cheap， time-saving and handy to make paper prototypes， so every student can try paper prototyping. This paper describes two examples of application of paper prototypes in the Human-Computer Interaction course and in the Foundation of Computer course， and points out other occasions to apply paper prototypes.

【Keywords】Paper Prototypes， Work Principles， Abstract， Computer Courses

【中圖分類號】G64 【文獻標識碼】A 【文章編號】2095-3089（2015）10-0204-02

1.前言

相信每一位上過計算機基礎課程的老師都曾遇到過這樣一個問題，就是不論如何變著花樣反復多次地向學生講解某一工作原理，學生還是吃不透、抓不住。多數學生會反饋說，“太抽象，不好懂。”理解工作原理一般要理解若干新概念，熟悉系統的構成并形成關于系統工作過程的完整認知。對缺少知識背景的學生而言，以講授的方式來幫助他們理解抽象的工作原理確實是一件難事。

“抽象的、難以理解的”工作原理存在于眾多計算機課程中。下面列舉一些。

①大學計算機基礎可以說是一門大雜燴課程。計算機工作原理、內存訪問過程、網絡協議工作原理、Web工作原理、數據庫系統工作過程和擺渡攻擊等既是難點又是核心內容。

②操作系統原理課程中，中斷機制、頁式存儲機制、缺頁中斷處理、進程管理機制和文件系統工作原理等都是難點。

③網絡原理課程中，OSI體系結構及其工作原理、TCP/IP工作原理、TCP連接過程、http協議工作原理、域名解析和網絡路由機制等都是重點和難點。

④計算機組成原理課程中，圖靈機工作原理、計算機工作過程、指令流水線工作原理、加法器工作過程和Cache工作原理等是難點。

經過多年的教學探索，我們發現紙上原型是幫助學生掌握理解抽象的工作原理的好工具。紙上原型能起到化虛為實的作用，也就是把抽象的概念映射成具象的紙制品。除了擁有繪圖的表達力之余，紙上原型還能動態演示系統工作過程。紙上原型的其他優點是制作成本低、時間可控，門檻低，便于學生參與。

本文下一節介紹紙上原型的概念。接下來的兩節描述紙上原型在人機交互課程和大學計算機基礎課程中的應用案例。相信讀者能從兩個案例中體會到紙上原型的價值，并能夠舉一反三地應用到其他場合。最后一節是結束語。

2.紙上原型

原型[1， 2]是系統的外觀或內部結構的模型。紙上原型是通過在紙上繪圖和剪紙制作而成的紙質實體模型[3， 4]。我們在計算機基礎課程中采用的紙上原型大多用來刻畫系統的內部結構。同時，串聯若干幅紙上原型，能動態展示系統的工作過程。下一節給出的例子能清晰地表明這一點。

事實上，紙上原型不是一個新概念。人機交互課程上通常都會講授紙上原型這一原型工具[1， 3， 5]。這一工具在人機交互設計（如軟件或網站界面設計）中得到了廣泛的應用。在交互設計中，紙上原型主要用于呈現軟件或網站的外觀和功能接口。通過串聯多幅“屏幕（或叫頁面、或叫窗口）”，紙上原型動態地演示了軟件或網站的界面流程。盡管有眾多的原型設計工具可供選擇，但紙上原型始終是交互設計師偏愛的一個選擇。這是因為它具有快速構建、輕松修改、關注流程、便于用戶參與和拋棄成本低等優點[4]。

經過嘗試，我們發現紙上原型適合用于幫助老師講授抽象的工作原理，也適合用于幫助學生理解掌握抽象的工作原理。如果安排學生參與構建紙上原型，學生將會有更多主動的思考，對抽象的工作原理的理解將更加深刻。紙上原型這一工具值得推廣應用到更多課程中。

3.在人機交互課程中的應用

人機交互課程講授如何設計出好用的軟件或網站界面，向用戶提供優質的用戶體驗。原型設計是人機交互設計前期采用的方法和技術。設計出來的原型是軟件或網站界面的模擬物。人機交互設計中，原型用作探索、交流的媒介。由于具有快速構建、輕松修改、關注流程、便于用戶參與和拋棄成本低等優點，紙上原型廣受青睞。

紙上原型不但能夠呈現軟件或網站界面的布局和外觀，還能夠演示軟件或網站界面的流程。圖1～4是紙上原型的一個示例。它演示了一款名為“時鐘”的手機應用程序的設置鬧鐘功能的界面流程。

如何用上述紙上原型動態地演示時鐘程序的添加鬧鐘功能呢？表1列出界面跳轉動作與紙上原型演示動作之間的對應關系。表1 界面跳轉動作與演示動作的關系

4.在計算機基礎課程中的應用

《大學計算機基礎》是一門難講的課。學生的反饋中經常包含抽象、枯燥、不系統、散亂和不知所云等詞語。講解計算機工作過程是一個難點中的難點。

理解計算機工作過程涉及一系列抽象概念。CPU組成方面，控制器、運算器、程序計數器（PC）、指令寄存器（IR）和通用寄（R0， R1， …）存器等都是看不見摸不著的。內存模型方面，字節、內存地址和字長等概念和內存的作用需要吃透。程序方面，程序、機器指令、操作碼、操作數等概念和程序的存儲方法需要充分理解。總線方面，涉及數據總線、地址總線和控制總線等抽象概念。要學透如此之多的抽象概念，光靠閱讀文字描述來熟悉他們確實是一道難題。

采用紙上原型來講解計算機工作過程，能使局面發生改觀。針對計算機工作過程的紙上原型的制作步驟說明如下。

①繪制CPU組成圖，見圖5-a。講授計算機工作過程時，我們有意忽略大量與CPU組成相關的細節，目的是突出重點。

②繪制內存模型圖，見圖5-b。圖中表格的每一單元格代表4個字節，表格左邊的數字代表內存地址。

③繪制連接CPU和內存的總線，見圖5-c。這里不展開總線的細節內容。若需要，可以分別制作數據總線、地址總線和控制總線。

④在內存模型圖中，手寫“1加到10”匯編語言程序，見圖5-b。為便于書寫，我們假定每條指令的長度是32位（4個字節）。講課時，告訴學生指令不見得是固定長度的。

⑤裁剪6條與圖5-b中的單元格等高等寬的紙條，依次書寫“1加到10”匯編語言程序的指令，如圖6，稱之為“指令紙條”。

⑥模擬程序執行的起始階段。假設程序起始地址為800，在程序計數器方框內用鉛筆書寫800。

⑦模擬CPU取指令動作。用一張空白字條，抄寫程序計數器上的內容（稱之為指令地址紙條）經過總線移動到內存。定位指令地址紙條的地址值所對應的指令“MOV #0， R0”，把寫有該指令的指令紙條經過總線移動到CPU的指令寄存器中。

⑧模擬程序計數器自動計算下一條指令的地址（下一指令的地址 = 當前指令的地址 + 指令的長度）。在程序計數器方框內用鉛筆書寫第二條指令的起始地址804，見圖7。

⑨模擬執行指令。把指令“mov #0， R0”從指令寄存器IR移動到控制器，然后在通用寄存器R0格子內用鉛筆書寫0，見圖7。

⑩依次地，照步驟7，8，9模擬第二條、第三條以及后續指令的取指令、計算下一指令地址和執行指令的步驟。

利用紙上原型，能動態演示程序的執行過程。表2列出程序執行動作與紙上原型演示動作之間的對應關系。

對于以上步驟，可以由老師邊講解邊演示，這樣做時間開銷最少。但學生不見得能深刻理解計算機工作原理。如何讓學生學到更多？下面是一些選擇。

①教師提供紙上原型素材，學生講解演示。這樣學生自己在腦子里組織程序執行流程并講述出來，而不是坐著聽一聽而已。

②學生自己制作紙上原型素材，并講解演示。這一做法使學生動手，既有機會讓學生了解CPU的組成、內存模型的構成和總線的作用；也有機會讓學生熟悉計算機工作過程。

③使用另外一個匯編程序。這一做法是指教師以一個匯編程序作為示例，講解演示計算機執行程序的過程；然后要求學生走通另一個匯編程序的執行流程。

5.結束語

在講授抽象的工作原理的時候，僅僅依賴口頭講述，效果往往不佳。學生總是反饋“太抽象，不好懂。”此時，紙上原型是一個選擇。事先經過精心設計和準備，邀請學生參與制作和演示紙上原型，學生將會把抽象的概念和過程與紙上原型實物和演示動作映射起來。這樣會起到化虛為實的作用。

紙上原型既有圖形的表達力，又能動態地演示系統運行流程，還有制作成本低、時間可控，門檻低等優點。紙上原型可以應用到大學計算機基礎、操作系統原理、網絡原理、計算機組成原理和數據庫原理等課程。

參考文獻：

[1]Carolyn Snyder. Paper Prototyping[M]. Morgan Kaufmann. 2003. Vol.55（8）. P.26-28.

[2]Chandler， C. D.， G. Lo， and A. K. Sinha. Multimodal theater： Extending low fidelity paper prototyping to multimodal applications[J]. Proceedings of Conference on Human Factors in Computing Systems： CHI '02， 2002. P. 874-875.

[3]陳媛媛. 淺析交互設計中的紙上原型設計[J]. 設計技術研究. 2013. 第2卷. 第4期. P.41-44.

[4]阿里巴巴UED團隊. 紙上原型設計方法說明及使用規范[R]. 2009.

[5]寧濤，霍利. 紙面原型設計方法在虛擬仿真系統開發的應用[J]. 計算機工程與設計. 2008. 第29卷， 第20期.

作者簡介：

葉常春：現工作于國防科技大學計算機學院，副教授。

尹良澤：國防科技大學計算機學院，講師。