Web Design with Relume AI & Webflow - Full Course

  Рет қаралды 30,441

Flux Academy

Flux Academy

Күн бұрын

In this course we’re going to be building a fun website for a Sneaker Museum! I’m going to show you exactly how I think and work, so that you can not only improve the quality of your web designs but also increase your efficiency and get the work done faster.
CHAPTERS
0:00 Intro
1:18 Turn brief to moodboard
9:45 Create wireframes with Relume
23:40 Design the website in Figma
46:43 Build in Webflow
Learn Webflow the FAST way with our full Webflow Masterclass course 👉 bit.ly/3Uev1S2
Learn to design beautiful strategic brands with our Brand Design Mastery course 👉 bit.ly/3UvS77U
Try Relume 👉 bit.ly/flux-relume
Try Webflow 👉 bit.ly/flux-webflow
📱 Find us on SOCIAL MEDIA
Ran's Instagram 👉 / ransegall
Ran's X (Twitter) 👉 / ransegall
Flux Academy's Instagram 👉 / flux.academy
Flux Academy's TikTok 👉 / fluxacademy

Пікірлер: 58
@ThatsThoms
@ThatsThoms Ай бұрын
A little tip for you - when you style the buttons in webflow you should add stroke to every of them. Even if you don’t want stroke on particular type of button, add stroke with the same color as background to avoid different heights in buttons. Aside from that, the video is a perfect tutorial, love it!
@sebastianmihaiprisacariu8975
@sebastianmihaiprisacariu8975 Ай бұрын
Or use box-sizing: border-box; on all elements.
@hitesh6245
@hitesh6245 Ай бұрын
thanks for the tip bro :)
@mindfulmilligan
@mindfulmilligan Ай бұрын
So awesome!! Ran.. process vids like this are my absolute favorite. Also.. I feel like you were a lot more positive and supportive of yourself. I feel like you are someone who can be hard on themselves due to high standards.. just know that everyone watching is very impressed and grateful ;) You rock Ran!!!
@FluxAcademy
@FluxAcademy Ай бұрын
Appreciate that my friend ❤️
@davidgoult8694
@davidgoult8694 Ай бұрын
For context I haven’t finished watching this… Ran this is really good almost feels like it should have be the second level of the Webflow master class 4.0. It definitely gives OFF that vibe but more polished. ❤
@Franzx98
@Franzx98 23 күн бұрын
Hi Ran, here to say that you can just divide the pixel value by 16 to get rems. Also you can calculate them directly in Webflow just typing /16 + enter 😁
@user-pz9pz1ig5b
@user-pz9pz1ig5b Ай бұрын
Thank you for finally showing a good Relume style guide tutorial!
@wladimirrahn6194
@wladimirrahn6194 Ай бұрын
You can convert PX to REM right in the webflow designer. Type in your pixels, lets say 70. Then continue typing 70/16rem, hit enter, and the conversion happens automatically. Great video Ran, absolutely love these. The more I see these, the more I want to do your courses. Keep it up.
@FluxAcademy
@FluxAcademy Ай бұрын
That's an awesome comment! Thanks for sharing!
@jean-francoiscarreau9100
@jean-francoiscarreau9100 Ай бұрын
Crazy content, I love the workflow, the process , everything. Thanks a lot !
@DelfinaAlden
@DelfinaAlden Ай бұрын
Cannot express to you how much I was waiting for this video! I'm not a designer but need a website and was inspired to try using relume to figma to webflow after watching one of your older videos. It's been weeks of frustration & trying to figure things out (I wasn't familiar w any of this). This video answered so many of my questions and came just in time. Thank you so much!
@FluxAcademy
@FluxAcademy Ай бұрын
Great to hear!
@faelanm
@faelanm Ай бұрын
I'm currently taking the Webflow Masterclass and these videos on KZfaq are perfect bonus lessons. Thank you Ran.
@FluxAcademy
@FluxAcademy Ай бұрын
Happy to hear! Good luck!
@lisally6384
@lisally6384 21 күн бұрын
Good luck!
@KalvinPatel
@KalvinPatel 9 күн бұрын
how much do you pay for Webflow, is it better hosting than Bluhost?
@faelanm
@faelanm 9 күн бұрын
@@KalvinPatel Webflow has different pricing options with their hosting included in it. I've used Bluehost as well but it would be hard to compare the two because Webflow is not just a hosting plan.
@KalvinPatel
@KalvinPatel 9 күн бұрын
@@faelanm gotcha, ya Webflow is alsso an editor too. Right now I have BluHost hosting, GoDaddy domain, and I use Semplice as my portfolio builder (that uses wordpress). Would you recommend me switching all that over to Webflow and just learn how to utilize webflow?
@henrythomas7112
@henrythomas7112 Ай бұрын
Thank you so much for this video. Super helpful and well-presented. Your time and effort is most appreciated!
@FluxAcademy
@FluxAcademy Ай бұрын
Glad you enjoyed it!
@Lyf_of_Ike
@Lyf_of_Ike Ай бұрын
Best video I have watched on this channel, a true master class
@FluxAcademy
@FluxAcademy Ай бұрын
Glad you think so!
@andrej59846
@andrej59846 Ай бұрын
I learned a lot. Thanks! 👋
@allaboutislam3652
@allaboutislam3652 2 күн бұрын
just wow,its so fast
@skillfulwebdesign
@skillfulwebdesign 23 күн бұрын
Please Help! I'm a total Newb to Relume and Figma. Where do I find the pages you show in the tutorial, 01 Inspirations, 02 Moodboards, 03 Art Directions, 04 Wireframes?
@Erwin_t
@Erwin_t Ай бұрын
WOOOOW Amazing! How would you do it in Framer?
@piotrgorski1945
@piotrgorski1945 Ай бұрын
Great video, thanks Ran :D
@FluxAcademy
@FluxAcademy Ай бұрын
Glad you enjoyed it!
@empanada420
@empanada420 Ай бұрын
When I go to my style guide section, I only see the first “typography section, and not the other sections, namely the “variable” section. Is this affected because I have a free Relume subscription?
@plablomarcalcortes
@plablomarcalcortes Ай бұрын
Nice brow 😮
@tresvecesdos
@tresvecesdos 17 күн бұрын
Gracias Ran 👨‍💻
@FluxAcademy
@FluxAcademy 16 күн бұрын
De nada!
@benjaminbarros4068
@benjaminbarros4068 29 күн бұрын
Awesome tutorial, thanks! Just one question. What website are you using to create those 3D sneakers?
@lenovogmail9272
@lenovogmail9272 9 күн бұрын
so what was the use of Figma? why didn't you export the wireframes from Relume to WebFlow directly?
@hamzitoo
@hamzitoo 27 күн бұрын
can you provide this Brief document , so we can generated another version of it USing AI!
@tosinajiboye5347
@tosinajiboye5347 22 күн бұрын
This is hard I’ve been looking where I can get it
@maymemyintzaw851
@maymemyintzaw851 23 күн бұрын
Hi.Ran I enjoy learning webflow with your amazing tutorials. I have a question bro.I find difficuilt in pricing per page especially CMS powered blog pages .like main blog page and its 7 template pages .My per page price is $30 .My per page price is $30 .How should I charge for CMS powered pages.pls suggest for me.
@peterjacob4738
@peterjacob4738 7 күн бұрын
Where did you get the pictures you used......I wanna get mine from there too
@64mo22
@64mo22 6 күн бұрын
Midjurney AI
@Mr_wolf162
@Mr_wolf162 Ай бұрын
bro as a beginner can i use this method😊
@FluxAcademy
@FluxAcademy 29 күн бұрын
Try it!
@jerryratunilfuentes7124
@jerryratunilfuentes7124 Ай бұрын
i cant afford to upgrade the relume cause im only a student that i want to work part time job im so dissapointed that i cant copy the class sync then the relume layout please help me i want to become a good web designer sooooo sad i dont have bank too
@FluxAcademy
@FluxAcademy Ай бұрын
You can be a good web designer without Relume. It's just a helpful tool in some scenarios. As you start to get paid for your work you can use that money for your tools, just like any trade.
@chouaibbz3126
@chouaibbz3126 Ай бұрын
where is the assets
@andrewmoreira8744
@andrewmoreira8744 Ай бұрын
do the same thing, but this time with framer instead webflow.
@paulmuresan9523
@paulmuresan9523 Ай бұрын
What AI is doing is very basic. Stop calling it "revolutionary". Graphic on the left content on the right and the reverse with few cards section... WOW. Soo incredible. Just marketing (overhyping everything).
@SonTran-dh9db
@SonTran-dh9db Ай бұрын
QQ: In post production phase when you are preparing your resource images to be plugged into the figma doc...What frame of thought are you in when deciding on the size/dimension of each image? Is there a standard or best practice based on popular aspect ratios?? Thanks for the wonderful tutorial.
@observer3359
@observer3359 Ай бұрын
Couldn't you have done that much quicker in framer ?
@Fusion-Expert
@Fusion-Expert Ай бұрын
Brief …..?
@chriswertz5825
@chriswertz5825 27 күн бұрын
This is such a great video, thanks for taking the time to make it. The switch to longer form on your videos has been a nice one. The updated Webflow Master Class is also so comprehensive now, but these vids are full of valuable nuggets l. Keep up the great work. 🫡
@178rohan
@178rohan Ай бұрын
I bought relume and i am half impressed and half disappointed when you look at the components library for most pages / sections there isnt that many choices thats the only downside for me now!
@Yusuf_Ucgul
@Yusuf_Ucgul 29 күн бұрын
You can search "uncommon components" if you want something creative
@fiveshorts
@fiveshorts Ай бұрын
So essentially, you’ve had no ideas of your own. You copied someone else’s creativity and colors. You lifted the vibe from a museum. You let MidJourney blinker into an uninspiring art direction. Then Relume to avoid having to think about customer journey and experience. Components so you don’t have to think. No consideration for the end user. Maybe they’re all just stoopid and only expect the expected. But this is why AI is killing the creative process. You’re simply creating more noise and less signal. This is not a workflow or best practice to benefit the customer or their customers. This is a workflow that allows YOU to deliver two sites in the same time that one may have taken. It’s the homogenization of the process. The lowering of the bar. And it’ll be a year before those same clients are delivered a tool that lets them do everything you just did, with one click, then they just keep hitting the Remix button until some know-nothing sees something they like. And AI will have left you behind to go play with its new friends.
@clemenskotoku
@clemenskotoku Ай бұрын
You're right in a way but no ideas of his own and copied? Maybe you always come up with contents/layouts that are new under the sun. If someone is going to be replaced by AI like you're saying it's definitely not Ran lol. This is not entirely how he executes real world projects, he conducts strategy session to know what are required to achieve the goal of the website. You're not gonna get all of that in a video like this.
@iamsavishka
@iamsavishka Ай бұрын
This video is really valuable. I love it
Top 5 Webflow mistakes beginners make
9:25
Flux Academy
Рет қаралды 62 М.
Why he switched to Framer from Webflow
11:10
Flux Academy
Рет қаралды 16 М.
Eccentric clown jack #short #angel #clown
00:33
Super Beauty team
Рет қаралды 20 МЛН
Osman Kalyoncu Sonu Üzücü Saddest Videos Dream Engine 118 #shorts
00:30
SHE WANTED CHIPS, BUT SHE GOT CARROTS 🤣🥕
00:19
OKUNJATA
Рет қаралды 14 МЛН
1 класс vs 11 класс (неаккуратность)
01:00
БЕРТ
Рет қаралды 4,4 МЛН
Webflow Tutorial: Build Your First Website!
4:08:56
Bring Your Own Laptop
Рет қаралды 125 М.
5 Must-Have Plugins for Figma Designers
12:24
Stephen Wise | DemandFlow
Рет қаралды 12 М.
My harsh advice to someone who wants to change their life
17:43
Why I switched to Framer from Webflow
12:17
Omar Farook | Building Tech Startups
Рет қаралды 147 М.
The only 6 fonts web designers need (and they’re free!)
13:40
Flux Academy
Рет қаралды 18 М.
Best Web Design Resources 2024 Worth Bookmarking
7:03
Codex Community
Рет қаралды 105 М.
Figma Advanced Tutorial: A 2-hour Masterclass
2:12:45
Bring Your Own Laptop
Рет қаралды 351 М.
Learn CSS flexbox in 10 minutes! 💪
10:01
Bro Code
Рет қаралды 105 М.
Eccentric clown jack #short #angel #clown
00:33
Super Beauty team
Рет қаралды 20 МЛН