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

‍