关于在iOS当中实践Material Design的访谈

设计师Jason Zigrino(不认识)谈他在iOS平台上尝试Material Design设计语言的经验

你产出了很多不错的Material Design,尤其是iOS版本的Google Keep探索。你平时都使用哪些工具?设计这些app界面通常需要多少时间?

大家一样,我在多数项目里都会用到Photoshop和Illustrator,不过最近特别钟情于Sketch。我从来无法满足于静态的mockup,所以涉及到动效设计时,我通常会使用After Effects。

在设计iOS版本的Google Keep时也不例外,这些工具基本都有用到,特别是最后需要将所有的界面和转场方案都整合到After Effects当中。花费的时间大约在一周的样子。

对我而言,动效设计可以传达出很多静态界面及传统转场流程难以表现出的特质,其中也包括一些情感化的元素。但同时我也必须强调一点,无论是单一元素还是界面转场,其中的动效都必须服务于某种目的,而不只是出于美观炫酷,更不能干扰或拖延人机互动流程。

当我与界面上的元素进行互动时,我下意识的希望了解这些元素从何而来,又会去到哪里。界面上的多数交互元素不能只是凭空的出现或消失 - 交互行为与触发的结果之间没有视觉上的关联,用户很快会迷失方向。

交互元素自身的行为特质对于我们理解和记忆界面的交互方式非常重要。譬如我给你一个界面,上面有一个返回按钮。当你点击这个按钮的时候,自然会期望有事情发生。然而,如果当前界面只是凭空消失,同时新的界面突然呈现在眼前,你便无法感知到前后状态变化之间的关联,进而需要回忆之前的界面状态,回忆自己的操作行为,并根据回忆来推测当前界面与之前的内容及操作之间的关系。虽然在实际当中这一过程非常短暂,但足以给用户造成很大的认知负荷。所以,更合理的做法是使当前界面平滑的过渡到下一个界面,或是使特定的交互元素通过某种运动方式过渡到下一个状态,通过这种有迹可循的过渡方式辅助用户转移注意力,让他们更直观的理解交互行为与状态变化之间的关联。

在iOS版本的Google Keep当中,我通过动效全程辅助着用户的每一个交互行为。例如,当用户选择创建一条新备忘,文本输入框会自动展开,然后更多相关的信息和选项会通过动效呈现在输入框底部。在这个环节当中,随着状态的切换,信息和功能由主到次通过动效依次展示在界面当中,用户的注意力得以平滑的过渡到新的状态当中,无需刻意回忆和判断前后状态的区别。

02-material-design-ios-app

03-material-design-ios-app

你为什么决定在iOS平台上尝试通过Material Design打造Google Keep?

无论对于Android,还是iOS、Mac甚至是PC,我都很有热情,所以慢慢开始习惯于在各个平台的设计生态之间取长补短。我对Google Keep非常有爱,不过可惜的是,Google并没有在iOS App Store上架官方的版本,所以我决定自己上手,在iOS上尝试使用Material Design设计语言来打造一系列非官方版本的Keep界面。

如今,我越来越聚焦于对UI动效在人机互动当中的沟通作用进行探索和实践。平时,我会试着在其他一些知名的iOS app当中通过Material Design的设计语言来提升交互和视觉体验,另外也在设计一款自己的旅行社交app。这些对我来说都是绝佳的实践机会。

 

使用Material Design设计的iOS app当中,你最喜欢哪一个?

这个问题蛮难回答的。Google官方最近在iOS上发布了很多优秀的app,譬如Google Search和Inbox,在我看来便是Google官方在iOS上尝试Material Design语言的绝佳案例。

04-material-design-ios-app

在所有这些app当中,我个人觉得Google Play Music算是集大成于一身,包括通过动效引导用户与界面进行互动、通过简洁的界面框架使内容本身得到最大化的呈现等一系列基本设计原则都得到了淋漓尽致的体现。

你是否认为Material Design将来会对iOS app的设计方式带来越来越深的影响?

绝对的。实际上,抛开特定的风格概念,将设计语言的本质抽象出来,你会发现Material Design的基础理念可以被运用到所有的平台与设备当中。当然这并不意味着所有平台上的app都会有着相同的外在表现形式。

你是否建议其他设计师在iOS app当中尝试Material Design的设计元素?

Material Design设计语言当中的诸多视觉要素与交互模式都可以很好的被运用在iOS平台上。但是无论怎样,与操作系统自身的特性保持和谐统一都是非常重要的。你不能为了融合风格而去融合风格。在没有绝对必要的情况下,强迫用户去学习和掌握全新的操作习惯,这种做法无论在可用性层面还是情感层面都会造成极大的负面效应。设计语言的基本原理是可以被灵活运用的,根本目标是最大化的提升体验,不要制造出颠覆性的结果。

