建站运营知识

免费体验
当前位置: 首页 > 知识库 > 建站运营知识 >

20个令你脑洞大开的 3D TOUCH 概念设计案例

分享到:
时间:2016-06-19 12:52来源:谷歌推广seo网络知识 作者:谷歌优化怎么做

   iPhone 6s 和6s Plus 的压敏屏幕所带来的3D Touch 让iPhone 的交互多了一个全新的维度,交互从不再局限于2D平面手势,按压操作的加入使得手机交互进入了3D的维度。交互层次的提升让操作拥有了更大的潜力和截然不同的操作模式。

  除了轻点、轻扫、双指开合这些熟悉的 Multi‑Touch 手势之外,3D Touch 还带来 Peek 和 Pop,为iPhone 的使用体验开拓出全新的维度。

  手机的屏幕对于不同力度的按压进行识别,并且作出不同的交互反馈。快速轻拍是大家习惯性的标准操作,而加大力度的按压则不同,两种不同的操作作用于图标和其他基本控件上的时候,会触发不同的反馈和结果。一般说来,新增按压力度这个维度之后,用户可以通过力度改变来获取更详细的信息和更丰富的菜单选项,提升了交互的层次,带来更丰富的体验,让产品更加得心应手。

  那么对于UI和UX设计师而言,3D Touch能带来怎样的交互体验上的改变呢?今天的20个原型设计案例应该可以给你带来灵感。

  

20个令你脑洞大开的 3D TOUCH 概念设计案例 三联

  第一个案例来自中国杭州的设计师 Leo Leung。在他的概念设计中,3D Touch 并没有止步于预览(Peek)而开始加入更多更强的交互功能,可以快速高效地多选多个不同的图片,并且无需更多复杂的交互。

  

2-Adding-a-new-goal-animation

  这个交互的设计思路看起来有点过于简单,但稍加推敲,你会发现它非常实用。Force Touch 在此主要为用户提供触发“New Goal”的快速入口,整个交互的动画设计是顺滑而令人愉悦的,干净利落。

  

3-3D-Touch-for-Cycling-Concept

  3D Touch在这个案例中,帮用户快速打开个人积分榜。不需要多次点击和滑动来一层层地进入特定界面,3D touch 一发入魂,再加一个滑动操作,还可以触发“收藏”按钮。

  

4-3D-Touch-Notifications

  Tom Graham 的这个原创交互设计 对于3D Touch而言相当有价值,它并不复杂,但是在当前的iOS 通知推送系统基础上做出了合理的强化和优化。Force Touch 打开通知预览,滑动收藏,滑动关闭,这些让通知系统的可用性更强了。

  

5-3d-Touch-Music-Store

  John Khester 的3D Touch交互设计 几乎是为在线音乐商店定制的,使用Force Touch 触发专辑内容列表,使用滑动操作来触发专辑列表,和单纯的轻拍点击形成两条不同的交互路线。

  

6-3DTouch-to-home-by-Javi-Perez

  虽然这个交互设计 只是简单的示意图,没有华丽的展示效果,但是它的用法和其他的设计有很大的不同,它作用于返回按钮,并且提供了快速返回首页的功能。

  

7-3D-Touch-for-OS-X

  Mac的触控板上也有了Force Touch功能,而新加坡设计是 Zhikuan 的这个设计似乎就是以此为基础而设计的。Force Touch 提供了预览功能,以及拓展而出的快捷操作按钮。

  

8-Shopping-Peek-3D-Touch

  这位设计师的是为电商平台设计的,在列表页中无需点击进入具体产品条目,长按触发3D Touch 来查看产品的基本信息。

  

9-Profile-Peek-and-Pop

  Peek 和 Pop 是3D Touch的两个基本功能,而设计师 Armand Chakhalyan 针对带有图片的个人档的交互设计则融入了这两大功能。通过模糊背景和色调变化平稳过渡,实现了快速预览和弹出框两个交互。

  

10-3D-Touch-Animated-Mockup

  Boris Borisov 的这个设计其实还是沿着官方设定的路线来走的,用力按压图标,英文seo,触发弹出菜单,菜单中包含了一系列常用的选项,每个选项都被设计成图标+文本的样式。Boris 的这个案例还附上了AE文档,你可以下载学习一下哦~

  

11-Day-024-Boarding-Pass

  设计师在这里使用3D Touch 让用户可以触发预览航班的最关键信息,每个条目都可以这样触发,并且链接到某个小型的信息展板。

(整理:英文推广TuiGuang123.com)

分享到:
------分隔线----------------------------
购买咨询 | 联系我们 | 产品报价 | 付款方式
网站地图 Copyright·深圳市亿推信息技术有限公司 版权所有 粤ICP备13042246号