Figma’s Dev Mode is no longer free — but I still think it’s worth it.
Here’s some good resources for the five bits mentioned:
What is the CSS Box Model https://developer.mozilla.org/en-US/d...
Breakpoints in responsive design https://www.nngroup.com/articles/brea...
Git fundamentals (just read the beginning) https://www.freecodecamp.org/news/lea...
Inspect element / title-leverage-the-power-of-chromes-inspec...
---
▶️ Watch next
Creating stateful prototypes
• Create state in prototypes with variables
Making a Netflix clone in Framer • making a Netflix clone with Framer
I spoke to the UK’s top freelance designer • I spoke to the UK's top freelance UX designer
---
🌐 Get in touch at https://paavandesign.com/
💡 Got an idea for a video? Tell me here → https://forms.gle/Cf1W7Rwk7qDRkrVN6
🔔 Make sure you're subscribed so you don't miss any videos → / @p44v9n
---
This video was edited with Descript, which makes it easy to edit a video using the power of AI transcription. Try it here (affiliate) https://get.descript.com/j7stm9bed0d7
Screen Studio makes it easy to create beautiful screen recordings in minutes. Try it here (affiliate): https://screenstudio.lemonsqueezy.com...
All my recommended tools → https://paavandesign.com/links
---
00:00 Intro
00:30 Making bread
00:59 The challenge of taking design into code
01:37 Dev handover
03:14 Should designers code?
03:33 Five things to know about code
03:38 Box model
04:00 Inspect element
04:45 Code base structure
05:18 Git outta here
05:37 Media queries
06:12 In conclusion