Interactions in Webflow
I get it. Learning another app to do something you’re already doing is for the birds. You’re a user interface designer — you already create beautiful, Dribbblicious interactions with Principle, Flinto, or your app of choice. Why change now? Why put the hammer down when we’re master hammerers.
But, listen! Webflow is the jackhammer you’ve been waiting for — I promise.
Let me ‘splain.
The interactions you’ll create in Webflow are better than any interaction you’ll create in the app of your choice, for one simple reason:
You can hand off the code to your developer for production use.
No more lurking about to make sure your developer uses the right easing. No more drawn-out conversations about why an interaction should wait 600 ms before starting. With Webflow, those days are gone, dear reader!
Handing things off to your developer
Okay, so we've completed the HTML structure of our website, styled the site to our liking, and added beautiful interactions. The next step is to simply export the site. That's it! Place the files on Github and let your developer go to town.
I can tell you from experience it really is that simple. What is my experience, you ask?
A little about me
I work at a medium-sized corporate company in Bridgeton, MO. A few months ago I had to create a multi-step form for a developer. Easy enough, but I had little bandwidth at the time. I needed to complete the request quickly and with as little fuss as possible.
Before I jumped in, I received sign-off on the form by presenting it in Webflow. I didn’t get the usual push-back because Webflow made it possible for the stakeholders and I to work together. We knew the solution we were after and Webflow helped us get there.
I created the form in Webflow, exported the site, and handed the code to the developer. And just one change request came in. Amazing!
Connecting and collaborating
This is one of the many anecdotes I could tell you that have helped make Webflow my go-to tool. There really are no other tools that can do what Webflow does: create high-fidelity mockups and production-ready interactions, and export semantic code.
What’s your number-one tool?
Connecting design and development is not any easy task. What's your go-to tool and why? Share your expertise in the comments below.