About the project
Andrea is an early career coach with lots of experience and knowledge to offer to his clients. Unlike many coaches nowadays, he has a proven record of many years in HR, recruiting, sales departments, as well as management experience and a successful career of his own.
Andrea came to us to help him showcase his skills and attract new clients by creating
a website that stands out from the crowd and convinces visitors that he is the right answer to their career problems.
Understanding users
In order to understand Andrea's customers - their needs, struggles, and behavioral specifics - and define what design solutions will work best for them, we started our project by creating an average prototype of his target market and looked into their journey.
We created 2 personas that represent the majority of Andrea's clients. They are split into 2 groups - young professionals (Marco) and fresh graduates (Anna). The targeted country is Italy, and the service will be provided in 2 languages - Italian and English, hence Marco represents a native Italian and Anna - a foreigner. We also took into account different genders and personality types.
Customer journey
The customer journey map represents the way Anna and Marco search for a career coach to resolve their career-related problems. It starts with them realizing the problem and progresses through different steps of the process until they sign up for the service, attend coaching sessions, and leave a review about their experience.
CJM is another way to go in-depth with understanding our client's target market.
Competition analysis
After looking into our customers, it's time to assess our competition in order to devise a strategy on how to make our website stand out and attract clients. To do this, we selected 6 coaches who represent both direct and indirect competition for Andrea and analyzed their offers and websites.
Competition analysis helped us determine what to include on our website and what to avoid, as well as how to better differentiate ourselves. This includes visual aspects, website structure and content, features, and the presentation of our unique value proposition (UVP) as well as the general impression and feeling the website gives to a visitor.
Website structure
To create a good website structure is to craft a seamless journey that addresses most of the visitors' questions and concerns and piques their interest in the product or service. Based on all the information collected previously and the best UX practices, we developed the information architecture. This will serve as the foundation for our designs but can be modified later based on the outcomes of user testing.
Prototype design
To ensure our design meets audience needs, as a next step we built wireframes ( they outline page structure and functionality) and create a prototyp (it simulates user interactions). These will undergo user testing to improve the user experience before finalizing the website design.
User testing
To assess the usability of our designs, we enlisted 4 participants from our target market for a moderated usability study. Testers completed several prompts and answered follow-up questions, which aimed to address our three main "How might we?" goals.
Based on the outcomes of the testing, we made conclusions and implemented various changes described below.
UI design
The logotype was provided to us by the client, hence we had to pick the color pallete and stylistic elements to match with it.
We decided to go with a blue color palette for the website due to its associations with trust, reliability, and professionalism, which aligns well with the tone we want to convey to our audience. Additionally, blue is a calming color that can promote a sense of tranquility and stability.
We also decided to embrace the triangle shape facing up that is present in the logo as it symbolizes progress, direction, and forward movement - which perfectly describes career coaching and its goals.
HI-FI wireframes & Adaptives
The next step following the receipt of feedback from user testing and the establishment of the brand style is to construct high-fidelity wireframes, incorporating the modifications learned from user testing and utilizing the presented above UI kit.
Hi-fi wireframes helped us to visualize the final product for the stakeholders, facilitating adjustments based on their feedback. This process ensured that we were aligning our design with user needs and project requirements before advancing to the development phase.
Recognizing the significance of mobile users in today's digital landscape, we also prioritized the creation of adaptives. It allowed us to visualize and tune the smartphones layout, ensuring optimal usability.
Mockups
Creating visual mockups is important for us as it's assisting our clients to better visualize the end result - not everyone has advanced visual imagination skills.
Improvement plan
Each project has time, budget and other restrictions. Hence, we put together some (not crucial for the product) features and adjustments that can be implemented on a later stage - once the website is already launched or when the budget allows.
