1 在[页面]面板中选中[page1] 2 在[元件库]中选中[动态面板],并拖拽到[设计区域]中 3 双[设计区域]中的动态面板,打开[动态面板管理]页面 4 在[动态面板管理]页面中输入动态面板的名称“测试动态面板”,并单击[面板状态]下的“+”号4次,并将State1-4修改为tab1-4 5 在[面板状态管理]的[面板状态]下单击[编辑全部状态]按钮. 6 单击[编辑全部状态]按钮后的[设计区域]展示为 7 在tab1-4动态面板中添加[矩型1],修改[矩型1]的内容为“tab1-4”,…

利用Axure的动态面板组件制作图片轮播: 首先现在操作区添加一个动态面板组件: 鼠标放在动态面板上,右键单击选择面板状态管理,给动态面板设置名称并添加两条状态然后点击确定. 双击动态面板,然后双击state1,跳转到state1状态设置页面,然后我们为其添加一个背景图. 同理,也给state2和state3导入图片. 在动态面板页,单击属性中的载入时用例: 点击确定,然后在浏览器中预览就能看到图片轮播效果了.…

这几天用Axure画原型图的过程中,须要实现Tab选项卡切换的效果,但Axure中并没有类似于Tab控件的部件,所以能够用Axure中的动态面板(Dynamic Panel)来实现. 本文以已经汉化的Axure7.0为例.英语不太好的朋友能够先进行汉化(汉化的时候要注意版本号.不同的版本号.汉化文件也稍有差异). 详细实现过程例如以下: 1.往页面中拖入一个动态面板部件: 2.给该动态面板部件加入几个状态: 操作方法为:双击该动态面板,点击左側的加号加入状态.这里把四个加入的状态名称改为"选项卡…

实现目标 点击导航条不同的菜单,页面跳到菜单相应的位置,实现页面自动滚动. 1.  拖入编辑区3个矩形,并相应命名为菜单1,菜单2 ,菜单3: 2.  再新建3个想要制作的文本框准备进行锚点滚动: 3.  将要制作的文本框进行选中组合,并对组合进行命名为页面1: 对组合进行命名:页面1 4.  我们接下来选择出一个便签来记录每一个制作的文本框的x与y的坐标: 5.  进行移动我们刚才的页面1组合,并进行菜单2的锚点的坐标: 6.  进行移动我们刚才的页面1组合,并进行菜单3的锚点的坐标: 6. …

1.打开axure7,开始. 2.拖一个占位符组件到布局上(当然也可以是矩形.图片之类的),大小270*170,作为幻灯片的第一张片子,双击写上“第一张片子”. 3.拖一个矩形,设置形状为椭圆,调整大小为10*10,调成一个正圆,Ctrl+D,连续复制到第4个,表示当前幻灯片的数量,排列整齐,放到上面的占位符下方,设置第一个指示器的背景色为灰色,表示当前选中状态.做好的效果如下: 4.现在开始,动态面板上场了:选中占位符组件,右键“转换为动态面板”,起个名字main,选中4个圆形指示器组件,右键…

有一次,主管安排我写一个项目的原型,但是项目中涉及到了Tab控件,在Axure中的控件中找了一番,没有找着Tab控件.那么我们只能换种法子来实现它了,我们用到了Dynamic Panel来模拟. 1.首先我们拖动Dynamic Panel到我们的页面中.如下 2.双击Dynamic panel,然后跟据你要创建的Tab页面填写 3.然后点击面板状态下面的第五个按钮,进行所有控件编辑 4.然后拉一个Rectangle和两个Button Shape到页面1上面 5.选中Button Shape右键-…

Axure原型 1.原型的出现 -软件功能复杂,用户需求多 -挖掘用户的实际需求 -项目组之间降低沟通成本 2.类型: ［草图原型］描述产品大概需求,记录瞬间灵感 ［低保真原型］展示系统的大致结构和基本交互效果:可用于给项目组同事进行交流 ［高保真原型］视觉和体验上几乎接近真实产品:最多用于给用户进行演示 3.原型设计方式不是单一的,可以用草图.文字等等,Axure是一个快速的原型设计工具,方便用于与用户和项目组同时交流 4.axure RP(rapid prototyping)可以让设计师们利…

