UI Animations, Gamification & Microinteractions

This hub covers the polish layer: animations, gamification (streaks, rewards, progress rings), haptics, and microinteractions that make an iOS app feel alive. Build the screens from a free VP0 design and add motion that communicates state, respecting Reduce Motion and accessibility.

What this hub covers

Animations and motion
Gamification and streaks
Microinteractions and haptics
Lottie and Reanimated
Accessible motion

Guides in this hub (14)

Dumb Phone Mode Toggle with Animation for iOS

Build a dumb phone mode toggle for iOS: a deliberate SwiftUI switch animation, a stripped minimal launcher, plus the supported way to drive grayscale and Focus.

Cat Laser Pointer Game with Auto-Move for iOS

Build a cat laser pointer game with auto-move for iOS in SpriteKit: randomized prey paths, haptics on catch, and honest, cat-friendly safety guards.

Tinder super like star animation in React Native (Reanimated)

Build a Tinder super like star burst in React Native with Reanimated. Here is the burst, how to wire it to the like action, and when to use Lottie instead.

Live Trivia Game UI Clone: HQ Trivia Pattern Guide

How to clone the HQ Trivia live game UI: synchronized countdown, answer lockout, elimination states, and the honest line between UI and live infrastructure.

Duolingo-Style Progress Ring Animation on iOS (SwiftUI)

A Duolingo-style progress ring is one trimmed circle, animated. Here is the SwiftUI pattern, the rounded-cap detail, and how to drive it without redrawing.

Wheel of Fortune Spinner UI Template for iOS

A free SwiftUI spinner pattern: a smooth spin that lands fairly on a segment, with disclosed odds, Reduce Motion support, and no pay-to-spin. A reward, not gambling.

Confetti Cannon Animation in SwiftUI (Free Pattern)

A confetti cannon celebrates a real win with a burst of particles. Build it in SwiftUI, fire it only on genuine success, and respect Reduce Motion.

Duolingo-Style Streak Flame Animation in SwiftUI

Build a Duolingo-style streak flame animation in SwiftUI: a flame that grows with the streak and celebrates a daily win, from a free VP0 design.

Custom Haptic Patterns With Core Haptics in React Native

Add custom haptic patterns to a React Native app with Core Haptics: tap, buzz, and bespoke textures, from a free VP0 design. Tasteful, restrained feedback.

Leaderboard Podium Animation for iOS (Free SwiftUI Pattern)

Build a leaderboard podium that ranks your top three with a satisfying rise-into-place animation in SwiftUI, accessible and free, starting from a VP0 design.

Lottie vs Rive for React Native Animations

Lottie and Rive both add rich animation to React Native, but they solve different problems. A clear comparison, plus how to pair either with VP0.

Meditation Breathing Circle Animation in SwiftUI

Build a calming breathing-guide animation in SwiftUI: a circle that expands and contracts to pace breathing, with haptics, from a free VP0 design.

Rive Interactive Button in React Native

Build an interactive button with Rive in React Native: idle, press, loading, and success states in one animation, from a free VP0 design.

Tinder-Style Swipe Trivia UI in React Native

Build a swipe-to-answer trivia game in React Native: card-stack questions, swipe for true or false, and snappy feedback, from a free VP0 design.

Related topic hubs

React Native & Expo: Mobile Frontend Architecture Native Apple & SwiftUI: The iOS Ecosystem Free iOS Templates, UI Kits & Components Vibe Coding: iOS App Template Strategy Native Hardware, Sensors & Device Features Web3, Telegram Mini-Apps & Crypto UI AI App Builders & Vibe Coding Tools App Store Publishing, Build Errors & Deployment B2B, Enterprise, Healthcare & Industry Apps Compliance, Localization & Accessibility Maps, Location, Mobility & Delivery UI Payments, Monetization & Regional Fintech Backend, Auth & Data Integrations AI/ML Product Templates & Agentic UX AI App Builders: Pricing, Code Ownership & Shipping Framework & Component Library Authority Core AI UI Component Authority AI UI & Component Tool Alternatives and Comparisons Enterprise SaaS & Compliance UI AI IDE & MCP Integrations Backend-Connected UI Systems Mobile App UI & Super-App Templates Design-to-Code & No-Code Migration Advanced Interaction & Spatial UI AI Agent & Local AI Interfaces Programmatic SEO & Conversion Components The Vibe Coding Operating System

New here? Start with the VP0 Journal, or browse free iOS components. VP0 is the free iOS design library for AI builders, copy a design and your AI tool rebuilds it in SwiftUI or React Native.