×

axure制作网页原型图

axure制作网页原型图(如何用axure画app原型图)

admin admin 发表于2023-02-17 07:16:12 浏览33 评论0

抢沙发发表评论

本文目录

如何用axure画app原型图


多学习,多练手

画好原型后

1.下载Axure

2.如果是给itouch或者iPhone用的,比较好办,直接用320×480的分辨率画好辅助线,然后画原型

3.按F5生成原型的时候,在“Mobile/Device”选项中可以设置适配移动设备的特殊原型

4.设置说明见下图:(页面大小显示我的这个设置是按320×480的大小,默认不缩放)

5.用你的移动设备访问你生成的原型链接(如本地服务器,或Dropbox托管)

6.把该页面创建一个桌面快捷方式7.完成(有icon,有闪屏)

另:想做鼠标动作或者复杂的页面交互比较麻烦,不推荐,尽量简洁。


怎么学Axure网站原型设计的问题


学习axure rp可以分为以下几个阶段:
一、新手级:
是指刚刚接触原型设计,这个时期主要是打基础。先熟悉AxureRP的工作台,有哪些功能及组件,以及一些基本的操作,弄清楚每个组件是干什么用的。
在新手阶段,主要还是以熟悉为主,可以去网上找点前人总结的经验。再者就是要自己尝试着去用一遍里面的功能,可以做一些简单的页面原型,可以是没有任何交互的,也可以是带点交互的。
二、学徒级:
等到熟悉了AxureRP的所有功能之后,要开始实际应用其去设计一般的中低保真的原型了。光知道组件怎么用了还不够,还要配合交互事件,交互动作,条件判断,甚至是变量一起去实现某个交互的功能。如果说新手阶段是打基础的阶段,那么这个阶段其实就是一个融会贯通的过程,把所掌握的知识活学活用,真正的结合起来去实现一个整体的原型设计要求,这样才能掌握AxureRP的核心功能。
这个阶段的学习前期主要是模仿为主,首先要能看懂别人做的原型实例,看看人家是怎么设计的,然后依样画葫芦,自己动手做一个。
三、大师级
AxureRP自身所带的交互事件和动作已经能实现现有产品层面上的大部分交互效果,只要做基本上都可以用原型来实现。这个阶段可以试着做一些实现起来比较困难的实例,并可以尝试着开始做一些整站或者整体产品的效果,前面都大多停留在单个页面,单个实例的原型设计上,这里就要求能完成更整体的效果,出来的是一个产品的完整的原型。
最后要说明一下的就是,AxureRP只是一种原型设计工具而已,做交互设计最重要的还是想法,工具只是用来帮实现想法的。不必过于追求技术,不必过于追求视觉表现。把握好整个产品方向的同时,应专注于交互流程、页面内交互、布局结构的创新和优化。按照上面坚持下去,学习axure不在难!

axure是做什么用的


Axure RP是一款专业的快速原型设计工具。Axure(发音:Ack-sure),代表美国Axure公司;RP则是Rapid Prototyping(快速原型)的缩写。

Axure RP是美国Axure Software Solution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专业的原型设计工具,它能快速、高效的创建原型,同时支持多人协作设计和版本控制管理。

工作环境

Axure的可视化工作环境可以让你轻松快捷的以鼠标的方式创建带有注释的线框图。不用进行编程,就可以在线框图上定义简单连接和高级交互。在线框图的基础上,可以自动生成HTML(标准通用标记语言下的一个应用)原型和Word格式的规格。


关于Axure做原型图,怎么做出那种效果啊,点一下就列出二级目录,求详细教程


问这个问题的你,一定是个新手PM,老实说Axure我用着不太方便,首先需要下载,破解版、中文版、插件,下不完的东西,稍不注意就是一堆流氓软件。再有其实功能对新手不太友好。个人推荐你使用摹客原型。
与Axure、Mockplus等原型工具相比,摹客原型是在线的,它无需下载,打开链接就可以使用,更加灵活易用,灵活的组件拖动操作方法,也降低了新手的学习成本,即便是新手也能很快的把文字需求用原型形式表现出来,非常强大。
同时它还支持设计脑图和流程图,特别适合新人,一款工具,满足产品设计中大部分需求。

如何打开axure设计的原型图


