• 文/WOOSEVELT
• 發佈於1天前
• 閱讀2407
• 評論0
• 喜歡2

閱讀2407

標籤：

• 產品經理
• 嗶哩嗶哩
• 產品原型

動漫網站近年來越來越受年輕人青睞，雖然隨著年齡的增長年輕人不再喜歡看小時候看的動畫片，但是動漫卻在一個較廣的年齡範圍內受到大眾的喜愛。除了日本動漫，中國的動漫也在漸漸發展。因此許多為喜愛動漫的群體提供的平臺逐漸發展起來，「嗶哩嗶哩」作為一個發展較早的動漫愛好者觀看視頻和互動交流的平臺，人氣較高，發展到現在不僅有動漫，也有國內外電影和連續劇資源，支持用戶自主上傳視頻，因此在b站上出現很多人氣極高的視頻up主，彈幕和用戶質量也普遍較高。同時，彈幕文化也在迅速發展，「嗶哩嗶哩」在國內也是較早出現彈幕的視頻網站，在觀看視頻的時候發彈幕，既可以給觀看用戶科普相關知識，在視頻播放的某個時刻即時解釋視頻內容，也可以和共同觀看的其他用戶進行互動。本次我們就給大家分享「嗶哩嗶哩」app的高低保真原型~

我們的原型包括「首頁」、「分區」、「動態」、「消息」、「我的」五大一級界面板塊，「直播」、「搜索」、「歷史記錄」、「個人主頁」、「推薦」等二級界面，「播放視頻」、「註冊登錄」等完整流程頁面，含有圖標和文字結合的「分類」完整組件、含有視頻縮略圖和文字介紹的「番劇區列表」，滾動切換的「banner動畫」、「視頻彈幕」的完整演示動畫等，形式多樣，要做動漫視頻類app的盆友千萬不要錯過啦！

高保真與低保真原型對比

戳大圖可以看到高清對比~

放出一個高保真預覽gif——

想完整預覽所有頁面和流程的戳這裡↓

高保真組件庫預覽

利用組件庫搭建頁面

在精選廣場的組件庫裡搜索嗶哩嗶哩，在搜索出的組件庫右下角點擊引用為我的公用庫

（或者直接簡單粗暴的戳這裡→ xiaopiu-精選廣場搜索「嗶哩嗶哩」）

也可以戳這裡進入高保真組件庫→ xiaopiu-嗶哩嗶哩高保真組件庫

之後點擊右上角的引用按鈕~

引用以後，就可以直接在項目中看到左邊的組件庫裡有引用的這個組件庫啦~所有引用的組件庫會隨著發佈者的更新而更新哦~

這個組件庫到底有多方便呢？看看這個動態演示↓

資源地址

文/WOOSEVELT（知乎專欄：xiaopiu工坊）

本文由 @WOOSEVELT 原創發佈於產品壹佰，未經許可，禁止轉載。