Axure RP9原型设计工具使用记录:基础操作

2024-02-05 02:12

本文主要是介绍Axure RP9原型设计工具使用记录:基础操作,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

Axure RP9使用记录一

  • 📚第一章 前言
    • 📗背景
    • 📗目的
  • 📚第二章 基础介绍及操作
    • 📗页面功能总览
    • 📗基础操作
      • 📕设置样式
      • 📕设置交互
      • 📕设置组合
      • 📕设置动态面板
        • 📘属性
  • 📚第三章 实际应用及问题记录

📚第一章 前言

📗背景

在之前的ETL工具调研专栏,记录了很多ETL工具调研过程,确定技术选型之后,也就是最近两周,一直在使用Axure RP9画原型,原型也结束了,今天主要复盘下,记录一下画原型过程中元件的基本使用和一些问题

📗目的

为了避免在未来还需要进行原型绘制时出现遗忘,故此做个小笔记,以备不时之需(各位看官如果想系统的学习Axure RP9,可以去视频网站找些教程视频,博主就是这么干的,最终完成了数据集成ETL原型设计工作)。

📚第二章 基础介绍及操作

📗页面功能总览

在这里插入图片描述

📗基础操作

📕设置样式

以矩形为例:

  • 拖拽矩形1和矩形3
  • 修改矩形1的样式,可以变成矩形3
  • 单击选中元件,双击进入元件编辑,可以输入文字
  • 双击选中文字,可以设置字体、大小等
  • 单击选中元件,点击交互,选则下面的交互样式,可以设置鼠标悬停样式
    在这里插入图片描述
    进行修改样式等操作时,看不到类似确定的按钮,说明不需要点击确定,一般需要点击确定完成的按钮都很明显,没有看到说明不需要,改完即生效,如果不放心可以点击一下页面空白处

📕设置交互

以常见的点击新增按钮,弹出窗口,点击页面空白,关闭窗口为例:

  • 拖拽按钮到页面(几个按钮就是样式不一样,针对不场景,和上面矩形一样)
  • 拖拽一个矩形作为点击新增时的弹出窗口
  • 弹出窗口设置好之后,右键设置为隐藏(因为该窗口是通过点击新增弹出来的,所以一开始是隐藏状态)
  • 单击选中新增按钮,选择交互,选择单击事件,找到显示隐藏选项,设置显示弹出窗口
  • 单击页面(就是白色底板),选择交互,选择单击事件,找到显示隐藏选项,设置隐藏弹出窗口
    在这里插入图片描述

📕设置组合

针对上面的弹出窗口,真正使用的情况下,不会那么简单,一般需要填写各种值、下拉框等,这个时候就需要把这些内容作为一个组合,即整体,再进行显示、隐藏等操作

  • 拖拽矩形、文本框,绘制窗口内容
    在这里插入图片描述
  • CTRL+单击选中多个元件(此时按住CTRL不松开,按住鼠标拖动,可实现复制效果),点击组合,输入组合名称
    在这里插入图片描述
    在这里插入图片描述
  • 按照弹出窗口方式设置显示隐藏操作
  • 此时发现点击弹出框进行输入时,弹出窗口直接隐藏掉了,具体原因不清楚,但是可以给弹出窗口增加一个单击事件,解决该问题
    在这里插入图片描述
    不能按空格和回车,不然还是会隐藏
    在这里插入图片描述
    下图中的页面排列,可以指定页面内容排列方式 居中还是靠左
    在这里插入图片描述

📕设置动态面板

绘制原型的时候,一些复杂的联动效果,都是通过动态面板实现,有些可能中继器更简单点,只不过暂未涉猎,这里只记录自己实际用到的
在这里插入图片描述
这里以点击不同按钮弹出不同内容为例,点击动画名称弹出相应的动漫人物:

  • 创建好不同按钮,拖入图片元件,双击选择对应的图片,右键设置为动态面板
    在这里插入图片描述
    在这里插入图片描述
  • 双击进入动态面板,设置不同状态(即不同内容),可以点击复制原有状态或者新建状态
    在这里插入图片描述
    在这里插入图片描述
  • 给每个按钮设置交互事件,绑定不同的动态面板状态
    在这里插入图片描述
    为了方便选择,先给状态重命名一下,慢速点击两下,进入编辑状态
    在这里插入图片描述
    设置好一个交互事件,可以直接Ctrl+C复制,选中要粘贴的元件Ctrl+V粘贴,针对相同操作可以节约时间,我们这里对应不同的状态,所以还需要重新编辑选择下状态
    在这里插入图片描述
  • 选择对应的状态,预览
    在这里插入图片描述
