How To Build ANYTHING in Webflow (Endless Possibilities)

[@ArnauRos]

What are your thoughts on this learning method?

[@kishangautam7506]

Really great way to teach how to organise divs to create a complex layout. Amazing tutorial Ros, would love to see more of these complex layout breakdowns.

[@xav8273]

Thank you Arnau for making this video! Really useful for me, you have helped me learn how to build in Webflow. Please make more videos like this. Do you have any good advice for making typography responsive? I often place various text elements in Desktop view, which visually work, but the moment they go to mobile view (vertical and horizontal) the text leaves the constraints of the div block and continues even beyond the canvas size. Why is that do you know? Keep up the amazing work 🙂👌

[@ArnauRos]

Thank you Xav!! Try to use REM for sizing, it will help you with scaling issues :)

[@xav8273]

@@ArnauRos Thanks Arnau. I will see if that works. 🙂

[@rickderico356]

Just wanted to leave a note that your thumbnails are often very intriguing. Also, i appreciate that you're not making mouth-wide-open silly faces like most other youtubers.

[@ArnauRos]

I appreciate that! I try to not be too dramatic :)

[@guillemrossalvador]

Loved this style of video. It was really useful to see the entire design process of a webflow page. You should do more of these!

[@ArnauRos]

I’ll definitely do more of these!

[@meghanheather2046]

Struggling SO hard to get started with Webflow - this tutorial saved me. SO CLEAR and easy to understand. Thank you!

[@ArnauRos]

Glad it helped!

[@shayanzaidi2836]

Seeing someone's process and workflow is so useful, especially someone who's clearly done this so many times. Thank you for this content

[@JasonPullara]

Interesting. I like this video because it shows the thought process of how you create certain things - like finding the correct navbar margin to make it look good. That's the kind of thing you'd never actually teach someone, just something that comes with experience.

[@ArnauRos]

Thanks Jason, its those small things you never think about that make the most value!

[@guillemrossalvador]

Totally agreed, it's awesome to see the actual process of designing in webflow!

[@VTalkTogether]

Love this case study learning method to get to see how professional developer to build website step by step.

[@ArnauRos]

Glad it was helpful!

[@concannonpublishinghouse9057]

Seeing your video today has already completely transformed my entire webflow process! Thank you for putting this together Arnou.

[@mbuit]

Thanks for the useful video, I'm a UI designer trying to learn Webflow and your channel has been a great resource!

[@ArnauRos]

Thank you Minh!

[@mariejae92]

Hello. I have been watching you for some time and this has to be the most understanding idea of Webflow ive seen. Fantastic tutorial 🔥🔥🔥 Appreciate you!

[@ArnauRos]

Thank you Marie!!

[@stevenbeverly9539]

Why do people always find the need to apologize for not being perfect? The point of the lesson wasn't perfection, and no one expects that from you..no need to apologize homie

[@ArnauRos]

🙏🏻🙏🏻🙏🏻

[@skottmellins4584]

Hi, Thanks for this very helpful tutorial explaining the mindset you have from the design to the website. But really, in order to be completely helpful, please could you quickly make the same tutorial showing us how you shift around the boxes to be responsive, from the design to the website… exactly how you did shown in this video. Th kk you for your videos and your advices

[@villiers4623]

You made it look very easy, this is the best way to learn you got a new subscriber

[@ArnauRos]

Thanks for subbing :)

[@pixelperfectpravin]

Box model is way of thinking when creating something on web

[@JaumeRos]

Loved this style of video

[@ArnauRos]

Thanks for watching!

[@Lumanix1]

Bro you make it seem easy. Amazing tutorials. Keep them posting. Loving the videos

[@5214428]

That was a real good exercise to learn. Thanks heaps. Are u going to do one perhaps on making it responsive? That would be awesome!

[@ArnauRos]

Great suggestion!

[@kelvinedionwe]

Hello Arnau, thanks for this video. Was very detailed. I learnt so much in few minutes.

[@Adrian-Sko]

Awesome technique! I'm going to start mapping out every possible div block before jumping into webflow now. Thank you for showing us this. The only thing that keeps bothering me... How on earth would I make this site responsive, and look good on mobile? But I just started learning webflow a while ago, so maybe this wouldn't be as hard as it seems.

[@ArnauRos]

Glad it was helpful! To make this responsive you would be better off using Rems, %'s, VW, as depending on the viewport size it would alternate, but yes it would be a task to make this responsive as is with all the unique layouts

[@prabhatsaini108]

Marking the designs with red lines is a good idea when starting with development.

[@gracedanye]

This is mind blowing, thank you 👌🏽

[@JessieTraslavina]

This was way easier to follow than webflow university which goes so fast I cant follow it, even after buying a 50 inch tv to see better

[@ArnauRos]

glad i could help :)

[@magschilaev1376]

Really enjoyed the walkthrough. What software are you using for screen recording here? I think you were using Loom before so interested why you switched?

[@ArnauRos]

Hey! Just quicktime for screen rec :)

[@Victorkv5]

That's amazing, thank you!

[@removalscompanystokeontren8897]

