UI Interactions and Animations Roundups

There was lots of amazing creative output from the design community in the past couple of weeks so it’s time for a new UI Interactions and Animations roundup! The motto is: relax, chill, slow down your decorative motion but move in that crucial content swiftly! Your users will thank you Dream-like distortions are also a hit: subtle, wavy and water-like animations are a wonderful way to show images and play with typography.

Hope you enjoy this selection and draw lots of ideas from it!

Seek Menu Interactions

by Joe Taylor

Home Page Experience

by Awesomic

Aesthetica Magazine

by Evgeny UPROCK

Layout Archive

by Hrvoje Grubisic

Nectar – CBD Landing Page

by Phenomenon Studio

Landing page concept

by Tamerlan Aziev

The Vasa

by Maria Krtd

Digital agency landing page concept

by Tamerlan Aziev

Hiring: Digital Designer

by Nathan Riley

Slider Exploration

by Ryan

ONE TYPO

by Peter Arumugam

Disegno Journal Redesign Concept. Stories

by Evgeny UPROCK

Chefz – Onboarding

by Martin Maderic

NFT Cats landing page design

by Sergey Antoniuk

Uplinq – Early Concept

by Quintin Lodge

ICEHOTEL – Brand Indentity.

by Evgeny UPROCK

Orchids and Thorns

by The Glyph

Longread interview

by Tamerlan Aziev

Wendy’s Granny Chocolate – Web Design with Illustrations

by Outcrowd

Cryptocurrency website navigation

by Lyashenko

light and light-3-10

by WantLine

Ninja tunes. The Cinematic Orchestra

by Evgeny UPROCK

Crescent – Branding

by Wiktor Buksza

The post UI Interactions & Animations Roundup #23 appeared first on Codrops.

March 5, 2022

UI Interactions & Animations Roundup #22

Another month has passed and we have been busy collecting good inspiration for you! Here’s a fresh roundup of UI interaction shots and animations from the finest designers on Dribbble.

Hope you enjoy it and thanks for checking by!

TRUE Initial Concept

by green chameleon

Red Rocket – Review

by Marvin Schwaibold

Balart studio menu

by Ilsaf Yarullin

2 years

by Mariano Meijome

Tod’s Academy – All Projects

by Basilico

Procedural Grid

by Niccolò Miranda

VILDMARK* – Home Page Card Hover

by Vivien Cseresznyés

Voxel NFT

by Anatoliy

Söhne Website

by Kévin Gautier

JUO Studio Webflow Website

by Halo Dev

365 Magazine

by Ruslan Siiz

Homepage Animation for Melbourne Wooden Showroom

by Vitalii Burhonskyi

Om Swami – Official Website

by Niccolò Miranda

Landingpage carousel

by Jonas Emmertsen

Moooji.co

by Slava Kornilov

Experimental Nike redesign v.2

by Pauline D.

Cyber // E-commerce Website

by blacklead studio

Lazarev. | WE’RE BACK IN BUSINESS

by Lazarev. ux/ui

3D Animation Homepage For A Creativity Workshop Promo

by Vitalii Burhonskyi

Immo Carriere – Web Design for HR & Recruiting Agency

by Outcrowd

Neringa Hotel Website

by Juste Navickaite

The post UI Interactions & Animations Roundup #22 appeared first on Codrops.

February 1, 2022

UI Interactions & Animations Roundup #21

We’re back with a new roundup of the latest, hottest and most creative motion designs from the last month. This time we feel the roundness is going on in many designs and the animations based on these shapes are super interesting.

Remember, when those distortions took off like a rocket ship? Well, those are much more toned down now and we see a lot more sophisticated and meaningful warping and curving going on, which is a good thing.

I hope you enjoy this collection and get up to date with the latest animation trends in web design!

MKTLM

by Roman Salo

Interactive Project Index

by Luca Fasoli

radical.

by Andrew Baygulov

Explorway Web Design

by Juste Navickaite

Woven Planet

by Glenn Catteeuw

condé vilde //

by Andrew Baygulov

Looks like it’s going to rain…

by Ivan Gorbunov

Jarang Macul – Landing Page Animation

by Risang Kuncoro

Moooji NFT

by Slava Kornilov

ATLAS

by Zhenya Rynzhuk

Editorial Landing Page – Cole Haan

by Francesco Zagami

m.vertigo | Gallery

by Ivan Gorbunov

ward //

by Andrew Baygulov

Jam of the Week | 156

by Britton Stipetic

BWE e-commerce website

by Layo

Dala

by green chameleon

Tuning In

by Ali Zafar Iqbal

