How Rocket Lawyer uses Webflow for product design

So what was your design workflow like before Webflow?

Before Webflow, our process was:

Create mocks in Photoshop

Compile them into a PDF

Click through

Some of us also used Keynote to get those interactions communicated. But we're fortunate to have started using Webflow so early that it's just an integral part of our process now.

What have been the benefits of moving out of that workflow, and into Webflow?

I think Webflow brings life to your product. Being able to inject movement and microinteractions makes your design solution so much more engaging and delightful.

And as a designer, being able to inform a developer of those desires in such a very clean and expressive way, again, empowers the designer to continue developing their own skills. Because prior to gaining this ability with Webflow, you’d either have to “fake” interactivity, or you just wouldn’t expand your design into that realm. Your whole experience had to be described, which sort of defeats the purpose of design.

And now we have a much richer understanding of code, and we know how to manipulate it the same way that a developer can.

So how has adopting Webflow benefited Rocket Lawyer?

Ultimately what Webflow’s done for us as an organization is to streamline our process.

It allows us to get from wireframes to final design very quickly, because we're not having to design static images for desktop, tablet, and mobile. Instead, we build out the whole experience in Webflow, from desktop on down, and we hand off the URL to our developers, and that's what they reference.

No specifications documents, no PDFs or PSDs, just the Webflow site.

What's been awesome about it is they have one URL, and when changes are made, the designer can quickly implement those and tell the developer, "Hey, refresh your screen. Those changes are there.”

So streamlining the design process has been great. As a designer, Webflow’s helped me empathize more with our developers and think about my designs from a development standpoint. Better communication between designers and developers is a constant struggle. I'm all about trying to make that better.

Free ebook: The modern web design process

Discover the processes and tools behind high-performing websites.

Start reading

So where does Webflow fit into your design workflow now?

Webflow is basically our final output — the ultimate deliverable of our design process.

We often do a lot of our thinking in wireframes, in Sketch, and InVision prototypes, but when we’re ready for high-fidelity, both visually and in terms of interactivity, that’s when we move to Webflow.

We've actually built our style guide in Webflow and made that a template. So when a designer is moving from wireframe to final design, they're just working off of that template, and all of our styles are already there. So they’re just layering our visual skin onto their wireframe.

But more importantly, it's a working prototype of the experience that we've designed, and using Webflow’s interaction tools has been really great for our team, because before Webflow, we were using prototyping tools like Framer or Principle.

And as cool as those tools are, they don't quite produce the product in a way that a developer is going to be building it, right? They express the product in a visual way. But with Webflow, you can hand off something that is code, and it's got all the information they need to replicate it.

They don’t actually use the code Webflow generates because they have their own code style guides to follow. The sites we built in Webflow serve as more of a design reference and a mockup to help the devs understand the intended experience.

Webflow’s also allowed us as a design team to build and maintain a living style guide. So rather than a static PDF that we're constantly updating and having to re-share with people, it's a website. That's really awesome and empowering to us.

So do both product and marketing design teams use Webflow?

Yes, but product designers more so than marketing designers. Mostly because our marketing designers are working on full flows and their pages are mostly static. We're definitely interested in advancing our marketing design a bit, exploring more animation and such. And I know Webflow will be able to support that once we're ready to make that move.

What’s your process for getting a new designer up to speed with Webflow?

I see Webflow as another tool that new team members have to learn to use to work here at Rocket Lawyer. And Webflow of course has made it easy insofar as the interface is pretty intuitive if you've used a few graphics programs. It's pretty easy to pick up.

So usually, we just say, "Here's Webflow. Start a project and play around with it. Or look at an old project and see how it's built."

Start building better products with Webflow

With Webflow, Liana’s team has been able to:

Streamline their design process

Improve their coding skills and knowledge

Build empathy with their development and engineering colleagues

And build a living style guide to strengthen their brand

If all that sounds like a dream, well: Webflow can make it a reality. Get your team on board today.[Source]-https://webflow.com/blog/how-rocketlawyer-uses-webflow-for-product-design

A Web Design Training Institute Institute teaches you to create own website with best java certification programs, core java, advanced java