文章/答案/技术大牛

发布

社区首页 >问答首页 >请问这种动效怎么做？

问请问这种动效怎么做？

提问于 2020-12-23 11:40:32

回答 0关注 0查看 129

视频内容

动效

运维排障定位快人一步

一站式日志服务平台---日志服务 CLS，智能化配置、开箱即用，协助解决业务运维、服务监控、用户行为分析、日志审计等场景诉求。

回答

成为首答用户。去写回答

【动效】：刮刮卡

canvas https 网络安全 api 网站

A viewport represents a polygonal (normally rectangular) area in computer graphics that is currently being viewed. In web browser terms, it refers to the part of the document you're viewing which is currently visible in its window (or the screen, if the document is being viewed in full screen mode). Content outside the viewport is not visible onscreen until scrolled into view.

WEBJ2EE

2020/11/05

1.3K0

canvas中普通动效与粒子动效的实现

canvas http css 编程算法

canvas用于在网页上绘制图像、动画，可以将其理解为画布，在这个画布上构建想要的效果。

用户2356368

2022/04/07

1.9K0

五、jQuery动效

https 网络安全编程算法

显示slideDown()动画，隐藏动画slideUp()，切换动画slideToggle()

Dreamy.TZK

2020/06/18

2.1K0

动效设计原理:从卡通动画到UI动效

windows animation ui 动画动效

作者：袁骁，腾讯SNG ISUX 用户体验设计师。热衷于研究 Emotional Design和认知心理学 UI是基于静态页面来设计的，页面之间通过跳转切换。在设计过程中，设计师很重视单页的视觉效果，却经常忽略了对界面跳转的处理。这些未经处理的跳转由于没有提供足够的预期，所以用户在使用时经常会觉得困惑。与此相反，在卡通领域，由于使用了足够的动画效果，用户可以非常容易理解某个动作，即使夸张的动作也没问题。尽管UI设计和卡通动效之间存在差异：卡通更侧重于娱乐，而用户界面却是严谨的互动式工具。但是我们还是可以借

腾讯大讲堂

2018/02/12

2.8K0

动效素材极速交付：腾讯PAG动效组件技术揭秘

渲染动效视频腾讯研发

编者按：音视频产品中的动效素材需求是源源不断的，例如贴纸花字，转场特效，照片和视频模板等，并且对它们的产量，上线速度，以及视觉效果都有比较高的要求。但在传统工作流中的交付成本却非常高，需要通过代码来手动还原设计师预设的动效内容。为了降低或消除动画相关的研发成本，腾讯内部历时 5 年研发了一套 PAG 动画工作流的解决方案，能够一键将 AE 动画内容导出并应用到几乎所有的主流平台。LiveVideoStackCon 2022北京站邀请到了腾讯媒资产品中心副总监陈仁健,为大家系统地分享在产品需求的驱动下，PAG

LiveVideoStack

2023/05/05

1.7K0

canvas中普通动效与粒子动效的实现普通时钟粒子动效粒子时钟总结

canvas http

canvas用于在网页上绘制图像、动画，可以将其理解为画布，在这个画布上构建想要的效果。

用户2356368

2019/04/03

1.9K0

动效实战！跟着TUBIK STUDIO学习UI动效的常见用法

ios

对于动效的看法，我个人也觉得微动画，微交互是最好的。不过有动画总比没有的好，也要看实际用途

進无尽

2018/09/12

1.6K0

消除动效研发成本：腾讯 PAG 动效解决方案

渲染动效解决方案腾讯研发

本文作者陈仁健，腾讯 OVBU 媒资产品中心副总监，曾主导过开源 UI 框架 FlexLite 与 Egret 游戏引擎的设计研发。2018 年加入腾讯，作为腾讯多媒体技术委员会下 AVGenerator Oteam 核心 PMC 成员，持续专注在音视频编辑、图形图像特效、C++ 跨平台渲染等领域。主导研发的中台组件 PAG 动画解决方案已接入服务了 400+ 应用，包含微信、QQ、王者荣耀、小红书等头部 App，并于 2022 年 1 月正式对外开源。 T Chat｜我在大厂做研发系列直播第 16 场

LiveVideoStack

2023/05/05

1.5K0

关于动效的笔记

微信 tcp/ip

1.2内容呈现：一个页面内的信息内容丰富度超出了页面的承载量或者用户的认知程度，除了将信息拓展到其他页面这种方法之外，使用动效将页面信息按照重要程度进行分层，有层次的呈现给用户

霖酱

2020/02/13

8600

动效设计原理:从卡通动画到UI动效 - 腾讯ISUX

css

概要 UI是基于静态页面来设计的，页面之间通过跳转切换。在设计过程中，设计师很重视单页的视觉效果，却经常忽略了对界面跳转的处理。这些未经处理的跳转由于没有提供足够的预期，所以用户在使用时经常会觉得困惑。与此相反，在卡通领域，由于使用了足够的动画效果，用户可以非常容易理解某个动作，即使夸张的动作也没问题。尽管UI设计和卡通动效之间存在差异：卡通更侧重于娱乐，而用户界面却是严谨的互动式工具。但是我们还是可以借鉴卡通动效的优点，从情感和认知层面上将两者的优势相结合。 Keywords UI、动画效果、卡通

腾讯ISUX

2018/06/29

