菜单优设网 - UISDC

会员

开通优设VIP星球

尊享13项VIP特权持续新增

主题打卡挑战

21天带练！告别无效练习

接私单赚外块

VIP优先接，累计金额超百万

优设私房课免费学

价值178元热销课程

你的私人律师

每月可免费咨询30次

开通VIP

领取更多设计师实用特权

投稿

动效话题

UI 1.3w

B端产品如何巧用动效？来看腾讯的实战案例复盘！

B端产品中如何巧用动效，提升产品体验友好度，同时利用动效传递功能亮点？如何基于品牌内核，建立动效设计系统？这篇腾讯的实战案例文章统统教会你！

2022/05/19

腾讯设计族

UI 1.8w

想让设计更酷炫？先学会 6 种常用的动效落地方案（附插件下载）

本文给大家分享在可视化设计中最常用的 6 种动效落地方案，手把手教你如何配合开发将小动效在页面中展示出来。

2022/05/07

Mr.小六

UI 1.7w

研究Material Design交互动态系统后，总结了这6个知识点！

研究 Material Design 交互动态系统后，学习总结出交互动效的6个知识点，希望对大家有帮助。

2022/02/11

ALEI

Material Design

UI 3.7w

如何让动效又快又好落地？我分析了这5种格式的优缺点！

本文总结了5种常用的动图格式，以及输出动图过程遇到的问题和解决方法，帮助大家选择合适的动图格式。

2022/02/10

ALEI

UI 7.2w

掌握这3招，搭上 2021-2022 动效设计趋势快车!

本篇结合超多实例，浅析 2021 年动效趋势，希望可以给大家带来一些设计灵感。

2021/08/30

土拨鼠

2021-2022设计趋势

UI 4.9w

网易出品「你的人格主导色」，是如何从零开始做动效设计的？

前段时间大家有被《你的人格主导色》这个 H5 刷屏了吧，今天我来和大家聊聊这个项目中动效设计是怎么落地的。

2021/07/06

土拨鼠

UI 4.7w

7000+超详细干货！系统掌握动效设计模式（上）

本文将基于界面整体设计框架，结合用户心智模式，系统介绍动效设计需要考虑到的全部维度。

2021-01-29

京东JellyDesign

UI 3.8w

提升 UI 细节和体验的 10 个常用方法

如果你觉得你的 UI 设计起来很无聊，想让它看起来更加有趣，其实是有很多相对通用的方法。这些方法大都不算复杂，稍加调整，总会有不俗的效果。如果你想试试，不妨试试我所总结的这些赋予 UI 以个性的10个方式。

2020-10-13

陈子木

UI 4.9w

一篇文章帮你了解AE动画插件Lottie的前世今生（附避坑案例）

今天这篇分享，将会讲到Lottie这个插件怎么来的，为什么会叫Lottie？使用过程中有哪些需要注意的？具体又该如何正确使用？

2020-09-02

土拨鼠

UI 2.8w

写给新人的App动效设计方案基础科普

本文从动效的分类、设计规范和设计方案等方面，给新手阐述APP动效的基础知识点。

2020-08-17

jingwhale

UI 5.9w

做好直接用！动效神器 Lottie 基础入门教学

今天来给大家介绍一款可以将 AE（Adobe Effect）文件导出 json 格式，实现 0 开发成本，提高沟通效率的工具 —— Lottie。

2020-02-27

土拨鼠

神器推荐 5.4w

比阿里犸良还强大！Lottie动效设计完全指南

之前的文章已经介绍了 Lottie 是什么，以及如何导入设计文件，那么今天就为大家讲解如何根据我们的需要导出 Lottie 文件。

2019-08-18

土拨鼠

交互 2.9w

腾讯高级设计师：交互知识树系列之平台规范

说到设计规范，这可能是很多设计师会忽略的一个东西，或者就算注意到了，也并没有引起足够的重视，今天咱们就来讲讲，为什么设计规范甚至是平台规范对我们来说很重要？你觉得苹果、谷歌、微软的设计团队怎么样？或者你有什么向往的设计公司或团队呢？

2018-06-09

程远

UI 2.8w

用一篇文章，帮你掌握基础实用的动效技能

