Axure教程 原型设计工具Axure RP新手入门教程(一):基础

2023-11-10

什么是Auxre RP?


Axure RP是一种线框图,原型设计,流程图和文档工具。使用Axure RP来创建和设置图表样式,为图表页面和元素添加交互性和注释,并将完成的设计发布到HTML以便通过Web浏览器查看。(点击下方图片可观看视频~)

                                                                                            点击下载Axure RP

Pages(页面)


Axure RP文件由页面组成 - 从一个或两个到数百个,具体取决于项目范围。“Pages”窗格位于Axure RP界面左侧仪表板的顶部,用于查看和管理项目中的页面。
每个页面都包含一个图表 - 通常是静态线框,交互式原型或由小部件组成的流程图。

Widgets(小部件)


窗口小部件是Axure RP中图表的构建块。最常见的是“shape(形状)”小部件Default library(默认库)的“Common(公共)”部分中的许多小部件类型(包括框,标签和段落)都是形状小部件;使用钢笔工具绘制的自定义形状也是形状小部件。(有关钢笔工具的更多信息,请查看矢量绘图参考指南。)图标库中的图标也是形状。
另一个常用的小部件是图像小部件,它有两个作用:用作图像占位符,或将图像导入图表。可以对导入的图像进行切片,裁剪,调整大小,拉伸,旋转等。

                                                             

表单小部件(如文本字段下拉列表)也可用,还有更高级的小部件,如内联框架动态面板中继器

您还可以使用连接器小部件通过将形状连接在一起来创建流程图。我们将在本培训系列的下一篇文章中详细介绍Axure RP的流程图功能。

排列小部件


将小部件添加到图表后,您可以在图表中通过移动,调整大小或旋转来重新排列小部件。您还可以对齐,分发,锁定,分组和更改小部件的深度顺序。单击小部件即可选中它,单击并拖动即可在页面上移动它。当选择一个小部件时,其周围会出现绿色边框。选择小部件后还会显示可以拖动以调整小部件大小的句柄。要在拖动小部件句柄时按比例调整小部件的大小,请在调整大小时按住【SHIFT】键。

小部件也可以调整为特定像素值。使用顶部工具栏或“Inspector(检查器)”中的“w”和“h”字段设置小部件大小(以像素为单位)。要约束小部件的比例,请单击“w”和“h”字段之间的“Maintain aspect ratio(保持纵横比)”图标。您可以在单击小部件上的角手柄时按住【CTRL】 / 【CMD】来旋转小部件,拖动以设置旋转角度。您还可以在“Style(样式)”选项卡中输入精确的旋转度。

小部件可以锁定在设计区域中,这可以防止通过拖动更改其位置和大小。如果需要,可以在Inspector中移动和调整锁定小部件的大小。要锁定小部件,请使用顶部工具栏中的图标。可以对小部件进行分组,便于一起操作多个小部件。选择要分组的小部件,然后使用快捷键【CTRL】 / 【CMD】 + 【G】对它们进行分组。单击以选择组,双击以编辑组内的小部件。当看到页面的其余部分显示为灰色时,您就知道您正在组内编辑。

编辑文本


您通常可以通过双击来编辑小部件的文本。(双击画布上的小部件可以访问该小部件类型最常见的编辑功能。对于大多数小部件,此编辑功能就是小部件上的文本。)您还可以直接在形状小部件上输入文本。单击小部件选中后,然后输入文本。

                                                                      

样式小部件


小部件的样式控件位于Axure RP界面的两个区域:InspectorStyle选项卡(右侧)和Style Toolbar(顶部)。可用的样式属性包括形状位置和尺寸,旋转,填充颜色和阴影;边框线颜色,图案和厚度;和文本属性,如字体,颜色,对齐方式,行间距和填充。通过拖动出现在所选小部件旁边的手柄,也可以在画布上直接编辑某些样式属性(如旋转和角半径)。

                                                      

一旦设置了小部件的样式,就可以使用“Widget Styles(小部件样式)”功能(类似于Microsoft Word样式或CSS类)与其他小部件共享该样式。应用于所选小部件的小部件样式显示在Style Toolbar(样式工具栏)的最左侧控件中,也显示在Inspector的“Style”选项卡的“Widget Styles”下拉列表中。当您对特定小部件的样式进行更改时,“Style”选项卡中的下拉列表将在样式名称后面显示一个星号(*),您将看到“Update(更新)”和“Create(创建)”控件出现在样式名称旁边。(查看Widget和Page Styles的更多信息。)

交互性


交互确定小部件或页面的动态行为。交互有三个部分:事件,案例和操作。事件是OnClick和OnPageLoad等触发器。案例是触发事件时可能发生的不同情况。操作是构成每个案例的场景的各个组成部分。一个基本示例:链接到另一个页面的交互使用OnClick事件,具有单个案例,并使用“Window(窗口)”操作中的“Open Link(打开链接)”。

