Designing the new Dive website in Figma + Framer
Вставка
- Опубліковано 10 січ 2023
- #figma #productdesign
This tutorial shows how I use components to speed up my workflow in Figma. I also talk about visual design principles and how I approach UI design in Figma. Lastly we’ll see how easy it is to go from Figma to Framer to published website.
🎨 Ready to become a better product designer? 👉 www.figma.academy
🐦 Discover more design deep dives on Twitter 👉 Ridderingand
I don't even have words to say how pleasant it has been to study figma. especially when I find content like this. Thank you very much.
I've never taken any software courses, but I've been working as an art director for almost five years. always studying alone, looking, trying, making mistakes. Anyway, I just wanted to express my gratitude. you are a professional reference. thanks for the content! Hugs from Brazil
Being able to see the behind the scene is so valuable! I learned so much from this, thank you Ridd! (and hope there's more to come 🤞🏼)
Planning on it!
Absolutely love it! Glad to see some
Of the ways you are thinking, def need to include in my workflow
This was very insightful thank you. I needed more insight about that last outline issue.
That card, omg, looks incredible!
The tutorial was an eye-opener, I love it. The Framer transition is helpful too
Glad it was helpful!
I love the way you teach. Thank you bro.
Glad I’m not the only one to make a component right off the bat 😂❤
This was pleasure to watch, workflow is jawdropping
Glad you liked it!
Great stuff, I am not a fun of using auto-layout so much but you have used it here in a very efficient way
Awesome video! I like your personality
Greate Video! I also use auto layout from the get go but making it a component from the beginning was something new to me. Definitely going to introduce that practice in my workflow
It's fast but it's also kinda fun to see it all come to life like that too 😅
This is so sick!
After seeing this video i realized that i know 1%of figma !!!
thank you
Thank you so much Ridd, this is really helpful.
Good I'm glad :)
Gold !
Great but that would be awesome that you could type in Shortcuts description and in the Video to learn
🤣i love how he emphasizes that components UPDATE EVERYWHERE when they change 🤣. It almost beats the Blackhole repeat-recycle-repeat-reveal that "not even light can escape", like dewddd neeeeeuuuu wayyyy breeeeeeehhhhh never hurrrrrddddd
Dope
Very nice.. can you build that with framer tutorial?
Please make more of these videos its goldd
Trying 😅❤️
What's that music cover background? looks so dope!
How did you design the selected state of course in nav menu it’s so good
Love the new website!
I was wondering, which tool are you using for screen recording & video?
All in Descript!
Super cool Ridd! What is the benefit of pinning the blur layer and noise layer?
Allows me to have everything else in an auto layout so I need to absolutely position that since they are stacked on top of each other and kind of independent of the rest of the layout 👍
the programmers will be going crazy after seeing this design XD
Whoah!!! What an awesome video. Thanks for sharing the knowledge. How did you design the active status of the menu item in the nav bar?
It's a triangle vector shape with a bit of a layer blur :)
What happened at 10:15 when this selection popped up? Thanks!
how do you keep your playground frame fixed but the items are scrollable?
What is the pros to use Figma then Framer ? Why not use Framer directly for the whole process ? Is it because Figma allows more personnalisation ?
Man i love framer more
Can u please drop the layout link or something? I'm actually working on my first project for a university.. I can't make something like this yet.. I really think they would like this layout and design thanks..
Hi how did you create the noise?
There are some nice noise plugins in the Figma community!
why don't you design in framer from the start? is there any draw backs?
I'm just 10x faster in Figma so I do my initial exploring/building there and then move into Framer once it's time to start fine-tuning
when the Framer course?
Soon :) Jump on the waitlist on dive.club if you haven't already!
@@ridd Thas is awesome! any expected day for the realise?
@@diegolanzani4766 pretty tbd still
Thank you UA-cam algoritm for show me Ridd on main scren. 1 MORE SUBSCRIBTION! FIRE! 💪🔥
😇🙌
Not sure for what you actually need figma anymore
9:30 just “[“ works for me