神刀安全网

App常见异常状态

导语:用户在使用App时,除了正常的使用场景,还会碰到许多特殊场景:页面加载中(请求数据)、页面内容为空(缺省页面)、网络异常、服务器异常、下拉刷新、下拉加载、版本兼容等。友好地设计产品在特殊场景下的状态,对于用户体验至关重要。

一、页面加载中(请求数据)

1、场景:当进入页面,无缓存数据,则在页面上显示加载中的状态。原生页面多以插画的形式呈现。H5页面则在头部出现进度条。

2、交互:进入页面请求数据,最长加载时间为10s。10s后若加载不出数据,则返回网络/其他异常提示。

App常见异常状态

页面加载中(以土豆视频App为例)

二、页面内容为空(缺省页面)

1、场景:当进入页面,无数据,则在页面上显示该状态。

2、交互:对内容关注页,可以引导用户进入推荐页进行订阅;对搜索/筛选结果页,可以引导用户更换关键词或推荐其他相关热门内容;对普通的缺省页面,可以以插画配生动的文案告知用户当前页面为空。

App常见异常状态

页面内容为空(以土豆视频App为例 )

App常见异常状态

搜索结果为空(以B站和腾讯视频APP为例)

三、网络异常

1、头部

1)场景: 当进入页面无网络,则头部空出一行显示该提示。 

2)交互:当网络正常时,这行提示自动消失;当网络异常时,这行提示固定在页面上,点击时进入手机wifi设置页。

2、页面上

1)场景:当进入页面后网络异常且无缓存数据,则在页面上显示该状态。当进入页面后网络异常且有缓存数据,则页面上不显示该状态,只在头部提示网络异常。

2)交互:当网络正常时,回到加载中的状态,显示出数据。点击“重新加载”按钮,再次请求数据。

App常见异常状态

网络异常( 以京东App为例  )  

四、服务器异常

1、场景:当进入页面后服务器或非网络的异常且无缓存数据,则在页面上显示该状态。

2、交互:错误代码由后端返回。点击“重新加载”按钮,再次请求数据。

App常见异常状态

服务器异常原型

五、下拉刷新

1、场景:当用户下拉页面时,页面内容往下,空出一行显示该提示。

2、交互:下拉与请求数据时出现该动图,最长加载时间为10s。10s后若加载不出数据,该动图消失,然后在头部返回网络/其他异常提示,但页面显示缓存数据。

App常见异常状态

下拉刷新(以B站、虎牙直播为例)

六、上拉加载

1、场景:当用户上拉页面时,在页面最下方,空出一行显示该提示。

2、交互:对于分卡片的信息流,滑到倒数第二个卡片时,自动加载了。下拉与请求数据时,最长加载时间为10s。10s后若加载不出数据,就在页面底部返回网络/其他异常提示,但页面显示缓存数据。其他异常时,错误代码由后端返回。

App常见异常状态

上拉加载原型

七、版本兼容

1、场景:当低版本用户收到高版本用户发的消息,或低版本用户显示不出高版本才有的样式时,触发该提示。

2、交互:点击该样式,可以弹出APP升级提示弹窗,引导用户升级版本。

App常见异常状态

版本兼容

转载本站任何文章请注明:转载至神刀安全网,谢谢神刀安全网 » App常见异常状态

分享到:更多 ()