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

资讯热点
原型设计技巧:4次使你的线框看起来更好

发布时间:2020-3-4 分类: 电商动态

Web上的许多Axure或原型相关文章更多地是关于原型技术,软件操作和案例;并且很少讨论原型本身的内容和认知水平。本文从原型设计技巧开始,解释了如何从认知角度使线框看起来更好。

线框原型需要好看吗?我认为在确保效率的前提下需要看起来很好。

仔细看看定义标准:

简单明了,您可以一目了然地了解页面布局和元素;

定期统一,可以有效区分不同类型的模块;

准确到位,准确的原型表示,不仅仅是布局和元素,还有线框中使用的示例;

重点是突出页面的重点,而不影响后续设计师的设计。

因此,它不仅看起来不错,而且看起来方便易懂。

对于以上四点,我总结了四种应对技巧。以下是模仿淘宝票APP主页的示例,并详细介绍这4个笔画。

 一. 少用线条,使用颜色和阴影区分模块

使用颜色辨别模块在视觉上比线条差异更直观,并且更容易观察页面布局。我的建议是只使用黑白灰。如果产品具有原色,则可以为重要元素和选定元素添加原色。

根据制作原型主文件和组件库的概念,您可以预先指定类似元素的表达式,例如:

背景颜色为浅灰色;

按钮,使用圆角,使用主要颜色的重要按钮;

检查状态并使用主色底纹。

缺少硬黑线的页面,看起来简洁干净,布局清晰;同时,统一的元素表达降低了理解的难度。

该技术可以大大提高原型的理解效率。在我的工作中使用它后,我发现原型审查会议的效率有了很大提高,产品设计的理解错误也减少了。

 二. 熟练使用各种对齐方式

为了提高页面的可见性,整洁是必不可少的。为了高效和整洁,很容易熟悉Axure的各种对齐方式。

首先,我在“视图”视图中设置了一个自定义工具栏(也可以记住并掌握各种快捷方式):

在制作原型的过程中,使用复制和粘贴的对齐,但每个对齐都有规则,您需要在实践中灵活。例如:

对齐,向下,向左和向右将基于所选的第一个组件;

水平/垂直分布将基于所选组件的两个最外边缘。

正确使用网格和指南也可确保页面整洁:

 三. 使用真实数据表现元素

为方便起见,许多人会使用页面上的数据名来表示它,甚至使用“xxxx”。这样做的缺点是,显示页面和元素的功能并不直观,这不便于理解。

我在工作中发现,您可以使用实际数据和数据名称的组合来更好地显示页面元素信息和传递页面功能。

 四. 不使用Axure制作复杂交互

许多人沉迷于Axure生产互动的力量,忽视了原型最重要读者的需求。

原型目标读者主要是设计师和程序员,他们希望您提供准确和直观的原型。原型中的交互需要读者点击操作才能理解,程序员可能只看它,然后错过很多交互式内容;许多互动都不够准确,但在我看来,原型还不够专业。

因此,我只在原型中使用简单的页面链接,一些交互直接传递给交互设计器,或者在页面旁边进行简单的注释。

以上4个笔画只是我在工作中总结的一些提示。它们不一定适合每个产品和团队。我希望我能激励你探索自己的快速原型制作技巧〜

本文最初由@ ZoeSunPM发布。未经许可,禁止复制

地图来自网络

« “V Wave Award”大受欢迎,微博开启了社交营销的新“视觉”圈子 | 为什么要修改公司代购源码网站?修改后的版本选择了生辉友联 »