• About Us
  • Privacy Policy
  • Disclaimer
  • Contact Us
AimactGrow
  • Home
  • Technology
  • AI
  • SEO
  • Coding
  • Gaming
  • Cybersecurity
  • Digital marketing
No Result
View All Result
  • Home
  • Technology
  • AI
  • SEO
  • Coding
  • Gaming
  • Cybersecurity
  • Digital marketing
No Result
View All Result
AimactGrow
No Result
View All Result

Developer Highlight: Max Barvian | Codrops

Admin by Admin
April 25, 2025
Home Coding
Share on FacebookShare on Twitter


In previous Developer Spotlights, weโ€™ve featured devs whoโ€™ve pushed the craft of constructing award-winning web sites. However internet growth is extra than simply translating nice designโ€”Max Barvian is a type of pioneering devs who’ve a deep understanding of the core mechanics of frontend growth. In 2024, he shared one of many coolest CSS-powered, scroll-driven animations with us right here on Codrops. We are able toโ€™t shine the sunshine sufficient on Max, as his work represents the subsequent frontier in internet growthโ€”one which merges deep technical data with artistic experimentation.

Hello! My identify is Max Barvian. Iโ€™m a UI engineer at the moment working at Clerk.

Initiatives Iโ€™m happy with

NumberFlow

NumberFlow is an animated quantity element for React, Vue, Svelte, and vanilla TS/JS. It was closely impressed by the quantity animations within the fantastic Household app:

The inspiration for NumberFlow. Video by Benji Taylor.

I constructed NumberFlow as a customized factor with wrapper elements for every framework. All of the animations are powered by the Net Animations API (WAAPI). It makes use of the FLIP method, registered customized CSS properties, spring-based linear() timings, new CSS math capabilities, and composited KeyframeEffects for higher interruption dealing with.

The response to NumberFlow has been surreal. ๐• is at the moment utilizing it for his or her analytics dashboard, and Elon Musk even retweeted this screenshot of it:

barvian.me

When it got here time to rebuild my portfolio final 12 months, my aim was to make some mixture of Godly and the Apple TV residence display. Iโ€™d actually wished a web site like that for years, with a grid of undertaking movies that easily transitioned into element pages, however by no means felt assured about pulling it off. Then I discovered the View Transitions API. Regardless of its shortcomings (i.e. no interruption dealing with), it felt like the right software for the job. View Transitions utilizing snapshots of โ€œoutdatedโ€ views appeared good for the video grid, and meant I wouldnโ€™t have to fret about animating a bunch of components on the similar time. Finally, I had to make use of a number of extra tips to get respectable efficiency in the course of the transitions, however I nonetheless canโ€™t think about having constructed the positioning with the rest. I used to be honored when Googlers Addy Osmani and Una Kravets shared my little web site as a demo for View Transitions.

Musรฉe

I stumbled upon this unimaginable design by Kevin Pham on Dribbble a pair years in the past and instantly fell in love with it. I had wished to experiment with CSS Scroll Snapping and 3D scenes for some time, and this appeared like the right candidate. I ended up utilizing React Three Fiber, Movement for React, and Tailwind to implement it. Itโ€™s not good (thereโ€™s a pesky bug with cellular Safari on the final slide that I havenโ€™t been in a position to repair), however Iโ€™m fairly pleased with the way it turned out. I used to be honored when Guillermo Rauch, Paul Henschel, Matt Perry, and Three.js all reposted it.

Fluid kind initiatives

This work might be probably the most boring on the record however Iโ€™m nonetheless pleased with it. I used to be engaged on a Tailwind plugin for CSS clamp() after I encountered some longstanding accessibility points with fluid kind. I didnโ€™t need to deliver these points into my plugin, so I spent an entire Sunday watching math movies on YouTube and speaking to my physicist brother to determine the way to work round them. I ultimately printed the leads to Smashing Journal with some assist from their nice editors there, and was honored to see Adrian Roselli reference the work in his authentic article. Utopia, a well-liked fluid clamp generator, additionally built-in the findings into their software.

About me

I bought into artistic growth in a seventh grade journalism class, when my instructor made me the webmaster for our faculty newspaper. I requested my mother and father for Dreamweaver that 12 months for Christmas and bought my first freelance consumer a 12 months after that. Iโ€™ve since moved on from Dreamweaver ๐Ÿ™‚, however Iโ€™ve by no means wished to do the rest professionally. I really feel fortunate that Iโ€™ve been in a position to make a profession out of my ardour.

