Web产品的交互说明文档应该怎么写?

经常与开发同学聊天,他们说有一个详细的说明文档可以帮助他们更准确的进行工时评估,还可以帮助他们提高工作效率,减少多余的思考时间。因此在这里分享一些制作交互说明文档的经验。
我先说说说交互原型包含哪些部分?
版本说明及更新说明
页面流程图
信息架构图
业务流程图
任务流程图
线框图和交互说明(这是我们今天主要说明的内容)。下图为原型
在这里插入图片描述

原型通常分为低保真原型和高保真原型,交互说明文档则是对原型说明的部分。我们在看到交互原型的时候,很难看到原型后面的交互逻辑,即使原型的交互操作做的非常详细,看原型的人还是不能很快知道全部的内容。我们把交互的所有操作全部罗列出来,可以让查看的原型的人能很快的理解你的交互流程。

所以交互说明是原型中不可缺少的一部分。交互说明会让原型看起来更专业,也让开发同学更好的理解。下图为交互说明的一个案例

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

有的交互设计师喜欢用动态效果来代替交互说明,这样的方式会给开发同学照成一定的困扰。浏览原型的人需要逐一操作才能看见效果,一旦有某个地方没有操作到,就可能会遗漏。

文字说明则可以让开发同学清晰、快速地看到全部的动态说明,各种情况一目了然。

在时间允许的情况下,建议采用交互说明与动态效果相配合的方式,这样也会相得益彰,更容易开发同学理解。

交互说明文档应该说明哪些内容呢?
字段说明

字段说明包含字段长度、字符说明、取值范围。

  1. 字段长度主要包括字段的最大长度和最小长度。比如手机号码字段最长为11位。

若字段的最大长度大于界面可显示区域的宽度,则需说明超出区域的样式。比如,最多应该显示多少字数,超过时如何显示,是否折行等。

  1. 字符类型主要是指此字段的输入类型。比如手机号码为纯数字,数据库字符类型应为int(不需说明数据库类型)。

  2. 取值范围主要指数据的取值范围。比如,界面上出现下拉菜单,交互说明文档需要说明下拉菜单的选项内容,否则会增加一定的沟通成本。

排序规则

排序规则主要包含列表的排序规则。

比如产品列表,默认的排序规则是根据时间降序排序。
在这里插入图片描述

状态说明

状态说明包含初始状态、常见状态和特殊状态。

  1. 初始状态主要指显示的文字、数据、选项最开始的状态。用户在新打开一个APP时,初始状态是未登录的;在登录后,初始头像是系统默认的;

  2. 常见状态主要指某一板块的正常状态。用户对文章进行评论,有评论内容的界面则是常见状态。

比如登录入口,一般会出现2种状态:未登录状态、登录状态。
在这里插入图片描述
3. 特殊状态一般指非正常情况下的样式、文案以及说明等。比如在刷新文章列表时,手机断网加载失败,这时就属于特殊状态;
在这里插入图片描述

操作说明

操作说明包含常见操作、特殊操作、误操作、手势操作。

常见操作主要指正常操作时得到的反馈状态。比如一个按钮,在鼠标移入和移出时不同的样式。

特殊操作主要指一些极端情况下的操作。

在这里插入图片描述

反馈内容

反馈主要指用户操作后得到的反馈动作,包含提示、跳转、动画等。提示主要指操作后,系统反馈给用户的文字说明等。

设计师需要在原型上著名跳转时是“原页面刷新”还是“新页面打开”。

此外,还需要注明在界面的不同位置以不同手势操作时,会跳转到哪里。
在这里插入图片描述
数据来源

数据来源主要指列表内数据来源的说明。告诉开发同学根据什么条件从数据库里取数据。

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/335342.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux类似360软件,linux下有什么类似鲁大师查看电脑配置的软

满意答案drqyna2017.05.26采纳率:40% 等级:11已帮助:5455人linux如何查看系统的硬件配置如何在linux系统下查看系统配置?在图形模式下我们可以很方便的利用Linux的图形工具,点击几下就可以查看到Linux系统的的硬件信…

java 编写代码_如果您在2016年编写过Java代码-这是您不容错过的趋势

java 编写代码2016年最有趣的Java相关主题 关于代码,有很多热门话题,而要跟上所有事情,这是一项全职的工作。 如果您想知道如何从谷壳中分离出小麦,我们已经为您完成了工作。 在下面的文章中,我们将介绍2016年最热门…

thinkphp json_原创干货 | Thinkphp序列化合总

听说转发文章会给你带来好运最近Thinkphp几个版本都出了反序列化利用链,这里集结在一起,下面是复现文章,poc会放在最后01Thinkphp5.1.37环境搭建composercreate-project topthink/think5.1.37 v5.1.37poc演示截图调用链单步调试漏洞起点在\th…

linux安java,Linux安装Java

从人类社会的角度看OO(独家视角)引言 在OO的工作中,我们一定会涉及到类,抽象类和接口.那么类和抽象类以及接口到底扮演的什么角色? 本文主要是从人类社会的角度阐述类与抽象类以及接口的"社会"关系,从而让我们抛弃书 ...include与require的区别&a…

前端和后端的区别

后端工程师负责服务器端应用程序的编写开发(业务逻辑、方法、函数、数据库代码等) 前端工程师负责UI的html代码编写和设计,所以前端工程师一般指网页工程师 前端部分是和用户直接交互的,包括前台和后台部分 客户端其实就是属于前端…

