MentorAsuh

MentorAsuh

February 2025 - Present

February 2025 - Present

February 2025 - Present

MentorAsuh’s Website

MentorAsuh’s Website

Overview

Overview

About the Project

About the Project

MentorAsuh website was strategically designed to drive key business objectives — boosting user engagement, enhancing brand visibility, and generating quality leads for its programs.

MentorAsuh website was strategically designed to drive key business objectives — boosting user engagement, enhancing brand visibility, and generating quality leads for its programs.

Role & Responsibility

Role & Responsibility

Web Designer

Web Designer

At MentorAsuh, I was responsible not just for designing the website interface, but for leading the entire end-to-end website process. This included brainstorming ideas with stakeholders, building a consistent design system, designing the web pages, developing the site using Framer, maintaining it, and initiating new website improvements to support business goals.

At MentorAsuh, I was responsible not just for designing the website interface, but for leading the entire end-to-end website process. This included brainstorming ideas with stakeholders, building a consistent design system, designing the web pages, developing the site using Framer, maintaining it, and initiating new website improvements to support business goals.

Whats the problem?

Whats the problem?

The initiative to create the MentorAsuh website was driven by several key challenges:

The company faced challenges in introducing its brand to a wider audience, especially with the brand divided into two sub-platforms: MentorAsuh (career preparation) and MentorCollege (college preparation)

The lack of a centralized digital platform made it difficult to capture and convert audience interest into leads for ongoing mentoring programs

Ideations

Ideations

To address the two challenges above, I collaborated with stakeholders in an ideation session to explore possible solutions. The outcomes of our discussion were:

Developing a company website to serve as a branding tool that introduces both sub-platforms — MentorAsuh and MentorCollege

Showcasing ongoing and upcoming programs in a dedicated section, complete with clear CTAs to help users easily register for the programs

Requirement Gathering

Requirement Gathering

After completing the ideation discussions, I worked with stakeholders to conduct a requirements gathering process, which led to the creation of an information architecture outlining the key content to be included on the website, as follows:

After completing the ideation discussions, I worked with stakeholders to conduct a requirements gathering process, which led to the creation of an information architecture outlining the key content to be included on the website, as follows:

Design System Creation

Design System Creation

Before exploring the landing page design, I first created a design system to ensure visual consistency and streamline the overall design process. The finalized design system is presented below:

Before exploring the landing page design, I first created a design system to ensure visual consistency and streamline the overall design process. The finalized design system is presented below:

Design Exploration

Design Exploration

Next, I created two design approaches for the landing page, which were later brought into a design review session with stakeholders to decide which direction would work best.

Next, I created two design approaches for the landing page, which were later brought into a design review session with stakeholders to decide which direction would work best.

Design Review

Design Review

The design review session was conducted together with stakeholders, including the Founder & CEO, Co-Founders, Program Manager, and Marketing Manager. A design selection process was carried out, resulting in the following outcome:

The design review session was conducted together with stakeholders, including the Founder & CEO, Co-Founders, Program Manager, and Marketing Manager. A design selection process was carried out, resulting in the following outcome:

Based on the review and collective agreement, the second design was chosen for implementation. The stakeholders also provided several pieces of feedback on the selected design, including:

Based on the review and collective agreement, the second design was chosen for implementation. The stakeholders also provided several pieces of feedback on the selected design, including:

Design Finalization

Design Finalization

Following the design review session, I refined and finalized the selected design.

Following the design review session, I refined and finalized the selected design.

Then, to illustrate the branching flow between MentorAsuh and MentorCollege, the homepage was designed with the following layout:

Then, to illustrate the branching flow between MentorAsuh and MentorCollege, the homepage was designed with the following layout:

Framer Development

Framer Development

And yes — the process didn’t stop at design. I continued to the development phase using Framer. As with the design stage, I started by rebuilding the design system within the Framer project, including color styles, reusable components like buttons, and more, to ensure consistency and efficiency.

After a smooth testing process with no major issues or bugs, the MentorAsuh website was officially launched and can be accessed through the link below:

Results

Results

The implementation of the MentorAsuh website has led to several measurable outcomes:

Gained 200+ new monthly visitors consistently

Increased website impressions by 3K+ within a month

Improved the click-through rate (CTR) to 3%

What’s Next?

What’s Next?

The MentorAsuh Website project is still ongoing. I continue to maintain the website and develop new initiatives to further support business goals, such as:

Implementing a blog section to improve SEO performance

Developing a database of university majors and career paths to enhance the website’s functionality and user value

Key Takeaways

Key Takeaways

What did I learn?

Designing and developing a website at the same time was a challenging yet rewarding experience — it pushed me to think both as a designer and as a Framer developer

Continuously seeking new initiatives to support business goals trained me to think critically, stay proactive, and act quickly when opportunities arise