Present challenges

At Clerk Iโ€™m engaged on constructing the element library we use for our dashboard. Itโ€™s been a enjoyable problem to attempt to construct one thing that equally emphasizes UX and DX! I hope to share extra on ๐• because it progresses. React Aria Parts has been an enormous inspiration right here.

Instruments

I principally stay in VS Code writing React, Tailwind, and Movement code all day.

Philosophy

Somebody I comply with on ๐• thought NumberFlow was a superb instance of a quote by Charlie Munger:

โ€œTake a easy concept and take it critically.โ€
โ€”Charlie Munger

Thatโ€™s caught with me over the previous few months, and I feel itโ€™s elevated my enjoyment of initiatives I beforehand wouldโ€™ve dismissed as too routine or boring.

Itโ€™s an honor to be featured on a web site Iโ€™ve been studying my complete profession. Thanks so much, Manoela and the Codrops workforce!

Tags: BarvianCodropsDeveloperMaxSpotlight
Admin

Admin

Next Post
What We Beloved (And Hated) About The Marathon Alpha

What We Beloved (And Hated) About The Marathon Alpha

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Recommended.

Wi-Fi 6 vs. Wi-Fi 6E vs. Wi-Fi 7: What are the variations?

Wi-Fi 6 vs. Wi-Fi 6E vs. Wi-Fi 7: What are the variations?

March 26, 2025
Bing Webmaster Instruments Provides AI Quotation Efficiency Knowledge

Bing Webmaster Instruments Provides AI Quotation Efficiency Knowledge

February 10, 2026

Trending.

AI-Assisted Menace Actor Compromises 600+ FortiGate Gadgets in 55 Nations

AI-Assisted Menace Actor Compromises 600+ FortiGate Gadgets in 55 Nations

February 23, 2026
10 tricks to begin getting ready! โ€ข Yoast

10 tricks to begin getting ready! โ€ข Yoast

July 21, 2025
Exporting a Material Simulation from Blender to an Interactive Three.js Scene

Exporting a Material Simulation from Blender to an Interactive Three.js Scene

August 20, 2025
Moonshot AI Releases ๐‘จ๐’•๐’•๐’†๐’๐’•๐’Š๐’๐’ ๐‘น๐’†๐’”๐’Š๐’…๐’–๐’‚๐’๐’” to Exchange Mounted Residual Mixing with Depth-Sensible Consideration for Higher Scaling in Transformers

Moonshot AI Releases ๐‘จ๐’•๐’•๐’†๐’๐’•๐’Š๐’๐’ ๐‘น๐’†๐’”๐’Š๐’…๐’–๐’‚๐’๐’” to Exchange Mounted Residual Mixing with Depth-Sensible Consideration for Higher Scaling in Transformers

March 16, 2026
Design Has By no means Been Extra Vital: Inside Shopifyโ€™s Acquisition of Molly

Design Has By no means Been Extra Vital: Inside Shopifyโ€™s Acquisition of Molly

September 8, 2025

AimactGrow

Welcome to AimactGrow, your ultimate source for all things technology! Our mission is to provide insightful, up-to-date content on the latest advancements in technology, coding, gaming, digital marketing, SEO, cybersecurity, and artificial intelligence (AI).

Categories

  • AI
  • Coding
  • Cybersecurity
  • Digital marketing
  • Gaming
  • SEO
  • Technology

Recent News

8 Leon Kennedy Scenes from Resident Evil Requiem that Turned Newbies Into Followers

8 Leon Kennedy Scenes from Resident Evil Requiem that Turned Newbies Into Followers

March 18, 2026
New .NET AOT Malware Hides Code as a Black Field to Evade Detection

New .NET AOT Malware Hides Code as a Black Field to Evade Detection

March 18, 2026
  • About Us
  • Privacy Policy
  • Disclaimer
  • Contact Us

ยฉ 2025 https://blog.aimactgrow.com/ - All Rights Reserved

No Result
View All Result
  • Home
  • Technology
  • AI
  • SEO
  • Coding
  • Gaming
  • Cybersecurity
  • Digital marketing

ยฉ 2025 https://blog.aimactgrow.com/ - All Rights Reserved