0-1 搭建无忧包下单小程序 Web 版

无忧包下单小程序是一个帮助续包专员给车主下保险订单的 B 端工具。此需求从 0-1 搭建了 Web 版本的小程序,满足了 PC 办公的保险下单需求,提升续保效率

#UI/UX

🤔一句话描述需求

当前包开心(蔚来保险销售人员,又名“续包专员”)完成一个完整的续包流程,需要在「无忧包线索管理小程序-web 端」和「无忧包下单小程序-移动端」来回切换,步骤繁琐且效率低。此外续包流程无移动端使用场景,大部分是坐班完成所有的工作。因此急需上线 Web 版无忧包下单小程序,降本增效。

🎯 设计目标

1. 提供续包专员一个高效的 Web 版下单工具,提升操作效率,增加收益

基础信息

下单流程图

交互设计

开始:应用面板中增加「无忧包订单」小程序入口

Step 1: 选择车辆&人员

Step 2:选择无忧包

Step 3: 签署合同

Step 4: 发起收款

订单详情

Stg 录屏

竞品分析

调研范围

分析了Apple、Tesla、平安车险、宜家等下订单流程

查看调研文档

设计挑战

挑战 1: 信息布局(车辆信息 VS 保险价格信息)

挑战二: 创建订单、详情页的操作按钮位置是否要保持一致

用户验证

Figma Demo 原型

调用用户:5 位来自全国各地的包开心, 男女比例 1:4

用研目的:1) 调研下单交互的可用性和易用性。2)对下单页面信息布局方案进行验证。调研文档

关键结论

项目总结

设计决策 = 场景分析+可用性测试+竞品分析+ ...:

在设计过程中,面对不确定的解决方案时,首先可以根据真实的用户使用场景进行判断,其次参考竞品亦能够辅助决策。如对方案仍然存在不确定性,可通过可用性测试,对方案进行进一步的调研和验证

“对用户反馈的问题需要进一步分析和考虑”

可用性测试不仅是一个验证设计方案合格的方式,也是一个提升产品基础体验的机会。在调研过程中,用户往往会吐槽现有流程中不愉快的地方,以及给出改进建议,或提出新功能的要求。但是这些反馈只具备参考性,产品经理和设计师需要深入去研究背后根本原因,寻找最佳解决方案。