20个有抱负的UX Motion设计人员的免费赠品

界面设计人员通过模拟用户动作的动画模型对UX设计产生了更大的兴趣。 这些UX实体模型依靠具有动画效果的运动来定义界面如何响应用户输入

大多数用户体验设计师都学会使用软件来创建这些动画。 最受欢迎的两个选择是Adobe After EffectsPrinciple (仅OS X)。 您可以在Photoshop之类的程序中设计界面模型 ,然后将UI移入这些程序中进行动画处理

如果您有兴趣学习UX动画,那么免费赠品将是一笔巨大的财富。 您可以研究他人的作品,并研究他们的设计,以了解其工作原理。

在下面,您将找到仅适用于UX运动设计的 Principled和AE用户的最佳赠品。 他们一定会帮助您了解UX动画的工作原理以及如何构造自己的动画

阅读更多: 鼓励用户参与的4种UX设计技术

删除动作

出于各种目的, 滑动是移动应用程序中非常常见的操作。 默认的iOS滑动操作用于显示用于编辑/删除项目的备用选项 ,而这正是Ramil Derogongun创建的此免费赠品中的功能。

20个有抱负的UX Motion设计人员的免费赠品

您可以为After Effects下载免费的AEP文件,然后自己尝试。 UI遵循非常基本的线框方案 ,用户输入显示为蓝点。 最好通过动画来显示这些类型的用户行为,因为它使开发人员有机会查看界面的工作方式

小部件滑动

这是另一个滑动式动画样机,专注于幻灯片中的购物车项目 这个免费的滑动动画由Leon Leon设计,附带PRD文件,该文件是为Principle制作的。

20个有抱负的UX Motion设计人员的免费赠品

动画非常简单,并演示了施加压力时项目应如何在屏幕上移动。 每当释放滑动动作时,您也会感觉到缓和效果

Dualshock UI

这是Alexander Boychenko共享的令人难以置信的动态UX动画效果。 该模型基于用于移动应用程序UI的PlayStation控制器。 它包括一个草图和原理文件,您可以免费下载。

20个有抱负的UX Motion设计人员的免费赠品

这个免费赠品展示了如何创建在屏幕之间滑动的过渡。 但是,您还可以看到页面元素如何在屏幕上以各种方向进行动画显示。

汉堡菜单动画

汉堡包图标仍然在移动界面中风行一时。 此菜单图标免费赠品演示如何将三栏图标动画化为“ X”图标。

20个有抱负的UX Motion设计人员的免费赠品

这是一个重复的动画 ,因此“ X”也将重新设置为汉堡菜单图标的动画。 这是一个很棒的免费赠品,可了解UI元素的矢量操作

Snapster

此免费模型适用于名为Snapster的移动应用程序。 它着重于欢迎/入门屏幕 ,用户可以在其中查看该应用程序的演示,并了解其实际功能。

20个有抱负的UX Motion设计人员的免费赠品

这是一个PRD文件,不幸的是,这在After Effects中效果不佳,因此只有Principled用户才能从中受益。

加载微调

这是面向移动加载微调器的AEP After Effects免费赠品。 当Ajax进入主流Web开发时,这些类型的动画GIF变得非常流行。

20个有抱负的UX Motion设计人员的免费赠品

现在,这些移动式装载机只有一角钱,甚至可以对其进行大量定制以适合某些接口。 如果您要修改矢量,则此免费赠品随附AEP文件和Sketch文件以编辑矢量。

使用此免费赠品,您可以检查如何将各种细线图标动画化为形状和符号 一旦您学习了该程序,就可以轻松进行此类工作,因此可以帮助免费赠品进行研究。

iPhone样机

尽管此免费赠品不直接包含动画,但可以用于iPhone应用程序上的制作工作 这是一个免费的iPhone 5S AEP文件,可在After Effects中用作iPhone模板。

20个有抱负的UX Motion设计人员的免费赠品

只需导入您的界面模型,然后在After Effects中创建动画。 然后,您可以将其插入此iPhone模型中,以与您的团队共享。

iPhone模板

这是另一个具有更现代iPhone设计的 自定义After Effects模板 可从此页面的UX in Motion获得免费赠品。

20个有抱负的UX Motion设计人员的免费赠品

模板中的所有内容都非常易于自定义 在下载页面上,您还将找到标有“视频说明”的部分,您可以在其中学习如何为应用制作动画。

微型动画

即使最小的应用动画也可以对用户体验产生重大影响。 每当用户“喜欢”帖子时,此免费赠品就会显示“喜欢”微动画

