最专业的八方代购网站源码!

资讯热点
如何绘制高质量的互动草稿?

发布时间:2023-10-6 分类: 电商动态

我们如何确保交互式手稿的完整性并防止信息丢失?本文作者分享了他自己的一套方法。

交互式草稿是交互设计者的主要输出。在实际工作中,交互设计师的主要职责是根据产品提出的不同要求,以交互式手稿的形式呈现交互计划。此外,交互程序将流经产品,UI,开发,测试学生,因此成为他们判断交互设计师能力的重要基础。因此,可以说交互式程序的质量将成为交互式设计者能力的重要表现之一。

为了绘制高质量的交互式手稿,一方面要有正确有效的方法来设计和分析需求,然后根据分析中形成的设计思想进行设计;另一方面,交互式手稿需要有完整的结构。促进交互设计师的专业性。下面,我们来看看如何确保交互式手稿的完整性并防止信息丢失。

“目标用户”

谈谈交互式草稿,让我们来看看交互设计师的工作流程:

交互设计人员接收产品经理的要求。在与产品讨论之后,首先需要对要求进行设计分析。分析后,可以启动交互式草稿。交互式草稿完成后,将其交给UI学生进行界面设计,然后对开发和测试开发学生的学生进行测试。由此可以看出,交互式原稿文档的主要“目标用户”是产品,UI,开发和测试。

事实上,仔细思考,交互设计师的作用是赋予“清楚说话”的功能:产品学生需要知道交互式草案是否包含所有功能点; UI学生需要知道这个函数包含哪个接口,每个接口的元素是什么,元素的状态是什么;开发,测试学生需要知道函数的过程是什么,页面元素将如何反应。因此,所有上述信息都必须包含在交互式草案中。重要的是要了解交互式草稿的目标用户擅长绘制高质量的交互式草稿。

交互式草稿的先决条件信息

上面我们提到了交互设计师制作的交互草案是谁。让我们总结一下,上面提到的交互式草案中必须包含的信息是:

界面显示完整的过程

界面中的界面和元素显示了所需的所有功能点。

界面中各种元素状态

元素操作后的效果

对于第一点显示完整的过程,如果这个功能比较复杂,过程较长或者过程中的逻辑较多,可以附上流程图,方便产品,开发,测试学生理解;对于一般相对简单的功能,基于您使用的交互式草图的映射工具分为以下两种情况:

如果使用草图,则可以在单个图表中平铺所有界面。 UI和开发人员可以通过图中的主界面进入流程;

如果你正在使用axure,建议一个axure页面只显示一个接口或分支进程(优点是你可以完全显示一个接口或分支进程的各种状态,显示非常清楚),此时,过程是通过axure的左侧显示树结构,如下所示:

树结构示例

对于第2,3和4点,我们可以通过遍历来遍历过程和界面。遍历的方法是从头到尾看你自己的交互式手稿,注意它是否包含要求中的所有功能点;每个界面中的每个元素,如果用户点击,它会做出什么反应(颜色是否变化你需要激活吗?等等)?点击后要转到哪个页面?如果没有网络,你应该展示什么?以下是您的摘要:

按钮和图标通常包含三种状态:默认状态,单击状态和单击后的状态;

用户操作后可能出现的异常:无响应,无网络,无数据,大量数据,网络速度慢,无缓存,数据过期,状态发生变化(如城市变更),首次使用(新手启动)

这是每个人都要做的案例(如下所示)。在此示例中,左侧的树结构反映了主流。由于需求过程中设计的逻辑越多,最后附有[流程图]模块,以方便学生的开发和测试。在页面中,只有“我想解决细节”问题。操作后此页面的各种状态和结果。

交互式草稿的辅助信息——项目概述

在交互式手稿的第一页上,您可以添加“项目概述”主题,主要显示需求的基本信息和迭代描述。一方面,添加项目页面的概述可以记录交互的修改,并且在问题发生时很容易追溯;另一方面,使互动草案更专业是改善互动草案的好方法。

项目概述示例

交互式手稿的附属信息——设计分析

有一些要求。如果需求本身相对较大且涉及的人员更复杂,您可以将部分设计分析添加到交互式草案中。这有助于您更好地了解互动的设计方式。因为它被放置在设计草案中,而不是需要显示设计分析的特殊PPT,设计分析只需要放置最核心的信息,包括:场景分析,产品目标,用户目标,如下例:

设计分析示例

以上总结了应包含在完整的交互式草案中的元素。我希望每个人都能提供帮助。

« 白帽SEO屏幕技术分享 | 百度内容付费产品对SEO的影响是什么? »