How we design our amazing websites
Our blog posts have spoken a lot about the digital marketing and design industry, but we haven’t spoken about exactly how we go about the design. In this blog post, our head designer Kayla, will be lifting the curtain that too many designers have self imposed. We will be giving you an in-depth look at how we designed the website for one of our amazing clients, The Other Michael Jackson.
Michael Jackson, a business speaker based in the United Kingdom, came to us with two problems.
He had a website that was in dire need of an upgrade, but worst of all that website had been hacked. There were bots spamming him with hundreds of ads a day (some of them not PG friendly).
Here is the original website
Step 1: The great hack!
Our first goal here is to remove the spam posts and secure the website, ensuring that it could no longer be hacked and spammed. In doing this we realised that there was code that the hackers had implanted into the website that would break the site if specific spam posts were deleted. That took a while to work out, but we eventually got it sorted. Time worth spending to sort out the issue properly.
Step 2: Mockup of the new look website
Firstly, what is a mockup? A mockup is a PDF image document that we design to show the client our vision -visually. This way you can see what you are buying. We do this to make sure we have translated the picture you have in your head of what you wanted and it ensures that we are all seeing the same end result.
Mockups are not always 100% final. Primarily because a website is not like a PDF, where you can move things and manipulate things exactly how you want. Plus elements can also look much better in a static format and then when replicated onto an actual website framework, we use our training to ensure you are getting the best version of the overall design. The most important role of the mockup is to reduce the back and forth of design changes dramatically, so they are an integral part of the design process.
For The Other Michael Jackson’s website we assessed the original design and saw how the original design could be tweaked slightly to create a much more refined and purposeful look. Stronger and more secure for a professional result.
These were the final mockups that were produced and approved.
Step 3: Implementation
A website redesign and creating a website from scratch have one main difference, the builder! There is a misconception that a redesign is easier because you already have a base to work from. Designers are like fingerprints, every one is different and designs in a unique way. The redesign process can take a good few hours of just sifting through a website trying to figure out how this particular fingerprint works and how to edit it successfully.
Research complete on the original site, we then have a choice to make with the client. Do we create a duplicate website that runs independently of the original website or do we work on the original website and give the website a “Coming Soon” page?
Both these options are viable but the best action depends on the client and their needs. For example a busy website that draws in traffic and revenue cannot afford to be non-operational for the time it will take us to complete the project, where as a new website launch that will take approximately a week to complete may be able to afford that down time.
For this project the client chose a “Coming Soon” page, so we took down the site and got to work.
This project took approximately a week of design time and we are so proud of how it turned out. It was especially cool to see the visual link between the original and the final website.
As a designer, my projects become a part of me for the time that I am working on them. I dream about them, design them in my sleep, come up with solutions to problems, even in the shower and essentially have my design project in the back of my mind all the time. That’s my process and that’s why everything we do is done with so much passion.
Keep a look out for a blog post running you through the process of a complete brand creation. We are so excited to show you how we design logos, create packaging and discover a brand voice.