网络教育机构的网站互动设计初探在无创新中求创新

　　张迪欧(网校网CEO)

　　这是一篇抛砖引玉的文章，网校网在实施产品设计的时候，研究了国内网络教育机构的众多模式，同时与终端用户交流颇多，积累了一些设计心得。如今网络教育产品设计的重要性已经成为业内的共识，作为第三方平台的运营者，希望把一些感受与业内人士探讨分享，以期与众位高人探讨。

　　特别指出的是，本文在这里只探讨作为网络教育机构存在的在线教育网站，那些以单点突破的网络学习网站(例如背单词，课程表，习题)不在此列。

　　网校网首页设计

　　一在无创新中求创新

　　想必很多朋友阅读此文的时候，都会看一下网校网做成了什么样子，由于本文的心得皆从网校网设计中总结，所以还真得先解释一下网校网的模式。前几天有位撰稿人朋友采访了我。他提到一个问题：“网校网定位是解决网络学习孤独症的学习社区，但为什么从首页看不出来。”

　　这的确是一个信息量很大的问题，后来那位朋友写了稿子，名字叫《从无创意处大创意》，其实这就是我想分享的最大的心得，即“有些产品设计可以完全颠覆性创新，有些行业因用户习惯所致，还真得依从现有用户群体的使用习惯入手，哪怕看起来土些”。

　　中国的教育培训行业就是这样的一个特殊领域，作为服务性产品，教育的标准化程度低，学科涉及面广，销售过程的售前依赖度高，入行门槛低，因此教育培训行业仍然很难规范。在行业发展的十数年中，由机构和用户的彼此博弈、行业内部的不断自调整，已经形成了一种根深蒂固的用户认知，即“也许用户认为，只有这样的模式才是教育机构”。

　　也正是因为这样的原因，虽然当前传统的网络教育机构貌似“页面很土”，但仍然生意兴隆。同样因为这样的原因，网校网经过多次改版适应，仍然回归了目前的首页样式。这种设计虽然“看起来没啥特别”，但首页的跳出率只有20%。

　　作网络教育行业的创业者，在此我最大的心得是：我们没有能力去教育用户，在颠覆性创新的风险较大的时候，不如从现有模式入手进行微创新。而且专业人士能够看出，现有的网络教育机构的页面仍然具有很大的“微创新”的提升余地。我想，在分享互动设计心得的时候，这是个重要的思路。否则做出的产品很可能被媒体叫好，但用户不一定能够认可。

　　二环球模式、正保模式与学而思模式

　　在众多的在线教育讨论中，我们很少看到提及现有的网络教育机构，大家对创新模式都非常感兴趣，这的确是个有意思的现象。其实，传统的网络教育机构能够在市场上立足多年，每年为上百万学员提供网络课程，目前网络教育领域的主要收入也在他们之中产生，这其中肯定存在合理性。而且即便传统的教育机构设计有待提升，但它们在多年的市场推广中培养了用户的使用习惯，这种力量也是不得小觑的。因此纵观各网校的UE规律很重要，宏观归纳，现有教育机构的网站架构可以总结为三大类：

　　环球网校首页设计

　　1. 环球网校模式

　　“环球职业教育在线”运营多年了，是面向职业教育的综合性网络培训机构。其特点是教学的学科多，网站提供的资料内容多。如果我们大量观察网校页面，我们可以看出，很多网络教育机构都在模仿环球的网站结构，这种模式的特点是：

　　1-1 首页有一个大的学科目录，导航中也大量开列学科目录。

　　1-2 首页并非用户的阅读重点，用户的重点在于各个学科的二级频道。

　　1-3 学科的二级频道大量展示的学习资料、考试动态、文字密布，促销广告和招生的课表嵌入其中。

　　1-4 环球网校模式形成了一种课表规范，即，把课程按照班型纵向排列，按照商品信息横向排列，形成二维课表。用户需要进一步理解后再选课。

　　1-5 网校的促销信息嵌入到课表之下，这个部分几乎都是文字描述。

　　1-6 点击课程后，直接进入付费页面。

　　正保远程教育的中华会计网校首页

　　2. 正保模式

　　正保远程教育，是纽约证券交易所的上市公司，是国内唯一一家以远程教育在海外上市的机构，这一点值得业内人士骄傲。正保远程教育，是以中华会计网校为基础，同时提供了十几个不同方向的分校模式，如中小学教育网，建设工程教育网等等。因此，正保远程教育本身也是个多学科的综合性网校，与环球网校不同的是，正保把不同学科按大类分割成分校，而每个分校的内容相对聚焦。正保的中华会计网校结构，是行业性方向较强的网校常见的模式。

