做了一段时间的web，在移动端都快忘光的时候，临时被征用去做了两个工具类的app，一个Android原生开发，一个H5开发，彼时已忘得七七八八，一边看着规范一边极力回忆做过的和分析过的移动端界面，侥幸过关。所以痛定思痛，今天来分析一个app，毕竟设计趋势一直在变，以不变应万变那是用来唬别人的，只有自己知道别人口中的中规中矩暗含的意思大概就是，你的界面实在是太土了。
爱屋及乌，作为云音乐的死忠粉，不管怎么说，网易的产品一生推，下面就是网易公开课的app界面解析咯。
1.首页
先来说首页，其重要性不言而喻，最能拿得出手的，最能吸引用户的，一定要在首页统统展现出来，这就如同“XX院”一个女子风情万种的说着：“客官，里面请～”反正首页呢，该有的都有了，巴特，关于轮播广告，个人浅鄙之见，是移动端不太友好的一种展示方式，众所周知，上下滚动是手机用户最常用的手势，在当今浮躁的社会，极少有人的目光会在某一个区域多做停留，不信各位看官随便打开一个应用，在无意识的情况下，就是赶紧往下滚几屏看看后面都有什么，更何况这个轮播广告数量居然有9个之多。既然是放在首页的轮播，那势必是这个app相当引以为豪的内容，所以何必羞羞答答的隐藏起来，直接展示就好。
页内导航的图标重心不稳，看上去大小不一致，当然啦，网易的一干设计师们一定不会犯这么低级的错误，但视觉上的统一也很重要耶。
因为这不是app解析的重点，平时在工作中也怕自己太纠结于图标而投入过多精力，比较良好的交互方式更重要，但还是稍微改了一下，自我感觉整齐舒服了很多。
关于推荐的内容，因为很长，需要滚N屏，就不一一截图了，但滚到底部后很有意思，是两组展现形式不同的内容——“订阅推荐”和“专题推荐”，因为此时我是尚未登录状态的，所以这里所谓的推荐应该是能极大的激起用户兴趣的内容，订阅我打开看了一下，确实干货满满，这说明网易公开课在把握用户心理层次做的还是相当到位的，目标用户是带有求知欲和探索欲的群体（我例外，我就看看这个app界面……，偶尔看下感兴趣的内容），所以看订阅推荐的几个涵盖美食／物理／历史／文学等等，还是传达了知识传播的理念的。
2.页内导航
好了，下面从页内导航开始，一个个排队来，先说“最热”和“最新”，这两个页面是相同的，都是那种无限滚动的瀑布流，如下：
但我唯一不能理解的是为何不给图片上的文字加上半透明黑的蒙版背景？如果说图片都是小编控制也就罢了，可以找些深色背景的图片，但下面这种
阅读起来真的好吃力哇，再说你们这个app针对的是青年人，也要关怀一下我们老年人哇。所以蒙版背景这种形式，土是土了点，但在更好的展示形式出来之前，绝壁不能省。
当然了，这是小细节，也罢，不影响产品，但我最大的赶脚就是“最新”这个页面的存在很鸡肋，因为网易公开课的内容五花八门，绝大多数人关注的是自己希望了解到内容，所以更新的那一堆，几乎就不是根据我订阅的类型分析过的，从里面扒拉好久才找到兴趣点，换句话说，我们来网易公开课，不是为了扫几眼新闻消磨时间的，最热或许可以看看，因为是人气最高的，一定程度上代表了内容的品质，至于最新嘛，拿掉也无关痛痒。
直播的界面同上，纵使“直播”现在是风口浪尖炙手可热，网易试新的心情表示理解，但是，但是，随便点开几个看了下，直播的内容相比较其他专题，真的是质量堪忧。直播，不是这款app的亮点，似乎直播内容下用户的评价也和我类似，“乱乱的，不知道在说什么”“音质差，听不清”等等，另外，直播哎，不要欺负我们不懂好吧，能快进的是直播嘛，这明明是“网易直播”的内容回放，何必凑那个热闹冠以直播的名头呢？嗯，名不副实，又可以砍掉一块。
页内导航剩最后一个，“分类”，其实，这才是最重要的页面，要从若干分类中筛选出自己所需，这个需求实在太强烈。个人甚至感觉首页的页内导航直接改成分类更加合适。
既然说分类重要，那我们来看看做的怎样，默认加载页还好，当进入某个具体分类频道（以心理为例）后，那个“筛选”功能着实让我凌乱了一把，因为当前已经是心理的分类频道了，所以当我试着用筛选时，第一反应就是对当前频道的内容进行筛选，没毛病啊，可当我再选了“数学”时，结果并不是我想象中的“心理✖️数学”，而是刷新当前频道，直接变数学了，所以我把下拉面板的数学和分类页的数学加了个双向箭头，感情您这不是筛选，是分类导航啊。当然了，你还不能在这个下拉面板中进行所有的导航，比如“公开课策划”的所有频道，还得从分类的默认加载页进去，然后在某具体的频道下的筛选面板只有“公开课策划”的，来来来，这个交互是哪位高人做的，一定是有想法，我不才，猜不透，求解～
这里的亮点是针对一个主题的单集视频和多集视频卡片的样式不同（蓝框框出的区域），单集的没有后面的层次感，这种视觉引导比单纯的文字描述直观，很喜欢。
3.视频播放
来看视频播放页
因为页面好长，所以只截取了有代表性的部分。关于移动端，纵向手势的应用一定优于横向手势，关于这个有机会回单独写篇文章，很有意思，但像这种展示“全部课程”就太适合横向手势了，因为用户回沉下心来，左右滑动去查看，当然，也同时提供了底部弹层的列表。而且当滑到某一极限时，顶部视频播放窗口消失，增加查看页面的视口，视频缩略成浮动层（红线框出的区域）以便切换。关于这种页面下滑时顶部区域消失以增加信息量的方式最近app用的也比较多，是一种根据心理模型得出的一个很友好的交互方式，不过这个app根据自己的产品性质做了改进，体验还是不错的。
关于跟帖，这里可比云音乐冷清太多了，只是不解的是，既然写跟帖是跳转到一个单独的页面，那搞个输入框就为了当入口用？嗯，一定是恁们网易开发人员充足，多做个页面无所谓，换做是我，该被项目组长嫌弃了，“什么？还要多个页面出来！”
另，这里有个bug啊，就是我回了2帖，内容都显示了，全部跟帖数量还是无变化，这个错误，低级了点……
4.订阅
说完页内导航，下面就是底部导航咯，订阅，也是主要功能之一。
同样，订阅也有三个页内导航，视频分类直接跳转到分类的默认加载页，添加订阅页面分为左右两栏，左侧为顶级分类（针对这款app，也是末级分类），右侧对应分类下的数据列表。
移动端要做好菜单树的功能还是需要费点功夫的，根据分类的层级数，每一层级的数量以及操作不同来选择适合的形式，由于公开课app层级结构简单，数据量小，所以这种展现形式还是适合的，添加/取消订阅操作也方便，成功订阅后会有一个是否推新的弹窗。成功添加后的灰色图标设计可以优化一下。因为灰色和亮色做对比时，通常传达的意思是不可用或者需要被弱化的操作，而这里，需要表示成功的状态。
再来看我的订阅，也是简单的列表，名称+更新提醒，不过这里的已开启是灰色的，不如改成下面这种绿色线框+对号的形式。原因同上。
5.课间
这里，云课堂完全模拟了课堂，搞了个“课间”出来，不过回想我们的学生时代，课间就是侃大山嬉闹嘛，咳咳，这里的课间是一些可参与的话题讨论。先来看界面，卡片形式，左右滑动进行卡片的前后切换，还好，虽然不是特别新颖的形式，但相比之前的页面轻松了许多。
手贱贱的翻到了最后一张，然后到“查看更多课间内容”，随便来个“哔哔”看看咯，这里把“被赞过”做的最大最醒目，也是为了激发参与讨论的积极性吧。配色上似乎稍微改进下最好，大的灰色纯色底块总感觉是产品要上线之前，产品经理突然说，快快快，这里需要把“X人赞过”搞得醒目些，然后设计师尚未来得及思考表现形式，搞了下布局就匆匆上线了。
6.小彩蛋
这个功能是因为我频频刷开这个app，然后看到的。金光闪闪的奖章一枚，就是激励用户的手段咯。
好了，app本身不复杂，就写到这里，即使有这样那样的小问题，染鹅，这仍是一款良心制作，原因？当然是内容为王啊。凭心而论，真的一款app的界面对用户有没有影响，肯定是有，但绝没有设计师们想象的影响力多么深远，一个优异的界面救不了一个烂的app，当然，一个好用的app我们会忽略很多界面和交互的问题，既然如此，那我们为什么还要分析app界面，吹毛求疵？还做什么优化？答案是：当然有意义啊，我可不想有一天自己的做的app也掉入同样的坑，然后被人指出来……其实绝大多数设计师做的都是敏捷开发，前期尽量一次成型，因为后期没有修正错误的机会，流程上能跑通，界面不那么丑，不引起用户误会，就已经算合格了，嗯，这是正解。