Thank you for the feedback! I agree. The previous ones we made almost a year ago for Twitter, so I uploaded them here since many people were still interested in them. But from now on, all further videos will have voiceovers and my talking face :)
Thank you! There are multiple options depending of what is the final outcome: 1 - If it's a static graphic, let's say placed as part of a bento card/footer, use just JPEG (actually WEBP or AVIF for better size/quality). 2 - If you want to have an interactive animation, you can make this clock match the current user's time in realtime. For that, I would use rive.app. Check the neon.tech/ we designed and developed, here is bento card with a clock that is fully synced with user's current time. 3 - If you want to create an animation similar to the intro of that video, in that case, I would just embed it as H265/VP9/AV1 videos. You can check another work of ours huly.io at the footer where the clock is inserted as a video.
Well if made in figma with auto layout and absolute positioning you can get the code for development which is why designs like these are made in Figma or any other interface designing tool that allows you to make graphics considering the flexbox logic. Ai and PS will just give you a static image.
Thank you! There are multiple tools where you can achieve similar results in, and some of them you're right more suitable for certain effects. For example it can be PS, AI, Affinity Designer, Pixelmator, but you can also do this in Blender/C4D where you won't need to think about reflections and shadows and just setup correctly the light sources and materials. We do this in Figma because: - It's a collaborative platform. I can easily collaborate on the work with multiple designers and then even easily pass it to the Motion Designer/Developer. Any adjustments or progress from every member will be available to everyone instantly. - It's a tool in which we have the most experience, and what's more important is that every designer knows it, including Motion Designers. If I had an agency specialized in 3D, full of 3D artists, I would be doing this in Blender.
I prefer these tutorials where you talk and explain your thought process over the previous time lapse ones!
Thank you for the feedback! I agree. The previous ones we made almost a year ago for Twitter, so I uploaded them here since many people were still interested in them. But from now on, all further videos will have voiceovers and my talking face :)
I also agree with this!
Masterpiece of details 🔥🔥
Hey, you promised to post the 3D gaming console Figma design, but you haven't yet.
The best UI/UX Designer in Figma I ever SEEN!!!
Please more tutorials, I really want to learn from you sir!
Can I talk just a little bit with you?
Thank you for the support! The more is coming. Sure feel free to reach out to me on any social apps or email(check a website).
Wow this is fantastic tips❤
Thank you so much 😊
The main issue while implementing such detail-oriented designs is the handling of nested masking in Figma. Can you make a video on that only?
Great idea. I actually already have some materials for it, just need to wrap it up as a video.
Thanks for great tutorial.
But how to deliver this to developers? do you use JPEG or MP4 for animations?
Thank you! There are multiple options depending of what is the final outcome:
1 - If it's a static graphic, let's say placed as part of a bento card/footer, use just JPEG (actually WEBP or AVIF for better size/quality).
2 - If you want to have an interactive animation, you can make this clock match the current user's time in realtime. For that, I would use rive.app. Check the neon.tech/ we designed and developed, here is bento card with a clock that is fully synced with user's current time.
3 - If you want to create an animation similar to the intro of that video, in that case, I would just embed it as H265/VP9/AV1 videos. You can check another work of ours huly.io at the footer where the clock is inserted as a video.
Man U did marvels, but why doing it in Figma? AI or PS are more suitable for this sort of tasks.
Well if made in figma with auto layout and absolute positioning you can get the code for development which is why designs like these are made in Figma or any other interface designing tool that allows you to make graphics considering the flexbox logic. Ai and PS will just give you a static image.
@@shishukumarguin6918 Agreed
Thank you! There are multiple tools where you can achieve similar results in, and some of them you're right more suitable for certain effects. For example it can be PS, AI, Affinity Designer, Pixelmator, but you can also do this in Blender/C4D where you won't need to think about reflections and shadows and just setup correctly the light sources and materials.
We do this in Figma because:
- It's a collaborative platform. I can easily collaborate on the work with multiple designers and then even easily pass it to the Motion Designer/Developer. Any adjustments or progress from every member will be available to everyone instantly.
- It's a tool in which we have the most experience, and what's more important is that every designer knows it, including Motion Designers. If I had an agency specialized in 3D, full of 3D artists, I would be doing this in Blender.
The senior doesn't understand how a clock works. If the minute hand is in that position, the hour hand can't be there.