以Xeropan改版为例，探讨怎样的UI设计才算是成功

记得曾经有个客户跟我们说，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设计成功的关键所在。