如何应用AxureRP做原型设计
什么是原型呢?这个在之前介绍为什么需要进行原型设计当中有提到,原型是产品的最初形态,确认用户对产品界面和操作功能可用性的需求,高保真的原型接近于产品的最终形态,但仍只是原型。产品原型简单的说就是产品设计成形之前的一个大体框架,对网站来讲,就是将页面模块、元素进行粗放式的排版和布局,深入一些,还会加入一些交互性的元素,使其更加具体、形象和生动。
一般在进行主要页面原型设计之前,设计师需要了解设计需求,如果身兼了需求分析或产品分析等角色,设计过程就会稍微简单一些,因为已经了解了从用户需求到转化成可实现需求的整个过程,否则的话至少需要产品负责人员提供一份功能清单才能开始设计,最好就是能参与到用户需求的调研里面,这样在设计的过程当中就不容易出现设计人员和需求人员对需求理解上的偏差,减少一些沟通的成本。
用AxureRP来做原型设计的优点应该看的很多了,快速,可交互等等,这里主要结合AxureRP自身的一些功能说明其在原型设计过程当中的应用。借用别人的一张图,主要从交互设计中涉及的三个主要步骤进行说明:就是先设计一个初始的主要页面原型,定义页面流程图,最后再完善原型的过程。
一、 主要页面原型
个人建议在开始设计之前,先手绘一份草图,用来确认上面提到的与需求人员之间的理解差异,这份草图应有一个大致的轮廓,列出主要的功能,有一个很粗的页面布局等等,另外前期的时候不要加入太多的视觉设计,因为这个只是初始化方案,后面应该还会有比较大的改动,且不应该让视觉效果抢了原本要说明演示的交互效果的风头;再者我认为毕竟设计师和专业的美工还是有差异,视觉设计再好看,到后期美工制作的时候可能根本不按这个风格来设计,就浪费时间,还不如省下时间用在以一些交互设计和设计方案的推敲上,达到一个最优方案的状态。
开始设计之后就要注意重复页面的重用了,这个AxureRP的模板管理(Master)功能能够满足,就是将某一部分页面,预计后面其他页面会用到的,就先做好模板,这个越早做越好,可以省掉很大一部分设计时间,例如页首,页尾,标记,ICON等。之前也有介绍过使用模板管理的好处,就不再重复介绍。如果只是简单的两三个小页面的功能,可以不用这个功能,但如果页面上的交互比较复杂,且页面数量,元素数量较多的情况下,个人建议还是使用模板管理功能,基本上如果是设计网站或者一个完整的产品的话,肯定都是比较复杂的,如果能在前期就引入模板,后面的设计速度会大大加快,且页面的结构也会更优化,能够提高页面加载速度。
二、 页面流程图
在确定主要页面之后,就可以定义页面流程了。页面流程图有利于向大家展示自己的想法,也有利于思路的整理。可参加之前介绍AxureRP案例时提供的一共以流程图方式来说明登录注册功能的例子。通过页面流程图,可以整理页面的交互行为,在向他人展示的时候,也可以一目了然的看出需要的操作步骤是多少步。
页面与页面间的流程图可以用AxureRP的站点地图面板里面的自动生成流程的图的功能,要使用这个功能,就需要在设计之初就建立好页面的层级结构,比如一般都有首页,然后在首页下面按主要功能模快可能会分成几个页面,再在这些页面下建立各自的功能子页面,这样就是三层结构,自动生成出来的页面流程图结构也会很清晰,但前提就是要设计好结构,例如按页面分层次,按功能分层次等。
页面的流程图就复杂一些,涉及到一些操作的业务规范和要求,这个就要求设计人员要熟悉用户需求的,并且还要熟悉一些常见的操作流程,一般都是递进式的设计,就是第一步是怎样的,第二步是怎样的,每个步骤之间按顺序从上到下或者从左往右,可以设计成一个页面,也可以设计成一个页面内的多个标签,在设计前要先有构思和大体布局的想法,这样在设计时就不会出错,可以在页面内或者定义一个流程图页面把流程图单独画出来,可以在设计的过程当中做参照。
三、 完善原型
页面的主要页面和页面流程确定之后,就可以完善原型了。这时主要是一些细节的工作,包括前期设计页面的完善,以及一些交互功能的定义等等,也可以适当的加入一些视觉的东西,但还是不宜加入太多。
至于如何去完善原型,可以参照之前的一些介绍AxureRP的文章,参照里面做示例应用时的方式,完善页面上的提示,注释,交互操作等,可能用到得AxureRP的功能也会很多,也会用到一些高级技巧,这里不做过多介绍,可参考实例。需要注意的就是AxureRP的主旨是快速的原型设计,因此在设计过程当中不必太过追求技术效果,一些复杂的交互效果,如果有现成的实例可以用的就借用一下,如果没用,建议就画一个简单的,然后做一下详细的说明,毕竟做复杂的设计会耗掉相当多的时间。
AxureRP只是一种原型设计工具而已,做交互设计最重要的还是想法,工具只是用来帮实现想法的。不必过于追求技术,不必过于追求视觉表现。把握好整个产品方向的同时,应专注于交互流程、页面内交互、布局结构的创新和优化。
如何应用AxureRP做原型设计的更多相关文章
- week 10--了解原型设计的工具
了解原型设计的工具 随着原型应用的普及,越来越多的产品会采用原型设计来表述.完善整体需求,这样做自然有其原因.首先原型的制作成本和演示成本都比较低,除非比较复杂或者保真度要求比较高的原型,在描述一个功 ...
- 原型设计工具—Axure
作为软件设计的一员,需要在软件开发初期确保软件的具体内容,防止后期大幅度的修改. 在这样的情况下,原型设计软件就起到了关键的作用. 摘要: 原型设计为什么这么重要呢? 因为它帮助我们搭建了低保真或高保 ...
- axure rp ----专业的快速原型设计工具
Axure RPAxure的发音是』Ack-sure』,RP则是』Rapid Prototyping』快速原型的缩写.Axure RP Pro是美国Axure Software Solution公司的 ...
- 从Adobe调查问卷看原型设计工具大战
近年国内外原型设计工具新品频出,除了拥趸众多的老牌Axure在RP 8之后没有什么大的动作,大家都拼了命地在出新品.今天 inVision 的 Craft 出了 2.0 的预告视频,明天 Adobe ...
- 快速原型设计工具-Axure RP的介绍及简单使用(生产初期向客户展示设计产品的原型-也就是展示产品)
啧啧~~ 给大家介绍一款超棒的原型设计工具--美国Axure Software Solution公司旗舰产品Axure RP 这款工具通俗的说呢,就是在项目整体需求考察后对整体设计一个简要性概括!设计 ...
- Axure RP for Mac(网站交互式原型设计工具)破解版安装
1.软件简介 Axure RP 是 macOS 系统上一款最知名和最强大的原型设计工具,增加了大量新的特性,如应用多个动画,并同一时间运行一个小部件,如褪色,同时移动等,而且具有全新的图标和界面 ...
- 9款原型设计工具与Sketch的强强组合,轻松构建交互原型!
原型设计的发展历史经历了纸上原型.静态线框设计.到现在的可交互式原型.作为设计过程中最初始的阶段,设计师们对原型设计的要求也越来越高.因此,如今的原型设计工具格局也发生了很大的变化. Sketch对于 ...
- 15款优秀移动APP产品原型设计工具
一新来小盆友问:“移动产品原型设计都用啥工具?” 答:“@#¥……&%*” 又问:“能详细说下各个工具吗?我比较一下” “……” 好吧,谁让我那么的爱分享而你又是小美女呢 ———————正文开 ...
- AXURE在原型设计中的应用
转: http://uedc.163.com/2248.html 前言 什么是原型呢? 产品原型简单的说就是产品设计成形之前的一个简单框架,对网站来讲,就是将页面模块.元素进行粗放式的排版和布局,深入 ...
随机推荐
- Mybatis使用Mapper方式CURD
Mybatis 使用Dao代码方式进行增.删.改.查和分页查询. 1.Maven的pom.xml 2.配置文件 2.1.db.properties 2.2.mybatis.xml <?xml v ...
- JavaScript 数组函数 map()
JavaScript 数组函数 map() 学习心得 map()函数是一个数组函数: 它对数组每个原素进行操作,不对空数组进行操作: 不改变原本的数组,返回新数组: arr.map(function( ...
- JQuery ajax提交表单及表单验证
JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目 注:经过验证,formValidator只适合一个 ...
- 记一次付工解决Sqlserver问题的过程
问题:Sqlserver连接不上 1 检查自身 Sqlserve服务是否开启 Windows服务是否开启 2 用CMD尝试连接Sqlserver 显示详细错误 由于文件不可访问,或者内存或磁盘空间不 ...
- thinkphp 应用编译
应用编译机制作为ThinkPHP独创的功能特色,从1.0版本就延续至今,3.2版本的编译机制更加具有特色. 应用编译缓存 编译缓存的基础原理是第一次运行的时候把核心需要加载的文件去掉空白和注释后合并到 ...
- Java笔记 - Socket编程
两个Java应用程序可以通过一个双向的网络通讯连接实现数据交换,这个双向链路的一端称为一个Socket.java.net包中定义的两个类Socket和ServerSocket,分别用来实现双向链路的c ...
- NPM 使用介绍(包管理工具,解决NodeJS代码部署上的很多问题)
引用地址:http://www.runoob.com/nodejs/nodejs-npm.html NPM 使用介绍 NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问 ...
- tomcat JAVA_OPTS设置
原文地址:https://blog.csdn.net/bamboo_cqh/article/details/72820700 AVA_OPTS ,顾名思义,是用来设置JVM相关运行参数的变量. JVM ...
- 记录一次hexo托管到coding失败,页面总是404,可是相同的代码托管到github是没问题的。
文章目录 问题描述: 问题原因: 问题解决 2019.1.23 问题,coding又挂了. 弃疗 个人博客:https://mmmmmm.me 源码:https://github.com/dataiy ...
- 13_springmvc拦截器应用
一.实现登录认证 1.需求: 用户请求url,拦截器进行拦截校验 如果请求的url是公开地址(无需登陆即可访问的url),让放行 如果用户session 不存在跳转到登陆页面 如果用户session存 ...