页面状态还是组件?到底什么才是交互的中心?

随着信息行业的日益发展,软件的开发设计得到了更多人的重视,软件的原型设计也同样的变得原来越重要。我们目前使用的原型设计工具中,设计的模式普遍为两种,一种是以页面状态为中心来设置交互,比如Flinto for Mac和Principle。另一种模式则是以组件为中心,这种工具也很多,比如大家常用的Axure和Mockplus。那么这两种方式哪一种才是最好的呢?我们这里来做一下具体的分析。

一、以页面状态为中心

Flinto for Mac和Principle这类原型设计工具有一个共同点,那就是它们本身几乎不具有任何产生组件的能力,基本都是通过使用导入其它图形工具导出文件而获取组件和页面的。Flinto敏感的抓住了一个现象,那就是Sketch的崛起。它果断用一种可以说是与Sketch捆绑的方式开发了Flinto for Mac的版本。通过以页面状态为中心来设置交互,在状态罗列在页面后,简单的链接就会自动产生动画效果,而且动效还很逼真。这对于开发后期的UI演示来说,帮助是极大的。Principle的工作原理和Flinto for Mac基本相同。

这种以页面状态为中心设置的方式确实受到了很多人的追捧,但是问题也是确实存在的。当一个页面中有大量的组件需要实现交互的时候,这个依靠不同的页面状态来实现交互设置的方式就面临了一个巨大的挑战,那就是如何来显示大量的状态。Flinto和Principle的方法想必也是出于无奈,它们只能把各个层级按照某种顺序排列在地面上。

flinto

二、以组件为中心

Axure、Justinmind以及Mockplus这类原型设原型设计工具本身是具有产生组件的能力,很自然地,组件就成了这类工具软件设置交互的中心。多数的交互都是通过改变组件的属性来实现的,使得整个设计过程变得灵活起来。而也正是这种灵活的设计方式在软件开发的前期需求表述上可以真正的做到快捷、有效。

相信很多用户在升级了Axure新版本之后并没有收获原有的期待,不过Axure仍然是用户最多的原型设计工具。它的设计操作模式也为很多同类的工具提供了借鉴,甚至可以说,有很多原型设计工具是在模仿Axure。Mockplus在设置上通过高度可视化减少了设置步骤,在面对大量的交互设置时,仍然能够实现敏捷迅速。

然而,当交互的设置对象为组件而不是页面状态的时候,那么这个项目显示出来的整体篇幅就小了很多。Axure对于交互功能的支持更加丰富。Mockplus也不甘示弱,尤其是它对可视化程度的把握。它采用的拖拽方式是设计过程变得可视化,而设置结束之后链接线就会隐藏,所以即使页面内部的交互设置多达几十个,也并不会影响整体的视觉效果。

mockplus

不管是以页面状态为中心,还是以组件为中心,最好的原型设计方式只存在与相对的人群之中。开发前期的需求表述方面,Axure和Mockplus很明显是占有优势的。而Flinto for Mac和Principle则在后期的演示中能够呈现出更好的效果。结合需求才能选择正确的工具。

原创文章,作者:yanz kontol,如若转载,请注明出处:https://www.iamue.com/18858/

(0)
yanz kontolyanz kontol
上一篇 2023-03-03
下一篇 2023-03-03

