百度腦圖二次開發及支持英語詞匯教學內容可視化的探究

周敏 周宗萍

摘要：百度腦圖是一款免費、部分開源的Web版思維導圖軟件。本研究的英語詞匯教學內容可視化是指借助表格、思維導圖，將一些在內容和結構上存在一定關系的詞匯以可視化的方式呈現出來?；诎俣饶X圖的開源代碼，在英語詞匯數據庫的基礎上，探索設計并初步實現了詞匯的模糊檢索、一鍵導入百度腦圖生成思維導圖的軟件功能，提供一個集詞匯資料便捷查詢和生成可視化學習內容于一體的詞匯學習工具，以期提高學習者學習英語詞匯的效率，減輕英語教師的工作負擔。

關鍵詞：百度腦圖；開源軟件；教育軟件開發；英語詞匯；可視化

中圖分類號：G434 文獻標識碼：A 論文編號：1674-2117（2018）10-0065-04

緒論

1.信息技術支持教學

當今世界，計算機軟硬件的迭代速度高于許多行業和領域，信息技術在引領學習、工作、生活等方面創新和變革的效果十分明顯。借助信息技術來支持教、學、研，可以為師生創設數字化的學習資源、工具和環境，并提供跨越時間和空間的服務。在英語詞匯教學中恰當使用軟件工具、多媒體設備，將有助于教學內容的呈現、教學活動的開展、教學成果的評價。

2.知識可視化理論

知識可視化的實質是將內隱知識或隱性知識外顯化，將外顯知識生動化。[1]將學習內容可視化，可以幫助教師事半功倍地完成教學任務，可以降低學生的認知負荷，聚焦學生注意力，有利于學生聯系新舊知識進而有效記憶。[2]知識可視化借助信息技術工具支持，可以將圖形圖像、視音頻、動畫等豐富多彩的元素整合在一起，而思維導圖是知識可視化的典型工具，可以條理化地梳理知識，可視化地組織知識。

3.文檔的線上管理

百度云盤和百度腦圖都是百度公司提供的在線應用軟件，不僅具有線上的文檔支持不限時間地點、多終端調閱、分享等功能，而且還有海量存儲空間、防誤刪備份、數據安全等保障，給我們的學習和工作帶來了極大的便利。將百度腦圖運用到英語詞匯教學中，可以方便地制作思維導圖，通過鏈接可以分享腦圖文檔給其他學習者，并能夠在不同的計算機上實現腦圖資料線上同步管理等。

百度腦圖基本介紹

1.軟件框架和開發準備

“百度腦圖”又名“Kityminder”，是百度公司2015年推出的非營利性產品，并將底層核心代碼開源，由百度前端研發團隊[3]（FEX-team，Frontend X）進行開發、維護和迭代，它具有界面美觀、功能豐富、兼容性好、操作便捷等優點，是一款優秀的思維導圖制作軟件。

百度腦圖的實現代碼分為客戶端和服務器端兩大類，客戶端運行在瀏覽器上，主要是HTML、CSS、JavaScript代碼，服務器端借助PHP編程語言響應客戶端請求，實現對數據庫的增、刪、改、查。Kityminder-core基于矢量圖形庫kity，是百度腦圖核心部分，包含了腦圖數據的可視化展現、簡單編輯功能等所有腦圖底層的支持。外層Kityminder-editor是百度腦圖的編輯器，包含UI操作界面和熱盒hotbox方便用戶輸入。由于再外一層的文檔管理、用戶認證、分享、歷史版本等功能需要和服務器端交互，所以百度腦圖開源的代碼只包括Kityminder-editor及其底層代碼（如圖1）。其依賴的十多種JavaScript類庫和框架都是開源的，在代碼托管網站Github上全部開放下載，供交流學習。

基于百度腦圖的二次開發，除了掌握Web基礎知識外，還需要了解JQuery庫、AngularJS和Bootstrap框架，以及任何一種服務器端動態網站開發技術，如JSP、ASP.NET等。在搭建了百度腦圖基本的編輯功能后，還需要實現腦圖文檔的網絡同步、層級文件夾式管理、導入導出、分享、訪問認證等功能。有了上面的鋪墊，在進行詞匯可視化部分的功能設計時，就可以基于百度腦圖的開源框架，二次按需定制化開發，從而極大地豐富軟件的功能特性，提升工具的層次水平。

2.百度腦圖功能介紹

內容創作。腦圖節點支持多種類型的內容和操作。從內容上看，可以是純文本、超鏈接、圖像、標簽、圖標、源碼備注等，支持多種不同類型的文檔導入批量生成內容，也可以導出思維導圖；從操作上看，可以插入、刪除、排序、歸納、復制、剪切、粘貼、撤銷和重做等。

外觀設置。從樣式上看，支持6種邏輯結構樣式圖切換、“整理布局”按鈕一鍵恢復默認排版、20種主題切換。用戶可以從字形（加粗、斜體）、字體、字號、文字顏色、背景顏色等方面對文字進行編輯，可以拷貝和粘貼節點的樣式，類似于微軟Office辦公軟件的“樣式刷”功能。

文檔管理。主體功能是文檔和文件夾的新增、復制、刪除、重命名、移動位置、層級列表查看、排序、批量操作等?！胺窒砦臋n”模塊可以設置文檔分享的URL鏈接、時間和密碼。“回收站”模塊可以恢復刪除的文檔，或徹底刪除。百度腦圖會自動記錄文檔的編輯歷史，并還原歷史版本。