The Heritage Museum Landing Page Animation

by Vitalii Burhonskyi

Frøya //

by Andrew Baygulov

Expo Dubai 2020 – Canada experience (Homepage)

by Nicolas Bonté

365 Magazine

by Ruslan Siiz

ZeroWaste – Web Design for Recycling Company

by Outcrowd

The post UI Interactions & Animations Roundup #21 appeared first on Codrops.

December 6, 2021

UI Interactions & Animations Roundup #20

Finally! A fresh new set of fantastic UI interactions and animations from great designers! There’s lots of novel ideas to discover and get inspired with. I personally love how grainy texture is used to add some “roughness” to motion along with interesting tilted ideas. Everything screams: go wild!

Hope you enjoy this selection as much as I do and thank you for checking by!

clate//

by Andrew Baygulov

Eraf // Portfolio Website Part 2

by blacklead studio

Primate Microsite

by Daniel Tan

The Future Art: Interactions

by Maxim Berg

Website Design for Flavia

by Mustafa Akülker

Eraf // Portfolio Website

by blacklead studio

Lasvit Concept – Products

by Filip Slováček

Rumble Kong League – Website

by Etheric

Wardrobe // Landing Page

by blacklead studio

Colors Combinations

by Roman Salo

HACKA HACKA – Web & Mobile Design for Hackathon

by Outcrowd

Traveler – Web Design for Travel Agency

by Outcrowd

Landing Page Design and Animation for Nottor app

by Brave Wings

Design Conference Promo Animation

by Vitalii Burhonskyi

Online store «SHINING»

by Lyashenko

State of Mind

by Advanced Team

rvlt.net

by Hrvoje Grubisic

Evoke—Typographic experiment

by Dominik Budimir

GLASS LIZZARD — Homepage

by Glenn Catteeuw

Ether – Web Design for NFT Marketplace

by Outcrowd

3D Hero Banner

by Minh Pham

Joy Toy Website

by tubik

The post UI Interactions & Animations Roundup #20 appeared first on Codrops.

September 27, 2021

UI Interactions & Animations Roundup #19

These past couple of weeks we’ve been collecting some motion gems for you that will hopefully spark some true inspiration! There’s some creative experimentation and novel moves are being explored, so don’t miss out on this roundup that has lots of animation variety. It’s interesting how specific combinations of colors and typography go very well with certain animation speeds and easings, something that, when done right, can bring a web experience to the next level.

I really hope you enjoy this set!

Home Exploration – Quartet Cie

by Thierry Rolin

TAE – Web Design for Travel & Tourism

by Outcrowd

Satellite Landing Page Animation

by Conceptzilla

Shoplon E-commerce UI Kit

by mr.alidoost

Wonderland Photo Collection

by Vitalii Burhonskyi

Arcade Club

by Ruslan Siiz

Nature

by Roman Salo

Essentialism

by Ali Zafar Iqbal

NASA. Main

by Evgeny UPROCK

Insomnia Website Interactions

by tubik

Betabank – Credit Card Product Page

by George Ilushenko

71ST

by Jurica Koletic

Spot Sneaker Store

by Ruslan Siiz

Visvim – Kinetic Type

by Domagoj Štrok

Brand Identity For Hops & Skips beer

by Afterglow

GetFit Landing Page

by Dede Dwiyansyah

Mara Camp Safari Travel website

by Outline2Design

DEKO — Hotel Website Animation

by Alex Tkachev

Fashion photographer website

by Den Potapov

Vinyl – Web Design for Vinyl Store

by Outcrowd

The post UI Interactions & Animations Roundup #19 appeared first on Codrops.

August 23, 2021

UI Interactions & Animations Roundup #18

Let’s start this week with a fresh collection of animation concepts! This roundup is a truly special one: each shot is a unique and exciting exploration of motion with details that will make your creative soul light up! There is lots of inspiration to draw from this set and I hope you enjoy it as much as I did!

Off-School

by Ruslan Siiz

Spark

by Michael Crawford

Message to Ukraine

by Roman Salo

We’re hiring – Digital Designer

by Nathan Riley

Animated 3D bike landing page

by Vitalii Burhonskyi

Glossarie

by Robbert Schefman

Kangol Website ✦ E-commerce. Home page

by Evgeny UPROCK

Flair Website Interaction

by MindInventory UI/UX

Designer’s Portfolio

by Pineapple Studio

Metal pin loop

by Matthew Hall

Discover Qatar Website Design

by QClay

Artence Magazine

by Ivan Gorbunov

Pencils Down

by Michael Crawford

Spott News

by Geex Arts

