CPP无差别同人站视觉&交互优化

这次改版的APP是被吐槽已久的CPP，无论是网页版还是移动端，用起来都让人非常头疼，不知道有多少小伙伴被这款软件折磨过呢（笑）。

CPP在发现页包含的信息种类相对比较全面，但是首页的视觉设计上仍有很大的优化空间，而且一旦体验了相关的功能和交互，你会发现各种交互逻辑以及功能模块的设计简直就是灾难...因此我们要进行大刀阔斧的改动。以下是APP的相关内容截图。

原版的设计中，上半部分的主要有搜索框、快速入口、banner、热门展会快速入口。在发现页的一级界面中，这样设计功能是没有问题的，点击banner或卡片就可以查看相关展会/企划的详情。还对功能进行了分类

在点击头部的搜索和快速入口区域后，会进入二级页中不同的分页标签栏目下。如果直接点击搜索框，进入二级页会自动跳转至【粮坑】标签栏下，但就算此时我订阅了相关粮坑，却不会显示任何内容，需要切换分页标签再返回刷新才能显示。

这个逻辑简直就是逆天，而且完全可以把二级页中的栏目整合到首页中。甚至我觉得在这种交互情况下，二级页当首页也完全没问题，原版的设计完全就是多此一举。

在二级页中很多内容完全是为了做而做，根本毫无实际的用处，例如【用户】和【社团】。完全不清楚这个东西的推送机制是什么，刷新也没办法获取新的内容。粮坑还经常失联——

在这里发现页剩余的内容就不截图和一一列举了，因为功能是一模一样的，点击图片跳转详情，点击更多跳转到二级页面相应的分页标签下。今天改版的目的就是要整合功能模块，然后优化视觉，让CPP看起来稍微再精致一些.

既然要整合模块优化交互，就先要把相关功能列出来，这只是一个很简单的版本，像相关页面下的具体模块由于篇幅问题暂时不列举得这么详细，如果后续有时间会再写几篇把剩下的内容补一补。

在原来的版本中，所有页面几乎都要导向搜索页的分页栏中，这次改版我们直接把分页提取出来放在首页，并且对几个重点功能进行了划分，让人用起来不那么混乱。

有了简单的功能地图后，我们针对【我的粮坑】进行页面框架的设计。

在改版的框架中，把原来搜索页中的栏目拉了出来在首页整合成了4个分页，点击即可浏览相应页面的内容。原版首页的banner仍然是不变的，同时增加了官方公告，可以及时看到官方的重要消息。

在粮坑页下方的分页栏中，完全是按照原来的功能进行设计的，同时将原来的粮坑管理页移动到了这里，更加直观和方便管理。粮坑热门作品和推荐作品也相应的按顺序移动到了下方。在推荐中，做了类似小红书的瀑布流，可以更好的引导视觉动线，同时增加页面的丰富性。

在已经有了大的框架后，剩下的就是填色填图了，先来看看上半部分的效果。将之前二级页中的界面和词条整合到首页了，同样也是分页标签的形式来展示，同时填充的背景色是从原来的品牌色中提取并优化的，选用深色的界面能够更好地突出banner和公告之类的信息。

在剩余的部分中，分页标签也是原来【粮坑】中就有的功能，只是提取出来做了交互和视觉优化，现在可以同时看到所有粮坑中的作品了，也可以点按订阅的词条来浏览单一粮坑，管理粮坑也会更加直观。

同时做了热门推荐，也做了一些小的视觉调整，也可以到二级页面中查看更多的热门内容啦。剩余部分就是类似小红书的瀑布流推荐。

在最下面的tab bar，把之前的图标替换成新的一套图标，之前的一套图标虽然很有“品牌感”，但是无论是从颜色还是样式上都不够直观，也不够好看，当然现在这个图标也还是有优化空间的，现在只是做一个粗略的版本。

接下来看一下和原版的对比。

目前只是对其中一个小模块的交互和视觉优化，而且很多问题由于篇幅问题根本讲不清楚。在CPP中有很多问题需要去优化，体验过CPP的人就知道原版APP有多难用了...现在这个版本肯定是要比原版好用得多的，以后如果有机会会再把剩下的页面改完~~