通过Inspector的Properties(属性)选项卡创建交互。在接下来的培训教程中,您将学习如何构建交互

Properties”选项卡中还有“Interaction Styles(交互样式)”部分。交互样式可用于配置在某些情况下应用于小部件的自定义外观:在小部件被鼠标悬停,单击,选择或禁用后。还可以通过小部件的快捷(右键单击)菜单设置交互样式。

小部件和页面注释


小部件和页面注释的最常见用途是记录小部件或页面的功能或要求。Notes(注释)还可用于记录更改,跟踪状态或管理自己或团队的任务。

在Inspector的Notes选项卡中添加注释。您可以通过单击“Notes”选项卡中的“Customize Fields(自定义字段)”来添加和删除小部件和页面注释的字段。

在浏览器中查看


在任何时候,您都可以在浏览器中查看图表。

选择“Publish(发布)> Preview(预览)”查看浏览器中的当前页面并与之交互。要与其他人共享项目,您有几个选择。您可以使用“Publish>Generate HTML Files(生成HTML文件)...”来生成源HTML,JavaScript和图像文件到本地驱动器,网络驱动器或服务器。

您还可以使用“Publish>Publish to Axure Share(发布到Axure共享)...”将文件发布到云。Axure Share托管在Axure的服务器上,包括密码保护,讨论和通知等功能。

                                                                      

打印


Axure RP主要用于创建在Web浏览器中查看的内容,但您也可以打印图表。要在画布上查看打印指南,操作“Arrange(排列)>Grid and Guides(网格和指南)>Show Print Guides(显示打印指南)”。打印指南的位置取决于您的纸张尺寸设置,可以到“Print(打印)>Paper Size and Settings(纸张尺寸和设置)”进行更改。

要打印图表,操作“File(文件)>Print”。您还可以选择要打印的文件页面,并在此处设置打印缩放。

