精华内容
下载资源
问答
  • Axure画FaceBook原型

    2018-06-19 20:39:04
    Axure RPFaceBook的交互原型,不过只是简单的页面,并不能实现所有的功能。
  • GS_Axure_1 用Axure元件前台页面,主要功能,实现快速原型! GS快速原型**
  • Axure实现页面跳转(Axure学习日志2)

    千次阅读 2019-07-29 14:07:35
    Axure画页面之后,有一些页面是通过某个组或者某个图标进行跳转,那么怎么实现跳转呢? 创建好页面 以我已经画好的 我的12306页面和登录注册页面为例。 实现点击我的12306登录栏侧箭头实现跳转登录页面 首先打开...

    Axure实现页面跳转

    在Axure画出页面之后,有一些页面是通过某个组或者某个图标进行跳转,那么怎么实现跳转呢?

    创建好页面

    在这里插入图片描述在这里插入图片描述在这里插入图片描述以我已经画好的 我的12306页面和登录注册页面为例。

    实现点击我的12306登录栏侧箭头实现跳转登录页面

    首先打开我的12306页面,选择登录栏的右侧箭头。选择好之后在右侧的PROPERTIES中选择OnClick。
    在这里插入图片描述点开后在左侧Link➡Open Link➡Current Window
    然后在右侧选择登录页面,点击OK即可。
    在这里插入图片描述这样就实现了在12306 页面点击登录栏右侧侧图标跳至登录界面。

    实现登录界面点击左上方箭头跳转回主页

    打开登录页面,选择左上方箭头,选择好之后在右侧的PROPERTIES中选择OnClick。
    在这里插入图片描述点开后在左侧Link➡Open Link➡Current Window
    然后在右侧选择我的页面,点击OK即可。
    在这里插入图片描述这样就实现啦!
    可以发布在浏览器上测试效果。

    展开全文
  • Axure页面原型设计

    千次阅读 2019-06-14 11:17:51
    Axure页面原型设计关于Axure打开Axure新建项目/页面元件使用导入元件库为页面元件添加事件用例展示 第一次写博客,偶然的机会让做一个软件的页面原型。也是第一次用,感觉挺有意思,就在这做个记录。有不足之处...

    第一次写博客,偶然的机会让做一个软件的页面原型。也是第一次用,感觉挺有意思,就在这做个记录。有不足之处请谅解。

    关于Axure

    我用的是AxureRP8。这个官网都可以下载:https://www.axure.com/download,应该是需要邮箱的吧,不记得了。

    1. 注册码 ,注册码的话可以自己找个链接:
      https://blog.csdn.net/a33130317/article/details/82351570亲测可用。
    2. 当然有些英语不好的小伙伴刚,这里准备了 汉化包https://www.axure.com.cn/2616/
    3. 下载完成后,安装什么的都不需要再找教程了吧。接下来就开始设计之旅吧,咱们看图说话。

    打开Axure

    这是打开后的页面,大致介绍一下。我这里加了汉化包。惭愧惭愧!
    这是打开后的页面,大致介绍一下。我这里加了汉化包。惭愧惭愧!

    新建项目/页面

    新建页面
    新建页面,

    元件使用

    元件的使用,以及对应工具栏
    元件的使用,以及对应工具栏

    导入元件库

    元件库文件导入之前要改后缀名 .rplib ,不然载入不进去。
    元件库文件导入之前要改后缀名	.rplib ,不然载入不进去。

    为页面元件添加事件用例

    页面中有些元件是需要时间的比如,你点击某个页面的元件需要它跳转到另一个页面,就需要添加事件用例了。
    在这里插入图片描述
    选择完成后弹出以下对话框。
    在这里插入图片描述

    展示

    点击你要运行的页面,快捷键按F5,页面就能再网页显示了,对用的事件也可以用。图示:
    效果图
    好了,以上就是我用到的大致流程,看完自己试试吧,能点个赞更好!当然里面有些参数专业设计有才懂得,我这里不是很懂。有不足多谅解。谢谢!

    展开全文
  • Axure如何页面的线框图

    千次阅读 2018-12-21 17:19:01
    我们在设计产品的时候,就好比微信,由很多个可滑动的页面组成,...出主要状态的线框图 一个页面,可能包含多个状态的显示效果。比如微信APP首页除了常见的下图显示效果,还有点击右上角+的显示效果,还有删除所有...

    我们在设计产品的时候,就好比微信,由很多个可滑动的页面组成,而每个页面中存在的线框图也需要一个一个去进行设计。我们都知道 Axure(http://www.axurechina.cc/)是一款原型设计工具,那么我们要使用Axure如何去实现线框图的绘制呢?
    画出主要状态的线框图
    一个页面,可能包含多个状态的显示效果。比如微信APP首页除了常见的下图显示效果,还有点击右上角+的显示效果,还有删除所有聊天的显示效果……
    但是,最核心的状态应该是用户进入该页面之后,正常清晰应该看到的所有内容。PM应该以此来画出该页面的主要状态线框图。
    补充次要状态的线框图
    然后我们画出次要状态的线框图。我们可以放置到主要状态的线框图旁边。
    有时候也可以次要状态的线框图,放到主要状态线框图上面。更加容易理解原型。
    优化线框图的细节
    画完该页面所有的线框图之后,我们可以调整一下细节。这样子会让我们的原型看起来比较专业。PM可以不追求原型的视觉美,但是得要求原型的逻辑美。
    元件的大小比较恰当,看起来是否协调。
    元件的位置,是否恰当,是不是对齐。
    同样功能的元件,大小是不是一致。
    元件的配色,是不是只有黑白灰,建议少用彩色。
    添加交互
    如果你们公司要求只需出静态图或者线框图,那么画完上面2步,就足够了。
    如果你们公司除了线框图之外,还要求PM画出交互,以此来更加逼真的表现APP原型。那么我建议你在主要线框图上面把主要的交互画出来。
    继续拿上面的例子来讲,如果我需要画出点击右上角+的交互。
    那么我需要把浮出层,生成为动态面板。
    然后给+去添加显示和隐藏动态面板的交互。

    按照类似的步骤,画出左滑聊天,显示“标记未读”“删除”,点击“删除”按钮,出现操作列表的交互。
    写上逻辑
    最后,我们需要补充主要状态线框图,次要状态线框图中的全部逻辑。逻辑貌似所有PM都会写,但是很多PM写得很一般。原因就是缺乏写作逻辑的规范。
    需要一一考虑每个元件是否有逻辑
    不要遗漏元件的视觉、交互、技术、业务逻辑
    逻辑相似尤其是相似的元件,建议把逻辑写到全局规范里面
    逻辑图流程图也是逻辑的表现方式
    至于具体写逻辑的方法,请移步我的其他文字
    产品逻辑的5种呈现方法和
    Notes-Axure最正统的产品逻辑表达法。
    预览效果
    如果我们做完了所有线框图,以及主要交互。我们生成原型或者预览原型的时候,可以看到如下效果。点击查看Axure生成的原型效果,基本上和微信APP很相似。
    当你学会了画页面的线框图,整个APP的原型也就显得容易些。就好比从细节着手,整个页面的线框图能够正确的画出来 ,那么一个APP的所有页面就比较简单。以上教程就已经全部介绍完了,希望对你有帮助。如果有更多感兴趣的内容,可以访问Axure中文网。
    本篇文章来源于:http://www.axurechina.cc/news/1452.html

    展开全文
  • Sketch和Axure画原型,哪个好用?

    万次阅读 2018-12-24 15:12:15
    Sketch和Axure画原型,哪个好用? 最近换了一家公司,就换了一款设计软件。之前公司,同事之间的稿件交流,都是统一用Axure原型图。现在新公司,同事之间的稿件交流,都是统一用Sketch原型图。我把自己这段时间...

    Sketch和Axure画原型,哪个好用?

     

    Image title

    最近换了一家公司,就换了一款设计软件。之前公司,同事之间的稿件交流,都是统一用Axure原型图。现在新公司,同事之间的稿件交流,都是统一用Sketch原型图。我把自己这段时间的Sketch使用感受,现在分享一下。

     

    Sketch和Axure相比,有哪些特点?

    Sketch大部分功能和操作思路,和Axure是一样的,比如:按住空格键,  显示抓手工具,这时候一边按住空格键,一边可以用鼠标拖动界面大图。

    下面我通过边用Sketch画几个示例图片,然后通过示例来讲解Sketch的特点。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例1:

    这是一个Sketch布尔运算功能画icon的示例。通过这里示例,可以发现Sketch包括有4种不同的布尔运算,你可以根据需要来具体选择:

    合并形状 (Union):

    减去顶层形状 (Subtract):

    与形状区域相交 (Intersect):

    排除重叠形状 (Difference):

    这些功能跟CDR和Ai以及PS软件的使用效果是一样的。

    之前喜欢用布尔运算画icon的同学们,你们遇到Sketch,就有福了。因为Sketch也可以通过布尔运算来画icon。 现在新版的Axure8.0,也开始有了布尔运算的功能。不过,还是Sketch的布尔运算位置更明显,用起来更顺手。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例2:

    这是一个用Sketch画的搜索框的示例:这个功能和Axure的一样的。不过,仔细看上面这张图,可以发现,Sketch可以绘制两头渐隐的直线,可以给文本框添加内阴影和外投影。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例3:

    这个示例展示了sketch快速切图的功能。sketch可以快速导出切图, 包括各种倍数的切图,一键导出,并且自动命名,比如:2倍图,导出之后,自动命名尾巴,@2x;3倍图,导出之后,自动命名尾巴,@3x;

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例4:

    这个示例是我用Sketch调整的2段示范文字。Sketch可以轻松调整字间距,行间距,段间距。配图的间距比例为:字间距(Charater) : 行间距(Line) : 段间距(Paragraph) = 1:26:16

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例5:

    这是一个快捷键的示例。Sketch的界面截图:它具备很多自带的快捷键,比如:输入R,就可以绘制矩形;输入L,就可以绘制直线;输入T,就可以开始输入文字。Axure则需要用鼠标选择矩形,然后拖动到面板,才可以开始更改矩形的尺寸。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例6:

    这是一个镜像功能的示例。Sketch画icon,可以支持镜像功能,使用方法和CDR,Ai是一模一样的。上图是先用布尔运算先绘制返回icon,然后通过镜像之后,就变成了更多按钮。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例7:

    这是一个导出pdf的示例。Sketch可以导出pdf格式的文件,从而解决Mac邮件发送附件到windows电脑,打开为乱码的问题。因为pdf文件的兼容性很好。具体操作是:点击“Insert”,在弹出的下拉菜单中,选择“Artboard”,或者直接按下快捷键A,直接在界面上画一个新画板,点击File,在下拉菜单中,选择导出pdf格式即可。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例8:

    这是一个展示Sketch自带规范控件的示例。Sketch可以自动提供iOS Ui Design的尺寸和按钮规范控件,比如:在线框图(wireframe)绘制过程中,经常需要绘制界面Tab的按钮大小和位置,在Sketch这里,只需要直接复制一套过来就好。除了iOS 的规范控件之外,Sketch还提供了Web Design的规范控件。具体操作:点击File,在弹出的下拉菜单中,选择New from Template,再选择iOS Ui Design。

    -----------------------------------------------

    Image title

     

    ▲上图是Sketch示例9:

    这是一个Mac电脑缩放屏幕的示例。轻轻滑动Mac电脑的触摸键盘,即可缩放Sketch的界面。双指向外滑动,Sketch界面开始放大。双指向内收拢,Sketch界面开始缩小。这个功能,在Axure上是不能单靠Mac的触摸屏来实现的。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例10:

    这是一个所页面pdf排序的示例。Sketch可以导出多页面的pdf,多个画板导出多个pdf。页面的顺序,可以在上图的红色区域中,调整Artboard的顺序,即可对应到pdf内页的页面顺序。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例11:

    这是一个Sketch选择群组里面的单个控件的示例。选中已经群组过的单个箭头。Sketch里面,对于已经群组过的部件,如何选中?只需要按住command键单击,就可以选中群里过的单个部件。

    -----------------------------------------------

    Image title

    ▲上图是Sketch示例12:

    这是Sketch快速更新版本的示例。Sketch的版本更新,只需要在联网的情况下,点击“Sketch”,弹出下拉菜单,再选择“Update”,即可一键完成软件的版本升级

    -----------------------------------------------

     

    ▲上图是Sketch示例13:

    这是在Sketch里面把彩色图片改成黑白的示例。使用场景:制作交互稿的时候,直接把彩色稿,改成黑白稿。操作步骤:选中图片,点击Color Adjust,调整Saturation即可实现。

    -----------------------------------------------

    与Sketch相比,Axure作为专业的线框图的原型工具,也有一些很有趣的功能。

    Image title

    ▲上图是Axure示例1:

    这是Axure的切图功能的示例。我们可以把电脑桌面上的图片,拖入Axure中,利用Axure的裁切图片功能,进行裁切,从而截取图片中的一部分。

    -----------------------------------------------

    Image title

    ▲上图是Axure示例2:

    这是一个Axure画流程图的示例。Axure的流程图控件很强大,在绘制原型图之前,可以先绘制流程图,再用流程图去沟通。等流程图定稿大致确认之后,再开始绘制页面的线框图。这时候,工作过程中,我们就可以避免因为业务流程没有理顺,导致的原型图频繁修改的沟通情况。

    -----------------------------------------------

     

    我给沟通优先级,做了一个排序:


    用流程图沟通 大于线框图沟通。流程走通了,才开始绘制线框图。这样可以避免因为流程上的修改,导致线框图反复修改。而线框图的时间评估,如果是2个小时。那么,每修改一次,就需要加班1个小时。

     

    这样就可以解释设计师离职的2种情况:

     

    改稿的次数越来越多,进而显得设计师的水平很差,从而导致设计师被辞退。

    加班次数越来越多,进而导致设计师很累,从而导致设计师跳槽。

     

    这两种离职情况,都可以通过这个沟通的优先级来改善。

     

    沟通思维 大于 沟通语言,跟不同部门的同事沟通,需要从对方的思维方式去思考。比如:跟开发沟通,更侧重后台的流程是否走得通。

    手绘流程图 大于 软件流程图,手绘流程图可以边沟通,边修改。而软件流程图,则需要敲打键盘和指点鼠标,两人凑近一台屏幕来修改,这样显得既麻烦又缓慢。

    -----------------------------------------------

    Image title

    ▲上图是Axure示例3:

    这是一个Axure绘制页面跳转关系的示例。Axure的优点是可以设计出全套页面,点击跳转的高仿真页面操作流程图。因为Axure的最小单位是page,很适合整理页面之间的整体架构,通过页面之间的跳转流程,来反映出线下业务的真实流程。

    其次:Axure用户群更广。Axure有windows和Mac两种版本。而Sketch目前只用Mac版本。这样一来,Sketch的用户群就丢失了windows用户。

    -----------------------------------------------

    Image title

    ▲上图是Axure示例4:

    这是描述Axure的主要特点的示例。我个人的更倾向于先分析产品的使用场景,用户需求,产品目标,以及商业模式,接着分析业务流程,然后绘制功能流程图,再分析页面的跳转流程图。接下来才开始绘制原型图,前期只需要用手绘打草稿的原型图,经过大致沟通确认之后,再开始绘制线框图。至于用什么工具绘制线框图,这并不重要。我看有些产品经理直接使用PPT画原型图,整个产品思维,业务流程,功能逻辑,也表现得挺不错的。

    -----------------------------------------------


    总结一下,如果想表现产品的业务流程,那么我建议使用Visio来绘制流程图。如果想表现产品的页面图文布局和页面的跳转关系,我建议使用axure。如果想表现产品的信息架构,我建议使用Mindmanager或Xmind。如果想表现产品的视觉层,包括圆角+投影+布尔运算画icon,我建议使用Photoshop或Sketch来作图

    展开全文
  • 关注公众号学习移动端组件的原型画法,咱们先看下Axure画出的原型效果,然后再对该组件进行详细讲解。一、组件介绍名称日历Calendar作用展示当月的日期组成多个日期按钮位置内容区样式详见上图交互点击日历里面的...
  • 列表页是PM画原型的时候最容易碰到的页面类型,那么如何快速画出并且展现交互呢?我们从具体的例子开始讲解其中的技巧,和各种不同的演变场景。希望初级PM可以通过这篇文章改进下自己...①先画页面框架②再画上导航...
  • Axure页面跳转

    千次阅读 2019-07-25 19:29:38
    1.在Axure里创建两个文件名,如: 2.点开Page 1,并在里面创建一个box,单点击box,往右边看,有一个OnClick。 双点击OnClick,出现以下画面,并点击Current Window 接下来就选择你要跳转的文件,这里因为只有两...
  • axure画原型图的问题

    2014-10-14 09:28:34
    我是新手,在一个页面上有几个按钮,,点击不通的按钮,在这个页面的某一个区域部分显示不通的内容,,这个怎么来? 需要用到动态面板吗?。。求大牛指教。
  • Axure绘制页面框架 图文详解教程

    千次阅读 热门讨论 2014-11-23 22:16:53
    Axure用来原型图,在这几天的学习实践中学到不少东西。今天给大家小小展示一下。 在不同的页面之间,常常有很多相同的东西,像头部 底部 菜单 导航等都是一致的。只有页面的一部分是活动的,可以显示不同的内容。...
  • 使用Visio、Axure画原型图

    千次阅读 2010-08-20 11:36:41
    下面是一篇使用Axure画原型图的文章  http://www.qiyeku.com/news/636357/ 一些设置…… visio作为一个通用的专业绘图工具,默认设置不是非常适合设计网页/应用程序原型,经过一些设置之后才会...
  • 1.把对应的元件都拖进来。(概要这里的话我都命名好啦~) 2.给“加” 元件新增一个单击事件(后续步骤如图) 3.操作完成确认后的样子 4.元件“减”和元件“加”一样,不过就多一个判断条件(当值小于=0的时候就不...
  • 整站原型设计中,不可能把所有功能都在一个页面展示出来,一定要那样做,可能要在一个页面画几十个动态面板,上百个状态了,先不说好不好维护和修改,这样叠罗汉足以让Axure跑死... 所以我们经常按功能分类,分别...
  • 其实Axure从6.0开始就加入了手绘风格。在线框图(Page Formatting)里有个页面样式编辑器(Sketchiness)的选项,可以设置手绘风格的“扭曲度”。默认是0,数字越大画出的线越扭曲,个人建议50为宜,然后选个卡通点...
  • axure怎么制作聊天页面

    千次阅读 2020-02-01 23:24:23
    产品经理是站在上帝身边axure怎么制作聊天页面的人。(上帝了解人性,懂得如何运用群体的特性去驾驭人类,产品终究是联系人与思想的媒介,虚无缥缈的道贯穿在产品经理和用户之间,隔着一层薄薄的纱,隐约可见,霎那...
  • Axure之实现页面的左右切换简单实例

    万次阅读 2017-03-23 23:13:08
    先在床上躺会.】提出问题Axure之如何实现页面的左右切换???解决问题1.新建一个项目2.在 【index】页面中,拖入一个【动态面板】,设置面板的宽度和高度,双击【动态面板】,添加3个 state页面。如下图3. 往第一个...
  • Axure--页面相互跳转

    千次阅读 2019-04-09 17:28:30
    打开Axure软件,首先在页面1中创建一个按钮; 选中按钮后,选择右侧的交互样式,当鼠标单击时; 选择打开链接; 、 在浏览器中预览一下; 可以发现从页面1跳转到页面2; ...
  • 最后就到了抠图,在抠图的过程中,有简单的图形,我们可以使用钢笔工具,钢笔工具可以出直线和伸缩成各种曲线,然后他有个边,任何曲线都是以那个位切线。为了不影响下一个线段,我们可以使用alt将,钢笔工具末端...
  • Axure制作版本:8.1(兼容Axure9.0) web端业务数据管理平台+Axure运营数据管理平台+用户画像分析+页面分析+用户活跃度浏览路径分析+用户信息管理+Axure通用web端高保真交互业务数据管理平台
  • axurerp怎么做登录页面

    2021-03-23 17:44:19
    axurerp怎么做登录页面?Axure是一款十分好用的原型设计软件。软件支持的功能十分的全面,对于还不是很了如何使用axure制作登录窗口的小伙伴们,下文中将会为大家带来详细的制作教程。 axurerp登录界面制作教程 打开...
  • 由于公司产品离职,只能自己做了,...3.由于我这个是在当前页面弹出二级页面,所以点击Current Window,并点击要跳转的页面,然后点击ok 4、点击ok后,回到工作区发现原来的按钮上有一个数字,表示添加上了点击事件,
  • Axure做原型的一种工具,中文版,可以实现画图、页面跳转、链接、排序、增删改查等一系列功能。同时还能导出html文件,很方便使用。
  • 青铜修炼手册:Axure页面右键菜单制作

    千次阅读 热门讨论 2018-09-01 18:02:59
    右键菜单这个功能我觉得大家都应该不陌生吧,这个功能应该成为我们浏览网页的必备技能了,但是我们有时候发现点击不同的东西出来的右键菜单都是不一样的,就如下图一样,在矩形内点击右键和在页面内点击右键出来的...
  • Axure

    2021-01-16 17:18:19
    Axure基本内容一、制作登陆页面二、主页面三、制作表格/应用中继器总结 基本内容 原型 项目:   可行性分析(项目经理)   需求分析(开发人员,项目经理,甲方)   罗列功能(原型设计出一套页面——开发人员)  ...
  • (2月24日更新)B站视频版教程:https://www.bilibili.com/video/av80136342/手机端交互中,页面的上下左右滑动是常用的交互形态,今天给大家分享一下如何使用Axure来进行模拟,这里使用动态面板来实现,如果对动态...
  • Axure RP:页面原型制作工具

    万次阅读 2013-02-08 17:06:07
    Axure RP 能帮助网站需求设计者,快捷而简便的创建基于网站构架图的带注释页面示意图、操作流程图、以及交互设计,并可自动生成用于演示的网页文件和规格文件,以提供演示与开发。 特点 1.Axure RP快速创建带注释的...
  • 注意的事项: 完整的页面流程图 转载于:https://www.cnblogs.com/newt/p/9218744.html
  • 使用Axure RP绘制原型图,你可以在完之后先进行预览,查看不足之处,但有时候会出现无法预览的情况,这是为什么呢?怎么解决?如果Axure无法正常预览页面,可以参考以下几种解决方法。ynJ网站目录-网站分类-目录...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,442
精华内容 1,376
关键字:

axure画页面