當(dāng)前位置:首頁>ps入門教程>ps基礎(chǔ)教程>設(shè)計知識>教程內(nèi)容

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine(4)

來源:站酷 作者:wy198498 學(xué)習(xí):2745人次

 

  很多設(shè)計師認(rèn)為他們以自己為聰明的想法來設(shè)計ui,但是通過實際的用戶體驗測試來告訴你,何種設(shè)計是最好的?

  如果你是一個網(wǎng)頁設(shè)計師下面幾個問題你需要首先問問自己。

  以下所有的例子都是通過Ptengine Heatmap來分析的,這樣可以使設(shè)計師很容易理解用戶對網(wǎng)站的那些部分感興趣。


1. 巨無霸的bannner廣告真的是一個有效的產(chǎn)品廣告方式么?

  一旦你的網(wǎng)站有了一個巨無霸廣告圖,這意味著頁面空間將都會被這張圖占用,所以你必須有一個非常好的設(shè)計才能吸引用戶的點擊。這里有一個使用 Heatmap分析過的甜品網(wǎng)站截圖。我們立刻可以看到,bannner點擊非常少。如果我們通過頁面分析更深入的了解一下,我們會發(fā)現(xiàn)第一屏只有2% 的人點擊bannner。很顯然bannner的設(shè)計是為了讓用戶去接受更多美食信息,而用戶卻通過主導(dǎo)航和搜索來自主瀏覽他們喜歡的內(nèi)容。

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine


2. 最好的地方你應(yīng)該放什么內(nèi)容?

  很多設(shè)計師都在安排一些內(nèi)容在網(wǎng)站不同的地方。但是你要知道這樣放對于你的用戶來說是否有效。這里有2個例子展示好的廣告圖被放倒了糟糕的位置。

  第一種情況仍是對這個蛋糕網(wǎng)站的分析。有幾個有吸引力的甜點食譜放在了首頁底部,有大量的用戶點擊,但是只有37%的用戶是看到了頁面的這個位置。所以設(shè)計師應(yīng)該把“殺手級”的內(nèi)容放到更突出的位置,不是這樣么?

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

 

  我們的第二個案例也發(fā)生了同樣的事情(一個賣鞋的電商網(wǎng)站)。這個網(wǎng)站有很多的鞋產(chǎn)品列表在這么長的一個頁面上,你要清楚哪個類型的商品是你的用戶最關(guān)注的。雖然只有20%的來訪者訪問到了最底下,但是這里的鞋子的點擊率卻是這么高,這里的產(chǎn)品似乎對他們非常有吸引力。

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine


3. 你必須總是給圖片加鏈接么?

  在網(wǎng)頁中圖片的表現(xiàn)能力總是文字更好,但是你的設(shè)計不能敗于直接引導(dǎo)用戶去一個地方,你必須用一個富有意義的圖片。這里有一個著陸頁的例子,看這個頁面的heatmap分析,我們可以看到一些點擊在圖片上,我們知道這些用戶想看更多的關(guān)于這圖片的詳情。

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

 

  這里的第二個案例是手機(jī)設(shè)備的幫助中心頁面。我們可以注意到電話號碼有不少點擊,但是這只是文字。用戶是期望點擊這個號碼就能打電話,如果你不想失去目標(biāo)用戶,你最好改進(jìn)你的設(shè)計。

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

 

4. 我的網(wǎng)頁底部設(shè)計得足夠好么,會被用戶點擊么?

  請看下面的例子。在女裝區(qū)域,設(shè)計師用了hot標(biāo)簽去吸引潛在的女性客戶點擊,雖然使用了粉紅色,但是表現(xiàn)也并不好。更加明顯的是,在男裝區(qū)域用的藍(lán)色標(biāo)簽點擊更少。這樣我們能明白,不管設(shè)計師如何思考,除非去研究用戶,否則都是低效的。

 

神器介紹!頁面設(shè)計體驗優(yōu)化工具Ptengine

  偉大的設(shè)計師不僅僅是有良好的經(jīng)驗和想法去建設(shè)一個完美的網(wǎng)站,而且也要知道如何去調(diào)整自己的設(shè)計,并能根據(jù)用戶體驗,獲取更高的轉(zhuǎn)化率。Ptengine是一個偉大的工具,可以幫助完美獲取訪問者的數(shù)據(jù),這樣就有堅實的后盾去分析自己設(shè)計的有效性。如果你想成為一個偉大的設(shè)計師,請嘗試使用這個夢幻般的熱圖和分析工具(Ptengine)吧!

學(xué)習(xí) · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!