详解新版微博App聊天界面优化经验总结

2. 纵轴布局的变化

间距关系从一种新增至两种,增强他人态与主人态之间对话内容的间距关系划分,强化了气泡的纵向分组,进一步强化从属关系。

详解新版微博App聊天界面优化经验总结,PS教程,

△ 纵轴变化

单位模块

单位模块主要都是一些显示效果问题,例如,图片太小、LBS识别度低、红包太弱等…如下图所示:

详解新版微博App聊天界面优化经验总结,PS教程,

△ 旧方案

1. 合理的图片尺寸

当图片与气泡最大宽度呈黄金分割比例之时,既不会出现加载效率和流程性问题,又能保证一定的舒适度。

详解新版微博App聊天界面优化经验总结,PS教程,

2. 增强LBS的可用性

我们加强了LBS信息显示和识别度,让用户在对话页就能获取到相关地理位置信息,让LBS的可用性和实际场景更符合。

详解新版微博App聊天界面优化经验总结,PS教程,

3. 红包体验升级

强化了红包的显示效果,并使之更具中国特色。

详解新版微博App聊天界面优化经验总结,PS教程,

总结

我们这次优化的目标是思考能为用户解决什么问题?核心是聚焦对话。细节的深度挖掘打磨、布局梳理、强调互动性等等…所要传达的视觉表现都是建立在这个目标之上。

多角度,不同因素综合考虑,在美感与实用性中寻找平衡,合理的运用一些设计法则,与实际用户场景结合,能让界面变得更加舒适、可靠。

详解新版微博App聊天界面优化经验总结,PS教程,