BestHub
Sign in
Tagged articles

UI animation

18 articles · Page 1 of 1
Geek Labs
Geek Labs
Sep 23, 2026 · Frontend Development

Teaching AI Design Taste: 38k-Star Skill Pack for Polished UI Animations

The emilkowalski/skills project (38.1k stars) distills a Vercel design engineer's decade of experience into 13 Markdown skill files that teach AI coding tools like Claude Code and Cursor concrete animation rules — easing curves, durations, performance pitfalls, and Apple's fluid interface principles — so AI-generated UIs gain polished, native-feeling interactions.

AI-assisted developmentClaude CodeCursor
0 likes · 14 min read
Teaching AI Design Taste: 38k-Star Skill Pack for Polished UI Animations
IT Services Circle
IT Services Circle
Jul 26, 2026 · User Experience Design

A Distilled Apple‑Style Design Skill with 10.5K GitHub Stars

The article introduces the open‑source apple‑design Skill from the emilkowalski/skills repository (over 10.5 K stars), explains its 17 Apple‑inspired design principles covering animation, tactile feedback, material, layering and typography, and shows how AI agents can use the Skill to generate or audit UI interactions with concrete command‑line examples.

AI AgentsApple designUI animation
0 likes · 6 min read
A Distilled Apple‑Style Design Skill with 10.5K GitHub Stars
Architect's Tech Stack
Architect's Tech Stack
Jul 20, 2026 · Frontend Development

Recreating Apple‑Style UI with the Open‑Source Skill Library (18.3K Stars)

The article introduces Emil Kowalski’s Apple‑design Skill, explains how it decomposes the hardest parts of the Apple Human Interface Guidelines into actionable rules, shows a quick npx installation, demonstrates responsive UI components, and highlights the library’s focus on precise feedback, physics‑based animation, and material depth.

Apple UIGitHubSkill Library
0 likes · 4 min read
Recreating Apple‑Style UI with the Open‑Source Skill Library (18.3K Stars)
Mashang Consumer UXC
Mashang Consumer UXC
Nov 12, 2024 · Frontend Development

Why Motion Design Matters: Boosting UX with Effective Animations

This article explores the importance of motion design in product interfaces, detailing its benefits such as reduced learning cost, brand differentiation, user conversion, and engagement, while providing practical guidance on tools, optimal animation durations, physical motion principles, output formats like GIF and Lottie, and effective handoff documentation for developers.

GIFLottieUI animation
0 likes · 9 min read
Why Motion Design Matters: Boosting UX with Effective Animations
Zhixing ZXD Design Center
Zhixing ZXD Design Center
Mar 26, 2024 · Product Management

What Can We Learn from Top App UI Animations? 6 Real-World Design Cases

This article showcases six recent UI animation case studies from popular Chinese apps—Gaode, Meituan, Didi, Tongcheng, Xianyu, and Didi Carpool—detailing their design techniques, user feedback mechanisms, and AI integration to inspire designers seeking effective, engaging product experiences.

UI animationcase studyinteraction design
0 likes · 6 min read
What Can We Learn from Top App UI Animations? 6 Real-World Design Cases
58UXD
58UXD
Mar 1, 2023 · Mobile Development

Master Mobile UI Animation: Motion Curves, Consistency Tips & Essential Scripts

This article explains why UI motion effects are crucial for mobile apps, details the four main animation curves, shares practical techniques for maintaining animation consistency, recommends After Effects scripts for curve adjustment and batch keyframe copying, and outlines export formats and duration guidelines.

After EffectsMobile DevelopmentUI animation
0 likes · 8 min read
Master Mobile UI Animation: Motion Curves, Consistency Tips & Essential Scripts
Sohu Tech Products
Sohu Tech Products
Nov 17, 2021 · Mobile Development

Implementing a Carousel with MotionLayout in Android

This tutorial explains how to create a smooth, animated carousel in Android using MotionLayout and its Carousel helper, covering core concepts, state definitions, XML layout and MotionScene configurations, Kotlin adapter implementation, and practical tips for handling view ordering and visual effects.

AndroidCarouselConstraintLayout
0 likes · 14 min read
Implementing a Carousel with MotionLayout in Android
Sohu Tech Products
Sohu Tech Products
Jul 14, 2021 · Mobile Development

MotionLayout Tutorial: Creating Advanced UI Animations for Android Apps

This article provides a step‑by‑step guide on using MotionLayout in Android, covering dependency setup, layout and MotionScene creation, defining start and end states, adding keyframe animations, gesture handling with OnSwipe, and common attributes for building complex UI transitions.

AndroidConstraintLayoutMobile Development
0 likes · 22 min read
MotionLayout Tutorial: Creating Advanced UI Animations for Android Apps
We-Design
We-Design
Feb 25, 2021 · Frontend Development

How Dynamic Design Transforms Mobile UI: Principles for Seamless Interactions

This article explores how dynamic design—rooted in animation principles from film and nature—enhances mobile user interfaces by clarifying page relationships, highlighting important information, adding warmth to interactions, and providing practical guidelines such as elasticity, easing, anticipation, and fine‑grained details.

UI animationUX Principlesdynamic design
0 likes · 9 min read
How Dynamic Design Transforms Mobile UI: Principles for Seamless Interactions
Ctrip Technology
Ctrip Technology
Nov 14, 2019 · Mobile Development

Exploring Easing Curves: Physics‑Based Animation, Common Curves, MATLAB Curve Fitting, and Linear Interpolation for iOS Apps

This article examines why easing curves matter for user experience, derives them from physical formulas, presents common easing functions with full source code, analyses Apple ScrollView dynamics using MATLAB curve fitting, and demonstrates how to recreate app animations through linear interpolation and practical tooling.

AnimationMATLABPhysics
0 likes · 19 min read
Exploring Easing Curves: Physics‑Based Animation, Common Curves, MATLAB Curve Fitting, and Linear Interpolation for iOS Apps
ITPUB
ITPUB
Dec 28, 2015 · Frontend Development

How to Compute and Draw the One‑Click “Dismiss” Effect with Bezier Curves

This tutorial explains the geometric derivation and step‑by‑step algorithm for calculating the tangent points of two circles of different radii and using them to construct quadratic Bézier curves that create the popular one‑click dismiss animation on mobile interfaces.

Bezier CurveMobile UITouch Interaction
0 likes · 9 min read
How to Compute and Draw the One‑Click “Dismiss” Effect with Bezier Curves
JD.com Experience Design Center
JD.com Experience Design Center
Aug 11, 2015 · Frontend Development

Why Motion Design Matters: Boosting UX with Smart Animations

The article explores the importance of motion design in product interfaces, detailing how thoughtful animations can enhance comfort, reduce friction, add delight, maintain attention, and subtly improve feedback, while providing practical examples and guidelines for effective UI animation.

UI animationfrontendinteraction design
0 likes · 8 min read
Why Motion Design Matters: Boosting UX with Smart Animations