提交需求
赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!
站在司机用户的角度了解他们的真实需求,提升ui升级,这次系统改版对自己来说也是提升。
什么是司机端B面
What?
滴滴代驾司机端是一款针对平台代驾司机的app,主要用于帮助他们完成接单、抢单、接送乘客的日常工作流程。而司机端的b面,查看司机所有跟“个人”相关的信息,及钱包、订单、等级等。
自学或者是正在学习UI设计的可以加我们的UI设计交流群606705140,每天晚上都有十几年经验的老师进行讲课解答疑惑,以及免费领取学习资源和软件。
写在前面
Who?Where?
他们是一群穿绿背心的代驾司机,在此之前,他们可能是企业的司机,可能是快递员,可能是一个普通的公司职工,也可能是快车司机......他们穿梭在夜间的城市道路中,服务于我们的代驾的乘客们。
但他们也是一群需要被关怀的群体,他们除了“上班”正常的接单外,他们在:“下班”状态下,更关心的是什么?当前页面的设计结构否满足用户的使用需求?
可用性测试
DIY Test
什么是DIY 可用性测试?
DIY 可用性测试绝对是定性的,通常DIY test 只需要3-5位真实用户即可。它不是要证明什么?而是要让我们倾听用户的真实感受,确定要修复的问题及如何修复他们。
调研目的 — 视觉设计
针对司机端B面“更多”和“个人中心”的板块,从视觉设计的角度出发, 找到用户在体验中遇到的问题,并为此研究视觉上可优化的方向。
用户选择
通过APP叫单的方式,找到5名代驾司机
提问环节
界面浏览 — 更多页面/个人中心
目的:让用户判断我们的框架时候合理?视觉入口是否明显?用户能不能快速查找他们所需的相关内容。
界面浏览结论 — 更多页面
目的:用户在测试环境下浏览界面,从上至下浏览,逐个内容进行点击,查看关注相关内容,或直接点击头像进入“个人中心”页面。页面结构比较散,用户浏览不到重点内容,用户只能地毯式搜索或者凭页面的熟悉程度进行查找。
界面浏览结论 — 个人中心
目的:用户首先点击头像查看等级和经验值,未看到相关信息后在进行查找,相关的文字和icon。新手司机和老司机对个人中心页面关注查找的侧重点有所不同,新手司机更关注客人评价。
情绪板
moodboard
什么是情绪板?
情绪板是一种启发式和探索性的方法,可以对如下问题进行研究:图像风格(photography style),色彩(color palettes),文字排版(typography),图案(pattern)以及整体外观以及感觉。视觉设计和人的情绪紧密相连,不同的设
计总是会引发不同的情感。情绪板也可以作为可视化的沟通工具,快速地向他人传达设计师想要表达的整体。
关键词
结合上文的分析,司机端B面一般是在司机“下班”的状态下使用,在产品的设计上要传递给用户关键词定义为
情绪板建立
基于体验关键词创建情绪板
情绪板关键词提取
总结:moodboard引申出的设计元素会运用到整体页面的视觉优化上,提升品牌感。
情绪板设计元素的提炼
视觉优化方向
Vision Design
根据上述可用性问题调研,总结以下视觉可优化方向
框架结构:优化布局 主次分明
a.调研更多页和个人中心页面的结构布局,增加页面的主次感觉,提炼用户常用模块,让新老用户都能快速找到对应入口。
b.优化个人中心卡片设计,不改变操作流程,提前露出埋藏较深的入口。
视觉体系化:规范图标 统一设计样式
a.根据moodboard设计元素的提炼,整合优化icon设计
b.优化个人中心卡片设计,不改变操作流程,提前露出埋藏较深的入口。视觉优化 统一子页面设计样式。
线上品牌理念: 品牌辅助体验
a.引入线上品牌理念,建立端内品牌DNA,品牌辅助体验,提要用户对平台的归属感。
UI体系优化 — 更多页面/个人中心/等级体系
Redesign
根据调研报告,对司机端B面的主页面“更多页面”“个人中心”进行UI视觉优化。
页面整合 — 高效浏览 卡片重组
1.重新整理 “更多页面”和“个人中心”页面,梳理框架结构。“等级”、“钱包”、“订单”是司机常用且较关心的业务入口,露出且放大常用入口。重组卡片信息,让内容的层次分明,引导用户快速找到对应的入口。
2.突出“我”页面的等级氛围。在“我”页面,整和了“更多页面”和“个人中心”的重要点击入口,在院线的版本中,青铜、白银、黄金、铂金、钻石 5个司机等级除了文案,没有其它的设计区分,并且司机需要二次点击查看“距离下一等级”相关信息,加强等级入口,重要信息提前露出。
3.等级进度可视化。司机等级通俗来说是区分“好司机”和“普通司机”的重要手段,但在之前实际的运行过程中,发现有一定差异。重构等级体系,让它变得更加合理,为了适配新的等级规则,将等级模块进行可视化视觉设计,在满足功能的基础上,更加强化了司机更关心的功能细节和等级的氛围区分。
视觉体系化 — 规范升级 体验优化
好的设计是高效的,让开发能够高保真还原视觉效果,减少沟通成本,完成快速上线在改版后,升级视觉规范,建立段内的品牌DNA,品牌辅助体验。
1.icon的重新定义。在情绪板提炼出了线和面的元素,可落地在icon的优化设计上,图标作为产品的服务以及品牌传播的视觉表达应具备的一致性。所以在icon的设计上简单、易懂。能让司机准确理解icon的表意。
规范的重新定义。重新定义了B面的设计规范:颜色、字号、icon、列表样式等。
总结
Conclusion
这次版本的更新对自己来说最大的收获是能站在全局、站在用户的角度思考问题,从问题的调研到将发现的问题总结落地到UI上,从整个框架的调整到结构信息的整理。给用户丰富但结构简明的视觉认知。
项目完成并最终落地时,我们看到了代驾司机端使用体验满意度明显上升。但是目前仅是进程的开始,我们的工作并没有结束。比如后续设计需满足更多不同群体司机师傅们的需求,我们将更继续努力基于数据、反馈来定义更好的用户体验。
大牛,别默默的看了,快登录帮我点评一下吧!:)
登录 立即注册