Sayuri.M

(en)

Target

Men and women in their 20s to 30s with no prior experience (mainly women).

Challenges

The previous site had a complex structure that confused users. Its outdated layout and limited visuals made it difficult to navigate.

Objectives

Design a user-friendly structure that prevents users from getting lost. Completely renewal the site content and update the visuals with modern design trends. Increase the number of seminar participants and applicants via the website.

Concept

A place to expand the new me.

Information Architecture

To increase the number of applicants from the website, we focused on creating a clear user flow that allows visitors to easily sign up for information sessions. A floating “Apply for Info Session” button is always visible at the bottom right corner of the screen, providing users with quick access from any page. We used yellow as the accent color to ensure high visibility and naturally draw the eye toward the call to action. Additionally, we added a new section on the top page to clearly explain the application process—something the previous website lacked. This includes details such as applying through Hello Work (job placement office), whether a written test or interview is required, and other important steps. By presenting this information upfront, we aimed to make the process more understandable and help applicants to take action.

Design

To refresh the impression of the existing site, we started by redesigning the color scheme. We chose three main colors: blue and light blue to convey a sense of trust and professionalism as an educational institution, and yellow to express positivity, brightness, and the energy to take a new step forward. In line with the concept, “A place to expand the future me”, and the catchphrase “Where my future begins to grow”, we used a main visual featuring a woman looking upward with a gentle smile. This visual direction helps evoke a sense of optimism and forward-looking mindset, encouraging users to take their first step toward a new future.

Key Points

1. User-Centered Information Architecture
To define the concept, our team created detailed persona and user story. We focused on users who are considering vocational training—most of whom have no prior experience in the field—and assumed they may feel uncertain about whether they’re ready to take on a new challenge. With that in mind, we structured the site to help users feel, “Maybe I can do this too.” We believed that creating a hopeful and relatable experience would directly contribute to our goal: increasing applications to both the info session and the program. To help users visualize themselves in the program, we added several new elements that were missing in the previous site: graduate testimonials, employment outcomes, and a sample daily schedule. These were presented using graphs and visuals to make the information easy to grasp and reduce hesitation, while also helping visitors imagine what life at the school would feel like.

2. Online Application Form for Info Sessions
The original website only allowed users to sign up for info sessions by phone, which created an unnecessary barrier. In the redesign, we introduced an online application form directly on the site, enabling users to register anytime with ease. This streamlined process is expected to significantly increase the number of participants attending the sessions.

Prouction Time

Planning / Information Architecture / Wireframes

4 days

Design

1 week

Coading

5 days

Responsive Design

Not implemented (designed for 1920×1080 screen resolution)

Tools Used

Figma, Photoshop, VS code