对如今的 UX 设计师来说，会点动效基本已是常规操作了。作为 UX 设计师，动效可以辅助的产出可以涵盖界面交互动效、项目宣传 MG动画、产品吉祥物表情包、年终汇报 PPT 等等。这些技能点虽然广，但是只需要掌握基础实用的几个点就足以辅助我们更好的包装输出。

2018-05-06

程远

交互 3.4w

内部教程！超详细的支付宝设计规范之交互篇

支付宝设计规范往期回顾：《内部教程！超详细的支付宝设计规范之图形图案篇》《内部教程！超详细的支付宝设计规范之配色篇》《内部教程！

2018-04-13

程远

UI 5.1w

超全面的 APP 动效设计必备知识总结

如今丰富细腻的 App 动效遍布移动端优秀应用界面中，为用户提供了良好的动态沉浸式体验，动效设计在产品研发过程中也越来越被认可和重视。通过本文，你将轻松了解到关于动效设计的一些必备知识：究竟为什么要设计动效？它的意义和价值是什么？

2018-04-10

程远

UI 3.8w

最全最好用的动效落地方法，都帮你总结好了（下）

上篇内容回顾：《最全最好用的动效落地方法，都帮你总结好了（上）》接下来进入下篇。主题是：从 Web 前端的角度来讲，有哪些便捷的方法实现这些动效？在目前行业内，动效设计的整个体系还未成熟。

2018-04-05

程远

UI 2.5w

最全最好用的动效落地方法，都帮你总结好了（上）

用户体验设计的发展日趋完善，优秀的动效是完善用户体验中不可或缺的一环，优秀的界面动态设计可以让产品的用户体验锦上添花……你会说，这些道理我都懂，但是动效做起来真的很麻烦啊。直接切入到大家常见的问题吧：一般情况下，在沟通界面动效的过程中，工程师会希望设计师使用更具体的表达方式。

2018-04-03

程远

UI 2.3w

7个实用技巧，让你的动效变得更优秀！

本篇文章不长，但是干货满满，希望能给大家带来一些实际帮助。下面进入译文。提高 UI 动效的实用建议让我们一起看看 UI 动画从好到优秀的一些例子。

2018-03-13

程远

UI 1.8w

阿里设计师：如何用动效创新方法解决产品问题？

一、前言B类产品设计过程中会遇到各种各样的问题，不同问题有不同的解法。有的问题不适合用动效去解决，盲目无意义的动效不仅浪费设计师及开发成本，更会降低产品性能、分散用户操作注意力等。然而有些问题则用动效解决更为巧妙，恰到好处的动效可以简化产品模型，降低设计开发成本，促进用户对产品的理解等。

2018-03-02

程远

教程 2.9w

超实用！12 条提高产品可用性的动效设计原理（附案例）

本文将市面上最常被使用的动效进行了一次总结并逐条阐明这些设计背后的原理，每条原理后面我都会为朋友们选出一些大家最常用的 App 作为例子，顺手打开就能体验啦。缓动（Easing）、偏移量和延迟（Offset & Delay）主要与时间相关。父子关系（Parenting）用于阐述元素之间的关系。

2017-06-05

程远

交互 3.4w

超全面干货！如何制作符合场景的交互动效？

@野子Joey ：动效如今被广泛的使用在界面设计中。但如何合理使用实效，而不是让动效干扰用户，却少有总结的经验。因此本文旨在结合现有的动效资源和案例，总结一下动效的使用目的，使用场景以及实现技术。

2017-03-20

程远

UI 1.5w

新手想进阶技能？超酷炫的动感特效轻松get！

lionisready：新手设计师相较于资深设计师，后者技能更丰富且全面，很多人想要进阶资深却苦于培养新技能，笔者在经手不少视频动效项目后，对于技能进阶颇有心得，特意分享出来。通常技能进阶的方向有如下两种：钻研型，工作需求和自身特长强结合，原特长在工作中日益强大，影响力不断提高；发散型，工作需求和自身特长有较大偏差，但经过努力让自己掌握了新技能，极大增强了职场的适应力和综合能力。两者各有千秋，笔者则是在发散型的艰难道路上一路飞奔后，大量积累了视频剪辑和动效制作的经验，希望给走发散型道路的设计师助一臂...

2017-02-21

程远

UI 1.6w