3.應用優勢分析

無需安裝。這是基于B/S版應用軟件的共同特性，在瀏覽器中打開網頁即可使用，通過網絡連接服務器進行數據交換。

交互功能強大。百度腦圖不僅支持豐富的內容呈現，還可以進行優秀的界面交互設計，典型的功能有整體和局部節點的折疊、展開、拖放、選擇，頁面導航，鍵盤快捷鍵等。

同步云端，線上管理。瀏覽器中編輯的文檔會自動保存，并同步到服務器。在相應的文檔管理列表頁面，可以進行查閱內容、二次編輯、分享他人等便捷的線上管理。

除了優點，百度腦圖當然也存在不盡如人意的地方，如腦圖類型不夠豐富、存在由于網絡不穩定而導致的報錯提示、暫未實現移動端適配、無法導出支持離線可交互操作的HTML文檔等。

英語詞匯教學內容可視化

1.需求與現狀分析

詞匯是學習和掌握一門語言的前提和基礎，國內教育中，英語詞匯的學習也一直受到師生的關注。但英語詞匯的學習大多屬于死記硬背，單調、枯燥，記憶效果不理想。[4]而從詞匯的學習和記憶來看，可視化技術手段可以將知識形象、直觀地表征出來，能很好地呈現概念之間的關系，促進對知識的理解與應用創新。[5]一些典型的可視化技術，如表格、思維導圖、圖示化圖（如“事物構成的指示圖”“物體三維模型圖”）、地圖、網圖、流程圖等，可以通過顏色、線條、方塊、二維平面、三維空間、透視、交互操作等豐富的可視化元素來表現學習內容。因此，教師充分發揮計算機在藝術設計、內容創作、網絡互聯等方面的特性和優勢，將極大地激發學生英語詞匯學習在圖形、圖像、聲音、視頻、軟件程序等技術手段支持下的潛力。

2.基于百度腦圖的英語詞匯可視化（如下表）

從詞匯內容分。詞匯語義學強調將詞匯的語音、語法和釋義符號三者有機整合，形成“語義場”，從而幫助理解和記憶。[6]如表示溫度從熱到冷變化的一組詞scorching、hot、warm、tepid、lukewarm、cool、cold、freezing；從屬于fruits的apple、pear、banana等，還有從內容上有相關關系的詞組搭配、同義詞、反義詞等。

從詞匯結構分。按構詞規律，英語詞匯有前綴、后綴、詞根等要素。[7]前綴是有共同的前面部分，可以表示有正負（或增減）、尺寸、位置、時間和次序等一類釋義的詞匯，如表示“位置關系”的inter-、trans-、ex-、sub-、super-、infra-等。后綴是有共同的后面部分，單詞的后綴會決定詞性，如形容詞常見的后綴有-ful、-able等，名詞常見的后綴有-ment、-ship等。詞根是英語單詞構詞法的核心，會決定單詞的意思，如pel、puls=drive、push，表示“驅動、推”，expel表示開除、驅逐（ex出+pel推→推出→開除），compel表示強迫（com共同+pel推→一起推→強迫）等。[8]

在英語詞匯的教與學中，可以將具有上述規律的一組詞通過思維導圖等可視化形式呈現在一起，進行比對、歸納，從而幫助學生提升詞匯量，提高學習效率（如圖2）。

當然思維導圖只是可視化的一個典型工具，不能呈現手繪作品的細膩質感，也不能像視頻和動畫一樣按時間序列來動態、三維地表現內容。在借助信息技術手段的同時，還要結合實際的需求，發揮人的主觀能動性，這樣才能物盡所用，創造最大的價值。

小結

本研究涉及信息技術和英語兩大學科，基于百度腦圖軟件的二次開發，以英語詞匯的可視化為切入點，分析探討了英語詞匯借助百度腦圖實現可視化的場景和案例，初步設計開發了詞匯檢索和生成思維導圖的軟件原型。目前暫未進行實證研究，后續在不同學齡段的詞匯可視化，以及英語的語法、閱讀、寫作，甚至其他語言學科的內容可視化等方面，都可以開展跨學科的互助合作和深入研究。

參考文獻：

[1]王朝云，劉玉龍.知識可視化的理論與應用[J].現代教育技術，2007，17（6）：18-20.

[2][8]何方平.思維導圖在高中英語教學中的應用研究[D].蕪湖：安徽師范大學，2013.

[3]Github.fex-team[EB/OL].https：//github.com/fex-team/naotu.baidu.com.

[4]吳玉婷.運用心智圖促進小學高年級學生英語單詞記憶[D].上海：華東師范大學，2011.

[5]羅冬華.利用知識可視化法輔助小學英語詞匯教學[J].小學教學參考，2014（33）：44.

[6]李宗宏.詞匯語義學和第二語言詞匯習得的圖式化研究[J].河西學院學報，2007，23（3）：107-113.

[7]周敏.基于SQL模糊匹配技術的英語詞匯學習小工具設計研究[J].中國信息技術教育，2018（1）：73-76.

作者簡介：周敏（1993.10—），教育技術專業在讀研究生，軟件設計師，主要研究信息技術支持教學、數據統計分析等；周宗萍（1993.10—），教育技術專業在讀碩士，主要研究信息技術支持教學、STEAM教育等。