下一篇文章将介绍Axure RP的流程图功能,敬请关注~

 

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Axure教程 原型设计工具Axure RP新手入门教程(一):基础 的相关文章

  • RealSense T265使用教程

    RealSense ROS 安装 https github com IntelRealSense realsense ros 安装教程 https www intelrealsense com get started tracking ca
  • Dockerfile使用教程

    第一 创建一个spring boot项目 第二 创建 xff1a Dockerfile文件 xff08 在项目根目录下 xff09 第三 复制粘贴 FROM java 8 设置基础镜像 FROM openjdk 8 jdk alpine 指
  • ROS教程(四):RVIZ使用教程(详细图文)

    ros教程 xff1a rviz使用教程 文章目录 前言一 RVIZ介绍1 数据类型介绍2 界面介绍 二 发送基础形状至RVIZ xff08 C 43 43 xff09 1 创建程序包2 创建节点3 编辑代码如下 xff08 示例 xff0
  • OptiTrack Motive 使用教程

    相机标定 最近在使用Quanser的地面车做实验 xff0c 需要用到OptiTrack系统进行定位 xff0c 记录一下使用过程 xff0c 供需要的人参考 本文参考了以下博客 xff1a https blog csdn net banz
  • Putty使用教程

    Putty作为免费且开源的老牌 SSH 客户端 xff0c PuTTY 经常用于 Windows 下连接管理远程服务器 为方便刚接触 VPS 的新手参考使用 xff0c 本文配合截图介绍 PuTTY 的基础用法及一些设置技巧 xff0c 希
  • Extjs 4.2 comboBox下拉复选框 checkbox

    Ext create Ext form field ComboBox name cmb fieldLabel 人员 margin 2 0 2 0 labelWidth 135 labelAlign right editable false
  • PS的颜色选择--从英雄到坏蛋的15个配色方案

    从英雄到坏蛋的15个配色方案 故事IGEEK DESIGN 迪斯尼公司于1923成立 他们的第一部长片电影 白雪公主与七个小矮人于1937年发布 关于白雪公主有一个最有趣的地方 她是迪士尼世界中最能代表 善良 的角色 在故事中 邪恶的王后嫉
  • 因为知道了这64个实用网站,初入职场我就成为了别人眼中的大神!

    一 设计导航 新媒体设计 产品经理设计 CND设计 懒设计 创客贴 二 在线工具 ARKIE作图 GitMind Removing 神奇海螺 一个工具箱 在线PS 视频压缩 三 云盘文档 小米云盘 坚果云 有道云协作 腾讯文档 石墨文档 四
  • 《网页设计基础——CSS的四种引入方式详解》

    网页设计基础 CSS的四种引入方式详解 一 行内式 规则 1 行内式是所有样式方法中最为直接的一种 它直接对HTML的标记使用style属性 然后将CSS代码直接写在其中 格式 p style color FF0000 font size
  • 《网页设计基础——HTML常用标签》

    网页设计基础 HTML常用标签 一 HTML网页框架 格式 二 块级标签 1 标题标签 h1 一级标题 h1 h2 二级标题 h2 h3 三级标题 h3 h4 四级标题 h5 五级标题 h6 六级标题 h6 h5 h4
  • 前端课设 网页设计期末作业-静态网页(下载链接在文末)

    网页设计期末作业 网站详情如下图所示 点我下载 https mp csdn net mp download manage download UpDetailed
  • Figma实用小技巧

    1 介绍 原作 草帽 视频地址 文字版整理 岩鸣杨子 2 快速拖拽调整数值 按住option可在数值上拖拽调整 不按option时只能在X Y W H 旋转 圆角等的图标上拖拽调整 不能调整透明度的数值 3 属性粘贴复制 shift X 互
  • 如何替代即将淘汰的Flash方案?

    欢迎大家前往腾讯云 社区 获取更多腾讯海量技术实践干货哦 本文由MarsBoy发表于云 社区专栏 导语 Web技术飞速发展的如今 我们在感受新技术带来的便捷和喜悦的同时 也时常在考虑着一个问题 老技术如何迁移 正如本文的主题一样 Flash
  • 使用HTML和CSS完成网页导航模块的制作步骤和方法

    小编本人从事IT培训教育行业多年 在教授学生网页设计课程的时候 尤其是到CSS部分的时候 学生总是很难理解 大部分学生上手慢 针对这个问题 小编本人在教学的时候 将网页设计分模块进行讲解 今天就来给大家分享一下如何使用HTML和CSS完成网
  • 网站下方版权信息的正规写法

    文章目录 格式 其中需注意 一个特别 教科书 版的例子 来自菜鸟教程最下方版权信息 其他写法 写在最后 虹棠包有话说 格式 Copyright 年份 名称 网站首页网址 All Rights Reserved 备案号 其中需注意 年份可以是
  • 2021-07-16(Qt实现图片拖拽功能)

    关于如何使用Qt实现简单的图片拖拽及缩放功能 一 代码实现 二 相关函数的解释 三 代码原理解释 一 代码实现 首先直接放出相关代码 可以根据注释进行一定修改 以下为头文件的内容 ifndef MAINWINDOW H define MAI
  • Spire.XLS 图表系列教程:C# 设置 Excel 图表坐标轴格式

    更多资源查看 Spire XLS工作表教程 Spire Doc系列教程 Spire PDF系列教程 下载Spire XLS最新试用版 默认情况下 创建图表时 Excel会自动设置其坐标轴属性 这些属性包括坐标轴选项 例如边界最大值 边界最小
  • QT 中信号与槽connect 放在哪个位置

    在使用QT 的时候 就一直犯嘀咕 两个对象之间使用信号与槽链接的时候 应该把connect 放在哪个位置呢 对象 A 对象 B两个对象 把connect 放在A 对象里还是放在B 对象里呢 在一次项目里面我突然自己领悟了一个方式 C 对象调
  • html制作动态八卦图源码

    动态八卦图 自动旋转的八卦图 一个html文件就行 如下动态图所示 taijitu html div div
  • CSS鼠标滑过翻转动画图标

    html css鼠标放上去变大效果 效果如下动态图 目录层级 代码如下 html文件 index html li li

