动效设计不只是美,Material Design涟漪动效如何提升交互质量?

产品: Google猎人: 龙爪槐守望者观众: 5.8k人 时间: 2025-05-19

Google

与「Google」有关的细节还有 42查看全部

我也有新发现 我要投稿
不只是美,Material Design涟漪动效如何提升交互质量?不只是美,Material Design涟漪动效如何提升交互质量?

细节描述

龙爪槐守望者: Material Design 在发布之初就设计了涟漪动效(Ripple Effect)。当用户触摸界面元素时,就像往水中投入一颗石子,从接触点开始以圆形向外扩散至整个界面元素。这种设计让用户能直观感受到界面的响应,增强了操作的确认感和沉浸感。在界面元素较多或信息复杂的情况下,涟漪动效还能有效引导用户关注当前交互的元素,避免误操作或遗漏关键信息。 涟漪动效既然模拟水中投石产生的涟漪,那么老版本仅在用户点击的界面元素内扩散确实显得不够自然。在Material 3 Expressive中,当按住一个元素时,附近的其他通知也会随之产生波动,就像整个手机屏幕成为了一个水池——触碰任意一处产生的涟漪都会带动整个水面上的所有物体运动。界面变得更加流畅和直观,提升了交互的沉浸感。

9.519人评分
收藏 1
分享细节海报

发表评论

{{ moreBtnTxt }}

你可能还爱看

3秒抓住用户眼球!小红书「交换春天」如何用动效点燃互动热情?
小红书

动效设计3秒抓住用户眼球!小红书「交换春天」如何用动效点燃互动热情?

猎人 - Tang9.0

用户在社区互动已经不仅仅局限于简单的点赞和评论。随着内容创作和互动形式的不断丰富,平台的设计也在不断创新,力求通过独特的方式吸引用户的参与,提升用户体验。最近,小红书推出的「...

查看详情

#动效#情感化设计#点赞

惊艳!Google Doodles以地球航拍美景致敬2024世界地球日
Google

设计彩蛋惊艳!Google Doodles以地球航拍美景致敬2024世界地球日

猎人 - AmberDu小白9.2

2024年4月22日,世界地球日如期而至。今年的Google Doodles别出心裁,以地球航拍的水文地貌照片巧妙拼凑成「Google」logo,呈现出一幅幅壮丽画卷,以此突...

查看详情

#Google Doodle#情怀#情感化设计

Siri的界面为什么变成屏幕四周跑马灯?
Siri

设计考古Siri的界面为什么变成屏幕四周跑马灯?

猎人 - 龙爪槐守望者8.0

Siri自2011年推出以来经历了多次界面迭代,其设计演变反映了苹果在交互理念、技术能力和用户需求上的持续探索。iOS 14 采用紧凑式设计风格,来电通知、Siri 都从全屏...

查看详情

#iOS#动效#液态玻璃