About the project
Ikana Business Solution is an agency that focus on helping business in digital area, from marketing, sales to development of website or mobile application. As they are growing their business, they realize that having digital existence such as business website can bring more leads to them.
Hence, the focus of this project is to build their first business website that capable of showing their credibility in term of what they offer and what they have accomplished.
What is my role?
i designed the whole website from scratch, from defining the flows, information architecture to creating the final UI.
What are the goals?
To build a business website that are capable of delivering the exact information that people need in order for them to understand & convinced on why they might need their helps. Which in turn, will bring more clients to them.
Who far is the scope?
Designing 0 to 1 user experience of the website that should containing all information related who they are, what they are doing, how people can reach them & get some estimation of the services.
What we are solving?
Clean delivery of information, improve credibility and help the client to estimate what service they might need & how much it will cost tem.
The design processes
Breaking down the brief
To begin with, this client has prepared some documentation containing detail information about the business they are doing. This include what services they provide, their process & strategy as well as their target market.
To kick of this project, i started creating user personas to give me & my client a clear picture who are we targeting with this website and what their personality & struggles.
Finding the right idea
As the requirements became clearer, i began by narrowing down the information and transform it into simple site map and information architecture. One of must have feature that the client required is the project calculator that very important for them to allow their client to estimate the service and budget they might need.
Since this website mainly used to funnel down the potential clients, i want to make sure in every page there should be easy access to contact or reach out to the agency, as well as entry point to the project calculator.
One of the thing that this clients want to me focus more is how we can convince the prospective clients more. The idea that i initially have is to include "Who need our services", therefore the prospective clients will feels relatable to this and hopefully decided to proceed further with their services.
Transform the idea into wireframes
As i have defined how the users will move and navigate on the website, as well as what information they will see. I now transformed it into more visible wireframes. There were multiple iterations done on the wireframe as the client provide some feedbacks, here is what the final wireframes look like.
Making the ideas alive
From earlier discussion with clients, they have decided the brand direction that they want to achieve for the agency. They want to have more cheerful and vibrant branding that capable of representing credibility and trustworthy to their potential clients. With this branding we should be able to convince them that they are capable of solving their business problems.
Primary color
Blue will be the main tone that is mainly used for buttons, background & emphasizing the important informations. This specific shaded of blue is chosen to communicate creativity & fun, but still show credibility.
Secondary color
To complement the colorful primary color, few shades of black is defined. These colors are mostly used for typography, background and highlighted states.
Typography
Stronger and sharp font like Poppins is purposely chose to go together with the color for the entire look and feel of the website. Besides, Lato font is also chosen to be used more on text and descriptions for easier readability and contrast.
Poppins
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
Regular
Bold
Black
Lato
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
Regular
Bold
Black
The home page
The information provided on the home page is designed in away that if it is read from the top to bottom, it will reveal the information in an order as if you want to know and understand about the agency and it’s business.
Main menu button is made floating to make sure that it is always visible and accessible from any scrolling positions.
About us page
This page is mainly telling the users about the company by highlighting more on the value that the business can provide, as well as showing who are the people behind in order to build trust from the potential client.
Besides, i tried to always make the agency reachable by always having entry point to contact the company at the bottom of each page. This is because, we will never know at which page the potential client decide to finally reach out for the services.
Giving the potential clients a good understanding about the services they provide is very important for the agency. So, i give more thought on this, basically how can we provide those information without only describing it in full text.
i decided to only show a brief explanation about the service, then let them know why they might need this and what will they miss if not. But, if they interested more about this service, the potential clients can click on the button to see the further details about the service and the processes for it.
Services page
Previous projects page
It is very important for the potential client to see what are the things that we have done so far. With this, they can see the scope of project that we have completed and how we can help those businesses.
Where to find us page
A pretty straight forward page where user can contact the agency in 2 ways. Directly contact through email or fill up the inquiries, then the team from the agency will reach out to them.
The objective behind this feature is to help the potential clients to have better clarity on what services they might need and see the estimated budget for that. With this, they will need to provide us with some information about their business area, main products or services they offer and the current challenges they are facing.
Based on that, with certain logic that build behind it, we’ll be able to pick the purpose services and hence the estimated budget for it.
Project calculator