Juice

by Jacek Janiczak

Alef Estate v.2.1

by Advanced Team

Path – Web Design with Landscape Illustrations

by Outcrowd

Marshmello New Website. Main

by Evgeny UPROCK

UltraDefinition

by Nathan Riley

Bank Of America Website — Rethinking. Business Savings

by Evgeny UPROCK

Vendome Clinique

by Advanced Team

Travel Guide To Mysterious Europe

by Vitalii Burhonskyi

The post UI Interactions & Animations Roundup #18 appeared first on Codrops.

June 28, 2021

UI Interactions & Animations Roundup #17

Vibrant colors paired with organic motion that doesn’t shy away from morphing different shapes and dimensions — that’s the current exciting landscape of UI animations and interactions. There’s something for everybody’s style, so dive in, enjoy and let some inspiration in!

Thanks for checking by!

mightybuilders – Blog Post Animation

by Vivien Cseresznyés

Identity Crafter

by Michael Crawford

Gallerie dell’Accademia di Venezia. Museum hall

by Evgeny UPROCK

Personal Portfolio Website

by Saad Ibn Sayed

Your Other Life

by Michael Crawford

Mercedes-Benz redesign. Goodbye, sir stirling!

by Evgeny UPROCK

Sporty & Rich Gallery

by Megan Milosevich

Event Management App Interaction

by Cuberto

mightybuilders – Article page animation

by Vivien Cseresznyés

okaybutcolor – Interaction

by Anton Pecheritsa

Focus Lab YouTube

by Bill Kenney

Home Page | InteriorLAB

by Victor Work

Exploration website

by Matthew Hall

Wendy s Cookies Website

by Dannniel

Expolight

by Advanced Team

Dancing on Air

by Irakli Nadirashvili

UI Concept #3

by Nino Lekveishvili

SNEAKERS – HOMEPAGE

by Hervé Rbna

WebGL Morphing Geometry

by Andrew Encharm

Travelo – Personalized Trips Operator

by Metacarbon

Blog Concept

by Irakli Nadirashvili

The post UI Interactions & Animations Roundup #17 appeared first on Codrops.

May 18, 2021

UI Interactions & Animations Roundup #16

It’s time for some fresh animation inspiration! I’m very happy to share this collection of great UI interaction ideas with you, it’s full of fantastic works that will hopefully give you that creative spark for new ideas

That floral cursor just swept me off my feet!

Please enjoy and thank you for checking by!

Interactive Studio Site

by Dh:pu Mathew

Ktech landing page interaction

by Taras Migulko

Expeditions Website Design

by tubik

Lokoto — fashion boutique. Home page

by Evgeny UPROCK

Kenzui – Mobile Educational App Design

by Outcrowd

mightybuilders – Scroll animation

by Vivien Cseresznyés

HM002: Flokka

by HYPEMOTION

Portfolio: Turi Løvik Kirknes

by Francesco Zagami

Marcus Eriksson – Index

by Yaël Bienenstock

Making Waves

by Victor Erixon

Oxymoron – Temp Website

by Filip Slová?ek

A Social Network For Giving – UI

by Nino Lekveishvili

Photographer Personal Brand Website

by Cadabra Studio

ZAiW Untitled

by Rolf Jensen

Boutique Florists Cursor Exploration

by Calvin Smith

Image Carousel

by Matthew Hall

Drinks Ecommerce Website

by tubik

KULT

by Max Demin

Four Seasons. Bora

by Evgeny UPROCK

Portfolio Refresh

by Michael Crawford

Pre Loader

by Matthew Hall

Journal Digital Experience

by Francesco Zagami

PayPal. Overview

by Evgeny UPROCK

The post UI Interactions & Animations Roundup #16 appeared first on Codrops.

March 31, 2021

UI Interactions & Animations Roundup #15

After many weeks of collecting some interesting UI interaction shots, it’s now time to share it with you! Some super cool trends are emerging; from swirly motion to visual repetition and infinite depths, there’s lots to explore and draw inspiration from!

I really hope you get some fresh ideas from this set.

Si Design & Dev | Paris & Co Iteration 001

by Shaban Iddrisu

Intergalactic Disassociation

by Michael Crawford

GoDaddy Online Store

by Rolf Jensen

Realistic Expeditions

by Ali Zafar Iqbal

Crypto Art Landing Page Animation

by Igor Pavlinski

Product Landing Page Experience

by Francesco Zagami

Presence Lessons

by Slava Kornilov

One step at a time…

by Fontfabric

Rogue Site Update

by Britton Stipetic

Planet X landing page

