A designer's dream is a dev's nightmare 😂, I'm hoping someday programs will become advanced enough that devs don't have to struggle that much to implement the most outlandish designs a designer can come up with
This is a piece of art. You are talented. Anyone can design, anyone can learn to use a tool and even master it over time. But, What you have is beyond. A very strong eye for design with a very imaginative and futuristic creativity. Appreciate your hardwork in sharing such valuable content. I came across this marvelous video of yours searching for something I wanted to build, all though it's not into blockchain. This video has give me the inspiration that there's still light in the end of the tunnel. 💡 Is this website fully live post development? I'd love to see it in real time if you could share a link. Thanks once again! 😊
Thanks for the kind words, unfortunately this project has remained a prototype. The client was expecting something else... but it happens. It is impossible to always guess the client's thoughts. The real project did not turn out, but the lesson turned out.
I have seen good work done by youtubers, but this, this is next level educational content ! If only we had more Educators who show their mastery and teach at the same time suing simple to understand methods which are easily replicable! kudos man ! Hope your channel blows up very soon ! cheers and best of luck ! keep up the amazing work ! you definitley got a sub in just 1 video. the only other channel that got my sub after 1 video was veritasium and vsauce ! This was next level !
Thanks for the kind words. I didn’t think at all that there would be so many views and subscribers when I posted the first samples of the tutorials. Now I need to try harder.
@@igorvensko I'm sure you'll be able to keep up the good work. I started my own TH-cam channel. I know what it takes to make videos, especially tutorials. Easier said than done. But the joy you get when you get genuine feedback from all around the world and especially the impact you have on people who appreciate your efforts and your videos, that's what makes it worth it! Will definitely send you some business as well as hire you soon for some personal projects. Love working with absolut talented ninjas 😊
Hey Igor, you are exactly the UX Expert that I was looking for. I didn't find your email address mentioned on your TH-cam channel. I have some business that I wanted to discuss. How can I reach you? Would you prefer Instagram outreach or some other channel for communication? Let me know! Cheers!
an extremely talented developer is required to code that UI. absolutely mind blowing, the developer who are looking to make this have to spend everylast one of their braincell
@@igorvensko not impossible. But you’d have to be an extremely efficient coder and designer to get this done lol. Unless the company is using purely no code website builder
Hey! This is awesome. I can play around with it and make many beautiful projects on this theme. Can you please please give the figma file of this project?
If designers made projects just to make it easier to code, sites would not differ from a Word document. Such a profession 🤷 designers invent - the developers are trying to repeat it. Without it, no one would grow professionally.
@@igorvensko i agree on what uve said..thats why we need designers for the vision..coders for implementing it.. but ofc there are certain times both has to compromise.
@@system8877 Of course, it all depends on the need to use one or another element or animation. And a lot depends on the client, if there is time, people with the necessary knowledge and funds for development - why not use :)
Wow! Great Work. I'm usually contemptuous of Figma, but now I'm motivated to learn. What do you use to convert Figma to html/css/js - does it still work?
Unfortunately, I only create designs, without coding. To developers I send all assets and video with explanations of how it works. And developers recreate it in the code.
I have a question I don't know how to solve. When I make animation of 4 blocks, on the test frame all is well, when I put a copy of the component in the main frame, when viewing the animation I see all icons first white, then the white color disappears and already as necessary look, what is the reason? not the 1st time I face with such an answer can not find any way, clip content everywhere off, I do everything as in the video
Amazing work! I am a frontend developer and I would love to implement this while I learn a new technology. Is there a chance someone can share a figma link or figma file with this already done? As I am not a UX myself and I will probably butcher this even tho this is well made tutorial.
Thanks, we can create transition from any layer on page. For example from Header group or Logo layer - when we click on header/logo we go to previous screen.
Great video my friend! I have a question if you could please help me. I have a client who wants a website with this kind of parallax effect, i do understand the principles of animating it, but i'm really struggling with understanding how to deliver it, since we are unable to scroll animate properly in figma. Should i animate like you did, with "on click" and let the developer turn it into a scrolling effect? Thank you very much!
True. This is best taken as a tutorial and on a real site it is not necessary to use all the effects and animations. Someone can use animation only for the first screen, someone can use parallax from the logo, and so on.
Hi Igor this is such a beautiful design and the tutorial is great as well. I am a budding frontend developer and I'd like to code it up(all design credits would be give to you as its supposed), if it's fine by you.
When you hover over the zoom animations it animates. but what happens if you click to go to the next frame while hovering over the zoom animation. Will it just instantly go back to the original state? And if so how can i prevent this from happening?
How could you translate it to website I think it will take a ton of position absolute and transform And tons of media queries for every 100px change in width But with this look maybe it is worth it
Great project, but now you made programmer mad that he have to put all those animations on scroll with parallax effects and that all need to work only when elements should get visible on screen and also need to move stuff on mobile version xD
what builder do you use? can it work in wp bakery? i downloaded fignel but it gives me a hard time. I try to but my designs with elementor and i would hope for something more creative
39:47 can you accomplish the same with with hover and change to since they're variants? I never use mouse enter bc it seems the same as hover, but obviously they must be different..i guess i dont see how
If designers made projects just to make it easier to code, sites would not differ from a Word document. Such a profession 🤷 designers invent - the developers are trying to repeat it. Without it, no one would grow professionally.
Ты явно русскоязычный несмотря на то что живешь в Польше. Зачем ты выпендриваешься на чужом тебе языке, слышно же как ты с трудом подбираешь слова и у тебя дикий акцент. Быть собой не пробовал?) А Midjorney использовать - это признак отсутствия своих идей и желания пустить пыль в глаза.
Да, я знаю русский лучше других языков, знаю польский и благодаря каналу стимулирую себя изучать английский. ИИ ускоряет работу и дает возможность создать то, на что ранее уходило много времени. Я пытаюсь всё время развиваться, и в языке, и в технологиях. Если не нравится - просто не смотрим и не раздражаемся. Удачи.
Hi Igor, are you a designer? UX experience and UI... I followed all your videos and love your work. Do you have a website or email please I am working on a complex project maybe you can help me on, that's the reason for the question above. Thanks 😊
🎉 Hi, check my Figma Animation Course www.wizardcourse.pro
Our developers would have a heart attack, but suddenly I'm inspired as a designer again. Thank you, Igor!
I felt this as a developer
You can do it :) A little patience, time and effort.
A designer's dream is a dev's nightmare 😂, I'm hoping someday programs will become advanced enough that devs don't have to struggle that much to implement the most outlandish designs a designer can come up with
yes
it's very easy to develop, even me as a designer I can do it
Using Mask to cut out the object is so clutch! Thanks for that!
:D You're welcome!
As a Developer, You're giving me some cardiac attacks of level-3. I don't think that I'll be able to survive.
Everything will be fine :)
This video is a goldmine of design inspiration.
Thanks :)
This is a piece of art. You are talented. Anyone can design, anyone can learn to use a tool and even master it over time. But, What you have is beyond. A very strong eye for design with a very imaginative and futuristic creativity. Appreciate your hardwork in sharing such valuable content. I came across this marvelous video of yours searching for something I wanted to build, all though it's not into blockchain. This video has give me the inspiration that there's still light in the end of the tunnel. 💡
Is this website fully live post development? I'd love to see it in real time if you could share a link. Thanks once again! 😊
Thanks for the kind words, unfortunately this project has remained a prototype. The client was expecting something else... but it happens. It is impossible to always guess the client's thoughts. The real project did not turn out, but the lesson turned out.
Dude...this is so incredible! PLEASE make more tutorials....would totally purchase a full course!!!
Thanks! Will do!
Definitely. A design course would be AMAZING!
Favorite Figma Tutorial Ive seen thus far on my journey lol. Great work, thank you! Subscribed
Welcome!
Спасибо ❤ очень приятно смотреть и слушать!!) вы очень талантливы!
this video is so helpful for getting more ideas about making websites. thanks for this incredible work
Glad it was helpful!
You are a damn wizard. I sat in front of figma and was like Ummmmmm. But you taught me a lot of cool stuff!
You're welcome! Everything becomes easy once you understand how it works.
I have seen good work done by youtubers, but this, this is next level educational content ! If only we had more Educators who show their mastery and teach at the same time suing simple to understand methods which are easily replicable! kudos man ! Hope your channel blows up very soon ! cheers and best of luck ! keep up the amazing work ! you definitley got a sub in just 1 video. the only other channel that got my sub after 1 video was veritasium and vsauce ! This was next level !
Thanks for the kind words. I didn’t think at all that there would be so many views and subscribers when I posted the first samples of the tutorials. Now I need to try harder.
@@igorvensko I'm sure you'll be able to keep up the good work. I started my own TH-cam channel. I know what it takes to make videos, especially tutorials. Easier said than done. But the joy you get when you get genuine feedback from all around the world and especially the impact you have on people who appreciate your efforts and your videos, that's what makes it worth it! Will definitely send you some business as well as hire you soon for some personal projects. Love working with absolut talented ninjas 😊
Hey Igor, you are exactly the UX Expert that I was looking for. I didn't find your email address mentioned on your TH-cam channel. I have some business that I wanted to discuss. How can I reach you? Would you prefer Instagram outreach or some other channel for communication? Let me know! Cheers!
@@1306anand Hi, you can write to igorvensko @ gmail.com
@igorvensko I've sent you a email. Looking forward to hearing from you soon.
Great tutorial Igor! 💪
Thank you for showing your workflow! ❤
Mind blowing work!!! Loved it❤❤❤
this is beautiful tutorial that is very inspiring! Thank you for making content like this!
You're so welcome!
Wow Igor. Very well done! Ty for creating this.
Thanks and you're welcome!
This is insanely good. respect.
Thank you!
Good job 👍 Greetings from Mongolia 🇲🇳
Thanks
Thank you so so much Igor Vensko ❤ ^^
You're welcome!
Thank you for this one. Expecting more detailed tutorials like this. ❤
Do my best, the channel is more like a hobby.
Thank you for this amazing art website
You're welcome!
This is a great idea! Thank you for sharing the tutorial.
You're welcome!
bro I loved it.... awesome animation trick for that line , portfolio is also too a nice and I I aslo loved the background music
Thanks 🙂
an extremely talented developer is required to code that UI. absolutely mind blowing, the developer who are looking to make this have to spend everylast one of their braincell
This is masterpiece.
Thank you!
this is absolutely great always see new different design on your channel
Do my best.
awesome idea brother, I cannot thank you enough for THIS. Love from the other side, keep up the good work. And, please know you are AWESOMEEEEEE
Thank you :)
It's really awesome, thank you for such a helpful tutorial !
You're welcome!
Thanks for this.
You're welcome!
amazing! i have learned alot from your talent
Thanks!
One word, amazing. I hope to be on your level of talent one day
LOL what talent?
Thank you 👍
Awsome work. Thank you!
You're welcome!
that is amazing great work really keep it up plz
Thanks, do my best.
thanks for this video!
You're welcome!
ur goood.
Thanks!
That's impressive :D
Thank you!
Как всегда топ! Спасибо за видео
Рад что было полезно.
Туториал супер крутой ❤
Спасибо :)
Дуже дякую! Відео дуже корисне
You're welcome!
This would be utterly impossible to translate to a real website developer haha. You would have to be a master
Nothing is impossible :)
@@igorvensko not impossible. But you’d have to be an extremely efficient coder and designer to get this done lol. Unless the company is using purely no code website builder
Промотаем =D
🤪
Thank you Igor Vensko for the tutorial..
You're welcome!
Hey! This is awesome. I can play around with it and make many beautiful projects on this theme. Can you please please give the figma file of this project?
This is hell for frontend dev...but i can see the ways u can implement this..but u need complete dedicated master front-end dev for this ahaha
If designers made projects just to make it easier to code, sites would not differ from a Word document. Such a profession 🤷 designers invent - the developers are trying to repeat it. Without it, no one would grow professionally.
@@igorvensko i agree on what uve said..thats why we need designers for the vision..coders for implementing it.. but ofc there are certain times both has to compromise.
@@system8877 Of course, it all depends on the need to use one or another element or animation. And a lot depends on the client, if there is time, people with the necessary knowledge and funds for development - why not use :)
Hello bro, amazing work, juste for telling you some people steel your work and post them in tiktok
Thanks. Yes, I saw couple videos in tiktok. Unfortunately, nothing can be done about it.
Can I get a copy of this?
igor i want the video pleaseeeeeeeeeeeeee ! i dont want to spend money please you must have shared the video also of abstract lines : (
Wow! Great Work. I'm usually contemptuous of Figma, but now I'm motivated to learn. What do you use to convert Figma to html/css/js - does it still work?
Unfortunately, I only create designs, without coding. To developers I send all assets and video with explanations of how it works. And developers recreate it in the code.
I have a question I don't know how to solve. When I make animation of 4 blocks, on the test frame all is well, when I put a copy of the component in the main frame, when viewing the animation I see all icons first white, then the white color disappears and already as necessary look, what is the reason? not the 1st time I face with such an answer can not find any way, clip content everywhere off, I do everything as in the video
Needed the figma file
In this tutorial I used video from Envatoelements and cant share it.
hey your all deigns are pop awesome !! can pls share figma file of this tutorial so that i inspect all the layer clearly for understanding..
Unfortunately, I cant share figma link because of licence for video from EnvatoElements.
Amazing work! I am a frontend developer and I would love to implement this while I learn a new technology. Is there a chance someone can share a figma link or figma file with this already done? As I am not a UX myself and I will probably butcher this even tho this is well made tutorial.
awesome work... but how can you navigate to the previous page?
Thanks, we can create transition from any layer on page. For example from Header group or Logo layer - when we click on header/logo we go to previous screen.
Great video my friend! I have a question if you could please help me. I have a client who wants a website with this kind of parallax effect, i do understand the principles of animating it, but i'm really struggling with understanding how to deliver it, since we are unable to scroll animate properly in figma. Should i animate like you did, with "on click" and let the developer turn it into a scrolling effect? Thank you very much!
Hi, yes. This is best option right now - create a simulation of scrolling using "clicks" but after coding this will work with scroll.
thanks but finaly it just ui ux , so hard to recreate with css
True. This is best taken as a tutorial and on a real site it is not necessary to use all the effects and animations. Someone can use animation only for the first screen, someone can use parallax from the logo, and so on.
Can you show an example on how to transfer this in Elementor? Thanks
Unfortunately, I only create designs.
@@igorvensko ahhh ok 👍🏻 😀
developer seeing the design: 😱
It depends on the skill of the developer 🙂
Awesome!!!!
Just wanted to ask that from where u get these assets like this stone image etc
Hi, in tutorial I show how I generate assets in Midjourney. Video from EnvatoElements. All links in description.
Hi Igor this is such a beautiful design and the tutorial is great as well. I am a budding frontend developer and I'd like to code it up(all design credits would be give to you as its supposed), if it's fine by you.
Hi, what font are you using?
Thanks
Man this was awesome. Is it possible without photoshop? I do t want to spend money on that again
Maybe we have other app for this kind of video transformation.
When you hover over the zoom animations it animates. but what happens if you click to go to the next frame while hovering over the zoom animation. Will it just instantly go back to the original state? And if so how can i prevent this from happening?
Looks amazing! Are you available for freelance work?
Hi, yes but I won't be available for subscriptions/projects until mid-May.
how it will adapt in mobile?
Great tutorial! just one question, what file type should I export to keep all animations in Behance?
Thanks! You can embed link from Figma to Behance or record your screen with animation from figma and paste video.
Әдемі)
Thanks!
How could you translate it to website
I think it will take a ton of position absolute and transform
And tons of media queries for every 100px change in width
But with this look maybe it is worth it
Here everything depends on the level of the developer and the financial capabilities of the client. :)
❤❤❤
You're welcome!
Has anyone recreated this tutorial, if so pls share the figma file
Maybe Julia can help you - www.linkedin.com/posts/julia-ibri_i-wanted-to-share-with-you-my-last-figma-activity-7022525157277650944-1w7i?
❤
👍
hi @igor checked your video, i was trying to use the 1st command prompt but it says invalid aspect ratio
Hi, in midjourney v4 you can try --ar 3:2
Is this only click to navigate? Or is it easy to add a scroll rather than click (like Apple website)??
In Figma I use clicks for activate animation, but after code (on real website) it can works with scroll.
Great project, but now you made programmer mad that he have to put all those animations on scroll with parallax effects and that all need to work only when elements should get visible on screen and also need to move stuff on mobile version xD
It all depends on the developer, some like to do just such designs.
Beautiful UI but as a frontend dev, it makes me sad 😪
Thanks 🤪
i dare u code this
I do only design (graphic part). I can help the developer morally 😀
Hi! Can you share link to the channel with midjourney bot?
Hi - www.midjourney.com/
What version of photoshop is that?! 😂
really large screen + white theme interface i guess 😂
Bingo 😄 screen 2560x1440 and light theme (I don't like dark theme)
what builder do you use? can it work in wp bakery? i downloaded fignel but it gives me a hard time. I try to but my designs with elementor and i would hope for something more creative
I do only design (graphic part) without coding. But I think this project we can recreate in webflow.
Is it possible to export such animation later?
Only recreate in code.
how you generae concistent image vibes?
Use same Prompt couple times and create variations.
39:47 can you accomplish the same with with hover and change to since they're variants? I never use mouse enter bc it seems the same as hover, but obviously they must be different..i guess i dont see how
Yes, we can use hover. In tutorials I try to show different solutions.
8:57 what is the name of the app? Photoshop?
I'm a newcomer😓
Hi, its Figma
@@igorvensko what is a paid app
Прикольно, но единственное акцент палит и чтение с переводчика 🙂
Как говорится "Do my best"
Can we call these kind of websites as web3?
I think every design for web3 company can called web3 design 🙂
Only if you add "Connect your wallet" button 😂
I want mire videos like that weekly plz for your subscriber 🙏🙏🙏🙏
Do my best.
You drop Adobe xd?
No, this project created in Figma.
Привіт, у фотошопі не виходить зробити бекграунд анімацію, чи є де взяти ваш файл? Фш не хоче рендерити мій варіант...
Привет, ссылка на видео в описании к ролику (там же и регистрация на EnvatoElements). Но думаю можно найти что-то подходящее на pixabay.com.
What tool do you use to record animations in Figma?
We can use any screen recorder tool. I use OBS studio.
@Igor Vensko Tutorials Thank you. I tried OBS, but the quality was poor. I guess I need to set it up correctly. In any case, thanks.
As a client, wow this what i want.
As a developer, ummm... How to make it responsive... what!? you need this after a week? Bye
Depends on developer :)
20:00
Unfortunately I don't get it.
@@igorvensko It was just a marker for me lol. It's where I left off and needed to return to. Thanks for the reminder!
20:20
:)
А можно на Русском ???
К сожалению, нет.
the programmer 💀
💀💀
If designers made projects just to make it easier to code, sites would not differ from a Word document. Such a profession 🤷 designers invent - the developers are trying to repeat it. Without it, no one would grow professionally.
Can you do something a LOT EASIER lol
I don't know how to make easier :)
@@igorvensko I’m hoping a slightly simpler animations? Maybe something in figma only entirely?
игорь а на русском можно
К сожалению, нет. Канал изначально планировался создаваться на английском языка чтобы хоть как-то стимулировать себя к изучению языка.
Ты явно русскоязычный несмотря на то что живешь в Польше. Зачем ты выпендриваешься на чужом тебе языке, слышно же как ты с трудом подбираешь слова и у тебя дикий акцент. Быть собой не пробовал?) А Midjorney использовать - это признак отсутствия своих идей и желания пустить пыль в глаза.
Да, я знаю русский лучше других языков, знаю польский и благодаря каналу стимулирую себя изучать английский. ИИ ускоряет работу и дает возможность создать то, на что ранее уходило много времени. Я пытаюсь всё время развиваться, и в языке, и в технологиях. Если не нравится - просто не смотрим и не раздражаемся. Удачи.
Hi Igor, are you a designer? UX experience and UI... I followed all your videos and love your work. Do you have a website or email please I am working on a complex project maybe you can help me on, that's the reason for the question above.
Thanks 😊
Website www.wizardmode.io/ or email igorvensko@gmail.com
how can i contact you
Hi, you can send email on igorvensko@gmail.com
@@igorvensko okay thank you
Your channel is really growing. Congrats!!! Do not get left behind > "Promosm" !
Thanks