那些具有空间感的动效设计

在我们的大脑中,存在着多维的思考模型,能够帮助我们理解周围复杂的世界。我们还可以利用这种具有空间感的思考模式,帮助我们处理抽象的信息。

动效设计的空间感


我的思考是具有空间维度的,而你,也同样如此。

你虽然看不到,但是可以抓住你的左耳吧?同样的,你可以挠挠你的鼻子吧?或者,你可以摸摸你的额头和后脑?你可以记住你的钥匙丢到哪里了?你可以不用看键盘盲打吗?你可以通过记忆和感觉来回想起手机装到了哪只口袋里吗?该走哪条路,想起来了吗?黑夜中还能记得去厕所的路怎么走吗?

我问了这么多,你肯定会回答,我能。因为在我们的大脑中,存在着多维的思考模型,能够帮助我们理解周围复杂的世界。我们还可以利用这种具有空间感的思考模式,帮助我们处理抽象的信息。

我认为最佳的软件时能够拓展用户大脑思维模式的软件。它能够让用户更加自然的思考,让用户更容易的适应软件内部环境,而不是盲目的四处探索,却找不到想要的going 呢。信息的传递本应该是计算机的工作,而不是我们的工作。这便是我们设计师设计软件的目的。极具空间感的界面设计能够符合用户的心理模型和预期。是真正为用户而设计的界面,它能够强化用户原有的思维模式,增强界面的空间感与时间感。这种界面能够让用户充分的感知什么元素身处在什么位置。就像一座结构精巧的建筑设计一样,它们往往易于穿梭易于浏览。空间的变化有序而融洽,不会让人感到突兀,而是理所当然。

塑造空间

设计具有空间感的界面,你需要从里到外,认真的考量将屏幕的界限所在。琢磨界面中的物体缩影具有的物理特性。它们从何处来?又要去何处?它们是以何种动态形式进行移动和转换?哪类特定的元素继承了哪些现实物体的物理属性?或者用用户的视角来思考,我现在在哪个界面?和其他界面的关联又是怎样?

这些问题难以用语言去组织回答。但是我发现我可以用图片来很好的解释阐述这些问题。

绘制地图

图解推理

当用设计来营造空间感的时候,地图可以帮助我们假象界面的心理模型,我们来感受操作,和界面层级关系之间的导航。而简简单单的将界面摆在一起,往往达不到我们想要的效果,我们的设计思考往往停留在单一的维度,没有办法更深维度的思考界面的空间关系。

下面这个范例便是Keezy Drummer这款应用的上下文层级分解图

这个简单的分解图,描述了Keezy Drummer中界面的上下文关系。这个分解图