【面向ACG编程】JE吧github网站更新思路

2017-08-22  本文已影响271人  跑者小越

上篇文章我们说到了曲谱库建立的思路以及过程，这篇文章我们将要对目前为止的几次版本更新进行分析。

移动端网址：http://jefun.top
PC端网址：http://lightmoon.pw
曲库地址：https://github.com/zytx121/justice_eternal/issues

v1.0.0

首先是第一版，也就是上篇文章截图中的那版。

之所以琢磨着添加了部分标签隐藏功能，是因为考虑到除了首字母标签之外，后期可能会加入大量个性标签（正如现在曲库中存在的标签：华尔兹、单曲、V家、LL、国产、gal、Fate等等）。所以将其他标签隐藏，只留下首字母是为了节省网页空间，让空间不那么紧凑。

关于b站api的引入完全是出于对b站的热爱，后来发现移动端无法播放b站视频（下面会提）。

aplayer是一款很漂亮的音乐播放器，支持歌词，列表，而且同一页面的播放器之间默认是互斥的，不会同时播放。当你点开一个播放器后，之前正在播放的播放器会自动停止播放。这对于在同一页面上展示不同大佬的口气录音是极好的！

v1.1.0

由于部分页面的贴图是直接下载的原图，导致加载速度过慢。使用ps对分辨率进行了调整，加快了图片的显示速度。

顶部tap的布局有问题，右上角的图标会挤压下面的文字。

v1.2.0 miku

这是首个以动漫人物命名的主题版本，整个界面配合首页的miku贴图，都变成了初音的颜色，为炎热的夏季带来了一丝清凉。同时，这也是网站上线后首次重大更新，听取了本网站首席产品汪的意见，对网站做出了重大改动。首先对网站的首页进行了简化，明确了搜索的主题。去除了冗余首字母分类功能，因为经过分析，貌似不会有人去使用首字母翻阅曲库，该功能略显多余，同时也会使首页变得复制，印象搜索体验。同时删除了搜索结果页面的分页功能，只留下一个干净的搜索结果列表，提升用户体验。（有广告或者推荐的搜索结果页面会让人恶心。）将反人类的顶部bar改到了底部。。。貌似只有b站等少数网站采取了吸顶的设计，目的是引导使用者往下无限刷新。将原来的视频页面和录音页面合并为佳作欣赏页面，都属于分享内容，同时起到突出本网站搜索主题的作用。搜索结果为空时，引导并鼓励使用者到github曲库进行谱子的提交。

v1.3.0

该版本对网站进行了又一次重大升级。首先经过贴吧的反馈，将原本仅仅支持移动端的布局改写成了响应式，增加了对ipad以及PC浏览器的支持。同时考虑到谱子数量的日益增加，将原来的一次加载所有的搜索内容改为了上拉加载，一次只增加十条。同时加入了有趣又人性化的提示。

增加了loading时的趣味提示框，算是彩蛋吧！不同场景的loading提示内容是不一样的哦！另外loading框还能提升等待数据响应期间的用户体验。

遵照首席产品的建议，将所有指向外部网站的链接（如：github、贴吧）从在当前窗口打开改为了在新窗口打开。

由于贴吧里排骨的教学视频深受大家喜爱，大家希望能够有个地方能够将这些视频收集起来，方便观看学习。于是推出了教学专区，征得排骨同意后将其所有教学视频进行了收录。同时优化了视频列表的布局及外观。

为几个页面添加了悬浮框效果，感觉看起来效果不错。

引入了gitalk，使用另外的仓库的issues来存放评论，支持在当前页面进行评论。同时也将存放口琴谱的issues和评论的issues进行分离，避免数据相互污染。

删除了侧边栏多余的链接，与bottombar的链接重复。使用者明明可以通过bottombar跳转，没有理由通过sidebar进行跳转。

优化了bottombar的外观，将其固定于浏览器底部。

v1.3.1 Matthew

关于谱曲上传规范

对于日本作品，一律采用官方译名作为title；
对于英语作品，一律采用英文名作为titile；
对于出名的歌曲，添加单曲label；
上传作品不限于ACG；
为了尊重作者，上传谱子务必填写歌曲相关信息。

上一篇 下一篇

猜你喜欢

热点阅读