2 简单使用原形工具Axure RP

文章内容仅为个人片面认知,接受纠正及补充

一、前言

1、为什么学习前端要使用原型工具Axure RP?

一般来说,作为程序员,当客户(甲方爸爸)找我们做需求,我们需要将甲方所描述的项目简单的绘制出来,通过绘制的界面了解甲方的具体需求以及甲方对项目的预期效果。绘制的界面的方法我们可以通过手绘、ps、HTML、原型工具(原型工具有很多种,我们这里选择Axure RP)以及其他方式。

  • 手绘方式:描绘起来粗糙,不足以让甲方直观感受预期效果。
  • ps方式:ps功能强大,以至于对于使用者要求高,具有专业性才能玩转。
  • html方式:效率过低,不适合做为绘制工作。
  • 而Axure RP作为一款快速原型设计工具,功能强大,容易上手,效果好

二、如何快速简单使用Axure RP

1、了解Axure RP工作区间

Axure RP的整个界面包含了:编辑区,站点地图区,元件库,母版区,工作区,属性、样式、说明区以及页面概要区。
在这里插入图片描述
编辑区:包含软件的全部编辑操作,比如说盒子(在本文中,盒子是对页面的全部元素的统称,例如按钮、表单、文本框等)的大小的调整,位置的移动。
站点地图区:就是页面的导航面板,对页面进行增加、删除、重命名操作。
工作区:绘制页面的区域。
属性、样式、说明区:对页面中的盒子进行样式调整、修饰,以及盒子与盒子之间的关系链接。
元件库:提供丰富的组件,直接使用,提高绘制页面效率。
页面概要区:对页面中的内容进行管理,分类,细化。方便设计者对页面框架进行把控。
母版:将可重复利用的版块整合在一个页面上,减少设计者重复绘制一样的版块。

1)、工作区进一步说明

新建并打开页面,在工作区燥起来。
在这里插入图片描述

2)、编辑区进一步说明

内容着实有点多,这里挑着必要的进行介绍
1、file:可创建新的文件,以及打开文件。
2、front:将盒子上浮back将盒子下沉。
在这里插入图片描述
3、group:选中一个或多个盒子组合成一个整体 upgroup:拆开选中的整体。
4、preview:预览已经保存的页面。

3)、元件库进一步说明

这里提供很多的组件,按钮,图标。
在这里插入图片描述
1.Box1、Box2、Box3:三种不同的盒子,主要用于构架整体页面。它们区别在于有无边框,背景颜色深浅。
2.Ellipse:一个圆。
3.image:插入图片,拖进工作区后双击即可添加图片。

在这里插入图片描述
4.Button按钮组件。
5.H1、H2、H3:大小不同的标题。
6.Label:文本框。
7.Horizontal Line:一条横直线。

4)、属性、样式、说明区进一步说明

现在选中的是样式区。
1.STYLE:样式。
2.NOTES:说明。
3.PROPERTIES:属性。
4.fill:设置盒子的背景色。
5.Border:设置盒子的边框线粗细、虚实、有无。
6.Font:设置盒子内的字体样式。
在这里插入图片描述

©️2020 CSDN 皮肤主题: 创作都市 设计师:CSDN官方博客 返回首页