Okay I started using Webflow just a short while ago… and YES it’s without a doubt the most complete application on the market for learning: core principles, layout design, site structure, terminology, etc. So I dove in a couple of months ago… and I would suggest you take a slightly less ambitious approach right out of the gate (if possible). I believe the best way to learn in the Designer is to use: “Rows”
Check out my training page I use:
Just about anything is possible with Webflow, but the problems is definitely in:
“Structuring Sections > Divs > Content” in layers. First get a system for how you want your layers to work…
- Section - for the name of your section, I.e: Hero, Testimonials, Features. I use sections to hold and name my areas that I’m going to work with.
- Div - for the wrapper… this is how I decide the layout system… Grid, Flex, Float… however planned.
- Content - sometimes it’s best to minimize the layers inside of content. Try using only 2 Divs with Webflow at first.
This has easily been the biggest challenge when using Interactions in the Designer… because confusion comes when you have dozens of classes.
To commit to this type of parallax effect for you first endeavor Use 1 row to start and that’s it!
- Section - named “Parallax Row 1” as an example - Display: Block
- Div - name “Clothing” or something like that - Display: Flex
- Content Divs - “Clothing Grid” - Display - will inherit flex but can also flex layer below
- Content - “Clothing Mens” - Display - inherited
This is just a suggested example… but this way, when you add parallax interactions you will have “1 ROW” with everything “In Proper Display Structure as Flex” and you can see the effect better… Besides there will only be 2 or 3 photos in the row… so it’s easier to view and visualize in your head. Check out my layers to see.
Hope these suggestions help. Have a great day!