Framer - 2hr Responsive Web Challenge

The hardest part for any web designer is making your entire site fully responsive for any screen size.

Follow me in this 2 hour challenge or exercise style tutorial where we try to hack through making a Figma website design into a fully responsive Framer website.

Resources
- Final site design: https://ledbyux.com
- Figma project file: http://bit.ly/3HQcQfi

00:00 Introduction
00:54 Copying Figma design to Framer with the Framer Plugin
05:55 Navigation
10:00 Header section
19:23 Logos section
22:34 Section 2 - content tables
50:58 Section 3 - Event agenda
58:46 Testimonial
1:01:51 Section 4 - Education blurb
01:07:34 Help and footer section
01:18:44 Mobile responsive
02:01:45 Adding links / scroll links
02:09:01 Final checks

#framer #webdesign #responsivewebsite #landingpagedesign #tutorial #nocode #challenge #bootcamp #uiuxdesign
------------------------------------------------------------------------------------------------

Check out Framer’s FREE Canvas Based Website Builder
Sign up here → https://www.framer.com?via=buildwithomar

Other tools used
- http://loom.com - What I used to record my screen for this video
- https://www.figma.com - The worlds best UI/UX design tool of course :)

------------------------------------------------------------------------------------------------

Follow me here for more content:

📱 TIKTOK ‧   / omar.builds  
📷 INSTAGRAM ‧   / omar.builds  
🐦 TWITTER ‧   / omar_builds  
🌐 LINKEDIN ‧   / omarbuilds  

------------------------------------------------------------------------------------------------
Startups I am currently building:

👉 www.Glorify.com - A VC-backed SaaS design tool startup
👉 www.Together.Design - A productized UI/UX service platform
👉 www.Blitzit.app - a personal productivity tool that keeps you in flow state

And a few more in stealth mode :D