📘属性
  • 上图预览,图片超大,是因为这里设置了自适应内容,也可以固定面板大小,通过滚动条查看内容
    在这里插入图片描述
  • 选择按需滚动,取消自适应,可以看到出现了滚动条
    在这里插入图片描述
    在这里插入图片描述

📚第三章 实际应用及问题记录

今天是2024-02-03,农历腊月二十四,周六,公司规定调休上班,梳理了一下最近工作用到的工具,也是为了后续更好的服务公司,明天是国家规定调休上班,明天再梳理下真正画原型中遇到的一些比较有难度的设计实现和问题吧!


已更新,详见:Axure RP9原型设计工具使用记录:实际应用及问题记录

这篇关于Axure RP9原型设计工具使用记录:基础操作的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/679476

相关文章

Python使用Pandas对比两列数据取最大值的五种方法

《Python使用Pandas对比两列数据取最大值的五种方法》本文主要介绍使用Pandas对比两列数据取最大值的五种方法,包括使用max方法、apply方法结合lambda函数、函数、clip方法、w... 目录引言一、使用max方法二、使用apply方法结合lambda函数三、使用np.maximum函数

Qt 中集成mqtt协议的使用方法

《Qt中集成mqtt协议的使用方法》文章介绍了如何在工程中引入qmqtt库,并通过声明一个单例类来暴露订阅到的主题数据,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧... 目录一,引入qmqtt 库二,使用一,引入qmqtt 库我是将整个头文件/源文件都添加到了工程中进行编译,这样 跨平台

C++使用栈实现括号匹配的代码详解

《C++使用栈实现括号匹配的代码详解》在编程中,括号匹配是一个常见问题,尤其是在处理数学表达式、编译器解析等任务时,栈是一种非常适合处理此类问题的数据结构,能够精确地管理括号的匹配问题,本文将通过C+... 目录引言问题描述代码讲解代码解析栈的状态表示测试总结引言在编程中,括号匹配是一个常见问题,尤其是在

Python调用Orator ORM进行数据库操作

《Python调用OratorORM进行数据库操作》OratorORM是一个功能丰富且灵活的PythonORM库,旨在简化数据库操作,它支持多种数据库并提供了简洁且直观的API,下面我们就... 目录Orator ORM 主要特点安装使用示例总结Orator ORM 是一个功能丰富且灵活的 python O

Java中String字符串使用避坑指南

《Java中String字符串使用避坑指南》Java中的String字符串是我们日常编程中用得最多的类之一,看似简单的String使用,却隐藏着不少“坑”,如果不注意,可能会导致性能问题、意外的错误容... 目录8个避坑点如下:1. 字符串的不可变性:每次修改都创建新对象2. 使用 == 比较字符串,陷阱满

Python使用国内镜像加速pip安装的方法讲解

《Python使用国内镜像加速pip安装的方法讲解》在Python开发中,pip是一个非常重要的工具,用于安装和管理Python的第三方库,然而,在国内使用pip安装依赖时,往往会因为网络问题而导致速... 目录一、pip 工具简介1. 什么是 pip?2. 什么是 -i 参数?二、国内镜像源的选择三、如何

使用C++实现链表元素的反转

《使用C++实现链表元素的反转》反转链表是链表操作中一个经典的问题,也是面试中常见的考题,本文将从思路到实现一步步地讲解如何实现链表的反转,帮助初学者理解这一操作,我们将使用C++代码演示具体实现,同... 目录问题定义思路分析代码实现带头节点的链表代码讲解其他实现方式时间和空间复杂度分析总结问题定义给定

Linux使用nload监控网络流量的方法

《Linux使用nload监控网络流量的方法》Linux中的nload命令是一个用于实时监控网络流量的工具,它提供了传入和传出流量的可视化表示,帮助用户一目了然地了解网络活动,本文给大家介绍了Linu... 目录简介安装示例用法基础用法指定网络接口限制显示特定流量类型指定刷新率设置流量速率的显示单位监控多个

JavaScript中的reduce方法执行过程、使用场景及进阶用法

《JavaScript中的reduce方法执行过程、使用场景及进阶用法》:本文主要介绍JavaScript中的reduce方法执行过程、使用场景及进阶用法的相关资料,reduce是JavaScri... 目录1. 什么是reduce2. reduce语法2.1 语法2.2 参数说明3. reduce执行过程

如何使用Java实现请求deepseek

《如何使用Java实现请求deepseek》这篇文章主要为大家详细介绍了如何使用Java实现请求deepseek功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1.deepseek的api创建2.Java实现请求deepseek2.1 pom文件2.2 json转化文件2.2