Redesigning a website is not the same as designing it from scratch. In fact, it’s even more complicated, because you need to pay attention to factors like brand identity, product positioning, and current clients base.
Ask the right questions
First things first, every project starts with a why. As a designer, my job is to ask questions about your business. Not just questions, but the right questions.
Why is a redesign necessary?
What are we trying to achieve with the redesign?
What are the problems with the current design? (UX)
Are the website visitors not converting to clients?
Or there are features that are missing and need to be incorporated?
How will you measure the success of the new design?
Define the redesign project scope
Redesign can mean a lot of things.
You want a fresh, new look or rather you want to tear everything apart and build a completely new web presence- new navigation, new colors, new features, on top of that the main CTA should be purchasing a product and not setting up a meeting.
Before starting the actual work I need to verify that the project brief contains a precise scope of the project. Ideally, in the form of a well-written brief.
You won’t believe how many clients come to me saying: I want you to redesign my website- just make it look better. It should be part of a designer’s job to ask questions and make all those fuzzy assumptions more clear, but honestly, as a freelancer, you are not part of the company and part of the team. So, inevitably you fall into the trap of designing the old way: you get the project requirement, you propose the concept, you refine the concept based on the feedback you get from your client, make the visual design, maybe a clickable prototype if that’s desired, and then you hand it over to your client. Your job is done.*
While it may be quite difficult to change your client’s mind, you might as well try to convince him that incorporating Lean UX practices are better for the business. When defining the scope of the project, the client should involve the whole team, introducing the freelance designer into the team and letting everyone work together to make sure that the design premises are validated. I try to explain to the client the importance of involving the whole team in the (re)- design process.
*I am not a front-end developer, so when someone needs a new design I deliver Sketch files and clickable prototypes.
Defining the color palette
First things first, I start by choosing the colors for the new design. My choice is influenced by the project scope or existing brand identity of the client. Obviously, if there is a well-established brand style, I don’t want to mess with it!
Choosing the right typeface
When searching for the perfect typeface, I usually make use of Fontpair. A nice typeface makes all the difference in design!
Wireframing
After I am done with the basics, I move to creating wireframes. I usually start with low-fidelity wireframes, consisting of gray blocks, text, and icons.
Using colors in Wireframes is a big no-no! It’s important to manage your client’s expectation when it comes to wireframes and educate them that wireframes are not the final design of a website in a gray color (which is what a lot of people seem to think). I usually create my Wireframes directly in Sketch.
Iteration
This is the time where I push the client to share those initial concepts with the whole team, across all departments and get their feedback. I’ve found that sharing my work on InVision and letting everyone leave their comments works best. This process can take up to several weeks, depending on the size of the project, but it’s SO worth it. Besides, making mistakes at this point is the cheapest for the company.
Converting Wireframes to High Fidelity design mockups
Once all the feedback is gathered and I have incorporated it, it’s time to move on to the visual design part, which is my favorite part of the process 🙂 I execute all my designs in Sketch. Ever since I switched from Photoshop to Sketch two years ago, I ‘ve found it extremely easy and a lot faster to work with. I am never going back to Photoshop ( Sorry, not sorry).
Project Handoff
My deliverables usually consist of the following:
- A Style Guide (if a new one is needed)
- A sketch file with all the designs
- A clickable prototype made in In Vision
- In some cases, I also deliver documentation files.
So how do you manage your redesign projects as a single freelance designer? Let me know in the comments below!
