如何从设计侧出发推动产品的基础体验?本次我们将以京东APP为方案切入场景,对目前产品弹窗的体验制定优化方案。

前言

弹窗/模态作为当今产品主流的交互形式,承载着产品大部分的场景链路。弹窗的体验影响着用户使用产品的操作效率以及信息提示的感知,构建统一成体系的弹窗体验并促进优化产品的用户体验是本次方案的主要目的。

弹窗类型梳理

梳理目前京东APP所涵盖的弹窗类型及应用场景,主要集中为四类弹窗形式。弹窗类型主要以对用户的提示层级和交互流程中与用户的行为关联度作划分。

Untitled

线上弹窗体验痛点

本次针对弹窗的动效体验,反复体验目前京东APP所有类型弹窗在出现和消失时的动效后。总结了以下几点体验痛点。根据分析主要问题来源于弹窗体验的不统一性。为优化目前的体验,我们从弹窗的动态感知及运动样式出发构建统一的体验语言。

1.弹窗运动速率平缓以及运动时长过长影响操作效率。

2.线上模态视图在空间变化上采用卡片倾斜的处理方式,卡片倾斜的方式显得整体动态拖沓不流畅。

3.产品内各弹窗样式传递于用户不统一的动态感知。

动态感知优化

体验线上弹窗的运动可发现,弹窗运动速率对比较弱导致运动过于平缓。整体运动给予用户弹窗响应过慢的体验感知,影响用户操作效率。为解决以上问题,针对弹窗的运动情况(出现/退出)对相应的运动曲线、时长进行优化。

运动时间

在时间方面,我们对弹窗出现和退出的时间进行差异化处理。弹窗出现相比结束需要更多的时间让用户清晰的浏览信息内容和感知弹框提示,而结束时则作时间减少处理将用户注意力集中在即将跳转的场景而不是弹窗退出的过程,差异化的处理可提升产品的体验效率。

线上弹窗体验痛点

本次针对弹窗的动效体验,反复体验目前京东APP所有类型弹窗在出现和消失时的动效后。总结了以下几点体验痛点。根据分析主要问题来源于弹窗体验的不统一性。为优化目前的体验,我们从弹窗的动态感知及运动样式出发构建统一的体验语言。

1.弹窗运动速率平缓以及运动时长过长影响操作效率。

2.线上模态视图在空间变化上采用卡片倾斜的处理方式,卡片倾斜的方式显得整体动态拖沓不流畅。

3.产品内各弹窗样式传递于用户不统一的动态感知。