20个有抱负的UX Motion设计人员的免费赠品

心形图标具有自己的动画 ,并将用户的个人资料照片添加到喜欢的堆栈中。 此免费赠品仅适用于Principle,如果需要,您还可以下载.mov文件。

钱包应用

数字钱包正变得越来越流行,这种免费赠品使设计钱包变得更加容易。 您将获得一个包含所有原始矢量元素的Sketch文件,以及用于Principled动画的免费PRD文件。

20个有抱负的UX Motion设计人员的免费赠品

这个免费赠品由Sergey Bykov设计,是一个有趣的小项目。 但是,如果您将其分解并逐步进行动画处理,可能会很有启发性。

iOS切换器

借助Apple的iOS 7,世界上有了一个全新设计的开关标签 这导致了许多不同的效果,包括模仿本地打开/关闭开关的免费动画。

20个有抱负的UX Motion设计人员的免费赠品

在此文件中,您将获得非常简单的动画效果以及基本的缓动效果。 开关移开,背景变为绿色,然后在关闭开关时恢复原状。

Ritter App

这是谢尔盖·拜科夫(Sergey Bykov)发布的另一项很棒的免费赠品,他称之为Ritter App。 其中包括用于矢量界面的免费Sketch文件,以及用于Principle动画的免费PRD文件。

20个有抱负的UX Motion设计人员的免费赠品

您将在此免费赠品中获得许多不同的动画 ,所以我认为这对于中级到高级的设计师会更有用。 初学者也可以从中学到很多东西,但是学习曲线可能比较陡峭。

邀请朋友

我们都知道并喜欢Google的加号图标弹出菜单。 好吧,贾德森·阿尔梅达(Jardson Almeida)基于简单的“材料设计”概念创建了“邀请好友”菜单。

20个有抱负的UX Motion设计人员的免费赠品

一切都以Sketch设计,并导入到Principle中进行动画处理。 您可以将这两个文件作为免费赠品下载并随身携带。

刷卡

这是另一个仅适用于Principled用户的通用刷卡免费赠品。 这是为通用幻灯片放映或本机应用程序UI创建的刷卡界面。

20个有抱负的UX Motion设计人员的免费赠品

我认为这对于刚接触Principle的初学者来说是完美的免费赠品。 它不是那么复杂,以至于您会迷失方向,但是却不是那么简单,以至于变得琐碎无聊。

在地图上聊天

许多设计师仍然使用Photoshop作为界面,此地图聊天免费赠品也是如此。 您可以为接口下载PSD文件,并为Principles动画下载PRD文件。

20个有抱负的UX Motion设计人员的免费赠品

这是一种令人惊奇的温和动画,但它看起来仍然不错,并且功能完全像您在简单的地图/地理位置应用中所期望的那样。

应用加载

移动应用程序经常使用加载屏幕来告诉访问者后端发生了一些事情。 这个集合中我最喜欢的免费赠品之一是由Roman Wagner创建的加载动画。

20个有抱负的UX Motion设计人员的免费赠品

加载屏幕完成后,它将一个接一个地加载各个元素。 该动画非常流畅,在移动应用程序设计领域中完全可信。

入职卡

对于每个新的移动应用程序而言, 用户入门都是至关重要的一步。 在这个阶段包含一些动画总是很不错的,这就是为什么这些入门卡动画可以对应用程序设计师非常有用的原因。

20个有抱负的UX Motion设计人员的免费赠品

它是由Austin Baird创建的,并免费发布以在任何UI / UX项目中使用。

原理演示

在深入研究Principle时,您将学习许多高级工作流程技术。 最好的免费赠品之一是为Yalantis创意团队创建的一款

20个有抱负的UX Motion设计人员的免费赠品

对于Principled用户来说,这是一个完全免费的资源,可以下载和使用。 它涵盖了一些技巧,显示了如何成为Principled动画的专业人士。

下拉菜单

菜单下拉菜单通常采用疯狂的动画来吸引我们的注意力。 这款After Effects免费赠品使用菜单上下拉楼梯动画来处理单个元素,使它们像楼梯一样掉落。

20个有抱负的UX Motion设计人员的免费赠品

这可能对每个人都没有用,但是它无疑是了解After Effects界面动画的好方法。

最后的话

所有这些资源都可以在您自己的项目中完全免费下载和使用。 如果您是UX动画的新手,我保证您可以通过研究这些免费赠品而学到很多东西。 如果您知道其他有用的资源,请随时在评论中删除链接。

翻译自: https://www.hongkiat.com/blog/ux-motion-designer-freebies/