淺談如何更貼切的來(lái)設(shè)計(jì)手機(jī)產(chǎn)品發(fā)布者：本站     時(shí)間：2021-12-31 10:12:18

筆者身為音樂(lè)產(chǎn)品的設(shè)計(jì)團(tuán)隊(duì)中的一員，也同意這個(gè)道理，并且朝著這個(gè)方向使勁兒設(shè)計(jì)。然而，道理都知道，設(shè)計(jì)卻很糙，要問(wèn)怎么糙?一用嚇一跳。

先從自己說(shuō)起，下面是某Q音樂(lè)產(chǎn)品某時(shí)期的歌單推薦樣式，當(dāng)然了，我們能見(jiàn)到的很多音樂(lè)產(chǎn)品也用著大同小異，換湯不換藥的此類(lèi)推薦樣式。

淺談如何更貼切的來(lái)設(shè)計(jì)手機(jī)產(chǎn)品,PS教程,

而下面這個(gè)某度音樂(lè)產(chǎn)品的瀑布流樣式看起來(lái)更加上檔次，頗有Pinterest的設(shè)計(jì)風(fēng)格。

淺談如何更貼切的來(lái)設(shè)計(jì)手機(jī)產(chǎn)品,PS教程,

再看看叫賣(mài)很努力的某易云音樂(lè)產(chǎn)品，果然有態(tài)度，灑家很多圖。

淺談如何更貼切的來(lái)設(shè)計(jì)手機(jī)產(chǎn)品,PS教程,

看完了中國(guó)互聯(lián)網(wǎng)三座山的音樂(lè)產(chǎn)品的這幾個(gè)例子，大家用腳都能發(fā)現(xiàn)我們面臨的問(wèn)題了，那就是我們成功地動(dòng)用了各種專(zhuān)業(yè)設(shè)計(jì)力量和高雅音樂(lè)品味設(shè)計(jì)了一款款精美的,令人陶醉的，并且鍥而不舍賣(mài)力迭代的

“看圖軟件!!!”

(其實(shí)躺槍的不僅僅是音樂(lè)產(chǎn)品，電商產(chǎn)品的各類(lèi)美圖圖庫(kù)更加讓人心醉神迷，目不暇接，還請(qǐng)自備防彈衣，下回再表)

槽點(diǎn)既然找到，我就開(kāi)始一本正經(jīng)地揣測(cè)一下出現(xiàn)此類(lèi)問(wèn)題的原因何在，并且誠(chéng)惶誠(chéng)恐地試著提出解決這些問(wèn)題的方案。

part1：我們?yōu)楹芜@樣設(shè)計(jì)：

首先，我們想要和盤(pán)托出一堆內(nèi)容給用戶(hù)，結(jié)果真的把盤(pán)子也端了出來(lái)。

其次，我們怕用戶(hù)麻煩，所以給了一個(gè)漏斗直插用戶(hù)的耳洞—”全部播放，批量添加”等功能。

再者，我們怕用戶(hù)看不出來(lái)這是一堆什么東西，所以給配了一張精美的圖片，以便幫用戶(hù)具象化腦袋里的東西，比如，80年代必聽(tīng)的歌曲就配了一張犯黃的圖片寫(xiě)了大大的一個(gè)”80″(聰明吧)。

最后，我們甚至怕用戶(hù)看不見(jiàn)這個(gè)盤(pán)子，就放了個(gè)大大的圖片，當(dāng)然不能忘了配一行犀利的英文字體作為點(diǎn)綴，粗中有細(xì)，完美無(wú)敵。

依靠上面的設(shè)計(jì)思路，于是交互布局及跳轉(zhuǎn)邏輯設(shè)計(jì)完了，看似么么噠的方案，還原一下草圖：

淺談如何更貼切的來(lái)設(shè)計(jì)手機(jī)產(chǎn)品,PS教程,

part2： 用戶(hù)為何不喜歡?

家住深圳南山區(qū)的X先生最近接受了一次令人印象深刻的關(guān)于某Q音樂(lè)產(chǎn)品的體驗(yàn)訪談，他向(設(shè))計(jì)者表達(dá)了和很多用戶(hù)一樣的對(duì)于某Q音樂(lè)產(chǎn)品的看法，大概如下：

首先，歌單主題描述因?yàn)槭謾C(jī)屏幕太小被限制字?jǐn)?shù)了并且還不能跑馬燈滾動(dòng)(這確實(shí)不能)，本來(lái)一句話的描述只能看半句，那就不看了唄，扣一分。

其次，直接全部播放功能會(huì)因?yàn)辄c(diǎn)擊圖片時(shí)誤操作點(diǎn)擊到，打斷正在收聽(tīng)的歌曲，而且會(huì)直接跳到播放頁(yè)面，扣一分，

第三，用戶(hù)根本不知道里面有什么歌曲，為什么要直接播放，給個(gè)理由先，因?yàn)檫@不是電臺(tái)啊，完全不能放心聽(tīng)啊，扣一分。

第四，圖片都是大眼睛美女，到底怎么區(qū)分日韓港澳臺(tái)?扣一分。

第五，這么多圖片，看起來(lái)多像廣告啊，最討厭廣告了，扣一分。

第六，圖片這么多，肯定費(fèi)流量，手下留情扣一分。

第七，一鍵播放肯定更費(fèi)流量，才不要點(diǎn)擊呢，扣一分。

第八，點(diǎn)大圖進(jìn)去會(huì)不會(huì)默認(rèn)播放啊?上面有個(gè)播放按鈕啊，不敢點(diǎn)，扣一分。

第九，好不容易看到個(gè)閱讀場(chǎng)景的圖片，感興趣，定睛一看，標(biāo)題是”不吵不鬧，就很好聽(tīng)”，結(jié)果又一張冒著熱氣的圖片寫(xiě)著”下午茶咖啡館最?lèi)?ài)播放的歌曲”，到底聽(tīng)哪一個(gè)，糾結(jié)，扣一分。

…如果起評(píng)分是十分，那么我們?cè)缇筒患案窳?，什么風(fēng)格延續(xù)，大圖獨(dú)有，都是自我褒獎(jiǎng)了。

淺談如何更貼切的來(lái)設(shè)計(jì)手機(jī)產(chǎn)品,PS教程,

鼻青臉腫，老實(shí)解決問(wèn)題，作為一款并非全新設(shè)計(jì)的產(chǎn)品，基于用戶(hù)導(dǎo)向設(shè)計(jì)的思路，可以有如下思考：

1.本質(zhì)區(qū)別：音樂(lè)產(chǎn)品區(qū)別于圖片瀏覽產(chǎn)品的方面在于，音樂(lè)要聽(tīng)，圖片只要看就行了。

pinterest的瀑布流交互形式，那是為了解決大量圖片瀏覽時(shí)尺寸不一，內(nèi)容雜糅而設(shè)計(jì)的，metroUI的規(guī)則色塊是直接將內(nèi)容動(dòng)態(tài)更新到圖塊當(dāng)中而產(chǎn)生的，并不是樣子貨。