Would you recommend using rem instead of pixels when sizing items, to help make it responsive?

[@ArnauRos]

Yes! Definitely, this was simply a build excersize, but using Rems would help make it responsive.

[@removalscompanystokeontren8897]

@@ArnauRos did you see the link I posted yesterday regarding parallax effect in the header section? Wondering if you new how to go about designing it in Webflow?

[@rezoan7225]

Want more of these

[@fictionplus]

Love this speed learning stuff lol

[@IlhamYogaPerdana]

Impressive!, how you breakdown that's grids 🔥maybe i can learn webflow with you 👋🏻

[@ArnauRos]

Absolutely! Anything in webflow you want to learn?

[@user-wu7xi9vt6r]

Nice video but how do you set up a bidding system in Webflow? ;)

[@ArnauRos]

Good question! No clue :)

[@Browsing394]

Hey! wondering how i would get into that zoom view at the start? thank you, im on windows

[@robertfreck2701]

Great Video!

[@ArnauRos]

Thanks!

[@DilanDilushanalk]

Is anybody know how to contact a webflow support agent? It is very difficult to me..

[@db2180]

This is a nice video but doesn't tackle major issues. I will give you a brief example: the green star that is supposed to sit between the two Div sections, it does not work. I was hoping you would have solved a problem I constantly have with my own sites. how to make sure it stays where you want it to stay. However, if you change screen size, the green star will move all over the place. When you want precision that method does not work. Also, the bidding section will move to a separate row no longer being apart of the to sections it will appear as if it is below on its own section resulting in a look different from what you are trying to achieve in the Dribbble inspiration page. So while it looks good, (with one resolition )the moment you try to look at it on different resolutions, it will break. I am still looking for a video to explain how to properly use a lot of images etc, without them going to undesired locations.

[@ArnauRos]

Hey! Try using rems to separate distances, it will make it easier with scaling. Also, you will need to modify per resolution if you want a truly specific design :)

[@alok1]

Is it legal? Copying dribbble design without paying the designer

[@ArnauRos]

Definetely don’t do this if you’re copying designs that aren’t yours. It’s fine if you’re doing it as a method of learning but it shouldn’t be done as a published site. If you want to take inspo from this site then I recommend you change up a few elements before hitting publish ;)

[@juankarlomorales4523]

thank god im a front end dev before i became a designer😂

[@ArnauRos]

lmaoo

[@deadshotgaming6449]

can you provide figma file

[@hertderg12]

how would you make something like that diamond responsive?

[@ArnauRos]

Using rems or making it relative to a more accurate point

[@benjaminchurchill3686]

@@ArnauRos Or just make it fixed width, absolute, Auto, Auto, Auto, -(50% of width)px

[@therealaarongeorge]

I think Webflow is a great tool for building websites, but how do you justify the monthly payment with all these limitations/caps? There’s limits on your number of E-commerce Items, Yearly Sales Volume, Form Submissions, Number of Pages, Monthly Site Visits, CMS Records, Bandwidth, and API Requests. There isn’t even a fully unlimited plan offered, and the closest you can get to unlimited is $235 per month… Am I missing something?

[@ArnauRos]

I completely agree with you, their prices are quite high. However the one trade off from cheaper, even free alternatives is the promise that their platform will never break on you. I can't tell you how many times I've had a Wordpress site freeze on me, or crash because a plugin was broken or had to be updated. Granted, that doesn't justify $235 p/m but as it stands a company that really needs that high volume or sales capacity probably isn't worried about being 200$ a month for their main (or one of their main) sales channels. Businesses that need Webflow's top tiers are probably making millions of dollars per year, with many employees. In the grand scheme of things their biggest tiers are for those who really need them as they are nearly limitless.

[@therealaarongeorge]

@@ArnauRos ​ I see your thought process, but for example, if I'm building a sales page for my own online course, collecting thousands of emails is a goal of mine, and so is driving my sales volume. It's completely realistic to see 6/7 figures here, but to reach that I would have to pay $2820 just to Webflow. That isn't including the cost of hosting my courses, additional plugins required, etc. I really want to like and use Webflow, but putting caps and limits on that many elements is really making it hard to be interested.

[@ArnauRos]

I see your points here, however, given the size of your business you really should be asking what is your peace of mind worth? For a 6/7 figure business paying 3K for the best possible sales funnel seems like a bargain to me. But again, looking at it in the form of "I'm paying X amount of money" does seem daunting. Either way, if you're looking to design & build a Webflow sales page I'd be happy to help you out :)

[@abeblue]

Main fear on making website is responsivness

[@ArnauRos]

Take a look at my most recent video!

[@James_m7]

Wish you it was a little slower and more details...thanks!

[@ArnauRos]

Noted!

[@bananaboy9137]

You skipped the building of the nav …

[@ArnauRos]

Navs are natively scalable!

[@orlie_dev]

Is it responsive?

[@ArnauRos]

Nope! Just 1280px :) let me know if you prefer to see responsive design next time!

[@D4wn42]

@@ArnauRos yes please - can't really do without responsiveness for any design

[@fernandopicardi2919]

[@ArnauRos]

sup!