　　2-1 每个分校网站涉及的学科数量大大减少，因此，学科目录不再是分站页面的主要内容。

　　2-2 分校结构的模式，把学科目录和资讯分类信息统一在导航里，整个网站仍然以资讯类网站的模式呈现。

　　2-3 课程仍然以课表式展示，点击课程后，直接进入付费页面。

　　学而思网校首页

　　3. 学而思模式

　　学而思模式所面向的学科规模特点与正保网校的分站类似，即，涉及的学科方向相对集中。与正保模式不同的是，学而思网校采用了课程信息页直播的方式，这种模式被K12或英语类网校采用较多。

　　3-1 学而思网校的课程展示是列表式，而不是环球正保的课表式，即，课程按行展示，每一行的信息量较大、

　　3-2 与环球模式、正保模式不同，学而思模式的网站具有产品信息详情页。

　　3-3 在产品信息详情页中自动播放试听内容。

　　以上是从网站结构视角观察的三种常见模式，相信这些不同的模式都是各机构多年摸索的结果，这对于创业者有较强的参考价值。不过值得一提的是，在UI角度，传统的网校的确拥有极大的提升空间，这恰恰是新近的创业者的机会。

　　三把课程切碎

　　谈到这里，我想深谙教学的业内人士肯定会心一笑，这应该不算是什么秘密了。笔者之所以在文章中提及，是因为我们应该不仅从教学的角度，而是从UE的角度看待这个问题。

　　所谓把课程切碎，就是把一堂完整的授课视频，按照知识点和教学目标分解成多个小段，并且加以排列组合。例如老师讲了一堂英语课文，视频录制了2个小时，目前比较专业的做法是，把这2个小时的课程按照教学内容分解成课文部分、习题部分、词汇部分、复习部分等等。这样做的结果是，我们得到了N多视频，这些不同课程的视频即出现了多个组合方法。即，把所有课文的习题部分整合起来，就形成了习题班;把所有课文的词汇部分整合起来，就形成了词汇班……这样我们就拥有了多个班型，适合不同学员的学习口味。

　　做到这一点是教研的功夫，更是互动设计的思路。即，把课程切碎，为用户提供了大量，标准化的，个性化的课程自助选择空间。这个思路的确是初创的网络教育企业不能忽视的。

　　四向电商靠拢，又得有教育味

　　不论任何学科的学习者，他们首先是普通的互联网用户，他们在生活里接触最多的肯定是淘宝、京东、凡客这样的电商平台。因此，作为付费者，用户使用网站的思维模式首先是被电商平台强化的。所以，在网络教育机构的产品设计上，千万不能和电商的UE相差太远，否则会导致用户迷惑。例如，课表式的展示虽然比较直观，但用户会多花一些心思去理解课表含义，如果从课表点击课程后却发现没有产品信息页，如果把课表嵌在海量的文本链接之中，这种方式很容易让用户眼睛疼，想必这对用户的耐心是一大考验了。其他诸如促销信息的展示，文案设计，按钮设计等等，也无不如此。

　　但是如果单纯地采用电商模版，这也有问题，会让用户感觉失去了教育感，对页面的专业性体验产生质疑。如何在二者之间拿捏分寸这真的是个功夫，是需要UE高手参与的工作。其实这就是本文在前面所提到的“从无创新处创新”，所谓“无创新”，是指网站的教育味不能变，所谓的“创新”，其实也就是把用户常见的成功的UE模式引入进来。

vc341b7J6LzG" height="390" src="/2013/0412/20130412050702675.jpg" width="560" />

　　Pinterest的瀑布流式网站设计

　　五瀑布流、图片与文字

　　瀑布流的网站真的很诱人，因为大量的图片展示会吸引用户的注意力。但对于网络教育机构而言，瀑布流的设计会遇到难题，即，瀑布流的方式很难适应所有学科的学习者的内容需要。如果一个一级建造师的学习者，肯定希望看到一级建造师课程的瀑布流，但除非你是一建的专门网校，否则你就会损失大量的其他学科用户。但如果我们把所有学科的课程均匀的瀑布一下，又会使用户觉得专业性不足。而且作为教育类网站，能够用于瀑布流的图片内容比较单一，因此，个人的心得是，除非专业性很强的教育机构，否则应该慎用瀑布流。顺便吐个槽，我曾经见过瀑布流式的课程信息页面，当时的感受是，即便作为专业人士，我也看不懂。

　　网络教育机构能够展示的图片恐怕只有教

补充：web前端 , HTML/CSS  ,

网络教育机构的网站互动设计初探 在无创新中求创新

网络教育机构的网站互动设计初探在无创新中求创新