交互动效- day②

还是按照“动效所在的页面和位置——这是一个怎样的动效——这个页面的使用场景是怎样的——为什么要这样设计——是否达到设计目标”的思路，分析第二个案例。

---

② 贴吧首页推荐下拉

1.动效所在的位置是首页顶部的tab栏；

2.动效由4部分组成，同时进行：a.推荐面板向下延伸；b.下拉控件转化为上拉控件；c.背景部分渐渐变暗；d.原来的栏目文字消失，同时以新的样式浮现并下移至所在位置，tab左边浮现“切换栏目”。

3.在我的理解看来，百度贴吧的“首页”相当于“发现”页面，用户来到这个页面是为了探索新的内容，而贴吧将这些内容做了不同的分类，方便用户有目的性的筛选。

4.我们来看这个动效有什么具体的作用：a、d 引导用户将注意力转移到新展开的面板，过渡自然，用户顺利完成当前的任务；c 使页面的重要内容得以凸显，完成关键内容的呈现，使用户完成任务不受干扰；b 是控件的转化，告诉用户这里变成了“上拉”控件，点击可向上收回面板。

总的来说，这个动效是tab超过显示区域的一种扩展方式的方案——平面内左右滑动+立体空间内展开。这两个方案都是为了展示超出显示区域的内容，但展开收起的动效更适合数量更多的栏目管理。

5.当小明切换到首页，看到tab栏未显示完的文字以及向下的控件，他尝试将tab栏向左滑动，发现能显示更多内容，他又点击向下控件，发现内容会以展开的形式出现。这样小明就明白如何查看不同分类的内容了。