基于Android平臺的學生考勤系統的交互設計

朱莉萍 黃吉蘭

摘要：本文筆者結合所在院?？记诠ぷ鞯膶嶋H需要，設計開發基于Andrmd平臺的學生考勤系統。在完成了前期需求分析和設計概要基礎上，對App系統進行交互設計，以提升用戶的操作流程體驗。根據交互設計流程和規范，分析系統需實現的功能，完成App線框圖、流程圖的繪制，原型設計，可用性測試。在測試后又對線框圖、流程圖、原型進行了修改與完善。

關鍵詞：交互設計；Android；原型設計；可用性測試

中圖分類號：TP302.2 文獻標識碼：ADOI：10.3969/j.issn.l003-6970.2017.08.016

引言

在互聯網及移動通信技術高速發展的今天，傳統的課堂點名方式顯得尤為落后。通過點名方式可以提高出勤率，進而增強班級課堂管理、促進學習氛圍和積極性，因此許多高校都在進行考勤改革，有的也將課堂出勤率納入教師考核當中。為了提高簽到效率，同時方便教師或教務處及時查詢考勤統計數據，進行本學生考勤系統App的開發。要能夠同時滿足學生和教師，提高簽到效率和準確性。

1 考勤系統需求分析

本系統的主要目的是設計實現一個基于Android的學生考勤系統App，僅供三類人員使用：管理員、教師、學生。管理員具有最高權限，學生和教師賬號均由管理員分配，按照默認的學號和工號進行登錄，指定統一的初始密碼，可自行修改。教師有發布通知公告、調停課、生成簽到碼、查詢權限，學生僅有請假、簽到、查詢權限。

1.1 功能設計

管理員：信息管理和數據維護，如導入、修改教師和學生數據，導入課程、班級名單等，對異常數據進行處理和修復。

教師：查看課程和課時、調停課情況，查看所授課程班級名單，發布公告，進行調停課，生成簽到碼，查看學生請假信息，查看出勤率及遲到曠課學生名單等。

學生：通過wifi定位教學地點后輸入教師發布的簽到碼進行簽到，查看當天的出勤情況，查看每門課程的出勤情況，查看當前學期的課程和總出勤率，查看公告，請假等。

1.2 框架設計（信息架構圖）

根據需求分析中的功能設計，對系統的功能進行梳理并分類歸納，從用戶行為、內容結構、數據關系等角度進行分析，得出信息架構圖。這是交互設計流程中的一個基本步驟。后期的界面設計、數據庫設計等都要以此圖為藍本進行開發設計。需要注意的是，本系統面向三類用戶，各自擁有的權限不同，根據功能的定位和信息架構層級之間的關系，列出每一個層級涉及的所有操作。圖1，圖2是僅包含部分子系統部分層級的信息架構圖。

2 系統交互設計

2.1 線框圖

線框圖是App系統設計的重要部分，通過繪制線框圖可以清晰地展現App的頁面、結構、功能和用戶行為。線框圖一般包含文字、圖片、視頻等，多用簡潔的線框、占位符等表示圖標、文本等。總之，線框圖就是用線條、圖形等描繪出的App系統框架，從而描述頁面功能與內容的邏輯關系。

線框圖可以手繪，也可以利用軟件工具輔助繪制，可以選用的工具有UxPin，Balsamiq Mockups、Justinmind，Axure，Visio等。其中的Axure是美國Axure Software Solution公司的產品，是一個專業的快速原型設計工具，能夠快速創建應用軟件或Web網站的線框圖、流程圖、原型和規格說明文檔。本系統主要采用Axure進行繪制，主要的線框圖如圖3所示。

2.2 頁面流程圖

如圖4所示，這個階段是利用相關工具完成頁面邏輯圖的繪制。頁面流程圖主要描述頁面流轉的關系，也就是用戶通過當前什么操作進入了什么頁面，以及后續的操作和頁面。換句話來說，就是要設計頁面之間的行為路徑，這對前端開發非常重要，可為編寫代碼做重要參考。理順了交互流程邏輯，才能提升用戶的操作流程體驗。

2.3 原型設計

如圖5所示，原型圖是App用戶界面的高保真模型，可以模擬用戶和界面之間的交互。制作App原型的主要目的是在實際開發之前測試系統的功能和可用性。原型設計在整個交互設計中處于最重要位置，因為它既要展現界面元素，還要實現功能的邏輯。本系統同樣采用Axure進行原型設計，完成所有的按鈕動作、頁面跳轉、提示信息的交互設計。

3 可用性測試

在完成好以上交互設計流程后，就需要對原型進行測試了。尋找合適的測試者，在測試中記錄發現的問題并及時解決。

3.1 測試方案

3.1.1 專家評測

先找多位交互設計專家對原型進行測試，找出問題后，修改線框圖，調整流程，更新原型，再次測試。

3.1.2 用戶評測

當前的交互設計都是以用戶體驗為核心的，在學院內各找五位以上學生和教師分別使用原型Demo，記錄下問題和疑問，逐項詢問用戶在使用過程中的感受和體會，通過搜集和整理用戶意見，修改線框圖、原型，重新進行可用性測試。

3.2 測試記錄分析和改善（1）教師端獲取班級名單應以教學班而非行政班的形式列出，對出勤率的統計也應當以教學班為單位，班級名單中除了學號姓名，還應該顯示聯系電話，電話可點擊并直接撥打；

（2）學生端課程界面，有的課程名稱很長，一行上同時顯示課程編號、名稱及授課教師不一定顯示完整，修改為手指向左右滑動，顯示出全部數據；（3）“我的”“設置”“退出登錄”的位置不容易找到，提升層級，修改在“我的”頁面中，位于最下方的長方形按鈕；

（4）教師測試者提出能否查看到班級中的班委名單，對經常遲到曠課的學生標紅顯示?？蛇x擇的修改方式有在“班級名單”頁面中添加一個“班委”按鈕，可轉入“班委名單”頁面，顯示班委的學號、姓名、職務、聯系方式。對遲到達到多少節數的學生在班級名單顯示中以黃色顯示，對曠課達到多少節數的學生在班級名單顯示頁面中以紅色顯示。

（5）學生測試者提出疑問：簽到碼輸入和提交時間只有兩分鐘，如果遲到五分鐘無法完成簽到，怎么判斷為遲到還是曠課？根據學院規章制度，遲到十分鐘以上為曠課，故在學生簽到界面增加一個遲到補簽按鈕，教師端生成簽到碼后兩分鐘內學生端簽到按鈕可點擊，兩分鐘后簽到按鈕不可點擊，遲到補簽按鈕可點擊，十分鐘后，兩個按鈕都不能點擊。

4 總結

通過交互設計的一系列流程，完成了信息架構圖、線框圖、流程圖、原型的設計，并進行了可用性測試，在測試基礎上修改完善設計。后續在確定的原型設計基礎上進行代碼開發，以求盡快將此APP系統用于本學院課堂考勤，真正有益于教師和學生。