张迪欧:网络教育机构的网站互动设计初探

时间:2014-09-15

  张迪欧(网校网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模式引入进来。

Pinterest的瀑布流式网站设计

  Pinterest的瀑布流式网站设计

  五 瀑布流、图片与文字

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

  网络教育机构能够展示的图片恐怕只有教师照片和促销广告了,那么在这个方面下功夫吧。把图片做精一些,背景丰富一些,这至关重要,因为这是打破页面枯燥性的利器。

  说到页面枯燥,教育类网站也遇到一个不能回避的问题,即,如果我们不展示文字资料,那么用户会觉得网络页面缺乏专业性。如果我们展示了文字资料,那么大量的文本会让用户眼花缭乱。这是个两难,另外,大量的文本链接有助于SEO,这个也是网络推广的需要,所以很多网校宁可体现专业性排列大量文本,也要牺牲页面的易读性。因此,目前的状况对UE的设计者是个挑战,如果解决了这个问题,那你的网站肯定所向无敌。

  六 UI设计,你可以做的更好

  UI设计太敏感了,纵然在UE中我们有N多个“不得不如此”,但UI设计肯定能够缓解“不得不如此”的缺陷。在这里,我实在不明白为什么教育机构(包括线下机构)的UI还采取渐变按钮和金属感导航,大红大绿的主题色,复杂的线条分割,粗重的色彩点缀,小小的行距。这一点真的不得不吐槽,我目前能够理解的是,也许用户心理已经适应了这种美术设计,认为这才是教育机构的特点。但用户最终是以眼睛舒服为导向,现在的用户喜欢微软雅黑字体,简洁的色块,功能性区域分割,Web2.0的图标,手绘的banner。从网校网的用户感觉来看,这个真的可以有,而且这恰恰是在线教育机构的创意空间所在。因此,只要把握好用户传统心里和互联网设计潮流的尺度,完全可以极大提升网络教育机构的产品体验。

  七 用户还需要什么

  除了这些,用户还需要什么呢?在网校网与用户的接触中感觉到,用户除了授课之外,还需要教学组织和课后服务。用户不希望购课后在页面提问题没人搭理,不希望拨打客服电话态度冷淡。用户希望网校能有个管理感,例如给用户留个作业;定期提醒用户:“你该上课了,快点来”;甚至在用户长期不上课的时候,给用户打个2分,这都是用户心理所需要的,而这些恰恰是教育之外的东西,也是初创的网络教育机构可以下功夫的地方。

  以上是对在线教育产品互动设计的一些观察和思考的心得,网校网是网络教育行业的第三方社区和选课平台,从自身来讲,最希望看到的是网络教育行业发展壮大。因此作为网校网CEO,把自己在一线工作的粗浅心得分享给各位同好,以期能够起到抛砖引玉的作用,如有观点偏颇之处,还望不要贻笑大方吧。

上一篇:几步让你的网站精美亮瞎眼:字体篇 下一篇:Github 上最受欢迎的开源 CSS 框架(库)

相关文章

最新文章