美文网首页@产品产品交互设计
页面交互说明自检list

页面交互说明自检list

作者: 黑子Y | 来源:发表于2020-02-22 19:46 被阅读0次

原型设计方案确认后,最重要的便是交互注释文档的撰写,需要输出给到UI设计和开发人员开发,交互原型上的注释说明的清晰程度,很大程度上影响开发和设计的效率和最后完成度。

交互注释说明自查清单:

自查list

1、限制条件:对页面元素属性的描述

①范围值:数据的取值范围。如下拉框限制,输入取值范围

②极限值:数据的显示限制。如标签最多显示字数

限制条件

2、操作和反馈:用户执行某项操作后给到用户的及时反馈

当用户执行某些操作后,需要给用户及时的反馈。不管是正常的操作、错误的操作、还是极端情况下的特殊操作、都要做到有响应,防止让用户不知所措。

2.1 用户交互方式,包括点击、按、长按、滑动等。

交互方式

2.2、操作类型

①正常操作

正常状态下,用户的操作流程。在用户的操作过程中,需要及时给予用户反馈,告知用户发生了什么。

②错误操作:

用户进行了一些错误的操作时,需要给出一些纠正反馈,错误提示内容需要包括当前错误和纠正的信息。即告诉用户当前发生了什么,接下来需要该怎么办。如长按语音输入时,用户单击无效提示

③特殊操作:

当用户进行了极端操作时,也需要给出的反馈。例如用户短时间内重复多次点击,提示操作无效

2.3、反馈

①提示:用户完成操作后,系统给用户的及时反馈

②跳转:页面跳转路径

③动画:用户操作后,元素或界面转场方式

操作和反馈

3、状态:不同场景下用户会遇到的状态,包括默认状态、正常状态、特殊状态。

①默认状态

默认显示的文案、选项。

如文本框的默认唤起的键盘、列表的默认排序方式(发布时间的倒序正序、更新时间倒序正序)。

②正常状态

用户正常使用的时候会遇到的状态。

如登录/未登录、认证审核状态(未实名/已实名)、订单状态(未付款/未发货/已发货)。即业务流程中正常存在的状态。

③特殊状态

一些特殊场景才会出现的状态。

包括无数据的状态、网络加载状态、网络连接状态、系统报错的状态。

状态

4、用户权限

当某些功能并非发放给全局用户时,需要明确告知开发人员,哪些用户有该功能的权限。如果在需求文档中没有进行说明,开发人员会默认认为该功能开放给所有的用户,所以当涉及用户权限问题时,需要明确的在交互文档中标注清楚,哪部分用户有权限使用。(会员身份、非会员身份、登录状态、未登录状态、不同等级对应的权限等)

状态

交互说明撰写注意事项

1、避免使用过长的文字说明,且文字描述和数据尽量做到真实

2、页面交互内容很多的时候,注意交互说明的排版,确保清晰和完整

3、整理好自己的交互自查清单,撰写过程中进行自检,减少遗漏的情况

举例:页面交互完整说明内容

推荐阅读

如何写好一份项目交互说明文档 - 简书

相关文章

  • 页面交互说明自检list

    原型设计方案确认后,最重要的便是交互注释文档的撰写,需要输出给到UI设计和开发人员开发,交互原型上的注释说明的清晰...

  • 08宝贝相册主框架及交互

    主框架 冲洗交互 拍照交互 页面说明

  • 「移动端规范」_APP页面切换/转场/跳转

    摘要:“全局交互说明” 是将交互文档公共或者通用的部分抽离成出来统一说明,在具体交互说明页面用到 “全局交互说明”...

  • 交互设计文档

    版本说明 优化目录 修改记录 目录 产品框架 页面流程图 页面展示及交互说明 封底

  • 淘宝十年产品事-笔记

    1. 能力模型 四种典型页面:Detail页面、List页面、交互页面、综合页面 满足需求的三种方法:提高现实、降...

  • 交互说明怎么写?

    所谓交互说明,简单的理解就是对交互原型的解释、强调或补充的说明文字。原型页面往往无法展示全部的交互细节,即便完全做...

  • 交互说明这么写

    所谓交互说明,简单的理解就是对交互原型的解释、强调或补充的说明文字。原型页面往往无法展示全部的交互细节,即便完全做...

  • 产品UI工作对接流程

    准备工作 业务逻辑 》说明业务流程、页面流程、交互效果、页面主次 页面重点 》展示重点的部分:比如购物车弹层的按钮...

  • 网页构成

    1.Web构成 构成语言说明结构HTML页面元素和内容表现CSS网页元素的外观、位置等页面样式行为JS页面交互 2...

  • vue keep-alive缓存问题

    场景:list页面(要缓存),跳转到details页面,需求:1 从details页面返回后 list页面不刷新,...

网友评论

    本文标题:页面交互说明自检list

    本文链接:https://www.haomeiwen.com/subject/bufrqhtx.html