1.7K0

前端必看！微信都在用的开源动效方案【PAG动效】

渲染开源微信动效前端

在 web 中实现一个动画， css animation 声明一下各个时间点的样式就好了，写起来并不麻烦。但是当设计给的动画越来越复杂, 还原度要求越来越高的情况下, 单纯依赖 css 写动画就显得捉襟见肘了。比如下面这些动画:

zz_jesse

2023/08/21

2K0

jquery_02动效方法

jquery

起初，我认真的时候，你不认真，现在你认真了，我却已离你有些远了。想想当时我们一起学习一起努力的日子，是不是有种莫名的喜悦。现在大家工作了，也会遇到一些前端设计的问题或相关的事情，这时你们能第一时间来到这里，想到曾经我们在一起共同学习过、努力过、拼搏过，我依然觉得很欣慰。所以当我的朋友们真正需要我的时候，我还在这里等着你，我在这里为你们准备了前端设计基础知识的成套视频（试听版）。无论你是第一次无基础学习，还是有基础来复习复习，也或是想我了来看看我，嘻嘻。都很欢迎大家！衷心祝愿大家工作顺利！一切都好！大

用户1730674

2018/05/02

8600

用了很多动效，介绍 4个很 Nice 的 Veu 路由过渡动效！

vue.js 编程算法

Vue Router 过渡是向Vue应用程序添加个性的一种快速简便的方法。它让我们可以在应用程序的不同页面之间添加平滑的动画/过渡效果。

前端小智@大迁世界

2021/04/19

2K0

动效歌词之全新实践

缓存编程算法渲染

一、背景 1. 现状歌词浏览已经成为音乐app的标配，展示和动画效果也基本上大同小异，主要是单行的逐字染色的卡拉OK效果和多行的滚动效果。当然，我们也不例外。 2. 目标我们的目标十分明确，一是提升歌词的基础体验，二是在此基础上，能提供差异化的VIP特效，来吸引用户开通VIP。二、探索技术方案经过多次的需求评审和沟通讨论，各方在需求的目标和细节上也达成了初步的统一。产品的希望：效果炫酷，能实现逐字动画(位移，翻转，渐隐渐现，模糊，粒子特效等)，可配置等。开发的思考: 技术架构方案，性能挑战等

QQ音乐技术团队

2019/01/12

2.6K2

Ant Motion动效插件分析

css apache

通过调用封装的组件，部署组件DOM结构和其上面的参数完成动画效果的添加，同时用户可以更改组件的参数以及自定义组件的样式来实现所需要的展示效果。

colezhou

2019/11/23

2.9K0

动效歌词之全新实践

缓存编程算法渲染

QQ音乐技术团队

2019/01/11

2.5K0

前端动效讲解与实战

svg canvas 渲染 css webgl

本文将从各个角度来对动画整个体系进行分类，并且介绍各种前端动画的实现方法，最后我们将总结在实际开发中的各个场景的动画选择方案。

2020labs小助手

2022/09/26

2.9K0

Flutter 转场动效大合集

jquery ui 网站 flutter ios android

动画经常会用于场景切换，比如滑动，缩放，尺寸变化，为应对这样的场景转换需要，Flutter 提供了 Transition 系列的动画组件，可以让场景转换动画变得更加简单。本篇为你整理了常用的 Transition 组件的应用。

玖柒的小窝

2021/11/05

1.2K0

ProtoPie 动效原型进阶之路

https 网络安全 mac os

腾讯ISUX isux.tencent.com 社交用户体验设计我们在日常的工作当中，经常需要向Leader，业务方、Boss或者甲方提交设计方案，而你的方案是否能够打动他们，从而获得宝贵的开发资源和排期，取决于很多情况，其中之一，很重要的就是你的DEMO是否能够给人一种身临其境的体验感受。而作为视觉设计师、交互设计师、产品经理，限于我们的专业能力并非开发，所以怎样在节约团队开发资源的情况下，独立完成创意的展示，成为了一项核心诉求。 By Dribbble 过去我们会使用AE（

腾讯ISUX

2019/08/07

1.6K1

小视频动效揭秘

opengl api 短视频

现在最轻松的打发时间的方式莫过于短视频应用了，应用商店里各种短视频App给大家带来了许多新奇有趣的内容。

Player 1

2019/12/12

9000

相似问题

关于一个javascript动效问题？

1389

商业版短视频sdk-动效贴纸？

0305

一般集成美妆动效价格多少啊？

1251

短视频支持自己自定义动效和添加静态贴图吗？

1361

移动直播iOS端SDK使用动效触发filepath must not be nil相关crash？

1658

问请问这种动效怎么做？

运维排障定位快人一步

回答

关于一个javascript动效问题？

商业版短视频sdk-动效贴纸？

一般集成美妆动效价格多少啊？

短视频支持自己自定义动效和添加静态贴图吗？

移动直播iOS端SDK使用动效触发filepath must not be nil相关crash？

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问请问这种动效怎么做？

运维排障定位快人一步

回答

关于一个javascript动效问题？

商业版短视频sdk-动效贴纸？

一般集成美妆 动效 价格多少啊？

短视频支持自己自定义动效和添加静态贴图吗？

移动直播iOS端SDK使用动效触发filepath must not be nil相关crash？

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

一般集成美妆动效价格多少啊？