写点什么

每个设计师都需要懂得动效知识(二)

  • 2020-01-08
  • 本文字数:1019 字

    阅读完需:约 3 分钟

每个设计师都需要懂得动效知识(二)

三、我们在项目中是怎么推进动效落地的?

我什么我们觉得超酷超美的 UI 动效,似乎很少在真实的 App 上看到它们被实现。技术门槛降低了这些 UI 动效的可行性也许是最大的一个原因;除此之外,设计师们在提出这些 UI 动效时,往往都缺乏使用情境。切记为了漂亮而漂亮。


常用的一些小技巧:


罗列全局动效改进点列表


提出概念方案,向团队推介


不同情况下的原型复杂程度取舍,简单可以直接拿样品和技术沟通,标志性动效细腻还原。有些动效可能比较简单,如果我们能用线上的例子说明你所需的动效效果,可以节省你做 demo 的时间,把重点放在重点细腻动效上。


视觉和交互的通力合作


我们增加动效是为了更好的阐述产品逻辑,它与交互紧密相关,所以跟你团队一起推进动效的产出事半功倍。

四、动效的工具

虽然身为设计师,可以定义非常酷炫的动效,但是由于技术成本限制可能被摒弃。所以作为设计师同样需要理解技术实现的基本原理。下面为大家介绍以下工具:

1. 交互性动效

如果你做了案例,动效只是为了说明你的设计,阐述你的交互逻辑,那么下面四款都可以满足的你的基本需求。Principle 和 Flinto 都可以直接置入你的 sketch 设计稿,跟你的设计产生联动。页面也很简单,完成转场的交互极其便捷,另外还可以做一些基本时间轴动画, 调节单个元素的曲线变量等。Hype3 实现的效果可能不那么精致,但是可以直接导出对应的代码。


Pixate 除了一些基础的控件供你使用,特殊的动效可能需要一定的代码才能完成,可能对于没有语言基础的设计而言效果过于简单。


2. 复合型动效

Origami 是一款基于 Quartz Composer 的插件,它提供了很多自定义的控件。但界面相对设计师而言不够友好。


3. 创意性动效工具

如果你要做一个很酷的开机动画,那么你可以选择 AE 或者 C4D。你可以专注在你的创意上而不被代码表达式干扰。



很多新手会问,哪个软件是最好的?其实并没有完全的类比,在恰当的需求下选择恰当的软件,用最低的成本完成你的需求就好。你可能会用 AE 去做 一个复杂的开机动效,用 flinto 展现了交互逻辑都是 ok 的。


最后,推荐一些值得参考的站:


Capptivate


UI animation


LitterBigDetail


免责声明:部分文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理。本声明未涉及的问题参见国家有关法律法规,当 ##本声明与国家法律法规冲突时,以国家法律法规为准。


本文转载自 Think 体验设计公众号。


原文链接:https://mp.weixin.qq.com/s/AJneuIhv1UsUPlNk6ebaQg


2020-01-08 17:43787

评论

发布
暂无评论
发现更多内容

话题讨论| 帮朋友拼多多助力会导致银行卡被盗刷?

石云升

拼多多 话题讨论 7月日更

查找——HASH

若尘

数据结构 hash

你有多少密码是123456

MySQL从删库到跑路

密码管理

都说数仓是面向主题建设的,那数仓的主题和主题域又应该怎么划分呢?

白贺BaiHe

数仓 7月日更 数仓主题 主题域 数仓建设

模块一作业

君子意如何

「架构师训练营第 1 期」

🏆「作者推荐」【JVM性能分析】精心准备了一套JVM分析工具的锦囊(上部)

码界西柚

JVM 性能分析 jvm调优 7月日更

为什么搞一个副业项目如此之难?

张理查

利用 Vector 从日志创建指标来提高系统的可观测性

哈德韦

日志 可观测性 Prometheus SRE vector

使用 Open Policy Agent 实现可信镜像仓库检查

张晓辉

Kubernetes 安全 OPA

Redisson 分布式锁源码 08:MultiLock 加锁与锁释放

程序员小航

Java 源码 分布式锁 redisson redison

Apollo配置中心如何实现配置热发布

慕枫技术笔记

微服务 后端 配置中心

币安链智能合约Dapp系统开发方案

薇電13242772558

智能合约

数据仓库的基本要求

奔向架构师

数据仓库 数据架构 7月日更

Linux之find xargs

入门小站

Linux

免费分享Java Web 开发的优秀图书

Java入门到架构

Java Java书籍推荐

yarn 的基本介绍和产生背景

大数据技术指南

YARN 7月日更

完了,又火一个项目

程序员鱼皮

JavaScript GitHub Vue 大前端 React

在线ASCII艺术字生成工具,SpringBoot banner生成工具

入门小站

工具

【Flutter 专题】91图解 Dart 单线程实现异步处理之 Future (二)

阿策小和尚

Flutter 小菜 0 基础学习 Flutter Android 小菜鸟 7月日更

phpExcel:Excel数据导入导出最佳实战

devpoint

php Excel thinkphp 7月日更

第八课作业

杰语

Ubuntu Server 20.04搭建kafka集群

玏佾

kafka kafka配置 kafka数据 Ubuntu20.04

学点项目管理,对咱程序员很重要~

后台技术汇

项目管理 项目管理工具

设计消息队列存储消息数据的MySQL表格

Vincent

架构训练营

架构实战营 - 模块 8- 作业

泄矢的呼啦圈

架构实战营

Spring源码解析 -- SpringWeb请求映射Map初始化

Java spring 源码解析

🏆「作者推荐」【JVM 性能分析】精心准备了一套 JVM 分析工具的锦囊(中部)

码界西柚

JVM 性能分析 7月日更

hive 与传统数据库对比

五分钟学大数据

hive 7月日更

Go 语言中一些不太常见的优化

Xargin

性能优化 后端 Go 语言

jTDS 驱动导致 cpu 100%

顾五木

cpu占用100% 线上程序问题

external-attacher源码分析(2)-核心处理逻辑分析

良凯尔

Kubernetes 源码分析 Ceph CSI Kubernetes Plugin

每个设计师都需要懂得动效知识(二)_文化 & 方法_Think体验设计_InfoQ精选文章