笔记本能安装联想智能云教室吗_挑战Jupyter Notebook:云协作、云硬件,上云的Notebook编程环境...

对全世界的 Python 高手而言,Jupyter Notebook 是目前最流行的编程环境,但它也有一些令人难以忍受的缺点。为此,一个位于旧金山的小团队开发了一款名为 Deepnote 的笔记本工具,这是一种云协作、云硬件,上云的 Notebook…

java自动生成类_自动生成优化的Java类专业知识

java自动生成类如果您今年访问过JavaOne,您可能已经参加了我的演讲“如何从数据库生成定制的Java 8代码”。 在那次演讲中,我展示了如何使用Speedment Open Source工具包使用数据库作为域模型来生成各种Java代码。 我们没有时间要考虑的一件事是&#xf…

在Linux中su和sudo区别,Linux中su和sudo的用法和区别

目录sudosudo:暂时切换到超级用户模式以执行超级用户权限,提示输入密码时该密码为当前用户的密码,而不是超级账户的密码。缺点是每次执行超级用户权限都要在命令前加上 sudo ,优点是在当前终端再使用 sudo 不要再重复输入密码(只对…

neo4j 添加属性_Neo4j:动态添加属性/设置动态属性

neo4j 添加属性我一直在研究一个具有英国国家铁路时刻表的数据集,它们以文本格式为您提供每列火车的出发和到达时间。 例如,可以这样创建代表停止的节点: CREATE (stop:Stop {arrival: "0802", departure: "0803H"})该…

python 提升效率_@Python 程序员,如何最大化提升编码效率?

作者 | Enoch CK 译者 | 刘畅 整理 | Jane 出品 | Python大本营 【导语】无论你是一位高级的AI工程师还是学生,你都会在工作或学习过程中需要用到 Python。自 1991 年首次发布后,Python 很快就成为了程序员和技术人员最喜欢的语言。作为一种拥有相对简单…

linux tar -xvf命令,linux下tar命令详解

2011-11-28 13:03朋友你好!我刚开始搞linux,碰到了很多问题,想问你下,希望能帮我解答下。下面是我的一段shell 程序#!/bin/shwhile [ 0 ]doread scoreif [ $score -lt 60 ];thenecho " you must work hard!"…

linux下如何查看主机是否安装了ftp server

常用的发行版的软件包管理系统有Debian系(包括Debian,Ubuntu,Mint等)和Red Hat系(包括RHEL,Fedora,CentOs,Scientific),前者查看是否安装了ftp的命令是&#…

spring boot rabbitmq_Spring Boot+RabbitMQ 实现延迟消息实现完整版,实用!

本文同步Java知音社区,专注于Java作者:Sam哥哥http://blog.csdn.net/linsongbin1/article/details/80178122概述曾经去网易面试的时候,面试官问了我一个问题,说下完订单后,如果用户未支付,需要取消订单&…

jax-rs jax-ws_信守承诺:针对JAX-RS API的基于合同的测试

jax-rs jax-ws自从我们谈论测试和应用有效的TDD做法以来,已经有一段时间了,特别是与REST(ful) Web服务和API有关的做法。 但是,这个主题永远都不应忘记,特别是在每个人都在做微服务的世界中,无论…

手机流量共享 linux,linux – 通过HTB共享带宽和优先处理实时流量,哪种方案更好?...

我想在我们的互联网线路上添加一些流量管理.在阅读了大量文档之后,我认为HFSC对我来说太复杂了(我不了解所有曲线的东西,我担心我永远不会把它弄好),CBQ不推荐,基本上HTB就是通往适合大多数人.我们的内部网络有三个“段”,我想在这些段之间或多或少地分享带宽(至少在开始时).此…

负载均衡解决方案

某网站随着知名度的提高,用户访问量日渐增多,近段时间以来,由于访问量的激增,服务不可用的情况时有发生。针对这种状况,结合实际情况,设计了一套解决方案。 技术实现 1、负载均衡。2台同样配置的linux服务…

pcf8523_PCF上的Spring Cloud合同和Spring Cloud Services

pcf8523最近,我们有一个客户,对于使用Spring Cloud Contract (SCC)来防止微服务团队之间的API“漂移”,微型开发团队会照顾个体的API(构成企业应用程序的一部分),这些客户非常感兴趣…

python二分法查找时间点_python有序查找算法:二分法

二分法是一种快速查找的方法,时间复杂度低,逻辑简单易懂,总的来说就是不断的除以2除以2... 但是需要注意:待查找的序列区间单调有序 例如需要查找有序数组arr里面的某个关键字key的位置,那么首先确认arr的中位数或者中…

linux shell ls -l,linux之ls -l|grep ^-|wc -l命令 Shell 中常見的日志統計方法

轉:http://www.cnblogs.com/senior-engineer/p/6203268.htmlShell 中常見的日志統計方法https://my.oschina.net/waterbear/blog/371845Linux Shell工具grep awk cut sort uniq sort 使用小結http://www.linuxidc.com/Linux/2012-05/61126.htm查看某文件夾下文件的個…

怎么运行aws的示例程序_使Spring Boot应用程序在AWS上无服务器运行

怎么运行aws的示例程序在之前的 几篇 文章中,我描述了如何设置Spring Boot应用程序并在AWS Elastic Beanstalk上运行它。 尽管这是从物理服务器到云服务器的重要一步,但还有更好的可能! 走向无服务器 。 这意味着无需花费任何服务器费用&…