随机推荐

  • 【VISIO安装问题】无法安装64位版本的office,因为在您的PC上找到以下32位程序

    无法安装64位版本的office 因为在您的PC上找到以下32位程序 当我们想要安装visio 64位程序的时候 我们的电脑提示这种错误 可能是我们电脑上32位 visio程序并未删除干净 直接卸载电脑上的32位visio程序有时候可能卸载
  • 严重: testWhileIdle is true, validationQuery not set ;使用连接池错误(无Spring框架,使用的JDK9,MYSQL8版本)

    在properties配置文件下添加一些配置 driverClassName com mysql cj jdbc Driver url jdbc mysql localhost 3306 javaweb userSSL true serve
  • C++ decltype用法详解

    1 什么是decltype decltype是C 11新增的一个关键字 和auto的功能一样 用来在编译时期进行自动类型推导 引入decltype是因为auto并不适用于所有的自动类型推导场景 在某些特殊情况下auto用起来很不方便 甚至压
  • Linux中grep函数的一些常见问题

    linux中grep 的详细用法已经有许多人介绍过了 本文是作者在学习过程中的总结和对原文中一些没有被提及或者含糊不清的概念的理解 一 grep概述 grep的全称是global regular expression print 即全局正则
  • 门子1200plc485 modbus rtu通讯,55条通讯,几百个数据,1s内完成

    门子1200plc485 modbus rtu通讯 55条通讯 几百个数据 1s内完成 最主要的是 别人的485要上升沿 还要写后面的完成和错误变量 又臭又长 我的 每条程序不用写上升沿 也不用管后面通讯的引脚 又快又省心 直接填写通讯地址
  • 云原生Kubernetes:pod基础与配置

    目录 一 理论 1 pod 2 pod容器分类 3 镜像拉取策略 4 pod 的重启策略 二 实验 1 Pod容器的分类 2 镜像拉取策略 三 问题 1 apiVersion 报错 2 pod v1版本资源未注册 3 格式错误 4 取行显示
  • Linux下安装Tomcat正常启动但是端口没有监听

    Linux下安装JDK1 7 然后安装Tomcat9 0 启动Tomcat端口没有监听 报错如下 Exception in thread main java lang UnsupportedClassVersionError org apa
  • 【火线解码】001.避免在finally语句块中使用return语句

    火线团队推出 火线解码 系列文章 每一篇解释一种不规范的代码写法 用较短的篇幅让大家快速的了解代码规范问题 001 避免在finally语句块中使用return语句 错误的代码示例 public class Bar public Strin
  •  Kaggle基本知识

    目录 Kaggle介绍 1 基本情况 2 含金量 部分Kaggle题目 kaggle的比赛类型选择 1 面向初学者 2 面向竞赛者 3 面向求职者 4 其他比较冷门的比赛类型 建议 申请Kaggle项目 1 项目导师背景 2 项目进阶分级
  • Task4 基于深度学习的文本分类

    fastText模型的输入是一个词的序列 一段文本或者一句话 输出是这个词序列属于不同类别的概率 在序列中的词和词组构成特征向量 特征向量通过线性变换映射到中间层 再由中间层映射到标签 fastText在预测标签时使用了非线性激活函数 但在
  • HTML <tbody> 标签

    实例 带有 thead tbody 以及 tfoot 元素的 HTML 表格 table border 1 thead tr th Month th th Savings th tr thead tfoot tr td Sum td td
  • Zmodem协议由浅入深

    Zmodem协议由浅入深 废话不多说直接解释 1 最简单的 ZMODEM 文件传输显示如下 例如 发送器要发送 爸爸的爸爸到底叫什么呀丫鸭压 gt gt gt gt gt 给接收器 逻辑如下 发送器 问 接收器可以接受什么类型的数据 接受器
  • stm32 Systick定时器

    Systick定时器属于是简单定时器 是为了节省定时器资源而存在的一个一般用于延时和用作实时系统的心跳时钟的一个定时器 Systick定时器就是系统滴答定时器 一个24 位的倒计数定时器 计到0 时 将从RELOAD 寄存器中自动重装载定时
  • 开发中遇到的线程不安全问题小结

    1 SimpleDateFormat 是线程不安全的 推荐使用如下 1 声明SimpleDateFormat变量时 加synchronized修饰 2 使用DateUtils 工具类 3 使用ThreadLocal 如下 private s
  • 设计一个学生类和它的一个子类——本科生类

    设计一个学生类 Student 和它的一个子类 本科生类 Undergraduate 要求如下 1 Student类有姓名 name 和年龄 age 属性 两者的访问权限为protected 一个包含两个参数的构造方法 用于给姓名和年龄属性
  • 微信小程序刷新前一界面数据和返回按钮监听

    在android中 为了实现从新页面往前一页面传值 使用startActivityForResult Intent intent int requestCode 打开新的activity 前一个activity通过onActivityRes
  • idea中安装leetcode插件后的cookie问题

    cookie配置 cookie失效操作相同 插件安装 cookie获取和配置 插件安装 参考 https blog csdn net m0 58275619 article details 120128587 安装插件后 idea中登录 可
  • 工厂模式有三个Level,你能用Go写到第几层?

    设计模式中的工厂模式是我们编写代码时常用的一种建造型模式 用于创建指定类的实例 在不使用设计模式的时候 我们是怎么创建类的实例的呢 别多想 这个问题没坑 就是我们写代码时直接用 new 关键字 直接创建实例 比如 Java 语言里是通过 n
  • Unet实现眼底图像血管分割(二)

    使用了google colaboratory的免费GPU进行训练 调整了源代码的各个参数 下面是configuration txt文件的解析 data paths 只有在修改了prepare datasets DRIVE py文件之后 才能
  • Axure教程 原型设计工具Axure RP新手入门教程(一):基础

    什么是Auxre RP Axure RP是一种线框图 原型设计 流程图和文档工具 使用Axure RP来创建和设置图表样式 为图表页面和元素添加交互性和注释 并将完成的设计发布到HTML以便通过Web浏览器查看 点击下方图片可观看视频 点击