Discover the best after-effects websites created by professional designers. Get inspired and start planning your perfect after-effects web design today!

WebDev For You

This demo showcases a circular slider with animated panels in the background. The panels were created in After Effects and triggered via a slider element in Webflow. The main slider was also linked to a secondary slider that showcases text. The sliders were linked together via custom code.

Inspired by the following Dribbble shot from Keshav Dev: https://dribbble.com/shots/12128648-Wildlife-Shot-Animation

WebDev For You - Interaction #143

This demo showcases an animated SVG/Lottie menu that comes in from the right to the left. The animation path was created in Adobe Illustrator and then animated in Adobe After Effects. Afterward it was brought into Webflow and the animation was triggered alongside a menu opening. Animations were also added to the open and close buttons as well as to the menu items in the menu.

WebDev For You - Interaction #141

Hi everyone! I built this website from a design concept by Zak Steele-Eklund from Studio VØR. Here is their dribbble page: https://dribbble.com/studiovor

The designs by Studio VØR have a lot of great illustrations and animations, so it was fun building this in Webflow to showcase the power of Webflow, and just how much you can do with it :).

Here is a video tutorial of how I built the website:
https://www.youtube.com/watch?v=-R9UO_eNQDg

Happy Webflowing :).

webdev-for-you-krai-by-studio-vor

This demo showcases a multi-slider animation with micro-interactions for the previous and next buttons.

The micro-interaction for the slider arrows was created in After Effects, and custom code was added to trigger multiple slides at once.

WebDev For You - Interaction #142

Camila Gomes

Published: https://www.lummo.com.br/

Portfolio: https://www.behance.net/camilacgomes

lummopantastica

This is a menu that reveals from the upper-left and the upper-right. They remind me a bit of like curtains coming in. There are many variations for this menu that I can think of as far as design and adding different elements. One example could be to add different textures or images to the panels as they come in, or trying different color variations for the panels. I kept it simple for this one to showcase the concept. 

The menu animating in was built with Webflow Interactions. The rotating text inside of the menu was built with Illustrator, After Effects, and Lottie.

To learn how to build this menu from scratch check out the subscription :).

WebDev For You - Interaction #139

Gigantic

We make films that captivate viewers, shape our modern culture, and resonate for years to come. Explore the creativity of film, commercial, and new media.

Independent Media

Sam Brandhildh

A bar called Gemma - One of the most loved bars in the heart of Stockholm, Sweden.

A bar called Gemma

Straight lines out, wavy lines in!

Learn how to create unique underline animations using Illustrator, After Effects, Lottie, and Webflow!

You might need a pretty unique design to make this wavy line animation work for your site, but using the tips and techniques covered in the video tutorial you'll be able to create any type of line for your menu underline animation.

Three different versions included in the demo.

webdev-for-you-interaction-137

Martin Schulze-Schilddorf

Whole animation is created in After Effects und implemented in Webflow as Lottie file.

Scrollable Info-Graphic (Animated)

This demo showcases an animal conservation header in Webflow. It is for a video tutorial that I created on my YouTube Channel. 

This demo incorporates the following:

-An intro with a logo animation created in After Effects and added with Lottie
-A Slider
-Animated headings when the slides change
-A Lightbox link with the background color of the site
-Elements added with Grid and Flexbox

You can watch the video tutorial here:
https://www.youtube.com/watch?v=VFBVh9FqDdA

WebDev For You - Animal Conservation UI

He’s back!

I’ll admit, an interaction a day was a bit ambitious. I had to take a nice break to re-think how I wanted to share new content. After some time I am re-introducing the interactions, but this time they will be weekly instead of daily. I might throw in an extra 1 or 2 in a week if I’m feeling inspired.

The other thing you will note with these interactions is that the video tutorials are no longer free on YouTube. The interactions and video tutorials take time to create and craft, so there is now a subscription where you can receive a weekly video tutorial on how to create the interaction of the week. Now that Webflow has introduced Lottie as a feature we will be using Adobe Illustrator and After Effects to create really unique and sophisticated interactions.

Thanks everyone for all the kind words and feedback on the interactions. I do have a lot of fun creating them and am happy to be sharing them again :).

Best,
John

WebDev For You - Interaction #136

