Webflow; A Love-Hate Relationship

First impressions…

Sabrina Tee
4 min readOct 14, 2019

I’ve never been good with website design. I’m a perfectionist and I can never be “done” with a website — I’ll notice a misalignment in the table, find the border colour odd and then scrap the whole colour scheme, spot that the sizing of the images aren’t the same...then I’ll tear my hair out in fury, throw my laptop to the ground and say I’ll never touch design again.

Kudos to all designers out there - patience you must have (with website design), young pa(w)dawan.

But I’d love to be able to build an entire website end to end. From the initial conceptualisation stages, all the way to deployment and all that mambo jambo server thangs. That’s the goal and that’s the dream, and well that means I got to pick up the laptop from the floor, find the hand tool on one of the hundred itty bitty squares that these design platforms always have, and soldier on one step at a time.

The graphic designers at my workplace use a platform, Webflow, to build prototypes and production websites. Their work is stunning and elegant but I’ve never had exposure to it all…up to about a month ago.

I’m part of the internship committee at Digi-X, a group of people that manages the sourcing, recruitment, experience, and exit — the entire lifecycle — of a Digi-X intern. Each intern is typically tagged to one of our products, working with each product and business development team but not often with each other. The last batch, one of our initiatives for them to interact with each other, was for them to build the Internship Program page on the Digi-X website. They had to run a cute little kanban board, design the UI, write the copies, take the photos and to put it up on Webflow.

After they left, I had to make some minor changes to the page. Thankfully, I sit next to the graphic designer, and he was kind enough to answer all my questions (“Which itty bitty square was that again?”). I thought — “Hey, this platform isn’t so bad…and less hellish than XD!”. I’ve been meaning to build v2 of my personal website for ages — it’s been a year in fact — and at this point, I know I’ll never get it up if I have to build it from scratch. What a perfect opportunity to try out Webflow!

Of course the learning curve is steep — so. many. itty. bitty. squares. What do they all mean? Half the time, I click and nothing happens! The other half of the time, I click and the damn thing disappears! Having some knowledge of CSS and HTML does help. I know if I want something centred, I just shove that thing into a div and voila! The bones of HTML and CSS are there, just hidden in those itty bitty squares. That said, sometimes it can just add frustration. I know I can justify content quickly by throwing in some inline CSS — but with Webflow, where do I do that? Animations and media queries were a pickle in this department as well.

The two best parts — the resources, namely Webflow University, and the incredibly strong community. Whenever I ran into issues, I would just google my question and someone had definitely already asked it — and they would have screenshots and step by step guides on how to solve it!

The most annoying part — Webflow makes it hard for you to export your project into HTML and CSS or deploy to a custom domain without paying. After spending so much time on this project, I bit the bullet and ended up getting the Basic site plan to deploy my site. The entire process for that though, was seamless, and makes it very easy for anyone without deployment or website experience to get a site up. Hint: they have a student 50% off for 12 months discount, so I dug out my old uni email address and updated my account.

I wouldn’t say I’m a pro, nor would I be comfortable to say I’m even at an amateur level yet…I haven’t even pressed 20% of the itty bitty squares! But I’ll just keep soldiering on, improving my skillset and getting closer towards my goal of being a full full-stack developer, one step at a time.

You can check out what I’ve built here: https://www.sabrinatee.me/

--

--

Sabrina Tee

engineer and product owner at @celcomdigi, thin mint addict, nap enthusiast, and that creepy person that smiles at your dog.