对于在iOS app当中尝试Material Design这件事,我个人更加聚焦于它背后的设计原理,而非具体的界面及元素的视觉样式;前者是根本,而后者很可能会随着潮流而更迭。对我来说,站在交互层面,元素与界面的转场过渡方式对人机互动体验的影响作用才是最值得关注的。在如今的触屏设备上,人机互动方式越来越复杂,但真实的控制感却越来越低;怎样融汇诸多设计语言当中的精华,更自然、更有效的提升人机互动体验,这是最关键的。

Material Design会不会只是一种设计潮流?

对于任何一种设计风格,当我们审视它们背后的基本原理时,或多或少总会发现一些经得起时间考验的要素。Material Design是一种纯粹的数字化设计语言,随着时间而发展演变,这是它与生俱来的能力。我们今天所看到和谈论到的Material Design,在两年之后很可能已经发展成另外一种形态。不妨将这类设计语言看做某种有机体,它能持续的调整和进化,以适应外在环境。

by  C7210   来自Be For Web
英文原文: https://medium.com/materialup-exploring-material-design/should-you-use...

 

原创文章,作者:Smiler李想,如若转载,请注明出处:https://www.iamue.com/9113/

(0)
Smiler李想Smiler李想
上一篇 2015-08-31
下一篇 2015-09-01

相关推荐

  • Sketch从入门到精通-Sketch3 神奇的测量键

    在做设计的时候经常离不开精准的测量,间距,字体的大小。尤其是在做移动端UI设计的时候,设计完的界面效果图还要输出标注规范给工程师们让他们去实现,这就离不开精准的测量。 在Sketch里面,有个神奇的测量键,你…

    2015-08-28
  • 使用 Sketch 搭建动态布局

    如果你在设计交互,你可能会经常遇到一些重复性的元素,比如列表中的行,或者网格化元素。尽管Sketch提供了一些方法,通过使用Symbols将一些样式应用到元素中,但如果你想让布局更有适应性或者动态变化,它恐怕就很…

    2017-12-28
  • 是不是该考虑加入动态交互了?

    本文转载自:阿西博客 原始链接:是不是该考虑加入动态交互了? 一个优秀的APP交互动画不仅仅是炫,而且要实用,有的还要考虑手机的性能等因素,所以想做一个好的交互不并容易,今天就带你来见识一下什么叫洋气范儿…

    2015-03-21
  • 2017年的Logo,这样设计才会火!

    设计是变换无穷的,而且不断地演变,与新的潮流和品味融合。此种特性不论是在时尚界、平面设计或是其他业界中都相当普遍可见。 Logaster特地做了2016年Logo总评比,预测有哪些热门趋势将主导2017年的Logo设计风格。…

    2017-03-03
  • UI设计之4个字体设计小技巧

    内容在设计中起着至关重要的作用。不管你是从事网站设计、移动应用程序设计、还是可穿戴ui设计,你的设计必须能够清楚地传递出设计的意图和目的。由于文本是基于沟通的目的,所以需要对字体设计有着深刻的理解。当然,…

    2015-05-14
  • 情感化设计—“愉悦性”的陷阱

    说起“愉悦性”,我们通常会想到一些让人感到温暖、开心的东西,譬如毛绒玩具、纸杯蛋糕、拥抱,等等。 不过,具有愉悦性的事物在某些情况下同样会带来负面效应。某些笑话可能冒犯到他人,温馨的广告可能误导部分观众…

    2016-11-28
  • StatCounter:2016年10月全球移动流量占比达51.2% 首次超过桌面端

    #交互学堂#产品移动端的交互设计趋势或占比要进一步扩张了。 该发现对整个互联网世界意义重大:这意味着那些尚未决定采用移动为先战略的互联网服务提供商真的应该这么做了,因为这一趋势已经不太可能逆转。 据外媒…

    2016-11-03
  • Facebook的产品设计师如何思考

    之前发现这部 Julie Zhuo 在斯坦福大学的演讲视频,主题为“How Facebook Designer Thinks”,全长37分钟,共分为四个主题,包括“怎样识别问题、定义需求”、“解决真正重要的问题”、“为什么要设计新表情”以及“预先定义…

    2017-04-06
  • sketch 插件 sketch-measure 更新,又大大的提高了工作效率 ~

    今天更新了一下sketch measure的插件,下面说一下都更新了哪些地方 1.新的UI界面 友好的ui界面使你标记起来更加便捷,新界面是不是看起来更加专业了许多,视觉上更加直观 2.输出出口 自动生成HTML的样式,而不仅仅…

    Sketch 2016-07-25