十五年信息化建设品牌 - 主营:提供信息化建设解决方案、提供内容安全监测解决方案

柳州信息化建设之重磅!移动端个人中心体验优化!

 二维码 7
发表时间:2022-06-24 16:37


改版背景 / BACKGROUND

为了兼容教育系统频繁的内容迭代和日渐完善的功能,学员端需要一种更简约、更舒适、更符合效率美学的设计方案,项目组评审后决定投入更多精力关注学员学习体验、升级系统的店铺视觉表现。

移动端店铺作为学员使用的主要终端,成为我们本次升级优先实装的内容。

根据使用和反馈情况,设计团队在一期对移动端个人中心区域进行了排查、分类 ,针对存在问题进行逐一解决。


设计目标 / TARGET

【产品层】设计团队借此会更深入了解系统的使用人群、清晰机构的业务运作流程,进而去了解移动端使用人群——学员的属性。

【交互层】秉承以用户为中心的体验设计理念,‍深入理解人群喜好和设计发展趋势,优化学员端信息布局与使用流程,提高使用、学习效率。

【视觉层】结合当下流行趋势和使用场景,剔除浮躁,呈现简约、高效的视觉界面。


从效率为核心出发,寻找设计切入点,经过团队多方调研探索和人群分析,明确设计升级方向:


发现问题 / PROBLEM

针对学员端个人中心,设计团队走查了数十款有相似场景的APP,经过反复分析讨论,复盘出我们的设计在以下维度的优化空间:


设计策略 / STRATEGY

1. 构建清晰的信息层级

新方案优化了元素比例、关键信息层级问题。
团队希望保持界面清爽、简约,同时可以兼容机构独有色彩的能力。

个人中心的优化表现


推广员的优化表现


订单模块的化表现

2. 高效利用空间,让内容露出更多

随着教务、营销功能的完善,旧样式在空间利用上有很大的提升空间。
新方案使用矩阵布局,空间利用率能有效提高61%。

个人中心功能矩阵

针对表单我们移除了页面跳转交互,通过简单的折叠展开,能实现学员在当前页面解决表单查看问题,提高使用效率。

表单化表现

3. 提高视觉精度,提升产品质感

为了提高机构店铺的品牌形象,设计团队精心打造全新图标库,贴合教育场景的符号设计,兼顾个性化主题色的应用和视觉的一致性,实现准确、高效的信息传递。

新图标库

4. 升级设计语言,确保视觉一致性

保证产品表现的一致性,减少学员的店铺上手成本。

店铺设计风格

结语 / SUMMARY

1. 打造清晰层级,提高信息高效传播

清晰的视觉效果及信息层级,让有效信息更快更准确让用户触达

2. 有效利用空间,让内容露出更多

展示更多信息,曝光更多核心功能,助力教务、营销更上一层楼

3. 提高视觉精度,提升产品质感

提高店铺整体设计质感,赋予企业专业感,实现高效的内容传递

4. 升级设计语言,确保视觉一致性

重新制定设计风格和基础规范,并搭建了业务组件,确保用户一致的产品体验

通过此栏目,团队后续将发布更多可公开的视觉优化方向和具体内容,感谢各位老师的支持。

会员登录
登录
其他帐号登录:
留言
回到顶部