Sketch to Webflow Case Study - Project Overview - MembershipToolbox.com I'm here today with my second Webflow client project and my new types of videos - Project Overview, Series where I'll walk you through the design process and show you how final Webflow product is built. To really show you what's behind the scenes. In the first video we will take a deep dive in - Membership Toolbox. I've been recently working with Memberspace crew on the website with a list of over 60 tools and resources to launch and grow successful online membership business. It's built fully based on Webflow CMS with all of the mosaics in the headers. And it's free to clone via Webflow Discover. Let me know your thoughts on this kind of series and what more would you like to see in the future!
In this tutorial, Jon Losert provides an overview of the process of porting a design from Sketch to Webflow. He begins by discussing the importance of choosing the right design to port, and then goes on to talk about setting up the grid and canvas size in Sketch.
Next, Losert covers the testing of different feature cards and design elements, and explains how to use conditional logic for CMS items in the Webflow header. He then shows how to set up and use Webflow CMS for Sketch design elements.
Finally, Losert provides an overview of responsive design and discusses how the design may need to be altered for tablet and phone displays. Overall, this tutorial is a useful guide for anyone looking to port their design from Sketch to Webflow.