第一步当然是下载、安装、汉化、激活。这些不再详述,百度一下有很多。笔者以前也谢了一个下载的经验,可以查看。
说一下基本的布局,8.0 比7.0有很多的改变:
图示标注区1:菜单栏
图示标注区2:发布区
图示标注区3:元件演示编辑区(对齐排版、大小、颜色等的编辑)
图示标注区4:页面栏目,发布后生成站点地图(可以取消显示)
图示标注区5:元件库(可以创建属于自己的元件库,也可以加载他人的元件库),元件库分类越清晰,内容越丰富,我们制作原型也就越快。
图示标注区6:页面工作区,发布后内容显示区
图示标注区7:为元件或页面添加交互事件,添加备注说明,设置编辑元件样式
图示标注区8:概要,当前页面的元件组织关系图,类似于Ps中的图层面板
图示标注区9:母版(使用DW做过网站应该会很清楚,母版类似于元件,且具备一处编辑多出同时修改的特性)。
下面的步骤,我们来简要说明一下每个标注区的用法:
2
图示标注区4:页面栏目
基本说明:可以将页面栏目理解为目录,为了更清晰的组织管理原型,在发布生成时,页面栏目生成:站点地图。
在页面栏目,我们可以创建文件夹及页面(见图示中的标注1),且可以拖动任意一个页面或文件夹,来改变他的级别(见图示中的标注2):
END
元件库的基本操作说明
1
图示标注区5:元件库
创建元件库(图一),并命名(图二)
2
保存成功后axure会自动打开元件库编辑面板(和原型库基本一致):
3
按照“页面栏目”对库进行组织,说明:文件夹为元件库的分类标题
4
添加:按钮,文件夹。圆角按钮元件,直角按钮元件:
并按图组织:
5
关闭并保存元件库,回到工作区,按图示点击:刷新元件库(创建时默认已经加载)。成功后,见下图所示:1 为元件库名。2 为命名的文件夹名 ,3 位元件库名
6
以上完成了元件库的创建与编辑。
下面来看一下加载:
本地加载和下载元件库
点击“载入元件库”,会自动打开本地,找到存放元件库的地方既可。
点击“下载元件库”:会自动连接到Axure官网,并手动下载
END
检视
该栏目包含:元件属性、元件备注、元件样式编辑
元件属性:
我们从创建的元件库中拖一个按钮到工作区,会见到下图所示的属性:
标注1:元件名(建议必须写,原因:同一元件使用较多时按钮名称区别)
标注2:交互事件,常用且非常重要,每类元件对应的交互事件略有不同,即元件的属性不一样
标注3:交互样式(鼠标滑过、点击、点击后)
说明栏,是对于元件的备注,可以添加备注,让UI或程序更好的理解你的意图:
3
样式栏:对当前元件的背景、边框、颜色、大小等进行设置:

axure是什么软件


axure是一款原型设计工具,更推荐选择Pixso协同设计。Pixso 不仅实现了和 Sketch、Adobe XD的无缝衔接,更基于优秀的组件变体、自动布局、实时协作等特色功能,团队成员面对一个复杂的设计项目,不再需要等主视觉完成后再进行子页面设计,让UI设计师在网页上就可以尽情自由创作。
Pixso协同设计可以无缝衔接以往工作,支持Sketch、XD、SVG等文件导入导出,自由进行Sketch的文件格式转换。并且,文件自动保存到云端,一键回溯到任意历史版本,再也不用担心文件丢失。素材库集成众多大厂优秀的设计系统,所有 UI 设计师均可直接拖拽复用,从此省去大量模块化设计环节的重复劳动。
想要了解更多关于设计工具的相关信息推荐选择Pixso协同设计。Pixso是一款专业的在线UI/UX设计工具,内置众多大厂的优秀设计规范,提供海量设计模板和素材,集成众多大厂优秀的设计系统,所有 UI 设计师均可直接拖拽复用,从此省去大量模块化设计环节的重复劳动,本地化字体资源,及专属私有化部署。

通过axure做原型设计生成的html代码可以让开发直接用吗


不可以,Axure 生成的只是原型,是在产品制定时供大家参考了解项目用的。

Axure输出的HTML文件不能直接用于前端代码开发,Axure为了模拟交互效果,使用了大量的JS,其中有很多是用不着的内容,前端代码需要完全重写。

Axure输出内容不能取代实际开发中的任何部分,只是为了提高沟通效率。

扩展资料:

Axure的特性

1.鼠标及键盘交互功能:

