A5创业网

项目发布

申请报道

扫一扫，联系编辑获得审核机会

符合以下要求，获得报道机会

1. 新公司求报道

2. 好项目求报道

3. 服务商求报道

4. 投资融资爆料

中介交易 网站交易 域名交易 公众号

登录 注册

会员中心 退出

微信

微博

手机版

网站导航

找项目 找服务

客服热线：400-995-7855

创业

创业动态 投资融资 创业故事 众创空间

财税

工商注册 公司财税 资质办理

产权

商标 版权 专利

科技

互联网 IT业界 移动 八卦休闲

站长

网站运营 建站经验 SEO 交互设计 好站推荐

营销

营销策划 网络推广 移动营销

电商

电商资讯 电商分析 移动电商

IDC

IDC报告 云计算 服务器 安全 CDN

更多

自媒体 公众号 小程序 产品 域名 会议 数码 游戏 系统 技术

首页

创业

创业项目

科技

站长

产品

营销

电商

域名

会议

A5交易

A5营销

创业服务

当前位置：首页 > 站长 > 交互设计 > 正文 品牌

标签

专题

软文

原型制作技巧：4招让你的线框图更好看 2017-12-22 08:59 来源：人人都是产品经理 我来投稿 我要评论

创业项目优选 好项目来A5招商 ，点击入驻！

网络上很多Axure或原型相关的文章，更多是原型设计技巧、软件操作、案例之类的内容;而对于原型本身及认知层面的内容，极少进行探讨。这篇文章，从原型的技巧出发，从认知层面，解释如何让你的线框图更好看。

线框图原型需不需要好看?我觉得在保证效率的前提下，需要好看。

先给好看定义标准：

简洁清晰，能一眼了解页面布局和元素;

规整统一，能高效分辨不同类型模块;

准确到位，原型表达准确，不仅仅是布局与元素，还有线框图中选用的示例;

重点突出，在不影响后续设计师设计的前提下，突出页面重点。

所以，好看并不只是外观审美，而是看起来方便，很容易看懂。

针对以上四点，我总结了4个应对小技巧。下面以模仿淘票票APP首页为例，详细介绍这4招。

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

使用颜色区分模块在视觉上比线条区分更直观，也更容易观察出页面布局。我的建议是只使用黑白灰，如果产品定了主色，可以增加一个主色使用在重要元素、选中状态元素上

可以根据制作原型母版和元件库的理念，去事先规定同类元素的表现形式，例如：

底色都使用浅灰色;

按钮，使用圆角，重要按钮使用主色;

选中状态，使用主色阴影。

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

这个技巧能大大提升原型的被理解效率，我在工作中使用后，发现原型评审会的效率提高了很多，大家对于产品设计的理解误差减小了。

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

要提高页面的可看性，整齐是必不可少的。要做到高效整齐很简单，就是熟悉Axure的各个对齐方式。

首先，我在“视图”中设置了自定义工具栏(也可以记忆和熟练各个操作快捷键)：

在制作原型过程中，配合复制粘贴使用对齐，但每个对齐都有规则，需要自己在实践中去灵活操作。例如：

上下左右对齐将以选中的第一个元件为准;

水平/垂直分布将以选中元件中两个最外边为准。

合理使用栅格和辅助线同样能保证页面的整齐：

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

很多人为了方便会将将页面上的数据用数据名称表示，甚至使用“xxxx”来代指。这样做的弊端是不能更直观展现页面和元素的功能，不方便理解。

我在工作中发现，可以使用真实数据和数据名称结合的方式去更好地展现页面元素信息，传递页面功能。

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

很多人会沉迷于Axure制作交互的强大中，而忽视了原型最重要读者的需求。

原型目标读者大多为设计师和程序员，他们希望你能提供准确直观的原型。原型中的交互，需要读者自己点击操作才能了解，程序员可能只会看，进而漏掉了很多交互内容;而且很多交互表现得不够准确，在我看来反而会使原型不够专业。

所以，我在原型中只使用简单的页面链接，一些交互直接交给交互设计师，或者在页面旁做简单的注释。

以上4招只是我在工作中总结的小技巧，不一定适合每个产品和团队，希望能抛砖引玉，启发你去探索自己的快速原型妙招~

本文由 @ZoeSunPM 原创发布。未经许可，禁止转载

题图来自网络