相关推荐

  • 艺术留学新宠—交互设计选"综合类"院校和"艺术类"院校有何差别?

    在当下这个数字智能急速发展的时代,交互设计成为了热门探索领域,同时它也是当下最受欢迎的留学专业之一。相较国外,国内开设交互设计专业的院校较少,即便有,也是和工业设计专业剪不断理还乱。而真正的交互设计包含的范畴更广,这一点从国外不同院校的交互类专业方向上可以看出,其教育框架完全在APP这一分支之上,而表现形式也不局限于媒体、数字、艺术、装置等。对于想要申请国外顶级交互专业院校的同学来说,确定好自己想要探究的专业领域是选校时的重要参考标准。...

    2018-05-07
  • 用户体验五要素

    01战略层什么是用户体验:用户在使用产品过程中建立起来的一种纯主观感受。用户体验的重要性:给用户一个积极、高效的体验,他们会持续使用你的产品,产品满足用户某方面的需求并来盈利,帮助人们提高生活质量,提高工作效率,改善人际关系,等等。五要素:战略层、范围层、结构层、框架层、表现层用户体验要素的作用:要素之间相互作用完成任务,创建一个总体的用户体验设计。适用场景:设计:战略层→范围层→结构层→框架层→表现层用户体验:表现层→框架层→结构层→...

    2018-02-06
  • 动态与富态

    一、动态:动画表达的设计应用 ”动态“的设计常常能使页面的呈现更加动感,有活力,富有吸引力。具体来说,”动态”的设计在产品应用中常用于以下几种情形: 1.1. 丰富内涵 先试试为这段产品介绍做设计: Dropbox可让…

    2015-10-08
  • 百度高级UI设计师:规范、方法、一致性,真有那么重要?

    本文来自百度用户体验部高级UI设计师大牙的佳作,此文是她对自身工作的一种思考:一个遵从设计规范,按照所谓的系统设计方法,步步推导而来的解决方案,是否真的就是一个好的设计?你的答案是怎样?不妨一起来看看大牙的吧~

    2017-05-02
  • 《用户体验可视化指南》视频讲书(3)

    《用户体验可视化指南》书中第一章的第二部分。客户旅程是一条线路,用户地图是多条线路的集中展示,专注于服务蓝图的交互可视线之上的部分。心智模型本质是聚类,空间地图用于更复杂的系统去表达信息流和内容之间的关系。点击视频观看(大约10分钟)兰静同学听后分享这节视频有3个内容,其中有个非常重要的内容,解决了我也疑虑已久的问题:客户旅程图和体验地图,到底有什么区别?视频中详细的说明了二者的区别:一条线和多条线。客户旅程图强调了用户是怎么一步一步做...

    2018-04-01
  • Designing in color

    色彩是设计师手中强大的力量,它吸引你的眼球,调动你的情绪,让沟通更为有效。为了让你能够认识到色彩是多么重要,在一篇广泛被引用研究的报告-“The Impact of Color on Marketing”,研究者们发现对一些产品来说,90%的人仅仅基于它的颜色对一款产品下决定。

    2016-07-11
  • 一道交互设计笔试题的思考

    又到了一年两度的招聘季时节,这个时间肯定有一大堆人都在海投面试。恰好最近又做了一份笔试题,顺便就来聊一聊交互设计笔试题要怎么做吧。 我碰到过的交互设计笔试题有两种,一种就是两三个小时内给你三四道题,然…

    2016-04-13
  • 交互设计专业排名最高的大学有哪些

    上周四,康石石在《珠宝设计专业排名最高的大学有哪些》中,为同学们于世界范围(英、比利时、美、意大利、荷兰、挪威、瑞典、德国、爱沙尼亚)内梳理了22所顶级珠宝名校,并在文末许诺阅读量达1000,即为最热情的上墙读者解答艺术留学问题。本周四,康石石兑现承诺,继续为大家推荐货真价实的全球顶级院校,供所有希望出国深造交互设计专业的同学们,提供一份足以信赖的院校清单。写在前面的话交互设计,对于90%同学而言,其实都是一个未知的概念,这直接导致了各...

    2018-02-02
  • 12个关于用户体验的界面设计细节

    点击上方"工信商务培训学校"↑文章列举了一些界面设计中的案例细节,希望对产品设计工作有所帮助。UI设计工作中,设计师们往往不喜欢将界面设计得与原型图一致,总会刻意的去寻求存在感与原型做出差别,那么对于UI设计师来说,更应该懂得用户体验,成为办个用户体验设计师。以下列举了一些界面设计中的案例细节,希望对设计师们有所帮助。一.图标1.统一图标的样式图标在界面设计中还是占着较大的比重,它的存在有利于平衡界面,也让页面看起来更加的美观,也有一定...

    2018-04-06
  • 当产品进入碎片迭代,设计师可以做些什么?

    也许是刚毕业的你最该看的一篇干货。如果你已经习惯了等别人给需求,然后开Photoshop,再等别人说改哪里就改哪里,肯定谈不上工作成就感。想掌握设计的主动权,证明自己不仅是个画图的,建议把这篇文章提到的3个方法好好实践一番,绝对会有大收获(严肃脸)。

    2017-06-01