12教培機構一般在招生環節就會用到教材（或者講義）來進行招生宣傳，在教學環節更是會使用教材進行教學。K12教培機構除了采購大型機構的教材外，有的也會自己線下生產教材。那么這些教培機構線下生產教材的流程是什么樣的呢？

• 首先，確定教學大綱，即教材的目錄部分；
• 其次，設計教材結構，例如教材中的每一講由教學目標、每個知識點的知識講解、例題、練習題等組成；
• 再次，基于教材大綱和教材結構進行教材內容的整理和編寫，例如收集整理知識點的講解內容以及題目等；
• 之后，人工使用教材排版軟件進行內容的排版，并完成審校；
• 最后，將教材導出成PDF格式，送到印刷廠或者打印店進行印刷。

從上述的流程我們可以發現，教材編寫不是一件容易的事情。除了內容的整理外，教材內容的排版、審校更是耗時耗力。接下來我們就聊一下我們為什么需要在線生產教材以及怎樣設計在線教材生產系統。

為什么要在線生產教材

其實要回答這個問題，我們需要思考什么類型的教培機構需要在線生產教材以及在線下生產教材他們遇到了什么問題？

在實際調研中發現，那些超大型（機構規模在一萬人以上，例如廣州卓越）或者面向培訓機構輸出教研內容的機構（例如高思愛學習）是可能需要在線生產教材的。

這些類型的機構一般每學期需要生產多種教學體系多個年級多個教材版本的教材，教材數量非常龐大，極大地增加了人力成本。其中多個教材版本的教材會出現很多講的內容重復度較高，通過人工復制粘貼的方式很容易出錯，需要反復修改。

除此之外，人工進行教材排版也是一件繁瑣的工作，一方面沒有什么技術含量，另一方面比較耗時耗力。

基于以上幾點，如果可以在線生產教材替代人工復制粘貼的工作、基礎繁瑣的排版工作、減少教材內容中的錯誤，最終提高人效降低成本，那么這件事情也是有價值的。

如何設計在線教材生產系統

在設計在線教材生產系統之前，我們需要先明確業務的核心需求。經過調研總結，業務核心需求主要有以下兩點：

1. 多個教材版本的內容（包括知識點講解、例題、練習題）存在復用的情況。復用內容由于經常出現錯誤需要修改，如果出現錯誤時將每個教材版本的內容都檢查修改一遍太耗時耗力，并且還會出現遺漏修改的情況。
2. 每學期需要輸出的教材由于教材版本較多，數量也比較多。采用人工排版的方式，由于教材數量的增多，需要消耗較多的時間和人力，導致人力經常比較緊張，教材不能如期交付的問題。

了解了業務的核心需求，就可以開始初步思考設計方案了。下面我們分別就這兩點需求闡述初步的設計方案：

1. 將復用內容作為資源引用到教材中，如果復用內容需要修改，只需要修改引用的資源即可進行教材內容的自動更新。這樣既可以一定程度上減少錯誤率，還可以減少重復修改的操作，進而提高人效。
2. 采用系統在線自動排版來替代人工排版的方式，機器排版完成后人工只需要進行簡單的校審即可。在線自動排版有多種技術方案，既可以用純HTML排版，也可以采用線上的Word文檔排版，或者還可以采用Latex排版。那么該采用何種排版方案呢？

教材的在線排版一方面要考慮到教材樣式的設計，例如教材的版式、每講的標題、每個題目的序號等；另一方面還要考慮到教材內容的組成部分，包括學習目標、知識點陳述、例題、練習題、附加題等部分。

考慮到不少學科教材樣式設計具有一定的復雜性，純HTML排版一方面無法滿足樣式設計的要求，另一方面無法導出可支持線下編輯格式的文檔。結合團隊有專業的Word錄入試題插件和模板開發人員，最終決定采用基于Word的在線排版方案，即按照教材樣式模板和特定的規則，將教材內容自動合成到可支持線下編輯的Word文檔中。

完成了上述的初步思考后，就可以開始正式的產品設計了。我將產品設計環節分為三個部分：

（1）梳理業務流程，使用Visio或者ProcessOn工具繪制業務流程圖

（2）進行各個功能模塊的界面和交互設計

下面我將主要演示教材編輯部分以及教材生成部分的原型設計圖：

上傳教材樣式模板，文件格式是.dotx

編輯教材結構模板

編輯教材內容，根據教材結構模板，添加每講的知識點、例題、練習題等

根據教材樣式模板和教材結構模板，將教材的目錄、每講的學習目標、知識點講解、例題、練習題等自動合成Word版本的教材。

（3）分析學科的教材模板，制定相應的排版規則

• 排版規則總體原則是按照課程大綱順序排版，課程大綱的每講內容按照教材結構順序排版。具體來說，就是先排版第一講，再排版第二講，一直完成最后一講的排版，最后再進行教材目錄的排版。
• 排版的詳細規則，主要是在分頁和題目排版兩個方面。

在分頁方面，例如要求一講的內容結束后下一講的內容放在下一頁。同一講的內容如果一頁排不下自動排到下一頁，尤其要注意在題目排版時如果剩下的行數不能排下題目中的選項、表格、圖形、圖片等，則要將該題目排到下一頁。

