In the end, you mentioned Psychological tricks.. and explained 3 such principles... "Free" + Social Proof + Logos.. could you please make a video about as many of those things that can be optimised in entire website (not just hero section) like About section, Projects section and footer and same for Mobile view it Apps.
I'm pretty sure he first screen records himself designing in Figma, then plays it back at 1.5x and records himself talking over it while he watches the 1.5x recording (which is what you see in the small bubble of him speaking). It's physically impossible to design as fast as he's showing it, as talented as he is :)
This was great but one thing I always struggle with is once I design something for a website I find it doesn’t always work on mobile. Given that the majority of people use mobile nowadays how can I make a design that looks and works just as good on both without making too many sacrifices?
What I do often is to design for mobile first and make it as great as possible. Then expand that for the desktop and add complexity if you wish since you have more space to do it with. The standard method of desktop first is quite flawed I think. I also develop (code) websites mobile first then add complexity as I expand into bigger screens. But overall mobile has to be simpler in some way so design that first perhaps (as great as you can), see if it changes the way you solve the hero-section problem. There is no magic solution to this tbh. The awesomeness of the desktop version doesn't necessarily make mobile look worse, mobile just has to take a hit visually speaking due to the limited real estate. No way around it being a more or less single-column layout. A friend of mine uses mobile as the main point of focus now due to the reasons outlined by you for EVERYTHING. If it doesn't work on mobile he won't design or develop it.
I struggle with this too. It's kind of sad that you spend all this time and effort to design and then half or more than half of people see the lame mobile version. I mean no matter how well of a mobile version you make, it's just not as good as the desktop version. Space is beautiful :)
You can plan ahead for it - most layouts have a clear way to adapt to mobile. In this example we have 2 columns on desktop, and we'd have to break it into 1 col on mobile, meaning the text would have to go wither above or below the image, so we can create the image with that additional space in mind
In my opinion, before we dive in designing a website and in mobile we should consider a lot of things. The planning is the most essential part in designing. with this, it may help us to make our artwork works in different dimensions. So, I would highly recommend to plan it first and practice layout elements in order to create and translate visually appealing page. I think Simplicity may work rather than complex design. We want users to feel easy to the eyes and not confuse them.😊
I really like the minimalistic look of the team of rebels.. and all those simple geometric shapes are sold for me. this is just great. maaan your webdesign skills are just another level.
Wow that was amazing - realise you speeded things up shortened steps but the process was great to see - one of my biggest achilees heel is procrastination of directions and options I just get so many ideas and concepts its hard to choose especially with clients that say they know what they want when they see it - that puts all the risk on me in coming up with stuff that potentially they wont like and I need to figure out some better ways - was great to see your approaches really helpful
It's maybe just me, but when I come across a website that presents those aspects of this last optimization part, with plenty of calls-to-action, especially the word "Free" and doubtful testimonials / fake recent profiles everywhere, it always makes me feel like the website is a kind of scam or will force me in a way or another to pay for its services just after the subscription is done + will take the opportunity to steal and sell all of my data I would just have given to them. If we add the extra pop-up that cover the whole screen and we are done lol. But I get the idea of course, nice video, the render is really great. With a bit of parallax effect on the starship and death star, it would be a perfect landing page!
Absolutely love watching your videos because of the precise knowledge you share. Thanks a lot for making them and look forward to more insightful content from you guys!
SUPERB, Simply, Superb, your techniques are power, yet simple, it is at a pace my brain likes, rapid but clear and concise, I can watch this vlog again based on it's, "refreshing" factor; because it was truly that for me, refreshing, thank you for your extremely valuable contribution.
Each and every video is full of valuable content which really helps me to learn new things about Web Design every day. Thank you so much for this video Godspeed !!!!
Hello, I'm learning about web design, I think this video is great, and I'm a Star Wars fan so because of that I enjoyed it even more. Thanks for such a great content! What is your opinion about using Elementor for web design? do you recommend it? for optimizing images, which is more useful to learn: photoshop or illustrator, or depends? Have a great day.
@@FluxAcademy Thank you. Can't wait! Really appreciate you all experimenting with the fresh concepts and ideas for web design related videos all the time.
Thankyou for actually explaining tNice tutorialngs. Other videos that I watched started talking about how to make soft and didn't ntion anytNice tutorialng
Yea it’s no code. It does help to understand css + html though. Personally what I’m doing is going through the entirety of Webflow University. A series of courses by Webflow for free and a great place to start & see if it will be for you. The WU has sections and specific courses on web elements, HTML, and CSS I plan on definitely getting the Flux academy courses as well in the future when I can make the investments. The community alone I think would be worth it and in my understanding Flux courses range from beginner to advanced
hey Ran! i was hoping you could link me to the recent live stream workshops(airpod competition) because I don't see them on the channel and cant find them in the playlist for workshops. the reason I ask is because I was hoping to do the project aswell to work on it for a portfolio piece.
we're working to bring them back (editing out all the promo related content), if you originally enrolled in the challenge you have the links in the email.
This is cool, but I'd like to watch now the same, but instead of a general site, a blog, because a blog entails different needs... Can we expect some similar video to a blog? Cheers and thank you for this video!
Can you please teach how to get projects because I've 2 years of WordPress experience but I'm unable to find clients and get projects Experience get from a software house job and I also have a portfolio to showcase with clients
I think a more _down-to-earth_ example would've been much better. It would make your statements that you've actually done this with a real life client more believable rather than what it comes off as, i.e., an academic argument.
I have a question about the page/section height. When I watch design videos, most often when designing for desktop screen sizes designers use a 1440x1024 frame however the actual viewport height of the browser is usually significantly less. As a developer I can either make the section vertically responsive and make each section fit perfectly into the vh(viewport height) or keep the height pixel perfect to the design and just accept that on many devices the bottom of the hero section for example would not be visible until the user scrolls down. I am a developer with a some design skills but I'm very green In web design so I imagine this may be obvious for some however I was curious if there was a concrete/industry standard solution or if this is more of a judgement call.
I think you have to optimize for a certain screen size because you can't make it perfect for all viewports. Pick which ever screen the majority of your target audience will be viewing your website on.
In the end, you mentioned Psychological tricks.. and explained 3 such principles... "Free" + Social Proof + Logos.. could you please make a video about as many of those things that can be optimised in entire website (not just hero section) like About section, Projects section and footer and same for Mobile view it Apps.
I vote for this :) great idea
agreed
wee need these stuffs
read or watch a short video summary called Influence by Robert Cialdini. One of the foundations of Marketing.
Just a random nerdy thought but this video would've been perfect to release on May the 4th
Haha, good note!
Be with you
@@ransegall .
Finally soone who speaks in a calm way and getting to the point asap
I’ve recently discovered your channel and I must say I really like your teaching style! Extremely engaging, thanks for all the knowledge! 👊🏻
Appreciate the comment 🙏
It's like you design at the speed of thought. Really inspiring man!
I'm pretty sure he first screen records himself designing in Figma, then plays it back at 1.5x and records himself talking over it while he watches the 1.5x recording (which is what you see in the small bubble of him speaking). It's physically impossible to design as fast as he's showing it, as talented as he is :)
This was great but one thing I always struggle with is once I design something for a website I find it doesn’t always work on mobile. Given that the majority of people use mobile nowadays how can I make a design that looks and works just as good on both without making too many sacrifices?
What I do often is to design for mobile first and make it as great as possible. Then expand that for the desktop and add complexity if you wish since you have more space to do it with. The standard method of desktop first is quite flawed I think.
I also develop (code) websites mobile first then add complexity as I expand into bigger screens.
But overall mobile has to be simpler in some way so design that first perhaps (as great as you can), see if it changes the way you solve the hero-section problem. There is no magic solution to this tbh. The awesomeness of the desktop version doesn't necessarily make mobile look worse, mobile just has to take a hit visually speaking due to the limited real estate. No way around it being a more or less single-column layout.
A friend of mine uses mobile as the main point of focus now due to the reasons outlined by you for EVERYTHING. If it doesn't work on mobile he won't design or develop it.
I struggle with this too. It's kind of sad that you spend all this time and effort to design and then half or more than half of people see the lame mobile version. I mean no matter how well of a mobile version you make, it's just not as good as the desktop version. Space is beautiful :)
You can plan ahead for it - most layouts have a clear way to adapt to mobile. In this example we have 2 columns on desktop, and we'd have to break it into 1 col on mobile, meaning the text would have to go wither above or below the image, so we can create the image with that additional space in mind
In my opinion, before we dive in designing a website and in mobile we should consider a lot of things. The planning is the most essential part in designing. with this, it may help us to make our artwork works in different dimensions. So, I would highly recommend to plan it first and practice layout elements in order to create and translate visually appealing page. I think Simplicity may work rather than complex design. We want users to feel easy to the eyes and not confuse them.😊
@@FluxAcademy A video would be great!❤
I really like the minimalistic look of the team of rebels.. and all those simple geometric shapes are sold for me. this is just great. maaan your webdesign skills are just another level.
Thanks for the new video! I’m looking forward to seeing what other content you post! Always good to learn as much as you can!
More to come!
This is an excellent illustration of a properly professional design process... also, loved the rebel alliance illustrative example😃👍
Glad you enjoyed it!
Wow that was amazing - realise you speeded things up shortened steps but the process was great to see - one of my biggest achilees heel is procrastination of directions and options I just get so many ideas and concepts its hard to choose especially with clients that say they know what they want when they see it - that puts all the risk on me in coming up with stuff that potentially they wont like and I need to figure out some better ways - was great to see your approaches really helpful
Thanks for the comment John! appreciate it.
Hahaha! Can Completely Relate to it John.
Those questions (for what copy should go on the image) were SUPER helpful!!!
That was good :-) Breaking down the process into a short course. Love it.
Glad you liked it!
Holy smokes. That was awesome to watch you design.
It's maybe just me, but when I come across a website that presents those aspects of this last optimization part, with plenty of calls-to-action, especially the word "Free" and doubtful testimonials / fake recent profiles everywhere, it always makes me feel like the website is a kind of scam or will force me in a way or another to pay for its services just after the subscription is done + will take the opportunity to steal and sell all of my data I would just have given to them. If we add the extra pop-up that cover the whole screen and we are done lol.
But I get the idea of course, nice video, the render is really great. With a bit of parallax effect on the starship and death star, it would be a perfect landing page!
I like your style to teach, you know how to condense information and give it very easy for understanding.
I appreciate that!
The photoshop and brainstorm skills are brutal!
Can't wait to see more videos like that. It could be a hero section series for many different websites cheers
That’s a great idea! Thanks
Absolutely love watching your videos because of the precise knowledge you share. Thanks a lot for making them and look forward to more insightful content from you guys!
I gave a like by the second i saw the Jedi intro. Love it.
haha! WIN!
SUPERB, Simply, Superb, your techniques are power, yet simple, it is at a pace my brain likes, rapid but clear and concise, I can watch this vlog again based on it's, "refreshing" factor; because it was truly that for me, refreshing, thank you for your extremely valuable contribution.
Ya bro. Wow!! Thanks for reminding us that hero sections are still quite important for real.
Even with the fast forward editing, i can see tht you work really fast.
Each and every video is full of valuable content which really helps me to learn new things about Web Design every day. Thank you so much for this video
Godspeed !!!!
Wow wow and wow. Design is the hardest thing ever and you designed this like its nothing
You are the best! I loved this video and the manner how you explain this tema. Congrats!
Hello, I'm learning about web design, I think this video is great, and I'm a Star Wars fan so because of that I enjoyed it even more. Thanks for such a great content! What is your opinion about using Elementor for web design? do you recommend it?
for optimizing images, which is more useful to learn: photoshop or illustrator, or depends?
Have a great day.
very educational and eye opening! love the content
This was an amazing concept and well executed!
I feel like I should dust off my PS skills and create some amazing landing pages.
Yes! we'll try to create some PS tips vids soon
@@FluxAcademy Thank you. Can't wait!
Really appreciate you all experimenting with the fresh concepts and ideas for web design related videos all the time.
Brother Your Method of Explaining is so good!
1.Clarify who should care and why
2.Create wireframe
3.Create concept
4.Developing image
5.Design
6.Optimize
Nice to know that both Obi Wan and my Daughter has joined the rebels. 😂
Great content as always. 👍
haha! happy to hear!
Hi man, do you have any videos on your studio setup? Would be awesome to see how you do it. It looks wonderful!
Thankyou for actually explaining tNice tutorialngs. Other videos that I watched started talking about how to make soft and didn't ntion anytNice tutorialng
Such a brilliant explanation 🫶🏻 thank you for sharing your work and your talent
Pretty great video. But still designing for desktop only in a mobile driven world. Need to make a follow-up for portrait mobile hero section!
What did I just watch? 🤯🤯. You design so fast...
That was really great.
We want more like these
Thank you! coming up!
Very helpful video! Keep coming back with Amazing content!
Such a good website design you made!! ❤
Thank you so much for the valuable information.
May the Force be with you 🙂
I have seen the light 🤩
So much knowledge on this channel 👏
Damn you are so creative! 😮❤
Very helpful and mind blowing for starter like me, subscribed.
This is really amazing.
we want more
Thanks! coming up
So much value my man! Thank you 🔥🤝
thank u helped me a lotNice tutorial.... Very helpful
7:50 wow you are crazy quick! I wish I were that fast :0
1:44 Maybe 😂 this tutorial is from the future. It's a common theme in future website development for galaxy guardians & universe-related content. 👽🔥
רן אתה המלך
Thank you very much for this!
a very good tutorial 🙏
Dude, you really should offer your services to the New Republic, they're kinda struggling right now...
Thank you
it's really awesome please make more like this. I am so inspired thank you so much
Fantastic video! Thank You!
good tutorial👍👍👍
You are a great guy
handy for resetuping s or creating karaoke tracks. Thanks for the recomndation!
You are lucky my favourite nice tuto is nice tuto
Thank you! I'm excited to use yor guide.
A great tutorial. I'm very interested in taking all of your courses.
Thanks Robert! excited to have you when you're ready.
I definitely learned something new today
best comment ever.
This is really amazing. Thanks for this
I’m trying to learn webflow.. does your course help complete beginners with little html and css knowledge?
Webflow is no code
Yea it’s no code. It does help to understand css + html though. Personally what I’m doing is going through the entirety of Webflow University. A series of courses by Webflow for free and a great place to start & see if it will be for you. The WU has sections and specific courses on web elements, HTML, and CSS
I plan on definitely getting the Flux academy courses as well in the future when I can make the investments. The community alone I think would be worth it and in my understanding Flux courses range from beginner to advanced
no prior knowledge needed
Thanks for the video, it really inspiring. Please can I get the link for the class? I really wish to start with the right skill
I learned a lot!!! Thanks a lot
hey Ran! i was hoping you could link me to the recent live stream workshops(airpod competition) because I don't see them on the channel and cant find them in the playlist for workshops.
the reason I ask is because I was hoping to do the project aswell to work on it for a portfolio piece.
we're working to bring them back (editing out all the promo related content), if you originally enrolled in the challenge you have the links in the email.
This was insane value 🔥
Very helpful n creative....thanks
may i please know the fonts you have used ? Thanks...
This is cool, but I'd like to watch now the same, but instead of a general site, a blog, because a blog entails different needs... Can we expect some similar video to a blog? Cheers and thank you for this video!
Great idea!
@@FluxAcademy Well, now I'll really be expecting that video... :D
Flux, make a video where you make hero sections and make the same heros for mobile.
please tell me where you bought that canteen
ty
Excellent intro. It had me dying LOLL
Haha happy to hear!
Thank you, bro!
You're welcome!
Very cool thanks! How would this scale down to a mobile layout?
This is a great video!
Can you please teach how to get projects because I've 2 years of WordPress experience but I'm unable to find clients and get projects
Experience get from a software house job and I also have a portfolio to showcase with clients
we have lots of videos on the channel on this topic!
Please where are the Plan co workshop videos?
I'm interested too
if you've registered - the links to the videos are in your email
Do you have a video where you show how you transfer the design from figma to wordpress?
now that was really helpful!
facinating
loved it. thanks :)
amazing
Where is the workshop link?
Great video 👏
Great video man!
Glad you liked it!
I think a more _down-to-earth_ example would've been much better. It would make your statements that you've actually done this with a real life client more believable rather than what it comes off as, i.e., an academic argument.
very clever and fun
Awesome
Seems messy, I liked the 3rd one in the thumbnail
awsom
how do you define the spacing between the elements on the left (heading/subheading/call to action button)?
May i know the course name i want to bye but i didn't understand wich course is this
You the best 🔥
I have a question about the page/section height. When I watch design videos, most often when designing for desktop screen sizes designers use a 1440x1024 frame however the actual viewport height of the browser is usually significantly less. As a developer I can either make the section vertically responsive and make each section fit perfectly into the vh(viewport height) or keep the height pixel perfect to the design and just accept that on many devices the bottom of the hero section for example would not be visible until the user scrolls down. I am a developer with a some design skills but I'm very green In web design so I imagine this may be obvious for some however I was curious if there was a concrete/industry standard solution or if this is more of a judgement call.
I think you have to optimize for a certain screen size because you can't make it perfect for all viewports. Pick which ever screen the majority of your target audience will be viewing your website on.
So good 😆👍🏼👍🏼