网页原型规划模板 (网页原型规划规范)

怎么将一个网页中的元素放到新的原型规划中
根底的其实很简略学会，便是拖动控件完结布局。你能够从静态页面的规划开端学，了解每一个控件，然后了解这个控件能够做什么（增加什么事情），能够承受什么操控（事情能够对它做什么，比方启用/禁用？接纳参数？改动状况？）。在这个过程中留意领会axure软件自身的规划思路，这样学起来会事半功倍。然后开端学习做交互，找一些网站而不是实例教程来操练，先把静态的画出来，再看网站的交互是什么样的，尝试用axure做出来，这个时分会碰到具体的问题，想想按你了解的软件思路，能够怎样去处理，先探索一下，真实不会了再去找处理计划。重复几回后，常见的交互作用根本就会了，在这过程中也加深了你对axure自身的了解。再然后，跟着会做的作用越来越多，会走向作用控道路，总想做最高保真的，乃至到了改生成文件的css层面，其实有的作用一句话能够描绘清楚的但完成起来很费事，没必要。最终慢慢走精约道路，能简则简，简略有用就好。这个时分会更重视功率，怎样把一个模块做成多个页面复用的模板，怎样把组件打包共享给其它搭档，怎样经过axure进行多人协作共同完结一个原型规划.
怎么规划超卓的网站后台原型
明晰方针
既然是做原型的视点，咱们就从具体工作来谈，首先要明晰的肯定是产品方针，比方以下几个问题：
是全新的产品，仍是更新改版？
有没有相匹配的前台体系？或许其他需求合作的线下资源？等等
事务层面的方针是什么？新增功用？体会优化？等等
需求剖析
明晰了产品方针，在做需求剖析的时分就会有所偏重，总的来说，值得重视的有以下几个要素：
1、人物权限
这个十分重要，必定要在具体规划之前了解办理后台的一切类型用户。包含一共有几类用户，他们各自的运用需求，操作权限，还有用户权限的规划。
2、信息架构
必定要画信息结构图（即产品层面的数据模型），主要用于理清产品结构。画一下脑图，列一个excel表单，具体程度依据自己习气即可，需求和用户合作起来规划。
这个是和一般原型规划比较不同的一点，假如是改版还需求特别标示和旧版的差异，以及旧数据的整理或搬迁计划。别的，还需求考虑和其他资源（前台、对应页等）的合作，数据流向以及状况搬运等。
4、功用流程
惯例需求考虑的用户流程和事务规矩流程。依据不同的事务方针，用户流程能够按场景或功用进行区分，给予部分用户恰当的优化。事务规矩流程需求确保逻辑明晰，闭环，不要遗失反常流（闭环很重要）。
原型规划
总算能够开端原型规划啦，现在各种办理后台的主题模板都有许多，没有特别需求的情况下，和开发沟通好挑选一套“抄”即可。
规划过程中留意一下导航，列表（增修改查排序挑选）等，细节上不要遗失预览、过错/成功提示、新内容提示、快捷键等

modern mansion

具体滴卡片规划技巧：

卡片是咱们随处可见的小UI组件，原因很简略，它们占用的空间十分小，而且能够显现满足的信息，一般还有1-2种选项。

为什么运用卡片：

卡片能够存在和盛行，由于它们自身具有精约的规划和杰出的可用性，卡片将会持续盛行。

卡片作为切入点，能够进一步展现更具体的信息。

卡片在视觉上也很令人愉悦，由于在大多数卡片上，卡片的图画为卡片赋予了风格。

它们主动习惯Web和移动视图。

没有太多认知负荷，究竟卡片无处不在，用户早已经很了解。

它们坚持界面有条有理，且十分精约。

UI中的“卡片”就相当于物理国际的卡片。它们可充任容器，将内部信息组合起来。

该原型运用墨刀规划

暗影/描边有助于呈现出卡片的形状，至于你是想运用暗影仍是描边，取决于UI的风格。

该原型运用墨刀规划

卡片的优点在于：只需确保视觉上没有太繁复的比照，卡片的布景你能够随意“玩”。

该原型运用墨刀规划

当字体较小时，用户会倾向于“细读”；而字体较大时，用户更倾向于“跳读”。假如字体粗细运用过错，会影响可用性和漂亮性。

卡片的确很小，因而比照度在切割信息和优先级方面起着重要作用。

能够运用一般按钮、文本按钮或图标。在笔直卡片上，按钮一般放置在底部上；在水平卡片上则是在右侧或底侧。

在可聚集元素之间增加恰当的空地，也留满足的距离来对内部信息进行分组。

要使卡片在鼠标悬浮时更显着，一般运用较暗的暗影或上升一点高度。

本文转自在墨刀翻译自Dorjan Vulaj 的8 rules for a perfect card design。

望采用 谢谢~