有趣好玩的“纸上原型”APP交互设计

  • A+
所属分类:大话设计

本文来源: 庞门正道, 共 577 字

设计一款APP的时候,经常会听到,要先设计一个原型。在最初设计布局结构阶段,制作一个只有黑白线框的低保真原型。页面中应有哪些东西,大致占用多少地方,出现图片、视频之类的,用占位符来把地方填充。

有趣好玩的“纸上原型”APP交互设计

确认好页面布局,就需要整理布局与布局之间最基本的交互方式。点了这个按钮,手指滑动会出现、跳转什么东西,会弹出什么提示,窗口。

有趣好玩的“纸上原型”APP交互设计

而高保真的原型,就是上面低保真的高配版。不仅完善了页面的配色,原有的占位符都换成了正式的素材资源,页面中每个元素都有对应的规范尺寸,而且基本交互都可以完整的运行,已经非常接近成品的模样,让人一看就知道这个APP应该是做什么的。

有趣好玩的“纸上原型”APP交互设计

通常,这些都是由产品经理来完成的工作。那其他人想了解制作原型,该怎么办?位于哥伦比亚的伊瑟丝大学(Icesi University),为了给交互媒体设计的学生讲解UI设计的交互知识,找到了一种非常有意思的方式——制作“纸上原型”APP,交互什么的,所有的工作都在纸上完成!

有趣好玩的“纸上原型”APP交互设计

把交互的弹窗与页面背景都独立出来,在旁边移动纸张,或者折叠,进行交互!

有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计

开屏图,是不是有一种小时候收到圣诞贺卡的感觉

有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计

有一种偷看密码的感觉

有趣好玩的“纸上原型”APP交互设计

左滑右滑,非常顺畅

有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计

各种操作都是没问题

有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计

咻—— 划过去

有趣好玩的“纸上原型”APP交互设计

评分条

有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计

这个按钮,看起来很有触感啊!

有趣好玩的“纸上原型”APP交互设计有趣好玩的“纸上原型”APP交互设计

滑动删除

有趣好玩的“纸上原型”APP交互设计

太好玩了!

有趣好玩的“纸上原型”APP交互设计

真是非常佩服这个创意!全部页面的交互逻辑都搞清楚,视觉风格也确定好之后,就可以开始在电脑前制作电子版原型了。



发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: