When a Full-Stack Software Engineer Decides to Build a Freelance Website

Last week, a freelance web design opportunity fell into my lap. An author/friend-of-a-friend found out that I was, in fact, a web developer and she asked me to build her website. Like most things in life, you don’t know what you don’t know, and this project for me was no different. I thought that this would be great to brush up on my coding skills and maybe learn a new technology. But sitting down for my first meeting with my new client, I realized just how little my software engineering curriculum alone had prepared me for building freelance web design projects.

Since embarking on this project I’ve been learning so much about this industry, working with clients, new technology, etc. So, here’s a running list of the lessons it’s taught so far.

Lesson 1: Web development and Web design are very different things.

This one I knew before transitioning into web development but very quickly was reminded in this project. Being trained as a Software Engineer is really being trained to work on a team where other developers, designers, testers, managers, etc. work together to produce a product.

Meanwhile, freelance web designers are generalists and have to wear many hats, including those of the designer, developer, accountant, and consultant. Many freelance web designers don’t know more than the basics of coding because they are using Content Management Systems to create websites for clients that are easy to edit and (relatively) quick to build.

Lesson 2: Content Management Systems (CMS)

Before attending The Flatiron School, I actually made a fair amount of websites on CMSs including Squarespace, Wix, WordPress, Cargo Collective, and Adobe Portfolio. When I worked as a design apprentice for a web design consulting company, we were also working with CMS and I spent lots of time populating client data.

For this project, I’ve decided to use Prismic, a headless CMS, for this project along with a Gatsby frontend. This way, I’ll be able to build a custom frontend while giving my client something that she can easily edit and add to over time.

Lesson 3: You have to develop the design first.

A bit about me. I’ve nursed an interest in art/design for some time and have had the chance to work on lots of short term projects over the years. I minored in Studio Art and took various architecture studio classes including a studio. I was a member of multiple Art Boards at the University of Virginia where I graduated in 2018. I’ve worked as a gallery assistant, an arts administration research assistant, a sculpture assistant, a graphic design intern, a web design apprentice, and a freelance layout designer.

Because of my background, I’ve had a leg up in the freelance world but this has still been a lesson for me. The first step towards producing something that my client is happy with is designing the look and feel of the website. Getting ideas down on paper is a necessary part of the process, and there are lots of tools like Figma, Sketch, and Adobe XD to help. Before getting too lost in the details though, wireframing has been a great way to rapidly generate ideas without getting too attached to any single one.

Lesson 4: Write a contract.

This is certainly the most dreaded part of a freelance project for me, but also one of the most important. I worked on a freelance design project in 2018 without writing a contract and while it definitely could have been worse, I certainly did much more work than I had originally been asked to do. Contracts help protect you and your client's time and money and give clarifying structure to the project itself.

Lesson 5: How to (or not to) communicate with a client.

From going over what content she wants to include, to what she wants her website to look and feel like, to pricing, to logistics, I’m on a steep learning curve of communicating effectively and delivering to a client.

I’ve especially been learning how to communicate clearly with my client about what I’m building while not oversharing technical details that will bore or confuse them.

Pair programming, along with prepping for technical interviews, has given me the confidence to articulate an idea or algorithm to a teammate and work through technical problems together. In this project, however, I’m learning how to summarize technical considerations into ideas that are easily understood by someone without a technical background. I still have a long way to go in absorbing this lesson, but with practice, we all get better.