庸不易]web原形设计构思（axure网页制作教程）

原形是一个新产品的实体模型，根据制做这样的一个实体模型可以让大伙儿深刻体会商品功能的，让团队人员、项目干系人了解市场的概况。原型制作的好与坏，直接关系大伙儿对产品了解与理解，决定着要求传递的精确性。原形具体指导着设计、开发和测试工作中阶段，进而进而影响了商品最终的品质。因而，设计一份高质量原形，对于整个项目工作来讲尤为重要，因此我们必须努力把原形设计得很好。

大家科学研究了很多的出色设计实例，发觉这些出色原型都主要有以下5个特点：统一的设计规格及合理布局构造、典雅的色彩搭配、很明确的文本标准、高效率的母版设计、强悍的部件系统软件。一份好原型看起来给人的感觉是简约、一目了然、整齐划一，页面间的逻辑顺序也挺条理清晰。今天我们就来剖析这5个特点：

不论是设计手机端页面，或是PC端页面，首先我们都要确认好页面的设计规格，一般手机端页面的设计规格为375(总宽) x 667(相对高度)，在Axure RP9版本的之中，根据页面款式，我们能依据设计必须或是演试机器的屏幕分辨率选择适合的手机端页面规格。假如是PC端页面，总宽一般设为1024，相对高度一般不设置限制。

页面规格

这儿关键说明下PC端的设计规格，明确完后页面规格，下面我们应该根据用户需求来决定页面的设计样式及其界面布局，从纵向来看将页面必须分为好多个版面，每一个版面间的留白艺术空隙多少钱，这些都要统一。在设计PC端页面时，依据栅格系统的设计标准，从横着上把页面切分成24个格子,那样有利于页面的合理布局，不论是两等份、三等份、四等分、六等分都能够满足设计规定。每一个版面中间间隙一般为6px、8px、10px、12px、14px，不管选择哪种空隙规格，也要注意每一个版面间的留白艺术空隙始终保持相同。

设计规格

页面合理布局架构

设计标准中也要重视色彩搭配的统一，最先明确新产品的品牌色，品牌色即是新产品的主色，主色一般只有有一个。确认了主色，还要明确2个辅助色，一个产品的色彩搭配不要超过3种颜色，特别是同一个页面的颜色更不可超出3种，研究发现同一个页面的颜色超出3种上面，页面给人的印象就会感觉错乱，令人抓不住重点信息。知名品牌logo、实际操作按键、及其导航栏等应选用主色，极为重要的文本信息应选用主色。不重要的实际操作按键、页面状态信息、一部分提醒信息可以用辅助色。同一个按键的差异情况，可以用同一色系的不一样深浅度或对比度来划分情况。统一色彩搭配，能让原形看起来更加简约，防止出现五彩斑斓的黑、或是令人眼花缭乱的色彩搭配。颜色标准的效果主要运用于给用户传递统一视觉的感观，一眼就可以记牢新产品的颜色。自然有一些产品运营、互动设计师很有可能偏重于高级灰这类经点颜色，最后的色彩搭配会交给视觉效果设计师来决定，但即便应用高级灰也要重视色彩搭配的统一，同一个设计原素在不同页面中间始终保持色彩搭配的统一。

丰富多样的色彩搭配

商品信息是通过文本、视频和图片传递的，而绝大多数的信息也是通过文字做为媒介。因而，在开展产品原型设计，大家也要验证科学研究下汉字的应用。最先，我们应该明确文本的字，和颜色规范和标准一样，字体的应用较多不可超出3种，能够使用同一种字体样式虽然是最佳的。字体样式建议大家应用PingFang SC、Langting SC、Microsoft YaHei，英文字可使用Helvetica Neue、Symbol、Arial。依据文本信息的重要程度、文本种类，所采用的字体大小也是不一样的，一般，越极为重要的文本信息所使用的字体大小也就越大。绝大部分的文本最好使用同一个颜色，这儿强烈推荐全黑#000000，不同种类的文本可以用不同类型的对比度去进行区别。以下这两张图，汇总了不同种类的文本所使用的字体大小、文本颜色。

文本操作规范

同一个产品原型设计之中，我们能将一些应用率很高的部件、模版设为母版，如页面导航栏、文章列表、产品列表、页头、页尾、报表、各种表格等可以设为母版，下一次应用，直接在母版中拖动。培养应用母版的良好的习惯，能够极大地提升我们自己的设计高效率。依据应用的需求不一样，能将设计具体内容转化成不同种类的母版。母版种类分为三种：固定不动型母版、随意型母版及其摆脱型母版。固定不动型母版，一般位置在固定住的，不可以人为更改部位，如页头、App的底部导航等;随意型母版，在引用的情况下，能够灵便修改位置，这一类型的母版也是采用最普遍的母版;最终一种就是摆脱型母版，这类母版与之前二种母版本质区别便是在引入页面中改动它具体内容，而也不会影响到原母版内容，就像是远离了父子关系。此外二种母版，若是在引入页面中进行调整，往往会同歩改动原母版内容，彼此之间保持着一种特殊父子关系。

善用母版

伴随着参加的设计新项目愈来愈多，就会发现有一些设计原素在许多不同类型的商品之中都能被反复多次应用。如App的底部导航、table标签、弹窗组成、toast提醒、浮层提醒、下拉列表、时间轴、各种选择符、输入框、单选题、复选等，这种适用场景广泛通用性控制、部件能被不同类型的设计新项目数次经常使用，这时候母版早已帮不上我们了。到这一步，大家可以选择形成自己的组件库，把这些使用次数强的通用性控制、部件，乃至页面模版列入到自己的组件库之中。构建一套完善、全方位的组件库，不但可以统一我们自己的设计标准，还可以很大的提升原形设计高效率。有这样的一套组件库，设计产品原型只需不断地拖动，并在各种前提下稍加改动，就能够迅速的进行原形设计。原形设计的时间也降低了，做为产品运营、互动设计师就能有更多时间思索商品流程、逻辑性及其客户体验。