by Manoj Rajput

Estliving

by Hrvoje Grubisic

Branding Inspiration Platform

by Hrvoje Grubisic

Modular Architect

by Roman Salo

Layout (006) – Kombu® Art, Design & Culture Magazine

by Robbert Schefman

Layout Exploration

by Hrvoje Grubisic

Depth

by Vladimir Biondic

Confidence

by Vladimir Biondic

Floral

by Giorgi Gelbakhiani

Defund Tigray Genocide Site

by Rolf Jensen

Teennovate Interactions

by Maxim Berg

From Works to Single Project

by Francesco Zagami

Paul & Henriette — 002

by Aristide Benoist

The post UI Interactions & Animations Roundup #15 appeared first on Codrops.

February 5, 2021

UI Interactions & Animations Roundup #14

Here is a fresh roundup of the latest UI animation trends from Dribbble for you! We’ve selected some exceptionally stylish interactions that show some really nice, experimental motion concepts and animation ideas.

We hope you enjoy this set and get some inspiration for your next project!

Perfumery Product Page Animation

by tubik

The store Skin care Issue 81

by Barbara Skrodzka

WebGL And Webflow Exploration

by Thapelo Marumo

Onboarding text effect

by Gleb Kuznetsov

Anomaly Home

by Vedad Siljak

Marvel. Main page. Free digital comics

by Evgeny UPROCK

Elevated Interior Design Slider | June Homes

by Ion (Ivan) Shipilov

Alignment

by Roman Salo

Anomaly About Page

by Vedad Siljak

Automotive website

by Roman

Folio 2021 — 01

by Aristide Benoist

Lookbook Experience

by Francesco Zagami

Fashion Brand Website

by tubik

Silver & Gold Feed

by Armand Chakhalyan

Wakun /2-2

by Lukas Kus

Expolight 1st Concept

by Advanced Team

New World Carousel Animation

by Armand Chakhalyan

Four Seasons. Main Page

by Evgeny UPROCK

Defund Tigray Genocide Site

by Rolf Jensen

Bowers & Wilkins. Two Concept of Main Page

by Evgeny UPROCK

trashtalk® Interior Studio N° 07

by Pierre Borodin

Slidebean – Homepage (1 of 3)

by Quintin Lodge

The post UI Interactions & Animations Roundup #14 appeared first on Codrops.

December 20, 2020

UI Interactions & Animations Roundup #13

Lots of fantastic new animation concepts have been shared in the last couple of weeks with some shiny trends, lovely 3D effects and amazing immersive interactions.

We hope you enjoy this set and get updated with some fresh trends and ideas in UI interactions and animations.

2DOX Website Loader

by Halo Web

Luxam 3D Museum Scene

by Advanced Team

SQuarE

by Jacek Janiczak

Wine + Peace · Manifesto and Footer Homepage

by Pierre-Jean Doumenjou

Doonbeg—Golf Club

by Hrvoje Grubisic

Burger Menu animation

by Givi Dautashvili

Software Developer Website Interaction

by Cuberto

3D slider concept

by Hrvoje Grubisic

Lewa House – Early Concept

by Jack Harvatt

Naba Zabih Folio

by Zhenya Rynzhuk

Default Cube PRO

by Oleg Frolov

Lewa House Concept

by Nathan Riley

Méribel – posters

by Konstantin Yakovlev

kicks editorial

by Hampus Öhman

Instagram Social Widget

by Francesco Zagami

Landing page web design & interactions for Qoorio

by Vilius Vaicius

Motion Exercise N°008

by Bastien Allard

Bento 3D Design Vol.3

by Kirill Emelyanov

E-Commerce Web Interaction – Domingo

by Daniel Tan

Clothes Brand Website Design

by tubik

CUYANA — Store

by tokitoshi

The post UI Interactions & Animations Roundup #13 appeared first on Codrops.

November 17, 2020

UI Interactions & Animations Roundup #12

It’s time to share a new roundup of UI interaction and animation concepts with you! We’ve collected some fresh and super-hot shots that will give you an idea of current trends and some good motion inspiration. Check out those awesome icon animations, playful text warps and fun 3D rotations—they are super trendy these days!

Glasses

by Ruslan Siiz

TAKASHO debut

by Boro | Egor Gajduk

Ocean agency – home page load and scroll

by Juraj Molnár

Icons 3D

by Outcrowd

Marqeta Homepage

by Clay: UI/UX Design Agency

Berlin Music Awards

by Viacheslav Olianishyn

Header slider idea

by Hrvoje Grubisic

ORE Contact Page Animation

by Zhenya Rynzhuk