页面原型工具 Axure 超实用页面原型工具.好的页面原型是项目组成员顺利沟通的一个非常重要因素,Axure能快速制作页面原型,还能界面手动式加上事件,链接跳转,弹出层等等一切HTML开发中常用功能,做好之后能生成html,便于浏览,讨论.下面原型是我同事小兵做的,貌似我接触的我们公司需求分析人员对这个都很在行,做的东西都很漂亮.图1是模型,图2是生成的HTML…

自己的感受:非常的考脑,上课要集中120分精神. Axure(快速制作网页原型) 1:全局变量:a:在菜单栏中可以新建全局变量. b:控制全部网页. c:取到输入框的值,设置User的值等于输入框的值,把User的值传递到其他页面,设置新建的文件的值为User. 2:加法:首先在主页面上将加法的框安上,并命名,在等于符号上做事件,鼠标单击时做用例(用例1:编辑条件:选中项值,选项,+时,确定.设置部件文字=“[[LVAR1+LVAR2]]” 设置文本—结果,确定. 3:倒计时:安上文本,输入9.…

Axure不仅能制作静态的视觉稿.页面,还能添加交互动作,是进行原型设计的最佳软件之一.在认识了Axure的界面和部件库之后,我们可以用它来画线框图了,但是静态的线框图在表达上不如有交互的原型图来得直观. Axure进阶篇中将会介绍什么是交互,如何玩转Axure中最频繁使用的动态面板部件,做出狂拽炫酷的交互效果.另外,还会介绍母版(主要是触发事件)的使用. 交互基础知识 开始使用Axure做交互之前,我们先来看看Axure的安身立命之本,即交互这个概念.创建交互包括四个模块: 交互(intera…

如果说Sketch是最美.最简洁的设计软件,那么Axure就是最强大的原型制作软件.Axure不仅能制作静态的视觉稿.页面,还能添加交互动作,是进行原型设计的最佳软件之一.虽然Axure的学习曲线比较陡峭,但是掌握之后可以很快实现我们脑海中的用户体验效果. 笔者自学Axure有半年多的时间了.刚开始接触Axure的时候,逛过无数论坛.Axure的网站,也浏览了许多大牛录制的Axure视频课程.这些教程和资料非常完整地介绍了这款软件能够做什么,这款软件的界面如何,怎么样使用部件,如何创建交互等.但…

写了几个Axure教程之后发现,可能教程的起点有些高了,过分的去讲效果的实现,而忽略了axure功能以及基础元件的使用,那么从这个教程开始,把这些逐渐的展开讲解. 关于动态面板 动态面板是axure原型制作中使用非常频繁的一个元件,主要用途就是实现一些动态的交互效果.所以,如果动态面板使用不熟悉的话,对axure原型的制作会有很大的影响,那么动态面板都能做什么呢?主要有以下几个方面: 1.  隐藏与显示 2.  滑动效果 3.  拖动效果 4.  多状态效果 以上这些效果都在移动面板的元件属性里…

写了几个Axure教程之后发现,可能教程的起点有些高了,过分的去讲效果的实现,而忽略了axure功能以及基础元件的使用,那么从这个教程开始,把这些逐渐的展开讲解. 关于Axure动态面板 动态面板是axure原型制作中使用非常频繁的一个元件,主要用途就是实现一些动态的交互效果.所以,如果动态面板使用不熟悉的话,对axure原型的制作会有很大的影响,那么动态面板都能做什么呢?主要有以下几个方面: 1.  隐藏与显示 2.  滑动效果 3.  拖动效果 4.  多状态效果 以上这些效果都在移动面板的…

产品需求对产品研发而言非常重要,写不好需求,后面的一切工作流程与活动都会受到影响.转载一篇文章,关于产品需求文档写作方面的,如下: 本文摘自(一个挺棒的医学方面专家):http://www.cnblogs.com/okaimee/archive/2013/01/11/2855896.html 一.文章的摘要介绍 无论我们做什么事都讲究方式方法,写产品需求文档(以下称PRD文档)也是如此,之前我通过四篇文章分享了自己写PRD文档的一些方法,而这一篇文章主要是对之前四篇文章进行整体的摘要介绍,帮助大…

今天在写JS时,写到500多行时,感觉代码已经很难看了.想到C#代码都有折叠功能,是不是JS也有呢.在选项中找了一下,没有相关了的设置功能,于是就上网找.一找可就不得了,发现了好多好用的插件.都可以在Visual Studio 的MSDN上找到.网址为:http://visualstudiogallery.msdn.microsoft.com/ 插件有的是免费,有的是试用,有的是付费的.安装插件很简单,下载后双击安装就是了,和EXE安装一样. 网站上把插件分为三大类:工具.控制和模版.当然我们这…

在产品和技术领域里都有UML的技能知识,而对于产品人员的UML则更多的是指用例图,也就是我所称呼的用户流程图.在讲PRD文档写作的第二篇文章里,我提到了用户流程图的制作,实际上用户流程图是我在产品规则的初期对用例图的一种结构化的表达方式,由于以结构化的方式描述用例太抽象,缺少逻辑性表达,并且那篇文章更偏向于功能性用户流程,还不是实际意义上的用例,因此今天我补文一篇,细讲一下UML用例图和用例文档. 用例文档是由多个用例组成的一份文档,主要用于技术开发与测试使用,他是PRD中的重要辅助文档,用于讲…

很多刚进入app后端的小伙伴,有的是之前没有接触过这个行业,有的是只在学校学习了基本的技术知识,不知道开发app的整个流程是怎么样的,因此心里会有一股恐惧.听着别人口中的一大串app相关的术语,也不知道怎么回事,更谈不上和别人交流.在本文中,根据本人在创业公司的经历,帮你解决以上的疑惑,助你迈入app开发的大门. 项目启动阶段 在一个app项目启动之前,由产品经理(在创业公司里, 产品经理一般都是公司的创始人)把自己对app的想法,例如,app是做什么业务的,有哪些界面,每个界面上有哪些元素,每…

产品需求文档(PRD)的写作   一.文章的摘要介绍 无论我们做什么事都讲究方式方法,写产品需求文档(以下称PRD文档)也是如此,之前我通过四篇文章分享了自己写PRD文档的一些方法,而这一篇文章主要是对之前四篇文章进行整体的摘要介绍,帮助大家快速了解写作流程. 1.写前准备(信息结构图): 在写PRD文档之前,我们需要先罗列出产品功能的信息内容,这一步是将想法逐渐清晰的第一步,也是帮助我们接下来规划功能的辅助信息,同时也可以辅助服务端技术人员创建数据库.因为这是第一步,所以我们不需要罗列的很详细…

选项卡:点击不同的按钮会显示不同的内容 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-…

今天给大家提供一个由今天给大家提供一个由Java swing实现的酒店管理系统,数据库采用sqlserver,我会贴上部分代码,完整的代码请看文章最下方下载,下面看代码: 1.主框架代码: package 主框架窗口; import java.awt.BorderLayout; import java.awt.Color; import java.awt.Dimension; import java.awt.FlowLayout; import java.awt.event.ActionEven…

使用Axure制作的原型,如果你没有设置自适应视图的话它是不会自动适应任何设备的. 若要解释清楚这个问题需要的篇幅比较长,请大家自行参考 Point/Pixel/PPI/DPI 的意思和它们之间的关系.这里不再赘述,直接给大家提供一个常用的移动设备尺寸列表,制作原型时根据查询的尺寸在axure中设置大小即可,设计完毕后在生成HTML时设置 手机/移动设备 中勾选包含视图接口( include Viewport tag ),并进行配置,生成HTML后再到相应的移动设备中浏览就正常了. 意思是:你要…

想用Axure设计一个 APP原型 放到真实的移动设备中演示,但不知道应该使用什么尺寸?若要解释清楚像素和分辨率需要的篇幅比较长,请大家参考百度百科.这里金乌直接给大家提供一个常用的移动设备尺寸列表,制作原型时根据查询的尺寸在axure中设置大小即可,设计完毕后在生成HTML时设置 手机/移动设备 中勾选包含视图接口( include Viewport tag ),并进行配置即可. 原帖:http://www.yuanxingku.com/article-65-1.html 如: iPhone4…

使用Axure制作App原型怎样设置尺寸? 原文地址:http://www.axure.us/2172/ 本文由原型库网站投稿,转载请注明出处. 最近有几位小伙伴儿都提出同样一个疑问:想用Axure设计一个 APP原型 放到真实的移动设备中演示,但不知道应该使用什么尺寸?若要解释清楚像素和分辨率需要的篇幅比较长,请大家参考百度百科.这里金乌直接给大家提供一个常用的移动设备尺寸列表,制作原型时根据查询的尺寸在axure中设置大小即可,设计完毕后在生成HTML时设置 手机/移动设备 中勾选包含视图接…

对于产品经理来说,熟练使用一些常用软件是一项十分必要的技能.其中,作为一个专业的快速原型设计工具,Axure RP无疑在产品人心中拥有一个难以撼动的地位.但就要PS一样,虽然足够专业,但同样也会存在使用灵活性的一些问题. 今天我们就谈谈,如何用Axure快速制作APP交互原型,不对,更准确的说法应该是:如何用Axure快速制作一份有水准的APP交互原型.作为一名优秀的产品人不仅要保证效率,也要保证质量才行. 首先抛出我的方法论:制作属于自己的元件库并要学会善用母版,熟悉APP设计规范并要有自己一…

:target伪类的作用是突出显示活动的HTML锚,下面是一个简单的例子: HTML代码: <div> <a href="#demo1">点击此处</a> </div> <div id="demo1">测试结果</div> CSS代码: :target{ color: #343434; border: 1px solid red; background-color: red; } #demo1写…

Axure本身是没有直接提供圆形组件的,所以很多朋友在微博上问,如何使用axure制作圆形,难道都要找美工-- Axure没有提供圆形组件,但是它提供了一个万能组件--矩形组件,只要有矩形组件,我们就可以制作出圆形,下面让我们看看具体的制作步骤: 1. 拖动矩形组件到页面编辑区域,并设置形状为椭圆 2.设置椭圆的尺寸w: 80 h:80 来自:非原型不设计…

TabIndex-----------------------------------确定此控件将占用的Tab键顺序索引 Tabstop-------------------------------指示用户是否可以使用Tab键为控件提供焦点 无边框窗体制作中,鼠标移入,移出,按下的事件:  最小化: Anchor------------------------------定义某个控件绑定到的容器的边缘,当控件锚定到某个边缘时,与制定边缘最接近的控件边缘与指定边缘之间的距离将保持不变.…

微信小程序利用swiper制作内容高度不定的tab选项卡,不使用absolute定位,不定高度,由内容自由撑开主要思路是获取内容区的高度来给swiper动态设置值 .wxml <view class='content'> <view class="swiper-tab"> <view class="swiper-tab-item {{currentTab==0?'active':''}}" data-current="0&qu…

代码 这里主要使用表单的单选按钮来实现这个TAB显示和隐藏,首页tab里的内容默认隐藏,如果单选按钮为选中状态(checked)就显示内容.具体请看下面代码. 关于兼容性,因为是用CSS3来制作的,所以如果不支持CSS3的浏览将会出现不兼容的情况. HTML代码 <ul class="tabs"> <li> <input type="radio" name="tabs" id="tab1" che…

tab栏切换制作 先上图 要求1:默认状态,第一个选项卡被选中,展示第一个选项卡的内容 策略:第一个选项卡默认有被选中的样式,第一个选项卡对应的display: block,其他的dispaly设为none 要求2: 选项卡模块:被点击的变为红底白字,其他的变为白底红字 策略:排他思想,每次点击一个选项卡时,先把其他选项卡设为默认样式,然后自己设为被选中的样式.这里我们先在style里面设置一个新的class,把这个样式给被选中的选项卡. 要求3:每点击某个选中卡,出现对应的模块内容,点击第一个…