Let user's know where they are on a page with this unique Lottie scroll indicator!

WebDev For You - Interaction #138

JP Dionisio

This is my 2nd personal website as a Weblfow Designer.

I explored with animating Divs to create light animations within a website.
Lottie files will also populate the site in the future. Haha

I'm still developing this site along the way.
See my previous version here:
https://jpthedio-space.webflow.io

Here's my current website:
https://jpthedio.com

I'm based in Metro Manila, Philippines.

Feel free to clone this.
Enjoy!

JPtheDio (Dog World)

This demos showcases animated shapes for slide indicators. The animations were created in After Effects and then brought into Webflow. They were then triggered to play when a slide comes into view.

WebDev For You - Interaction #149

This demo showcases a menu button animation on click. The button morphs into a close button.

To learn how to create this interaction visit the video tutorial here: https://www.youtube.com/watch?v=hGbpAChCplM

Inspired by the Codrops buttons here: https://tympanus.net/codrops/2021/02/17/ideas-for-css-button-hover-animations/

WebDev For You - Interaction 152

Edward Hendry

Hey, this is my portfolio of motion design, animation, graphic design and Illustration.

ed-hendry-portfolio

WonderUp

Our humble beginnings: this was our very first site.

Just a simple one-pager that would evolve into the site we have today, it's always fun to look back at our past and think about how much we've grown in such a short time. 

Our focus is on our WonderUp 3.0 site now...

Wonderup 1.0

102976941

1070795817

1122423150

1186914386

1274323923

1316201488

1316201489

140432223

1462086697

1506258256

1567550242

1592612642

1631162196

1726628865

1733785607

173927913

1771795565

1863160016

1905118106

1975670756

2025032126

2030598753

Unlock more for your business with the Agency Workspace plan

Get direct access to benefits like unlimited staging sites and more control over roles & permissions

2032141491

2037807691

2144870841

2213518682

2216482092

2339906037

2351366352

2355632600

https://s3.amazonaws.com/webflow-dev-assets/66fd83b6cc0c8c6ed0e398e6%2Fcontent.json

2401116685

2486364096

gpt-4o

gpt-4.1

gpt-4o-mini

2546957535

2789269995

285302288

2857348505

2903381045

User Accounts will no longer be available on January 29, 2026.

Visit Webflow’s Help Center for migration guidance and more info.

3022611874

3023147062

3026881092

307653616

3106924665

3108168977

3112069432

3120801339

3151661775

3201643127

3243842104

3258716925

3266482432

3289310561

3313039722

3315729993

3387258362

3410497685

3452464914

3458155273

gpt-4.1-mini

3590523401

3591394191

3672367630

3737116140

3801251705

3844506029

3879263312

Learn best practices for collaborating with clients in Webflow.

Sell your apps on the Webflow Marketplace.

Learn about structuring seats, roles, and permissions in your Workspace

Partner with Webflow to build your business alongside 2M+ creators and developers

Request access for your team to collaborate in a client’s Workspace.

Charge your client for a Site plan directly in Webflow.

Earn more by selling templates on the Marketplace.

Start building your site with AI, a prebuilt template, or from scratch.

Add your team members to start collaborating on sites.

Watch a quick intro to what you can build in Webflow.

3913199261

3934148661

3941255684

3956476210

4063605209

4092855684

4103643638

4144203485

4206156914

451433404

489463363

504462606

536101258

612788821

622649767

622649768

644270296

657188092

660615456

665836192

737109165

772001133

817414265

846847440

882147072

911514507

938734410

1003029853

1045828939

1049811722

1087856901

1088396327

1093574045

1099435904

1108325183

1120744071

1131151533

1140906369

1147278396

1157311889

1157563538

1178238107

1178621510

1193740135

1197475705

1209008581

1216878544

1227154495

1229056119

1234765101

1236803103

1238404733

1250328847

1259889605

1291427916

1292405251

1297066426

130043074

1306352991

1312703771

1322655470

1323044307

1325953834

1336067073

1337084289

1350250754

1362856608

1365408040

1380896143

1406455659

1418395020

1433303746

143629253

Best After Effects Websites | Free Examples & Designs

Discover After effects websites
built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. Looking for templates?

Discover After effects websites built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. Looking for templates?

Discover After effects websites
built by the Webflow community