Inside intro animation

by Gil

Animated Icons for Maslo Mobile App

by Igor Pavlinski

Wine + Peace · Slider Winemaker Homepage

by Pierre-Jean Doumenjou

Uniform Wares. Watch website WIP design

by Daniel Montgomery

makemepulse website – Landing page focus

by Louis Ansa

Photography Contest Website Interactions

by tubik

ORE Image Grid Animation

by Zhenya Rynzhuk

Avalanche

by Advanced Team

W/2 – Interaction

by Anton Pecheritsa

Brand Experience

by Francesco Zagami

Endplan – Logo Animation

by Michaela Fiasova

Beginnings – Collections Slider

by Tom Anderson

The post UI Interactions & Animations Roundup #12 appeared first on Codrops.

October 22, 2020

UI Interactions & Animations Roundup #11

Today I’m happy to share another big UI animations roundup with you! Get inspired by these great concepts for website interactions and effects and see what’s in fashion these days.

I hope you enjoy this selection as much as I do and that it gets you up-to-date with the current motion trends!

If you’d like to see one of your shots featured here, don’t hesitate to get in touch with us.

Cargo Logistics Website Navigation

by Hrvoje Grubisic

Stop Plastic FAQ Page

by tubik

Quan landing page

by Lukáš Stra?ák

Archives® Experimental Animation

by Hrvoje Grubisic

Data planet

by Berezhnoy Eugene

Ringba Telecom Website Product Page Scroll

by Igor Pavlinski

Ginsburg

by Rokk Ebol

Ancient Art Museum Landing Page

by Kevin Pham

FWWA – Website Expl No. 1

by Rron Berisha

Personal Portfolio – 2021

by Denislav Jeliazkov

IBM: What’s Next in Computing

by Zhenya Rynzhuk

Tubular Concept 3 [Motion]

by David Kovalev

Tiny Porcelain – Concept art direction

by Tom Anderson

Origin2

by Zak Steele-Eklund

Landing page concept with zoom-in transition

by Minh Pham

IBM Research Website Hover Animation

by Zhenya Rynzhuk

Venue Faces—Interaction

by Hrvoje Grubisic

App Rating – MVP

by Lukáš Stra?ák

Hero Image Transition Experiments

by Zhenya Rynzhuk

Carousel Transition

by Francesco Zagami

Lighthouse – Custom Statue Store

by Malik Abimanyu

Task composer interactions

by Jakub Antalik

Header slider concept

by Hrvoje Grubisic

The post UI Interactions & Animations Roundup #11 appeared first on Codrops.

September 22, 2020

UI Interactions & Animations Roundup #10

Today we have a new interactions and animations roundup filled with fresh motion goodness for you! Flowy grids, organic shape animations and on-scroll fun mark this new set and we’re very excited about all the amazing inspiration!

Hope you enjoy this, too!

Sold&Sesy – Micro

by tokitoshi

Video Main

by Slava Kornilov

Curology

by Jonathan Vuijk

Arch – Homepage Motion

by Adarsh Goldar

Ring Homepage

by Rolf Jensen

Digital Exhibition of Shapes

by Zhenya Rynzhuk

Wiels — Contemporary Art Center — Events

by Glenn Catteeuw

Meilleur — Website

by tokitoshi

World of Shapes Animation with 3D objects

by Zhenya Rynzhuk

Docket note (Side menu)

by Ariuka

FOMU — Fotomuseum Antwerp — Carousel

by Glenn Catteeuw

Forest Planet

by Matthew Hall

Portfolio Interactions

by Tom Anderson

Archy – Interior agency website

by Yogie Ismanda

Landing page for gold jewelry website

by Artem

Ramenny web landing product page UI interaction

by Taras

physics 3D landing page concept

by Minh Pham

User Experience – Design Concept

by 00.032

OpenColony Marketing Website

by Ramotion

Web site — Ason Pottery

by Denys Boldyriev

Cobalten – Furniture Landing Page Animation

by Fauzi Akmal

Abstract 3D

by Kirill Emelyanov

The post UI Interactions & Animations Roundup #10 appeared first on Codrops.

August 4, 2020

UI Interactions & Animations Roundup #9

Slow down, tiger! That seems to be the motto in these past weeks in motion design and it’s certainly a good one. Away from too much noise, animations express a kind of tranquility these days that bring some Zen into busy layouts.

But let’s not shy away from some fun (gooey) playfulness, which is most fitting for mobile interactions.

And as always, don’t be afraid to be a rule-breaker when it comes to motion trends!

We really hope you enjoy this new collection and find it inspiring!