Tips & Tricks for Learning Webflow Faster

so last week someone reached out to me

and asked me what tool they should learn

first if they want to get into no code

and the answer is it really depends on

what it is that you build

but the first tool that i started off

with was webflow and webflow has

definitely been the most valuable tool

to learn

webflow is however one of the harder

tools to learn which is why i decided to

make this quick little video for you

with my top three tips or suggestions on

how to learn

webflow if you are new to this channel

welcome my name is connor i'm the

founder of the unicorn factory a

freelancer marketplace

in new zealand i created the entire

platform from scratch using noco tools

like web flow ear table and zapier

so if you are a non-coder and you are

looking for ways to build your own

online platform your own online business

then you are

in the right spot all you need to do now

is subscribe to the channel and i will

be sending you more videos

and tutorials like this in the future

but without

further ado let's dive into the first

three tips on how to get started with

webflow

so one of the easiest ways to learn how

all the controls on webflow work

is by editing templates when i started i

tried to learn

by building a website from scratch from

a blank canvas

and honestly i just could not build

momentum

so the first suggestion that i'd make is

go to

the webflow website create a new project

and pick one of the free templates that

you can then edit

cool so all you need to do is just

scroll to the free templates section

pick a template let's click this one

here start your

five-star project and now what you're

looking at is a pre-made website that

you can start modifying

so some things to know straight off the

bat is that you use the left side the

navigator to see what the current

structure of the side is

you can also add additional elements to

the structure so let's say we want to

add another text under this you can add

you can click the plus button click on

heading

and what will happen is another element

will be added underneath

on the right side you have the style

panel and on the style panel is where

you can make

visual changes to the different elements

so let's say for example you want to

increase the size of the font

you just click on the text that you want

to modify and then you just

scroll around the side here till you see

the different elements and then

you can just type in how you want to

change it now

on the right side are all these

different controls that affect

the style of different elements on the

page

if you want to change a specific element

all you need to do is click on it

and then go and make the changes that

you want so the point of this is not to

learn how to build a new website just

yet

at the moment all you want to do is get

familiar with the different controls

inside

of the webflow designer now i would

encourage you

to particularly focus on the design

panel where you can change the style of

different elements

and try to get familiar with as many of

the controls as possible

some good challenges to start off with

is try to change the color of the

buttons

try to change the color of the button on

hover

try to change the background image and

as soon as you get familiar with that

you're already

quite far ahead in terms of knowing how

webflow works

and so once you are comfortable with how

the design

panel works now what you want to do is

you want to learn how to structure sites

properly

and this is where we now go into tip

number two so the next thing that you're

gonna need to learn is you're gonna need

to learn how to structure your site

properly and

you're really also gonna need to learn

how the entire design process works

and that is can be quite overwhelming so

understanding how the tool is one thing

but then knowing how to start

and finish a project is a whole new ball

game but luckily

webflow has one of the best no sorry

they have

the best internal education platform i

have seen

any company have and it's called webflow

university

so webflow university is a website that

has a whole bunch of lessons

about how to set up a webflow site they

have lessons

ranging from everything from how to use

the tool to how e-commerce works to how

seo works and

so on one thing that is particularly

fantastic about

webflow university is the production

quality of their videos

is just on another level they break down

everything super clearly to make it

really understandable for anyone no

matter where they are in their webflow

journey

the storytelling and the hosts are

hilarious

which makes the whole learning process a

lot easier and most importantly they

cover

every little aspect of using webflow so

you can check out individual lessons

depending on

what problem you're trying to solve at

any given time but they also have entire

courses with a series of lessons that

allow you to do things like build an

entire project from scratch

so the course that i did that really

helped me understand how webflow works

was the create a custom portfolio course

that is now

on webflow it's an eight part series and

it covers absolutely everything that you

need to know

in the design process from coming up

with the ideas to

building it to making it mobile

responsive to using the webflow cms so

at the end of it you would have rebuilt

an entire portfolio website

and you'll know how webflow works so

after doing that course i got really

comfortable with

understanding what the process of

building a website looked like

so just to recap the steps that we have

so far first of all

get familiar with some of the controls

make some changes to some pre-made

templates

and once that is done jump over to

webflow university

and do one of their courses that allows

you to build a website from start

to end so if you manage to do all of

that you're pretty much 80 of the way

there and i'm convinced that you can go

through both of those steps within a

month

and you'll feel comfortable with using

the tool then and at this point

most of the stuff that you'll continue

to learn are mostly refinements

and the best place to learn refinements

is through the webflow showcase

and that is where we're going to be

going for tip number three so the

webflow showcase is

a library of projects created by other

webflow users

now the webflow showcase has some of the

most

amazing work whenever i go and visit the

webflow showcase i feel the need to

redesign my website which is a bit of a

problem

but that's just how good the work is

what's particularly cool about the

webflow showcase it's not just do you

get inspired by amazing work

you can also jump into the webflow

projects and inspect it from the

perspective of the designer so you can

see how the

designer structured their site how they

design

certain elements and if you are looking

for ways

to rebuild certain sections that the web

flow designer made

then you can see exactly how they did it

in the webflow designer so this is the

webflow showcase

just scrolling around on the first page

you can already see what amazing

projects are out there

so let's go and check out the pitch

webflow rebuild

that was added by andrea so as you see

when you click

into the website you actually end up in

the designer so you can actually see how

it was structured and you can already

see that

it's an amazing looking website now

let's say i want to learn how to build a

section like this

all you need to do is just click into it

and then you'll be able to see on the

left side in the navigator

how that particular section has been

formatted i found being able to inspect

these types of projects particularly

useful when it came to seeing how to

make your site more mobile responsive

because that was something that was

quite challenging for me early on

but then just being able to look inside

of the different elements seeing how

people structure it how they name their

class names

and how they format it at certain stages

was really helpful to really just

quickly understand how i should approach

it so one last small little pro tip

is some projects inside of the showcase

are cloneable which means if you see a

project like i just showed you you can

actually clone it put it into your own

designer and then just rebuild it

without making any changes

to the original copy that was uploaded

to the showcase

and that's it those are my free tips for

learning how to become a web flow

developer faster if you are brand new to

the tool

i think the most important thing to know

is that it is a

difficult tool to learn no doubt but if

you stick to it and you commit to

building something

then you will get there for sure um some

people

take three months to get there like

myself but i'm convinced that

if you just follow some of the tips i

gave you you'll be able to get there a

lot faster

and just so you know what kind of

opportunities are out there at the end

of the tunnel

i made most of my freelance money over

the last two years building

websites for people and i managed to

build the unicorn factory without having

to hire any developers

and let me just put it this way even

though it's hard to learn

it's absolutely worth learning so if you

enjoyed this video if you feel like

those tips are valuable please leave a

like

and a comment on this video and

definitely

let me know what kind of things you're

working on i think the one thing that i

forgot to mention is that the webflow

community is awesome they're a whole

bunch of people that create amazing

tutorials like the pixel geek

and run cigar so definitely check out

what else is out there but the most

important thing is just get started

i need you to learn how to build web

flow so that i can rope you into

building your own directories and

marketplaces

but that was it have a great one and

i'll see you back

for the next one