支持更多的新特性包括 OnDoubleClick(双击), OnContextMenu (右击),OnMouseDown(鼠标按键按下), OnMouseUp(鼠标按键松开), OnMouseMove(鼠标指针移动), OnMouseHover(鼠标指针经过), OnLongClick (鼠标长按), OnKeyDown(键盘按键按下), OnKeyUp(键盘按键松开)。

2.演示文档:

支持HTML5新特性,以及更好的支持手机演示特性。  

3.新增部件样式控制:

Axure7对于部件修饰功能有较大的改善,包括支持圆角、阴影、描边等设置。

4.更细化的部件属性:

更为丰富的部件属性,可以设置各种形状、样式,较Axure RP 6.5单调的形状而言,也是一种惊喜。

5.更多交互条件:

包括关闭指定窗口、设置锚点以及更为灵活的事件触发条件,对于移动互联网产品原型设计有很大帮助。

参考资料来源:百度百科-Axure


用axure做出的产品原型图的核心价值是什么,主要意义是什么


你好,首先我觉得原型设计需要根据需求(内部需求和外部需求)来设计自己的原型,其次你要明确产品原型相关意义~下面分享一些,你可以根据自身问题,看一看~

原型的定义:

  • 用线条、图形描绘出的产品框架,也称线框图。

  • 交互设计的结果输出,可能是一张纸上的几张图;原型代表着交互设计的结果,当最终实现的时候,交互流程会和原型保持一致;可以理解为草稿或者叫做参照物

  • 原型是一种让用户提前体验产品、交流设计构想、展示复杂系统的方式。就本质而言,原型是一种沟通工具。

原型设计:

  • 线框图描绘的是页面功能结构,它不是设计稿,也不代表最终布局,线框图所展示的布局,最主要的作用是描述功能与内容的逻辑关系。

  • 原型图是最终系统的代表模型或者模拟,比线框图更加真实、细致。

原型设计的作用,主要有两点:

  1. 沟通: 因为是原型是需求和功能的具象化表达,所以原型可以辅助产品经理与领导、交互、UI和技术的沟通产品思路。虽然需求文档也是可以满足沟通需求的,通过用例将交互写到设计描述文档中,但是原型可以更详细地解释交互。

  2. 测试:因为原型相较于UI稿来说修改更方便,所以原型能提高产品经理的功能设计没通过评审时返工的工作效率。没有哪一家互联网公司可以不经过测试,就直接上产品和服务。原型在识别问题、减少风险、节省成本等方面有着不可替代的价值。

原型设计的目的:

1.原型设计的核心目的在于测试产品,没有哪一家互联网公司可以不经过测试,就直接上产品和服务。

2.原型在识别问题、减少风险、节省成本等方面有着不可替代的价值。

3.虽然需求文档也是可以满足沟通需求的,通过用例将交互写到设计描述文档中,但是原型可以更详细地解释交互。  

设计流程:首先明确产出原型目的以及用户群体,这个原型有多大效率帮助我传达设计或测试设计? 有多少时间做原型?其次需要什么级别的保真程度?

具体方法:

步骤一:画草图:画草图的目标是提炼想法,并且最好给画草图加上一个时间限制,那就是15分钟。如果你绘画能力很差,那么恭喜你,可能你能更好地用好草图,因为你的注意力没有放在美化你正在画什么上面。另外画草图要避免陷入审美细节,尽可能快速的导出想法才是关键。

(用纸笔画的用户个人账户的草图示例)

步骤二:演示及评论

演示和评论的目标是把一些想法拿出来跟大家分享,然后进一步完善想法。

在演示过程中,要做好记录,演示和评论的时间可以对半分。

步骤三:做原型

在明确了想法之后,就可以开始进行原型设计了。这个阶段需要考虑很多细节,找出切实可行的方案,运用合适的原型来表达。

步骤四:测试

原型的目标之一是让受众来检验产品是否达到了预期,因此可以请5-6位测试者,通过音视频捕捉等方式,看看产品原型是否被顺畅地使用了。

原型设计工具:选择什么工具来制作原型?主要考虑以下几个因素(排名分先后):

1. 熟悉程度和获得工具的便利度;

2. 所需的时间和精力;

3. 可复用的代码/框架;

4. 为测试创建可用的原型;

5. 价格和学习曲线。

目前比较好用的在线原型设计工具有Marvel,Invision,墨刀等等。