The best converting websites always have a proven and well-tested process behind them. Once you perfect your design process and make sure it’s repeatable, measurable and user-centric, you can apply it to various different projects. How to develop a process like that? Here’s an inside look into our unique design process that’s been helping our clients grow for years.
Why You Need A Tested Process
Beautiful design can wow your users, but only the result of a good process will convert according to your business needs. The final result – a website – is only as good as its foundations. No amount of shine is going to cover bad decisions, and those will decrease your revenue.
Decisions need to be made based on data, not gut feelings. Good designers should be able to justify their decisions in a convincing way, yet some still base decisions that directly impact their revenue on hunches. A good framework takes a lot of the guesswork out of the design. And having an established process ensures that the important details are not missed.
The best converting websites are always the result of a tested and trustworthy process. If your process is flexible, repeatable, predictable and user-centric it can be applied to various needs and projects.
User Research And Testing To Understand The Target
This is where most companies fail. Trying to save money on skipping research, user testing and data analysis feels like a good idea at the beginning. You feel confident that you know what you need for your website, how you want to stand out, what the users think. But 6 months after your design is implemented you may learn the hard way that cutting costs early on puts your guesses to the harshest of tests. Hear, hear: the winners are data driven.
Analyse The Competitive Environment
You want your website to be unique. A memorable experience for the user. Conversely, the user wants to solve their problem without learning new interfaces. In order strike a balance between uniqueness and predictability you need to research how similar problems are solved. Some questions you need to answer in this phase include:
- What are the design patterns used in similar situations?
- What can be done better and innovated upon?
- What visual language does the competition use?
- How are the products/services presented?
Re-inventing the wheel is rarely a good idea (while staying on budget). Some solutions already exist, and it wouldn’t be cost effective not to use them.
Use Workshops To Discover The Needs And Goals
It’s difficult to come up with all the needs and goals in a creative brief. It is much easier in a structured conversation during a workshop. Your domain knowledge and our expert competence lead to an in-depth discovery, and this leads to a successful project.
Here’s where workshops excel:
- Aligning the views of all participants,
- Attacking the problems from different angles,
- Analysing the goals and ideating ways to achieve them,
- Discovering and documenting expert knowledge,
- Deciding on the right content for the purpose,
You will be in the capable hands of expert facilitators who conducted more than a hundred successful workshops. The meeting can be conducted in a shared physical space, or online, using a virtual board. The note-and-vote methodology ensures that each participant has an equal voice, while the decisions are swift and clear.
Plan The Work Before Opening Up A Design Tool
In order to tackle a complex website we split the work into smaller tasks. Starting with a good plan is the best way of ensuring that the whole design is cohesive and no details are missed. This includes decisions on user flows: what would the users encounter in their journey? What screens, content, interactive elements are needed to achieve your business goals and match them with tasks users need to achieve? This phase results in user flow charts and a site map that shows a tree-like structure of the entire website.
This is the key element to ensure great ROI. Short design sprints that result in demos allow you to see the work in progress and give frequent feedback. The functional prototypes we start with present the layout of information, content, and linking. Functionalities without the final graphic design. This is on purpose: to restrict the decisions to how it works, instead of fixating on how it looks.
Using Figma allows us to present the wireframes as a clickable prototype that can be tested on the target device. We employ users from the target audience and get feedback at this early stage, then change the prototype accordingly. This allows us to rely on user data, and get real user feedback before writing a line of code which, in the long run, is better for the client’s budget.
The Power Of System Approach
The final looks of the website are informed by two aspects: the functional prototype and a design proposal. We choose a traffic-heavy page, usually the product or service, that would give a good overview of the final design. Then we propose the design that uses your brand guidelines and presents the product in the best possible way. We discuss, iterate, and get your approval before moving forward.
Why not start with a homepage? Because iterating on it first is not the optimal way to use the budget. This is a hub site, usually quite complicated, and time-consuming to create – and that’s why the feedback loops tend to be longer and involve more complicated decisions. It’s better to start with the smaller pages and elements first, before moving on to the face of the entire project.
Having made decisions on one page, it is time to create a style guide for the rest. This user interface (UI) kit contains:
- Colours, both brand and functional (errors, success, backgrounds, labels),
- Text styles for text and multiple headings,
- Construction grids and spacing rules,
- Interactive elements (buttons, inputs, controls) and their states,
- Elements common to all pages: headers, footers, content cards,
- …and more.
The UI kit is a toolbox that collects all the building blocks of the website. It allows us to ensure consistency within the designs and speeds up the work. Changing the elements in the UI kit affects all the instances throughout the website. This optimises the work tremendously and lets us focus on creativity without repeating the busywork.
This phase results in a prototype showing exactly what the website would look like. This is subject to testing, just as a functional prototype. Findings are assessed and incorporated into the final version.
Work Closely With The Development Team To Deliver The Final Product
Our designers create solutions that are effective to implement. They discuss the designs with developers throughout the process, optimising the work needed to develop the website. Difficult decisions are made to ensure that the final result will work independently of screen size, resolution and browser. During the implementation phase the designers are present as quality assurance and consultants. The final result is a shared effort that adheres to the highest standards.
The Unique Value We Bring By Using This Process
We bring you great results while optimising your budget. This method removes the risks of expensive changes late in the process. All parts of the process are transparent and feedback loops are short and effective. Basing the work on discovery workshops allows us to meet your expectations in the best possible way.
Our approach ensures we make informed decisions instead of guesswork and builds on solid foundations of shared understanding. User testing is included throughout the process, instead of pushing it to the final phase, so the website you get in the end is proven effective even before the launch. This user-centric approach lets us address the user needs and meet your business goals simultaneously.
Our expert designers leverage the power of system approach and development knowledge to present effective, simple solutions to complex problems. While implementing the project we ensure the quality and optimise the work for efficiency. You can get the best results without the stress of an untested process, when your decisions need to supplement the lack of data.
All in all, investing in a solid design process gives a significant increase in the success factor of the project. Without it a designer might shake hands with you at launch day where everyone is happy with the result. But the real challenges and possible lack of growth will bite back after a few months, or a year – when frustrated users are (not) using your solutions and comparing it with your competitors. So, contact us and let’s get your project started with the right design process.
Łukasz is Head of Design at Frontkom. He has more than 20 years of experience and is keen on solving problems using design. He writes about best practices, universal design and how user experience can help your business.