在題目排版方面，需要考慮題干序號、標簽等的展示以及題目內的表格、圖形等的擺放位置。針對不同的題型，還要考慮特定的排版規則。比如，選擇題的選項一般是4個，4個選項之間的間隔是多少，如果一行排不下排兩行，兩行排不下排四行。再比如，解答題的答題區域空4行，綜合題的每道小題之間不額外空行。

總結

從上述內容我們可以看出，設計在線教材生產系統，首先要從業務人員入手，找到業務人員的痛點，之后就可以針對這些痛點進行初步設計和詳細設計了。

在整個項目的開展過程中，給大家分享下我的幾點感悟：

• 適應的才是最好的。一個問題往往不只對應一種解決方案，在確定采用哪種解決方案的過程中要考慮到當前團隊的能力儲備。例如在線排版技術方案的選擇過程中，老板特別想采用Latex的排版方式（感興趣的同學可以自行百度Latex排版），但是由于團隊并沒有Latex的技術儲備，所以最終還是采用了團隊比較熟悉的Word排版技術方案，并決定同時啟動一個小團隊進行Latex相關的技術研究。
• 60分的效果就可以投入使用。做到60很簡單，做到80分則要付出很高的成本。就教材在線排版而言，在線排版的效果短時間內很難達到學科要求的80分，但是只要保證核心功能可以滿足學科的需求，排版的效果即使只有60分，也可以投入使用。結合在線排版和人工修改的方式，人工通過花費少量的時間在審校過程中優化排版的細節問題最終也可以達到教材低出錯率如期交付的目標。

結尾

本篇文章大致介紹了教研系統中在線教材生產系統的設計，我將在之后的文章里繼續介紹教研系統中在線課件制作工具的設計，歡迎大家與我探討，也歡迎大家閱讀我的上一篇文章：《教材課件在線化流程的設計要點》。

作者：笑笑，微信公眾號：笑笑的三棵樹。近5年經驗的教育行業產品經理，會一直在教育行業深耕，熟悉教研系統、課堂教學平臺。

本文原創發布于人人都是產品經理。未經許可，禁止轉載。

題圖來自Unsplash，基于CC0協議

站設計中配色對于界面設計的重要性不言而喻。相信同學們眼中的當代界面藝術大師每個人都有各自熟知的一兩位。這些設計師精湛的技藝和卓越的創意是各位程序員所不能及的。但是對大部分網站設計者而言，設計的時間和預算都相對有限，個人能力也難以與頂級設計師匹敵。因此，許多網站設計者將自己的初始設計顏色定為一個單色或兩個相近色，以便從不同的角度來考慮整個網站的要素。

然而，有人會認為，隨著網站的日益普及，在提升協調性與藝術性的同時，對配色的有效運用也必須豐富多彩。花樣顏色的運用具有一個顯著的好處: 它提供了更豐富、更細膩、更復雜的表現手段，提升企業形象，深化交互體驗，提升用戶粘性等，產生了更加令人印象深刻的效果。

但畢竟，花樣色彩在掌控會比一個顏色更為復雜，標準化程度更低，難以統一，難以符合品牌總體形象的要求。。矛盾之處在于便捷和細致性的妥協。鑒于上述情況，人們推崇的一種方案是運用顏色主題。網站設計中的配色方案應該適用于不同的場合，為各種不同的業務形式和特點制定合適的配色方案，而不僅僅是單純的應用相近顏色。此外，我們還需考慮到在不同的配色場合下所使用的配色方案的統一性，以此來在多分辨率、多監控器的情況下，增加網站的可見度和美觀度。

網站排版：橫豎自由宣傳

大多數的網站排版以前端人員為主導，來實現HTML/CSS結構的建立。隨著CSS 3和HTML5的改進，人們將排版作為重點考慮的項之一。好的排版不僅有助于提高網站的可讀性，還能使網站表現出他的形式，營造網站所要表達的主題意義。

如果我們查詢現在有關網站排版的資料，可以發現許多支持“響應式設計”的文章。響應式設計是指對不同尺寸以及不同平臺具有優秀的排版展示方式。當然，前提是設備與軟件都能支持相應的標志或技術。 然而，建議始終記住，排版的作用之一是讓讀者可視化地體驗內容并掌握內容的無障礙性。過多夸張的排版手法回受到一些用戶的反感

對于排版而言，滿足基本的語義化要求，讓HTML/CSS遵循SEO和WAI的設計標準，有助于網站結構的分明和提升搜索引擎的排名。值得一提的是，人們對不同排版的要求也在不斷變化，需要與整個網絡環境的情況同步進步。對于初學者而言，簡化或少用排版辦法，提高排版效果與可視化效果，則是一個更為明智的方案。

在網站設計的過程中，配色和排版是非常關鍵的要素。在進行配色的設計時，只有經過合理的分析、選擇和組合，才能達到和諧的效果，提升網站的視覺效果和用戶體驗，進而更好的展現品牌的形象。在進行排版設計的時候，則需要結合不同的設備、平臺、語義化等多種情況進行考慮，使排版更加有利于內容的傳播與吸收。