Axure元件

一.元件基本介绍

1.1基础元件

1.基本元件:
文本框(Text Field): 用于显示文本内容,可以设置文本样式、字体、大小和对齐方式等。
按钮(Button): 可交互的控件,常用于触发特定操作或转换页面状态。
形状(Shape): 包括矩形、圆形、箭头等,可用于装饰、分隔或突出显示特定区域。
图像(Image): 插入图片文件,可以是 UI 元素、图标或任何需要展示的图形。
容器元件:

面板(Panel): 用于组织和包含其他元素,可以模拟页面结构或创建复杂的交互区域。
动态面板(Dynamic Panel): 可以切换状态和显示不同内容的容器,常用于制作可交互的组件和动画效果。
数据元件:

表格(Table): 用于展示和管理数据,可以模拟实际的表格布局。
列表(List): 显示项目列表或数据集合,支持多种排列方式和交互操作。
交互元件:

链接区域(Hotspot): 透明的热点区域,用于创建可点击的区域而不显示实际元素。
交互式组件(Interactive Widgets): 如下拉菜单、滑块、日期选择器等,可以模拟真实应用中的交互效果。
复合元件:

组合(Widget Groups): 将多个元件组合成一个单独的元素,便于整体管理和重复使用。
Axure 的元件库丰富多样,设计者可以利用这些元件快速搭建原型,并通过状态、交互动作等功能模拟真实应用的行为和外观。元件的组合和定制使得设计更加灵活,同时提高了设计效率。

1.2元件基本使用

基本元件基本元件是由形状元件、图片元件、线段元件及中继器构成。

包括了矩形、圆形、矩形的应用比较广泛,它可以用来做很多的工作,比如作为页面的背景,只需要将矩形填充相应的颜色即可;还可以把他制作为按钮、选项卡,使用的时候调整矩形的形状或调整圆角即可。

1.2.1图形

 

制作原型时,可以用它来代替对一些没有交互或者交互比较简单容易说明的区域;也可以做成关闭按钮。占位符在保真比较高的产品原型中作用不大。 

我们还可以通过在元件上点击鼠标右键,通过菜单中的【选择形状】,让矩形变为圆形或占位符。 另外,形状元件还可以通过上下文菜单【变换形状】选项中的【转换为图片】,将形状元件转换为图片元件。 在Axure RP 9中,我们还可以为形状添加背景图片。形状元件一般用于页面中的背景、边框、按钮、分割线等

1.2.2图片

使用方法,图片元件的操作比较简单,可以通过双击选择本地磁盘中图片,将图片载入到编辑区,axure会自动提示将大图片进行优化,以避免原型文件过大。 

1.2.3文本

 文本元件包括文本标签、文本段落、一级标题、二级标题和三级标题,用来表示页面中的一些文字内容。
实际上文本元件也是形状元件,给文本元件添加边框,就变成了矩形元件。

1.2.4热区

热区是一个透明的元件,通过属性设置就可实现类似超链接的功能。

常用操作:比如在一张图片中的两个位置上添加点击跳转的效果,就可以在这两个位置上放置两个热区,然后为热区添加点击跳转的交互。

热区的应用

1.可以添加成链接,用作链接跳转,在一定程度上减少工作量。

2.跳转到层或区域,比如滑动网页时回到顶部(跳转)。
3.可以添加交互,比如翻看网页时,自动加载。
4.用作跳转,如果每个标题都需要添加一个跳转链接太繁琐,可以添加一个热区 ,通过热区来达到跳转。

新手在初期学习使用axure软件时,仅需要了解热区功能及应用

1.2.5线段原件 

水平线、垂直线。选择水平线或垂直线,可以作为表示页面一些区域分割时使用,比如在两块不同区域之间添加一条水平线,来明显的区分。

使用方法:将水平线或者垂直线拖拽到右侧画布中,然后按下 Ctrl 键,将鼠标置于线段末端,进行旋转

 1.2.6表单型元件的使用

表单是需要用户填写的,所以表单元件都是用于获取用户输入数据的元件。 

二.元件应用

2.1登陆界面

2.2登陆界面运行

  • 27
    点赞
  • 28
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
LIB001 - AxureUX交互原型Web元件库完整版; LIB001v2 - AxureUX WEB前后端交互原型通用元件库 v2.0; LIB003 - AxureUX交互原型移动端元件库完整版; OTH002 - AxureUX信息化精美简历模板完整版; TEM001 - AxureUX电商产品移动端交互原型 - 优品汇APP; TEM002 - AxureUX后台业务管理系统原型模板; TEM003 - IOS11 Library And APP Template 交互原型模板; TEM006 - AxureUX电商平台WEB端交互原型模板 - 优品汇; TEM007 - AxureUX企业及通用型网站WEB端原型模板; TEM008 - AxureUX区块链宠物移动端原型模板; TEM009 - AxureUX内容资讯平台交互原型模板; TEM011 - AxureUX中后台管理信息系统通用原型方案; + FontAwesome字体图标; LIB001 - AxureUX交互原型Web元件库完整版; FontAwesome v5.7.2字体图标元件库(Free版); LIB001v2 - AxureUX WEB前后端交互原型通用元件库 v2.0; LIB002 - AxureUX交互原型Web元件库精简版; LIB003 - AxureUX交互原型移动端元件库完整版; LIB004 - AxureUX交互原型移动端元件库精简版; LIB005 - AxureUX手机移动端交互原型通用元件库 v2.0; OTH001 - AxureUX交互原型设计指南; OTH002 - AxureUX信息化精美简历模板完整版; OTH003 - AxureUX信息化精美简历模板精简版; TEM001 - AxureUX电商产品移动端交互原型 - 优品汇APP; TEM002 - AxureUX后台业务管理系统原型模板; TEM003 - IOS12 Library And APP Template 交互原型模板; TEM004 - iPhoneX And iPhone8 Mockup 原型模板; TEM005 - AxureUX后台管理系统框架原型模板; TEM006 - AxureUX电商平台WEB端交互原型模板 - 优品汇; TEM007 - AxureUX企业及通用型网站WEB端原型模板; TEM008 - AxureUX区块链宠物移动端原型模板; TEM009 - AxureUX内容资讯平台交互原型模板; TEM010 - AxureUX内容分享平台交互原型模板; TEM011 - AxureUX中后台管理信息系统通用原型方案; TEM012 - AxureUX手机移动端交互原型通用模板精简版; 表格原型,带交互; 数据可视化的动态元件库20191202; 数据可视化原型; Element; Material Design 元件库; web端元件库; 和微信风格一致的Axure元件库; 手机移动端交互原型通用模板精简版二; 微信小程序元件库; AxureUX交互原型移动端元件库精简版 v1.1; iOS 元件库;

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值