陌北默

@王二麻 动漫网站近年来越来越受年轻人青睐,虽然随着年龄的增长年轻人不再喜欢看小时候看的动画片,但是动漫却在一个较广的年龄范围内受到大众的喜爱。除了日本动漫,中国的动漫也在渐渐发展。因此许多为喜爱动漫的群体提供的平台逐渐发展起来,「哔哩哔哩」作为一个发展较早的动漫爱好者观看视频和互动交流的平台,人气较高,发展到现在不仅有动漫,也有国内外电影和连续剧资源,支持用户自主上传视频,因此在b站上出现很多人气极高的视频up主,弹幕和用户质量也普遍较高。同时,弹幕文化也在迅速发展,「哔哩哔哩」在国内也是较早出现弹幕的视频网站,在观看视频的时候发弹幕,既可以给观看用户科普相关知识,在视频播放的某个时刻即时解释视频内容,也可以和共同观看的其他用户进行互动。本次我们就给大家分享「哔哩哔哩」app的高低保真原型~

我们的原型包括「首页」、「分区」、「动态」、「消息」、「我的」五大一级界面板块,「直播」、「搜索」、「历史记录」、「个人主页」、「推荐」等二级界面,「播放视频」、「注册登录」等完整流程页面,含有图标和文字结合的「分类」完整组件、含有视频缩略图和文字介绍的「番剧区列表」,滚动切换的「banner动画」、「视频弹幕」的完整演示动画等,形式多样,要做动漫视频类app的盆友千万不要错过啦!

 

高保真与低保真原型对比

bilibili gaobaozhenduibitu

 

放出一个高保真预览gif——

bilibili preview

想完整预览所有页面和流程的戳这里

高保真原型预览:?xiaopiu-哔哩哔哩高保真原型

低保真原型预览:?xiaopiu-哔哩哔哩低保真原型

 

高保真组件库预览

bilibili gaobaozhenzujianku

 

利用组件库搭建页面

在精选广场的组件库里搜索哔哩哔哩,在搜索出的组件库右下角点击引用为我的公用库

bilibili zujiankusousuo

也可以戳这里进入高保真组件库→?xiaopiu-哔哩哔哩高保真组件库

之后点击右上角的引用按钮~

v2-5b0a788247bf2a868e4b2e826918f8bd_r

引用以后,就可以直接在项目中看到左边的组件库里有引用的这个组件库啦~所有引用的组件库会随着发布者的更新而更新哦~

这个组件库到底有多方便呢?看看这个动态演示↓

bilibili progress

 

资源地址

高保真原型预览:?xiaopiu-哔哩哔哩高保真原型

低保真原型预览:?xiaopiu-哔哩哔哩低保真原型

高低保真原型下载→?xiaopiu-哔哩哔哩高低保真原型下载

高保真页面库引用→?xiaopiu-哔哩哔哩高保真页面库

低保真页面库引用→?xiaopiu-哔哩哔哩低保真页面库

高保真组件库引用→?xiaopiu-哔哩哔哩高保真组件库

 

其他资源分享

更多资源详见专栏:xiaopiu工坊

或直接访问我们的网站:xiaopiu-精选广场

除了以上的APP原型模板,我们还有百词斩、知乎、喜马拉雅FM、天猫商城、WeUI、饿了么、音乐、ZAKER、Timeline、Yahoo News Digest、澎湃新闻、loading动效、腾讯视频、ofo小黄车、新浪微博、Instagram、Keep、支付宝、QQ、全民K歌、斗鱼、58同城、小程序-轻芒杂志、小程序-自选股、小程序-王者荣耀排行榜、小程序-朝夕日历、小程序-摩拜单车几十款精选多行业高品质原型模板等你来用哦!

 

原文地址:知乎

作者:王二麻

 

转载请注明:学UI网—UI设计师学习教程平台 » 视频APP「哔哩哔哩」原型分享

登录收藏

学UI就上学UI网!越努力,越幸运!

“学UI网www.ccopus.com?”最值得关注的UI学习平台! 每天发布高质量的设计教程和分享设计经验,服务于20万UI设计师,帮助初学者快速转型。每周六晚上免费YY公开课(36013311),给大家提供更多免费学习的机会。想成为设计师的你快来关注吧!

【特色推荐】

APP截图站app.ccopus.com” 海量APP截图,让你灵感爆发!国内最好的APP截图站。

UI作业网 zuoye.ccopus.com” 每一个作业题都尽量配有教程,交作业就有大神免费帮你点评作业,爽歪歪!

UI设计导航站 hao.ccopus.com” 专为UI设计学习者打造的资源+学习,双用途的网址导航站。亲爱的,你收藏了吗?

【学UI网 原创文章 投稿邮箱:tougao@ccopus.com,也可以找各个群的管理】

 
你可能喜欢的:
移动办公app「钉钉」原型分享移动办公app「钉钉」原型分享
「Ant Design」原型资源分享「Ant Design」原型资源分享
如何制作统一可复用iOS/Material Design元件库?(附源文件)如何制作统一可复用iOS/Material Design元件库?(附源文件)
在线教育APP「网易云课堂」原型分享在线教育APP「网易云课堂」原型分享
以手机淘宝为例,看原型图易缺失的交互场景以手机淘宝为例,看原型图易缺失的交互场景
背单词APP「百词斩」原型分享背单词APP「百词斩」原型分享
对于UX设计,你不必知道一切对于UX设计,你不必知道一切
问答社区「知乎」APP原型分享问答社区「知乎」APP原型分享
不能错过的Sketch实用新技巧和资源集锦不能错过的Sketch实用新技巧和资源集锦
App搜索功能探析(附原型模板)App搜索功能探析(附原型模板)
?