Web Design I UI/UX Design
CoQuest Landing page design
How it started
Project Human City (PHC) updated its company website design and is looking to revise the landing page for the CoQuest application. Although the landing page was designed, it was never launched due to delays in the application's development. As the CoQuest app is nearing launch, PHC wants to revamp the landing page to align with the company’s new website. As one of the UX designers for the CoQuest application, I collaborated with my coworker to create a new landing page.
What is CoQuest?
The Problem
Upon launch, the CoQuest landing page will be publicly accessible, and PHC aims to attract three distinct target audiences: users, investors, and community groups. However, the initial design lacks a clear focus on these target audiences and does not effectively showcase the application's unique features and experiences.
CoQuest, which stands for Collaborative Quest, is an engaging, community-driven platform where every individual becomes a participant in the quest for a project that aims for a better world. Individuals and communities can create projects and tasks for their participants and hire individuals who are seeking opportunities.
The Solution
To effectively engage users, investors, and community groups, the CoQuest website needs to be redesigned as consistent looking with the company website with user-centric interface that accommodates the distinct needs and expectation of each target audience.
My Role
UX Design
UX Research
Team
2 Designers
1 Developer
1 Marketer
Target Audience
General users
Investors
Community groups
Duration
3 weeks
Project Objectives
Enhance user engagement
This project aims to significantly increase user signups and app downloads by enhancing the website's user experience, making it compelling enough for our target audience to download and sign up.
Secure funding
Securing funding is essential for maintaining an application, and investors differ from regular users. We must tailor our approach to each target audience. For investors, it's important to provide both social impact and financial return to secure their funding.
Build trust
Building trust is crucial in business. Community groups, including nonprofit organizations and local communities, are more likely to collaborate with companies that share their values. Therefore, establishing trust with these communities is essential for increasing the success of projects.
Overview of initial landing page
To view full content of initial landing page, please contact me.
The initial landing page used a mixed-content approach without defining a clear target audience, which failed to deliver information and confused website visitors.
Major issues from initial landing page
No specific target audience identified
CoQuest feature is missing
Design remains unfinished
Content is lacking
Research and Discovery
Stakeholder Interviews
We interviewed with angel investors, non-profit organizers, and general users who are looking for work opportunities to understand their expectations and needs. Interviews were conducted remotely via Zoom.
Discoveries from the interviews:
Each target audience has its own expectations and needs.
Users expect the application website to be straightforward.
Users typically look for key features or functions when deciding whether to download an app.
Competitive Analysis
CoQuest stands out due to its unique features and functionalities, making it challenging to identify a direct competitor. For this project, we concentrated on the key features of CoQuest and conducted research accordingly. In the process, we identified some potential competitors that offer similar major features. Major competitors were Candid, Volunteer Canada, and VolunteerMatch.
Discoveries from competitors:
A clear slogan that effectively communicates with users.
Dedicated pages tailored for each target audience.
Utilize community-friendly imagery along with a consistent theme color design for their website.
How can we design a website that serves all three target audiences while enhancing user experience?
Focus point
Ideation and User Flows
With our insights and objectives in mind, we aimed to develop a solution tailored for three distinct target audiences by creating additional pages. We created a user flow in Miro to align our team members and avoid design inconsistencies.
User flows details:
Dedicated pages for each target audience.
From the landing page, users can directly access the CoQuest App.
Novice users who do not have an account yet can create one after clicking "sign up" on the sign-in page.
After signing in and the sign-up process, users can access the CoQuest App.
Design Concept
Consistency is crucial when designing websites, and it's essential to have a unified concept while collaborating as a team. To facilitate a smoother design process, I created a color palette and a Figma file for our team to use. This allowed us to share design ideas and provide feedback directly within the Figma file.
Color Palette
CoQuest's logo features a globe and reflects the Earth's natural colors. For the landing page, I created a color palette that aligns with this theme and chose to implement a warm and welcoming design concept.
Collaborated in Figma
We created a Figma file to collaborate with our team, sharing our ideas based on research and the color palette.
Prototyping in Figma
Improvement I
We created pages tailored to each target audience, and now, each audience has its own theme color that aligns with the CoQuest logo: blue for public users, navy for investors, and green for community groups.
Improvement II
Users can view images of the app's features that correspond to the descriptions in the card section, which are designed to meet their needs. The card section on the investor's page highlights all the programs and functions that CoQuest offers to its investors, capturing their interest.
Improvement III
The navigation bar clearly states the target audience so that it is easier for users to navigate to the page dedicated to them. The navigation bar is also stuck at the top of the screen, making it easier to navigate to the sign-in button, increasing user engagement.
Future Scope of the Project
Currently the project is in development mode and as soon as the application is launched, these would be the following steps:
Update content images based on the application final launch design.
Update CoQuest card on Project Human City’s website.
Usability testing before launch.