Shouldn't the sun and moon go in opposite directions really? So when you switch to night, the sun goes down rather than up. And then you switch to day, the sun comes up rather than goes down.
I'm a Designer and I think that the aesthetic parts of the switch itself are entirely unnecessary to build. It is sad that an application that lives from User Experience Design fosters aesthetics rather than usability. The only interesting aspect here is the person who thought about the vertical format and used Figma in a vertical way so users (other designers) can see the entire Figma app most of the time while he's designing
Use this Figma community file to follow along: bit.ly/3NQj2sf
Designers dream is a nightmare for developers.
Like architects and civil engineers
It's not really difficult to code if you have good animation skills
Designer Rock 🤟, Developer Shock 😱
Devs- This is my nightmare fuel
If you understand how it's happening then it's not a big deal
More content like this please, Figma! 👍
Two days to code a switch 😅
not only that, but a VERY edge-case switch. It's definitely doable, but not much reusable everywhere
don't worry, soon enough we will go from figma to code, no developers needed, thanks to ai
Is it really, though? This is CSS-level work with a bit of masking and creativity.
what I had in mind to say 🤧😂
@@fortytwo244fuck me, that’s already existed
The developers said either you died or I lived today
This is a great way to beginners how they can animate features in their designs
Took me time, but finally I did it! Thanks ❤
I wish these shorts could be saved.
Simple, share - copy link- open google- search TH-cam video downloader - paste ❤
Hello there. This reply should serve as a reminder.
Also, you can save shorts in a playlist.
you can look at the three dots on top right corner
Hello
As a coder this thing is giving me panic attacks
Love it! Keep it up
That’s great. Now add a third state for OS preference
Instead on empty White circle, they should've used icon of sun and moon with rotated animation ,
Cool! Very simple, very creative.
Good idea but how could someone code this ? 🤨
don't worry about that, this is just Dribbble content
@@fortytwo244 I know well the clients, if they see it, they want it 😂
many libraries, many coders who can assemble it :)
@@KellerG68 Then you design it for them... We are just the UI Designers, not the devs lol. The devs are going to cry though poor fellas😂😅
On my tool I use node states to accomplish this, it’s like css classes that can be applied but states can manipulate the node’s children states too.
Love it!
why is the content clipped with the round shape and not the frame rectangle?
If you start doing these, your team will never take tou seriously😂😂
Does it work in free version figma?
Amazing
But how do you add this stuff to a site or app?
Have You courses for the comunity?
I didn't understood how to add an instance in to a frame and test it in presentation view any one explain in detail please 😅
Programmer reaction: '_'
Kekw
Shouldn't the sun and moon go in opposite directions really? So when you switch to night, the sun goes down rather than up. And then you switch to day, the sun comes up rather than goes down.
I see my FE dev next to me throw his keyboard 👀
how do i acces the screen in step 3?
아 역쉬 피그마 👍🏻👍🏻👍🏻👍🏻👍🏻
Amazing. But can someone guide me as how to paste this toggle onto a frame and create interaction.
Just drag one switch into your frame by holding option button. You will see a violet border (component).
The developer: Why the F!@k?😤
CSS boyzzzzzzzz
Awesome! It's a great and easy guide to create such a complex prototype.
Edit: It's called a Toggle button actually.
Anyone know the name of the BG music
Now do it in CSS 😂
Web developer 🥲🥲
Awesome
How tf am i supposed to create that button 😑😑
Cool
Poor dev RIP
Now push it to the developer, ehehe
❤❤
WHY?!?!?! WHYYYYYYYYYYY!!!!!!!!
El que lo programa: 👉🙃
Crying in app dev
I literally saw a TikTok for devs making fun of designers with this exact example a year ago
want
Heck yes
e fodazze o dev! kkkkkkkkk
❤
cool but then you can’t change anything in your prototype based on the switch status. so you have a file full of animation without reaction. zzzzzz
I'm a Designer and I think that the aesthetic parts of the switch itself are entirely unnecessary to build.
It is sad that an application that lives from User Experience Design fosters aesthetics rather than usability.
The only interesting aspect here is the person who thought about the vertical format and used Figma in a vertical way so users (other designers) can see the entire Figma app most of the time while he's designing
Sorry to say but its distracting n creating more confusion. Design should be simple.
Cool