Reflections from my first design project
My induction in the design world was not the smoothest. It all started with designing my personal website before I officially labelled myself as a website designer. In the past few years I have worked on writing content for web pages, played around with WordPress (the most awesome open source tool for website design) and closely followed up on discussions pertaining to design. But being knowledgeable is one thing and being experienced is another.
When I sat to create myname.com, I followed the simplest formula possible to design a website — find a host, find a WP theme, write the content and press PUBLISH. Really. It was as simple as it sounds. Of course, it took me some time to figure out the simplest process too but I have to say I did feel confident after I published my first site on the web.
I was quick to say, it is time to find work where I could put this skill to use. Soon enough, I got my hands on a freelance project. Create a website for a small business in the insurance space in Toronto. Even with the inadequate exposure to the process, I moved ahead with my too-simple way of designing a website. As I got more and more involved in the project, I felt my struggles with the process were only getting magnified. In that instant, I couldn’t put my finger on any one thing that was going wrong and why was it becoming an overwhelming task for me.
It was only in retrospect and after speaking with a few people from the industry that I began to see what could have been done better. Following are some of the insights that have helped me become a better website designer.
Know your page builder
While selecting the theme for my client’s website, I was so focused on the layout that I wasn’t paying attention on the back end. Once the client finalized the theme and I installed it on WordPress, I realized that I would be using Bold Builder to set up the pages. From the perspective of designer’s user experience, it is not the best one. It does not allow for a side by side preview, neither has features such as padding and margins that are useful in customizing designs and generally seems to slow down the process.
As I started doing more research on builders, I discovered the different types of builders and their functionality. What is important here is the ease of usage you have with the builder as it can be a real time saver. The more comfortable you are with the elements of builder, the faster your process becomes.
I have now experimented with a few builders and Elementor seems to do the trick for me. I find it extremely useful that I can preview the change in design in real time and do not have to preview in a separate tab. Moreover, the basic version of this builder is so rich with features that I can bring out a lot of aesthetic appeal with simple elements such as lines and shadows.
Content first, design later
This was by far the most important insight and one of the biggest learning from my first freelance project as a web designer. For this project, I was mainly responsible for designing pages and another copywriter was hired to write the content. A basic menu structure was decided before writing the content or starting design. Based on this discussion, we finalized the theme. My thought process at this point was that I know how the theme is laid out and now the copywriter has to write the content as per the elements of this selected theme. A totally wrong approach.
What I wasn’t realizing was that the aim of content is to bring out the values of the brand and the aim of design is to ensure that content stands out.
If there is a certain content that needs to be communicated to the target audience, then a supporting design can be created, but if we are being orthodox about design then it is quite likely that either some of the content will be missed out or would be irrelevant. Hence, the best way to approach this is to have content first and design follows.
Set up a mood board
The significance of inspiration can never be undermined in designing. Whether you’re searching for ideas or you’re creating a wireframe before actually designing, it is important to set your creative thoughts in motion. All of design creativity is not always original, often it is inspirational. For me, in this project, the issue was that I was too fixated on design of chosen theme (as you may have already noticed by now!) that I wasn’t thinking about other design inspirations that were available to me. And definitely not creating wireframes (Big mistake, I admit!)
The best approach would have been to know the content first and then visualize the content in various design formats and create the most viable design. To be able to do this, a mood board is your best bet. Once you closely start looking at other designs, whether on Pinterest or Behance or simply other websites, the first thing that will happen is that ideas will strike you. You would start considering using various design elements. Not only ideation, it will also ease out the process of wire-framing. Even a simple pen and paper wireframe before building the actual page, can save a quantifiable amount of time.
Do your research
One of the pre-requisites of designing is research. The first step is to know the purpose of the website that you would be creating. Is it to create more awareness about your brand or educate your customers or simply a home where your potential customers can contact you?
While I did conduct some competitive analysis and trends within the industry, there was scope to deep dive a bit more into the brand. This would have not only helped me in designing with empathy but also be able to set the path for understanding user activity on the website.
It is imperative to do your research. Who are the users? What are they looking for? How does the brand fill the gap? And later on, it will help understand where are the users spending most of their time? What is the average amount of time spent by each user? Are there any places where they are getting stuck?
At this stage, having user personas wouldn’t be a bad option at all.
Prevent scope creep
Before signing up for the project, I established an overview of the tasks that I would be undertaking to create the website design. What I didn’t do however is that I didn’t lay out a detailed action plan along with the time that I would be spending on each task. I definitely did not account for any buffer time in case things go south. And well, there were a few tasks that took up so much more of my time than I anticipated. Overall, it resulted in me spending a lot more than I should have been.
Scope creep is a pretty common phenomenon that occurs in a lot of processes, and design process is no different. Especially as a freelancer, it is hard to draw the line between what is accounted for and what is not.
Thus, what would come in handy in a situation like this would be to have a design brief in place. A design brief would be the document that would entail not only the client requirements but also what you as a freelancer will be offering. Preventing scope creep may not be completely possible but it can be minimized to a great extent.
Apart from these insights, I also observed that designing a website, especially as a newbie, can become too overwhelming too quick. There is a lot that one only discovers during the process. Not everything comes from knowledge, a lot is learnt via experience. Hence, I definitely recommend taking intermittent breaks, clear the mind-space and then bounce back.
This project was a steep learning curve for me but surely helped me to put some things in perspective immediately. Going forward, I am equipped to plan a lot better.
What are some of your reflections during your learning curve?
