(三)如何制作相应场景的动效?

用户头像
苏州/UI设计师/7年前/154浏览
(三)如何制作相应场景的动效?

介绍了UI动效的设计思维,这种思维可以运用到各类设计场景中。

(三)如何制作相应场景的动效?


今天主要说的是一种设计思维——情景模拟思维


何为情景模拟思维呢?——前面我说到UI动效或者说交互设计乃至于整个服务设计,到了深层次的时候,都是需要与用户形成心理上的共鸣。而形成心理共鸣的前提就需要先让用户感到熟悉和亲近。情景模拟就是将用户生活中的一些场景在手机或者电脑的交互情景中进行呈现,来触动用户的一些感情的上的触点。


在进行分析的时候,我们结合场景和现有技术,分为:

    视觉——颜色、形状、质感···

    触觉——纹理、质感、厚度···

    听觉——进行互动的时候发出的声音

    动作——进行互动的时候发生的动作

    语义词汇——约定俗成的词汇,与文化传统有关联(常通过文案来显示)


举个例子

比如我们要做一个红包的动效,那么我们就可以按照以上方法来思考:

    视觉——形状(长方形的红包,带点圆角增加亲近感)、颜色(红色与金色搭配,喜庆)、质感(可以磨砂,可以喷金,高级感)

    触觉——纹理(可以体现在视觉里)

    听觉——在装红包、发红包、拆红包的时候配上相应的声音,情景感更强

    动作——红包展示出被装、被发、被拆时候的动作

    语义词汇——发、拆、装、抢、塞钱···


最后做出来的效果(素材来自于网络)



未完待续······

5
举报
|
2
分享
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
UI界面 组件
新能源APP应用UIKit
【新年UI图标】30个图标
Security Camera UI kit
UI 登录界面设计模板包
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
高级表盘系列UI源文件
APP/小程序商业项目UI模板|99个高保真UI+79个原型
新拟态风格 UI设计组件库
【新年UI图标】礼物/活动icon
【新年UI图标】活动icon
科技医疗透明柜UI界面设计
手表表盘UI系列
智能家居中心 简约 UI设计组件库
森系3D渐变流体抽象矢量UI背景图
【新年UI图标】旅行icon
UI通用设计素材1
我的钱包-UI界面设计-app
【新年UI图标】影音icon
【新年UI图标】积分icon
【新年UI图标】珠宝icon
拟物风质感写实UI卡片合集源文件
高级感金属拟物 UI设计组件库
矢量立体简约UI蓝白图标
你可能喜欢
大家都在看
登录注册