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

html-css020

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

不可以,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、摹客RP等,其中墨刀是一款可以直接在浏览器上打开使用的设计原型协作工具 。有些初学墨刀的小伙伴们想要了解用墨刀制作完原型之后可以导出什么内容以及对应的格式,下面小编来为大家解答这个问题 。

【墨刀中可以导出什么格式的单个元素?墨刀可以导出什么格式的原型图?】

墨刀中可以导出什么格式的单个元素?墨刀可以导出什么格式的原型图?

文章插图

我们在用墨刀导出元素/图层/画板的时候,可以以png和svg格式的图片格式导出,导出步骤如下;

1、首先我们需要从谷歌浏览器中打开墨刀工具,新建页面绘制原型图片等 。

2、然后我们需要在页面中选择需要导出的元素,可以是一个图层或是多个图层,也可以是一个组、嵌套画板和顶级画板 。

3、接着,在属性面板中,我们需要找到“导出”窗口来导出图层、元素或者画板 。

4、点击格式类型的下拉三角,可以选择svg格式也可以是png格式,具体根据需要选择 。

5、最后设置屏幕的密度倍率导出文件并在文件名后添加前/后缀 。

在墨刀中支持下载什么格式的原型?

1、墨刀中可以支持导出pdf格式的原型图,在编辑栏的顶部找到“下载”图标并点击,选择pdf导出即可 。

2、墨刀支持导出原型中的画布外内容,如PRD文档等,需要在编辑栏顶部找到“下载”图标并点击,选择png格式并开启【包含画布外元素】选项,点击下载即可 。

以上就是关于墨刀中支持导出的一些内容和格式,墨刀中既可以导出单个元素也可以导出原型图或原型中的画布外元素 。

墨刀如何添加页面标识?添加页面标识的作用是什么?

cdr如何去掉图片颜色?cdr中对图片进行去色处理的方法

cdr中如何对素材进行反显颜色?cdr反显颜色的三种方法介绍

Axure是最常用的原型制作工作之一。无须任何HTML/CSS/JavaScript基础,你都可以使用Axure制作出具备良好交互效果的原型图。本系列笔记以金乌的《Axure RP7 网站和APP原型制作从入门到精通》一书为参考教材,系统地学习一下Axure这款原型工具软件及其背后的设计思想。

开篇之前先提几个基础问题:

(1)什么是用户体验设计?什么是交互设计?什么是视觉设计?它们之间有着怎样的关系?

(2)什么是 UE ?什么是 UX ?User Experience?Usability?衡量“用户体验”有哪些指标和要素?怎么理解“可用性”?

(3)线框图、原型、视觉稿这三者有哪些区别?使用场景是怎样的?

线框图: 低保真图,通常以“黑白灰”线条来表达,制作速度快。

原型图: 中高保真图,可以代表最终的产品,用于在利益相关者之间的沟通。

视觉稿: 高保真图,具备良好的视觉效果。

在大多数的公司中,企业对产品经理和用户体验设计师并没有明确的界限,甚至你可以把二者看成相同性质的角色。

产品经理“斡旋”于开发工程师、系统功能、视觉设计、用户、业务逻辑、项目经理、投资人之间,协调资源并推动产品的发展。作为产品经理,必须深刻理解利益相关者的视角(他们到底想要什么)并与其密切沟通,以营造无障碍的协作环境,让产品在可控范围内推进发展。

身为产品经理,我们必须综合表达许多不同的信息,而这些信息常常会相互矛盾或冲突。我们不仅要熟悉业务流程,要了解技术约束、资源约束等,要了解用户体验对软件程序性能的影响,还要反复地做用户研究和数据分析等。我们要在纷乱的多条件模式下找到至关重要的平衡,并创建出最佳的可行的用户体验。

事实上,任何工具都不过是一种为了实现产品目标的手段而已,Axure同样只是一款工具,在工作中最重要的元素恰恰不是这些工具,而是你本人和你的思想。

1、Axure工作台上常用功能区域划分

菜单栏、工具栏、站点地图、部件面板、母版面板、部件交互和注释面板、部件属性和样式面板、部件管理面板、页面属性面板(包含页面注释、页面交互和页面样式3个选项卡)。 视图 >重置视图 ,可以重置Axure工作台。

(1) 站点地图 :用于增加、删除和组织原型中的页面。

(2) 部件面板 :用于管理Axure内建的部件库、第三方部件库、自定义的部件库。

2、Axure有哪些内置的常用部件?

线框图就是由一系列的部件组合而成,这和前端页面是一样的,页面由一系列的UI组件组合而成。不同的部件有着不同的功能属性,绘制原型的过程中要恰当选用这些部件。

3、对Axure部件可以执行哪些操作?

4、页面样式 Page Style 有哪些常用的操作?

5、Axure中的交互基础

在Axure中创建 交互 Interactions需要包含以下3个构造模块,分别是: 事件 Events、 用例 Cases、 动作 Actions。交互是由事件触发的,事件是用来执行动作的;交互设计的目的把静态的元素变成动态的,以提升产品的用户体验。

交互是Axure中的构建模块,用来把静态的线框图转换为可交互的HTML原型。每一个 交互 都是由3个最基本的单元构成,即 什么时候When(事件) 在哪里Where(用例) 做什么What(动作)

(1) 事件Events(When) :交互在什么时候发生?交互由事件Events来驱动。在Axure中的事件可以分为两大类,其一是页面事件,其二是部件事件。一个事件中可以包括多个用例,多用例根据条件判断来决定执行哪一条用例路径。

(2) 用例Cases(Where) :用例是用户与应用程序或网站之间交互流程的抽象表达,每个用例中可以封装一个独立的路径。通常情况下,我们让原型按主路径来执行动作,但是为了响应用户的不同操作或其它条件,我们还需要制作可选路径来执行其它动作。Axure中的用例,正是用来给事件Event创建不同的执行路径。 一个事件中可以包含一个或多个用例(多用例时需要根据条件逻辑来判断执行),一个用例又包含一个或多个动作。事实上,你可以把用例看成动作Actions的容器

(3) 动作Actions(What) :动作是由用例定义的对事件的响应。Axure中的动作分为六大类,分别是链接、元部伯、变量、中继器和杂项。