記得曾經有個客戶跟我們說，UI設計很簡單，只要界面做得好看，能吸引使用者的目光，並給使用者帶來舒適的視覺體驗，那就證明這個UI設計是成功的。

但UI設計真的如這位客戶說得那麼簡單嗎?下面，Inspirr將會以一個叫Xeropan的趣味遊戲英文學習APP的改版過程為例，和大家說說到底「怎樣的UI設計才算是成功的」。

Xeropan改版前存在哪些問題?

UI設計案例介紹

▲ Xeropan改版前是長這個樣子的

Xeropan改版前的UI設計其實並沒有想像中難看，甚至路人點贊評分也不低，唯一美中不足的是付費轉化率卻遠遠低於預期。

為什麼會出現這種情況?事實上，根據使用者的反映，他們不願意付費並非產品不夠好，也不是產品價格過高，而是感覺這個APP設計比較低齡化，不適合自己的年齡段和身份;以及免費與付費之間的權限差異並不大。

因此，要解決這一問題，Xeropan需要做的就是「改變低齡化形象，同時讓定位與付費用戶更加貼合」。

【Xeropan APP的改版過程 逐步找准產品定位】

第一版：低齡化嚴重 產品專業性不高

UI設計案例介紹

為了搞清楚為什麼使用者會對產品形象產生誤判，設計師與用戶進行了訪談實驗，發現：

· 產品icon與學英語關係不大，反而讓人認為這是一個醫藥健康類APP

· UI設計看起來非常幼稚，不夠專業，不夠嚴肅

第二版：icon換成年輕教授

UI設計案例介紹

針對第一版存在的問題，設計師將icon改為年輕教授，看起來更專業，更像老師;針對使用者反饋「插畫複雜，難以理解」的情況，設計師去掉了很多元素，同時為了讓等級和話題更清晰，加強界面的色彩方案對比，並有一根線串聯。

用戶反饋：

整體UI設計更加簡單明了，但兩個版本的方案差異太小，產品依然看起來比較低齡化。

第三版：去掉插畫故事

UI設計案例介紹

針對第二版所存在的問題，設計師去掉了icon中教授的外套，讓他看起來更加年輕;將之前島嶼和時間旅行的概念去掉，選擇更清晰易懂的信息布局。

用戶反饋：

整體UI設計一掃之前兩個版本的低齡化感覺，產品定位更符合大眾、成人和專業人士;但正因為界面更偏向商務人士使用，反而讓人困惑到底這款產品是用來做什麼的。

第四版：重新設計插畫故事

UI設計案例介紹

之前版本的UI設計太過專業，反而會誤導用戶，於是這次改版還是回歸遊戲化元素，繼續以時間旅行和角色概念為主，但整體視覺風格變得更加簡潔、成熟化。

UI設計案例介紹

使用者剛進入產品時，可以根據自己的語言和難度等級，了解故事的發展。

UI設計案例介紹

插畫比之前更簡潔，布局也更加統一，讓用戶能快速理解產品定位。此外，每個主題都有詳細的介紹，能激發使用者的探索欲。

UI設計案例介紹

強調顏色與等級之間的關聯性，讓用戶能快速判斷所處的階段。

UI設計案例介紹

產品除了提供原有常規課程，使用者還可以通過完成常規課程收集星星解鎖額外的獎勵課程。

用戶反饋：

本次改版在保持原有產品遊戲化和故事性的特徵前提下，改變整體視覺風格和概念，讓產品定位更符合大眾，並確保使用者一看就知道這個APP是用來學習語言，而且還和旅遊相關。免費和付費版本差異拉大了，吸引更多付費意願強的年輕用戶使用，從而提高付費轉化率。

最後，我想說…

很多企業做認為UI設計很簡單，界面改版畫來畫去就那幾個版式。上述改版案例卻告訴我們，最終的成品背後是需要做很多個方案和測試才能找准方向的。再者，或許將這四個版本給使用者點贊評分，很可能第一版分數最高，但最後真正能幫產品賺錢還是最後一版。

可見，UI設計的難點不是畫圖，而是找准方向、不斷測試、讓產品滿足UX設計……而這些流程才是UI設計成功的關鍵所在。