首頁技術(shù)文章正文

H5設(shè)計(jì):結(jié)構(gòu)設(shè)計(jì)分析方法

更新時(shí)間:2021-02-21 來源:黑馬程序員 瀏覽量:

設(shè)計(jì)需求:

校園表白場景感的播放音視頻界面設(shè)計(jì)

產(chǎn)品目標(biāo):校園表白 鼓勵(lì)用戶聽廣播表白

用戶目標(biāo):通過廣播結(jié)識(shí)朋友,表白獲得愛情

結(jié)構(gòu)設(shè)計(jì)

頂部設(shè)計(jì):彈幕區(qū);此處不易手控操作,所有設(shè)計(jì)為用戶可以觀看的內(nèi)容,刺激用戶主觀能動(dòng)性發(fā)布彈幕

頂部背景設(shè)計(jì):視覺效果要突出,營造校園愛情表白氛圍,此處可設(shè)計(jì)篇幅大一些,便于吸引用戶視覺

中部內(nèi)容設(shè)計(jì):播放電臺(tái)的控制按鈕,便于用戶操作切換電臺(tái),還可以給感興趣的主播點(diǎn)歌,強(qiáng)調(diào)點(diǎn)歌功能,刺激用戶

中下部設(shè)計(jì)更多內(nèi)容選擇:當(dāng)用戶對(duì)當(dāng)前推送內(nèi)容不感興趣時(shí)可以快速切換,給用戶帶來更多選擇

底部設(shè)計(jì):強(qiáng)調(diào)發(fā)彈幕和聊天,促進(jìn)用戶之間的溝通營造校園表白的氛圍,在滿足用戶需求的前提下,達(dá)成產(chǎn)品目標(biāo)

草圖設(shè)計(jì)如下

H5頁面設(shè)計(jì)效果

H5設(shè)計(jì)草圖



猜你喜歡:

UI設(shè)計(jì)之色彩的心理效應(yīng)

ui設(shè)計(jì)是什么?UI設(shè)計(jì)行業(yè)前景怎么樣?

UI設(shè)計(jì)原則:匯總深入人心的UI設(shè)計(jì)原則

黑馬程序員全鏈路UI/UI設(shè)計(jì)課程

分享到:
在線咨詢 我要報(bào)名
和我們在線交談!