产品会客厅 | 从“极客时间”App的信息架构上，我们能学到什么？
下载APP
关闭
渠道合作
推荐作者
产品会客厅 | 从“极客时间”App的信息架构上，我们能学到什么？
2018-11-30 邱岳 来自北京
《邱岳的产品实战》
课程介绍
写在前面的话
极客时间的专栏读者你好，我是邱岳。
我们在之前的产品会客厅中，分享了产品经理如何从一个 App 入手，去研究和学习。有朋友给我们留言，说希望可以用一个 App 从头演示一下。这次我们用“极客时间”App 作为例子，一起研究一下。
由于篇幅有限，我们就不按照之前说的整体逻辑全部过一遍了，我们着重来看信息架构方面的拆解和分析，其他的部分就留给你自己来发挥。
邱岳分享
00:00 / 00:00
1.0x
- 2.0x
- 1.5x
- 1.25x
- 1.0x
- 0.75x
- 0.5x
首先我们打开极客时间的 App，这个结构大家应该都已经非常熟悉了，共有三个 Tab 页。
第一个是首屏，它是一个根据运营属性的一个页面，第二个是知识产品的一个索引和列表，它就是一个跟信息架构直接相关的一个结构，第三个是个人中心。
我们直接从第二个 Tab 页看，因为它背后的东西，就是极客时间 App 里的所有的概念实体。
在 App 里面，其实有四种不同的知识性产品，它们是文字专栏，视频课程，每日一课和微课，接下来我们去看每种知识产品的信息结构，以及它的设计是怎样承载信息结构的。
文字专栏的信息架构
首先我们来看文字专栏。如果我们来看一个没有买过的文字专栏，可以发现一个信息页面，我们可以在这里进行订阅，通过信息页可以进到免费试读，通过免费试读，可以再进入到 Detail 页，在 Detail 页我们可以完成订阅。
我们再去看一个买过的专栏。因为订阅过，它着陆进来之后是一个更详细的信息页，在信息页里，我们直接就看到了信息的 List，还可以点进去直接听音频，这个信息页的结构跟之前不一样，是一个已购信息页的结构。
大家可以注意到的是，它的样式是完全不同的，大家记住这一点，因为我们再看下一页产品类型的时候，还有些不同，我们从已购信息页也可以进入到 Detail 页，这个是专栏整体信息架构的一个组织。
视频课程的信息架构
我们再去看视频课程，首先我们还是看一个没有买过的视频课程，大家可以看到视频课程 Nginx 课程，我是没有买过的，一进来跟专栏页面类似，也是一个信息页，信息页可以去看课程信息，以及课程类目，点击免费试看，它直接进入视频页的播放页面，也就是进入到 Detail 页面。大家可以看到这个信息页，同时肩负了呈现视频课程的简介信息以及目录，也就是视频课程 List 的两个职责。
我们再去看一个已经买过的视频课，有趣的是在视频课程里，已购和未购它的着陆的信息页的结构是一样的，只不过默认缺省的 Tab 页，如果是已购的话，会直接放到课程目录里边，如果是未购的话，是放在课程信息里面，这个页面是通用的。
它的路径也是一样的，我们可以从产品目录里面点到“开始学习”，或者点某个具体的课程，跟刚才的免费试看是一个结构的详情页，也就是说，在视频课程里面的结构，它相对来说比较简单，也比较统一。
但在专栏里面，我们刚看到它的信息架构不是非常一致的。尤其是看我们打开一个未读专栏的免费试读，就是这个页面，我认为是从整个信息的逻辑结构来说，稍微有一点突兀。
当然我一定要在这说明一个事情是，千万不要把 App 设计和画出来的逻辑图完全划等号，我们不可能说逻辑图是它的下一级，它是它的下一级，我们就把所有的入口和它的路径就按照这个逻辑图去排布，这是会有问题的。
如果我们根据信息架构去设计的话，整个 App 看起来会非常死板，很没有意思，就好像是一个很大的黄页一样，我们一定要去根据场景做设计。
我不知道极客时间的产品经理是不是有意去设计了这样一个路径，去帮助文字性质的专栏去做落地和转化，因为我猜测，有可能是文字和视频的专栏，用户的转化路径和理解的过程可能是有不同的，所以说会有这样不同的设计，不过，我个人更为喜欢视频课程这种统一和简洁的设计 。
社群的设计
我们还可以去看有一个有意思的事情呢，我不知道大家有没有注意到，当专栏已经购买后，专栏的已购信息页中，有“进入社群”的一个路径，这里面是与专栏相关的用户交流社区。
这其实是一个信息架构的取舍。
我们在打造社群，或者设计社群的时候，我们有可能会考虑把社群提到整个信息架构之外，也就是说可以看到这里有专栏、视频、每日一课，这一类都是知识产品，与它们并列的叫社群。这个社群就是一个更偏向于泛化的，是面向整个极客时间的一个社群。
同时我们还可以选择把社群对接到专栏这里面，也就是我们可能为一个专栏组织一个社群了，为整个专栏组织一个社群，也有可能就是像现在这样的设计师为每一个专栏定义一个社群，这都是在信息架构上的选择，
当我们决定了社群不是放到知识产品并列的这个位置，而是放到了某一个专 栏下面的时候，我们的路径就是从已购的信息页进入到社群里面去，它的入口在设计上必须跟信息架构的设计是吻合的，那也就是放在已购信息页的右上方，这样的设计是没有问题的。
音频的设计
除了这个之外，大家还可以看到，在所有的信息架构之外，还有一个东西就一直停留在右上角，这其实是极客时间的一个音频的控制系统。
比如说我们随便打开极客新闻去读一下本周新闻，然后它就会在右上角有反应，你会发现不论我们去到哪里，这个东西都是一直在上面，就是凌驾于整个信息架构之上的。
这种设计在音频类型的 App 里面是非常常见的，就是有一个能够凌驾于整个信息架构之外的设置机制，无论别的地方是否在转场，它也不会受到影响。
当然，除了音频这样的 App 形式之外，我们也经常会用到类似的这样的设计，比如把一个跟运营相关的东西，或者把一个我们希望独立于整个信息架构之外的控件，我们把它提出来。
在极客时间里也有这种例子，今天是双十一有运营活动，所以当我们点到专栏的详情页之后，我们会发现这里就有一个“特价拼团”的浮窗。你可以点进去利用它做拼团。
这个东西跟它的整个购买流程相不相关？也是相关的，但是你很难把它插到某个具体的结算页面，或者某个信息架构深处，因为它可能不具备特别强的抓取流量能力，所以说我们就用这样一个设计把它提出来，这是一个很常见的东西，大家也可以在自己的 App 里面去用。
个人中心
说到这里，极客时间还有一个设计是整体的专栏索引，当我们想要看订阅过的专栏，我们可以进入中心页里去看已经买过的专栏。
同时，在这里有一个我觉得是设计上的挺有意思的东西，在“已购”里有“每日一课”，但是，在个人中心里面又有单独的“每日一课”入口。
就像我刚跟大家说过的，并不是“每日一课”是“已购”的下一级逻辑，就一定把“每日一课”放在“已购”里，这就是为了满足某些用户使用的场景，我们很可能把下一级的实体提到跟它同级，这在设计上没有问题的，但是我们要把场景考虑清楚，才能这么做。
一些需要优化的地方
还有一点，我们刚刚是在第二个 Tab 页说到了整个极客时间的知识产品之间的信息架构和逻辑关系。但是我们首次点进来，肯定会进到第一个 Tab 页。
这里地方有一点小问题，我个人觉得应该去调整。我们看见“推荐阅读”下面是专栏内容，“热门课程”是视频课的内容。但是刚才看过第二个 Tab 页的列表后，我们会发现这里突出的内容和是有点不同的。
这样放的话，是很有可能让第一次来到这个 App 的用户感到有一点困扰的，像这“推荐阅读”，这有“热门课程”，“推荐阅读”和“热门课程”的内容会不会重复呢，这其实是一个有一点交叉的概念。
并且，我们看热门课程里面是视频，每日一课里面也是视频，在这个整个 App 最下面又有一个视频合集，尚不了解极客时间信息架构和它背后的概念实体的时候，我可能会把这几个东西混淆，我们就会以为在视频合集里面有可能有“每日一课”的视频，以及视频课程的视频，但事实上这里面并没有。
当然这些并不是严重的问题，只是我在使用的过程中，被困扰到的一点小细节，也许这样的设计带有运营的属性，大家也可以分享并探讨一下。
那我们今天对于极客时间信息架构的分享先到这里，不知道这个过程对你能不能有什么帮助呢，你可以留言分享，我们下期再见，谢谢。
精选留言
恭喜幸运用户 @功主 i ，你的留言被抽取成为本周的精选留言。极客时间将送出价值 68 元的极客福袋一份。1 个工作日之内，工作人员会与你取得联系。
本期讨论
你是否有过类似的 App 体验呢，有没有一些新的发现和线索，可以留言与我分享，我们一起讨论。
分享给需要的人，Ta购买本课程，你将得18元
生成海报并分享赞 12
提建议
© 版权归极客邦科技所有，未经许可不得传播售卖。 页面已增加防盗追踪，如有侵权极客邦将依法追究其法律责任。
上一篇
产品会客厅 | 产品经理如何上手体验一个App （下）
下一篇
产品会客厅 | 专栏销量过万是一种什么样的感受？
精选留言(7)
daisy2018-12-01产品目前对已购内容学习场景设计的特别不友好，路径过长9
代码丸子2018-11-30要实现结构清晰、重点突出的界面设计方案，你必须首先梳理出结构清晰、重点突出的信息架构。作为产品设计师，我们需要在这里承担思考与分析的责任，否则这一重担势必会落到用户身上。 在思考信息架构时，出现在我们头脑中的应该是一系列抽象的信息单元，包括名词与动词等等，而非具体的像素、组件或页面。这样，你很快便会发现，任何产品无法只是信息的集合；而用户怎样理解和使用产品，最终将取决于我们以怎样的方式将这些信息进行整合。 这就像在造句 – 各种名词、动词的组合方式决定着最终能够传达出怎样的信息。 产品也是如此。一个app可以抽象成若干名词与动词的组合，包括“事物”以及“我能对这个事物执行的行为”。其中的名词非常重要，app的信息世界正是由它们组成的大体上讲，app界面当中存在着这样一种比例关系 – 绝大多数的界面元素（约80%）用于呈现“名词”；一小部分用于呈现“动词”，即用户可以对那些名词进行的操作。展开7
听天由己2018-12-01还是看视频舒服，可能文字看久了，总会想着有画面更有温度。 今天主题的确适合视频切入，能够顺着思路去思考这样的信息架构是如何产生、设计并且交互的。 我对信息架构不敏感，但通过多次的首页设计，也慢慢领悟了一些原则：我们每个页面想要为用户传递的内容是什么？在不同场景下，这些信息是否足够且唯一？ 二爷提了很多次概念实体，这是我们理解产品和内部沟通的关键一环，基于同样的话语才能建立概念与观念。展开2
咋个学才快2018-12-02这么快就结束了。。其中还是学到了很多，不仅是专栏，还有些留言也对我的认知有帮助的。 另外看这个才知道有社群，有时间上app再看下。。1
向茂遥2018-11-30视频结尾突然伤感了一下……1
杜微2022-02-13很不错
青川2021-11-12获益匪浅