动效在UI设计中有哪三个关键用途

随着技术和硬件设备性能的提升，动效已经不再是视觉设计中的奢侈品。动效不仅仅是华丽的动态效果，它首先帮助设计师和用户解决了许多界面功能上的问题，让这用户更容易理解产品，也让设计师更好的表达。动效本身还让整个界面更加活泼，充满生命力，更加自然的相应让就用户和界面之间有了情感的联系。

2017-02-21

陈子木

UI 1.9w

腾讯超全干货！如何让你的动画更自然？

大熊：本文将从为什么要探究更自然的动画、如何探究运动曲线方程、列举常用的运动曲线、分别使用js和css实现曲线动画效果、可视化实现工具这几个方面进行介绍。希望阅读后，本文能给你在制作动画效果时带来一点帮助。1. 为什么需要探究更自然的动画自css animation推出后，强大的功能使得我们通过css也能制作出媲美flash的动画效果。

2017-02-17

程远

UI 5.1w

用这个方法，轻松提高H5动画的开发效率！

Janilychen：以往做一些H5的运营项目，都是动画设计师使用Animate cc（原来的Flash）先设计好动画原型，然后交给我们UI开发来实现。做过动画开发的童鞋都知道动画开发都是比较耗费时间精力的，而且还要高质量的还原动画设计师设计好的动画，来回沟通成本也非常高。那有没有一种高效的方法来改善这种流程，提高开发效率的同时还能完成高品质的动画呢？

2017-01-23

程远

神器推荐 23.0w

新人手册！动效设计几乎都是这10个软件做的（内附教程）

编者按：想学习动效设计？别以为只有复杂的AE 可以做。今天推荐的这10个软件都可以做出酷炫的动效设计，功能上各有优势，但效果丝毫不输AE哟（内附大量教程）。

2017-01-13

程远

UI 1.9w

超实用！移动界面动效设计的全方位科普指南

编者按：读完@顾小犊这篇文章，你可以知道动效的作用、设计原则、动效工具、制作方法、标注技巧等等，特别全面，强烈推荐收藏学习。动效在用户体验设计中正变得越来越重要，那么动效能带来什么好处呢？体现交互层级动态界面使人更容易理解交互层级关系，减轻了人们的认知负担给予反馈给人感觉界面是活的，让体验流畅弥补静态页面的表达不足在内容优先的设计趋势下，用户界面变的更加简洁。

2016-12-13

程远

UI 2.7w

动效丨七何分析法帮你全面分析界面动效

@十圆QCee ：以前在团队内部做过一个关于动效的分享，当时，是从现实参照、功能性、品牌，等维度进行分析。这次为了更全面的了解界面动效，我参考了5W2H分析法。5W2H又称七何分析法，分别是：What、Why、Who、When、Where、How、How much。

2016-11-29

程远

没有更多文章了

大家都在看

设计干货

文章 154

职场规划

文章 366

设计圈干货

文章 188

配色

文章 157

职场经验

文章 158

界面设计

文章 154

字体设计

文章 349

海报设计

文章 268

视觉设计

文章 175

热门频道

设计专题

热门设计知识精挑细选

细节猎人

1分钟小短文揣摩设计真谛

优设读报

行业资讯一站知晓

优设琅琊榜

顶尖设计作品聚集地

行业新闻

行业大事小事全知道

设计问答

高手大咖在线答疑解惑

热门频道

设计灵感

支持与服务

优设微博

@
优秀网页设计
380W粉丝！每日更新设计干货
@
优设
强烈推荐！优设官方品牌微博
@
优优教程网
官方微博，海量教程看不完
@
优设基础训练营
零基础入门，带你成为软件高手
官方群
优设官方微信群
01优设25+设计师交流群
02优设30+设计师交流群
03优设求职招聘群
04优设同城交友群
05优设私单群
06优设学生交流群

07优设UI设计师交流群
08优设插画师交流群
09优设平面品牌设计师交流群
10优设3D设计师交流群
11优优教程自学团
12优设VIP知识星球交流群
微信扫码添加管理员招财

微信号：uisdc411

严格审核打造高质量交流群

进群会有面试题谢绝打广告
优设微信

每天官微五分钟

一年萌新变大神

扫码关注

1000W

优设新媒体矩阵等你来关注