“And I believe part of the reason why I went with Juku (the competitor) at the beginning
was that they did have more information online.” 

“Scheduling a tutoring session is probably the most challenging of everything… I do all of
the above: email, call, text, walk in, confirm verbally. There’s no standard practice so it’s not the easiest.” 

- Frustrated Parent

Responsive Web Design: MVP of a website redesign for a local tutoring business that caters to high-achieving, busy parents who want academic success for their children.

ROLE

Product Designer 
User Research, Market Analysis, Personas, Journey Mapping, User Flows, Wireframing, Prototyping, Visual Branding, Usability Testing, UI Design

DURATION 

90 hours 



PLATFORM

iPhone 14 Pro Max, Standard Desktop

TOOLS

 Miro, Figma, Adobe Illustrator

MAIN PROBLEM SPACE

Crafting a Website Parents Can Rely On



Okay, so you might have some questions. Who is this frustrated parent? Why are they scheduling a tutoring session? Let’s take it a step back. First, I’ll give you some background on H.E.L.P. short for Honda Educational Learning Partners. H.E.L.P is a locally-owned tutoring business in Hawaii that forms long-standing relationships with parents and students to provide them with the best opportunity for their child’s academic success.

H.E.L.P is run by a single mother and long-time educator, Diane Sugahara, who wears the hats of Founder, CEO, and Tutor. Her passion for teaching little ones is evident through her daily commitment to H.E.L.P.

Diane came to me knowing that their outdated website needed some major revamping but not fully understanding what their clients needed from this website. Diane knew they lacked an effective website that caters to the needs and expectations of their target audience (both current parents who use H.E.L.P.’s services and prospective parents who might be interested in their services).

What are these needs and expectations exactly? Well, that's where I come in to find out. Here's the problem I found: 

H.E.L.P.'s current website fails to engage existing clients and lacks the essential information prospective parents need to assess its suitability for their needs.

Done are the "old school" days of back and forth emailing and leaving voicemails. At least that's what H.E.L.P.'s parents believe. They're tired of there not being a set system to schedule their child's tutoring session and feeling like there is no organization to the process. 

And, what about propsective parents? They leave the website with little of their questions answered, often feeling more confused than when they first came to the website. 

The four main pain points parents who currently use or are in need of tutoring services are facing: 

Disorganized Scheduling System for Current Parents

Lack of Specific Information on Website

Cluttered layout and lack of modern design 

PREVIEW OF THE SOLUTION

Introducing H.E.LP.'s Redesign

USER RESEARCH

Why Would Someone Want to Visit H.E.L.P.'s Website Anyway? 

Let’s back it up a bit. So, how did I find out this was the real problem?

When I embarked on the project of improving the H.E.L.P. tutoring website, the first step was to understand what users were trying to achieve when they visited the site. I needed to grasp the motivations and goals of both current and prospective clients. To achieve this, I interviewed various users to understand their primary reasons for visiting the site, what they hoped to accomplish, and their overall impressions of H.E.L.P.'s current website. My main research questions were: 

• What are the primary reasons people are coming to the site?
• What are they trying to accomplish? 
• What are users’ perceptions of H.E.L.P.’s current website? 
• Would a booking tool be beneficial for parents to better facilitate scheduling sessions for their child? 
• Why would current users even need to come to the site?   

USER RESEARCH

Busy Parents Led to a Derailed Timeline

To answer these questions, I conducted interviews with four parents, including two current clients at H.E.L.P and two potential clients. These participants represented a diverse cross-section of age, gender, ethnicity, and vision mobility. The potential clients either did not have a tutor and were looking for one or were using another tutoring company’s services. This variety was crucial in gaining a holistic view of our target audience.

The process of scheduling interviews was more challenging than anticipated. Working parents have busy schedules, which led to a lot of back-and-forth communication, rescheduling, and with me having to leave multiple voicemails to finalize the interviews. What should have taken a week stretched into nearly a month, significantly affecting my initial timeline. This delay necessitated a shift in strategy. 

USER RESEARCH

Gaps in the Competition: Misleading Information, Lack of Pricing Transparency, and More

Facing delays, I decided to conduct a competitive analysis while waiting to conduct the interviews. This analysis involved a deep dive into the top local competitors to understand how they utilized their websites to serve clients effectively. This exploration provided valuable insights into industry standards and opportunities for differentiation: 

The competitive analysis revealed several gaps and opportunities.

What the competition could improve in: 

• Transparency Issues: Excel and Kumon do not provide information about the cost of their tutoring services on their websites, requiring potential clients to call for details. This lack of transparency could be a significant barrier for prospective customers.
• Misinformation and Consistency Problems: Juku has faced criticism for providing misleading information about their payment plans, leading to financial losses for clients who did not utilize services within a year. Additionally, there are concerns about the inconsistency of tutors, with children experiencing different tutors in each session, which could affect the quality of learning.
• Lack of Online Booking: None of the competitors, including Juku, Kumon, and Excel, offer an online booking tool on their websites for current clients to schedule sessions, which could be a missed opportunity for enhancing user convenience and operational efficiency.

What the competition did well: 

• Website Design and Branding: Juku and Kumon’s websites are described as inviting, bright, and visually appealing, contrasting sharply with Excel’s website, which lacks personality and strong branding. This could influence the first impression and engagement levels of potential clients.
• Success Metrics: Juku leverages its success by showcasing the number of students accepted into private schools annually, a feature absent from Excel’s online presence
  

What did this mean for us? We needed to... 

• Ensure transparency of tuition on website 
• Highlight our unique value proposition- emphasize individualized tutoring and consistent tutors
• Create a strong and well-received branding that caters to the target audience
• Emphasize flexibility in scheduling. HELP’s business owner will go out of her way to work around parents’ schedules and will be flexible on rescheduling
• Highlight success stories and if possible, number of students accepted each year
• Include an online booking tool (if research supports this)

USER RESEARCH FINDINGS

A Need for Streamlined Scheduling, Detailed Insights, & Modern Branding

Research Finding #1 

3 out of 4 participants wanted a more streamlined and structured process for scheduling their child’s tutoring sessions. 

The current method of scheduling a session for their child is not meeting the needs of parents, who find it cumbersome and time-consuming. This inefficiency is leading to a negative user experience, as evidenced by the frustration expressed by 75% of interviewees regarding the need to use multiple communication methods to confirm a single tutoring session.

 
“That (scheduling) is probably the most challenging of everything. So I email I call, I show up and I walk in there
to make sure everything is done. And double check. So
there's a lot of footwork that needs to be done on my part.
And there's no standard practice. I do all of the above- email, call, walk in, confirm, verbally, whatever. I do all of it. So it's not the easiest.” 

 
“Anything automated will be great. Scheduling tool if they can look at a calendar would be fantastic because my son is super busy, I always am double checking month over month.”

Research Finding #2

3 out of 4 participants feel that more information about services, values/philosophies, and pricing is needed for potential clients to decide if HELP is a right fit for their child and family. 

While the website is simple and easy to use, parents felt like the descriptions of services could go more in-depth for those who may be considering H.E.L.P. and looking for more information. H.E.L.P.’s website needs to effectively communicate the type of business it is: individualized to each student’s needs as opposed to a rigid “one size fits all” system, with experienced tutors who are passionate about teaching and care deeply for their students, and catering to families’ busy schedules. This is HELP’s value proposition and makes them stand out from the competition.

 
“(When first visiting website) I was trying to look for more information about the you know, the program, so really just to do research. So when I first started doing research on Juku’s website (competitor) for Maxwell for SSAT and getting into private school for kindergarten. I did research online. And I believe part of the reason why I went with them (Juku) at the beginning was that they did have more information online.”

 
“I was really curious to know whether they could give me more insight on what my child needed more work in, what the expenses were, and how also we could partner together to also continue that.”

 
“They also give individualized help not only to get into private school, but thrive in their educational journey. Wherever that may be, and the parents should want kids to live up to their fullest potential, inspire their lifelong love for learning and boost confidence. And by giving this individualized training, I feel like that helps children along not only to prep them to get into the the finest prep schools, but also helped him just as students and lifelong learners.”

Research Finding #3

3 out of 4 participants feel that the overall look and feel of the website needs updating and looks outdated, which gives off the first impression that H.E.L.P. doesn't kee up with modern technology.

H.E.L.P.'s website fails to effectively appeal and engage a wider audience, particularly families with older students, due to its elementary design. The layout is cluttered and feels more like a newsletter jam-packed with blocks of text as opposed to a website. The site is in need of a modern "facelift" that clearly communicates its range of services for all educational levels, from K-12 while also portraying H.E.L.P.'s values of flexibility, working closely with the family, and focusing on the whole child. Its current "old-school" branding doesn't portray a modern approach to contemporary education and technology. 

 
"It looks very old school. Like it was designed and then early 2000s. But yeah, it definitely is not modern. It makes me question, is she (Diane) able to keep up with changes in education and what's been going on in life and in the world and you know what our kids are going to be seeing because technology has become so much more integrated into their lives. And we can't ignore that." 

 
"It just, it does look very elementary school teacher type of design. So I feel like when I was looking back when he was, I think second grade or first for whatever we I started, it was fine, because he was so young. But I don't think that that's necessarily good for the older groups."

HOW MIGHT WE STATEMENTS

Turning Broad Challenges Into Actionable Questions

We used "How Might We" (HMW) statements to clarify the problems we aimed to solve. HMW statements guided the brainstorming process, encouraging creative solutions and helping to focus on specific, solvable problems. 

How might we streamline the scheduling process to help users easily book sessions that work for their busy schedules? 

How might we help parents access the information required to determine if H.E.L.P. is the right fit for their child?

PERSONAS

Meet Nathan and Lisa

The results from creating HMW statements guided the brainstorming process and allowed me to focus on the problems that users really cared about. Based on the learnings from this I created two user personas that embody these how might we statements and represent the two main users of this site. These personas encapsulated the needs, goals, and pain points of our target audience, ensuring that our design solutions remained user-centered.  

Meet Lisa, a busy mother who finds the scheduling and billing processes cumbersome and inconvenient. Meanwhile, Nathan, a concerned father, struggles with finding detailed information on the HELP website and faces challenges in contacting the organization. 

PERSONAS

Transforming User Feedback Into Action: Nathan and Lisa's Unique Journeys

Really taking the time to understand the user and how they would navigate the site and follow their ‘journey’ as they completed tasks to reach their goals ensured that we could pinpoint specific pain points to identify areas of improvement at particular points in their journey. Based on the learnings from this activity, it made it easier to hone in on what features were the most important and had to be included to create the MVP (Minimum Viable Product). 

FEATURE ROADMAP

From Must-Haves to Nice-to-Haves: Prioritizing User Needs

The roadmap ensures that the most critical aspects of user experience are addressed first, laying a solid foundation for future enhancements.

• Must Have (P1): These features directly address the core needs identified through user research and are essential for the basic functionality and user satisfaction of the website.
• Should Have (P2): These features enhance the user experience by adding convenience and visual appeal but are not essential for the initial launch.
• Could Have (P3): These features are nice additions that provide extra value and engagement but can be implemented later without affecting the primary functionality of the site.
  

SCHEDULING SOFTWARE

Weighing Our Options for Scheduling Tools

A big decision we had to make as part of addressing the first HMW statement of “How might we streamline the scheduling process…?” Given the tight timeline, I felt that the best approach to addressing this problem was by seamlessly integrating an existing booking tool into our website. 

I compared the best performing scheduling software tools on the market so I got to researching and created a comparison chart so my client could easily compare features and different factors side by side. I considered price as being the most important factor since the client stressed this during one of our calls. Pricing would increase as more staff membes were added on, and she needed to have the option to include at least 10 tutors. She prides herself as offering the most competitive prices on the island and would like to keep it that way, therefore, the cost of this software needs to be within her price range. I also considered: 

• Ability to create different types of meetings 
• Ability to select a single tutor from a list 
• Ability to assign tutors 
• Multiple time slots per session 
• Google Calendar sync (H.E.L.P. currently uses this) 
• Website integration 
• Email confirmation and meeting reminders  

After sitting down with my client and going through the pros and cons of each software, we decided to go with Square Appointments Plus because it met all of the client’s expectations and needs in a scheduling software along with a feasible price to keep her competitive pricing. We initially wanted to go with TidyCal for the one time price of $29, which is incredibly reasonable. However, it was missing the one feature that was really important to my client. It doesn't currently support the functionality of allowing potential clients to choose from a range of consultants and schedule based on their specialties. Each TidyCal account is associated with one primary calendar, making it more suitable for individual professionals or businesses offering services from a single entity. 

INFORMATION ARCHITECTURE

A Site Map Redesign Focused on Simplicity and Accessibility

In redesigning the site map, I closely aligned it with the insights gained from our user research, making sure every change resonated with the needs, goals, and expectations uncovered.

Recognizing that session scheduling was a critical function for users, I strategically placed this feature as a prominently displayed call-to-action (CTA) button within the main navigation bar on every page. 

I streamlined access to information about H.E.L.P.'s services by dedicating a separate page for each service. This means parents can directly click on what they’re interested in, bypassing the need to dig through a sea of text before finding what they're looking for. It’s all about getting them to the info you need, faster and simpler.

H.E.L.P.'s Old Site Map

H.E.L.P.'s Revised Site Map

USERFLOWS

Nathan and Lisa's
User Flows

DESIGN

Drag & Drop Wireframing of Potential Solutions

I decided to use Miro to quickly create low-fidelity screens since I felt this method of drag and drop to build a wireframe was quicker than sketching. I wanted low effort and to create screens efficiently so Miro allowed me to generate quick ideas out of pre-existing components and icons. 

I initially came up with four versions of the homepage and spent most of my time on this page as I felt it was the most impactful in addressing user needs. Homepage is the first thing visitors see so I wanted to weigh out different options. I considered both visual hierarchy and content hierarchy, placing the information users were looking for at the very top of the screen (pricing, services, and how to contact the business). I repeated this process for each of the pages. 

I also went with a mobile-first approach and designed the mobile screens first to ensure that it was responsive as users expressed how they use their phones to browse the web when they're on the go. 

BRAND IDENTITY

Using Visual Design to Create a Flexible, Hollistic,
and Collaborative Brand

When creating the visual identity for H.E.L.P., I wanted the brand to embody the following values/characteristics: flexible, holistic, inspiring, collaborative. This is everything H.E.L.P. stands for and emobdies. I had the client fill out a brand identity questionnaire to gather more information of both her business and branding goals to develop a strong and effective brand. 

Parents wanted modern, cohesive branding that portrayed what H.E.L.P. represents and can offer as a business all while appealing to high-achieving families with children aged K-12. 

When creating the custom-made icons that added to the brand's playfulness, I wanted to incorporate H.E.L.P.'s values (growth mindset, respect, positive thinking, perserverance, and mindfulness). Each symbol below corresponds to a specific value.

• Cloud = mindfulness
• Star = perserverance 
• Heart = respect 
• Smiley face = positive thinking 
• Arrow = growth mindset 

 During this stage, I also tested contrast and accessibility to make sure the colors were ADA-accessible.  

USABILITY TESTING

How Can We Improve the Website

The goal of usability testing was to get valuable user feedback on the effectiveness of my product and what could be improved and iterated on to create a better user experience. Each participant went through different task scenarios, which was done in person. I printed out the mid-fidelity wireflows to have participants point through how they'd complete each task. I came up with the following research objectives for usability testing:

• Recognize any roadblocks or difficulties users encounter when navigating the site and completing task flows
• Assess if site features are designed in a way that is intuitive and usable
• Identify opportunities where the design can be simplified for better usability
• Identify any issues with accessibility
  
• Gain insight into the overall satisfaction of each task flow

Users went through 6 task flows: 

1. Inquire and get in touch with
the business 

2. Learn more about pricing and scheduling policies

3.  Learn more about
H.E.L.P.'s services

4. Learn more about the business and the tutors

5. Schedule and change
sessions online

TEST RESULTS

Improving Navigation

Priority Revision #1: (3 out of 3 participants) Users felt that the contact information (phone number and email) wasn't included enough throughout the site, making it less likely they'd want to reach out. 

One of the main goals for users is to contact the business. To make this more accessible and easier to find, I decided to include the phone number and email at the bottom of each page. This makes propsective parents more inclined to call if they don't have to search for it on the website. 

Priority Revision #2: (3 out of 3 participants) Users felt that one the mobile version, the "Book a Session" CTA button was hidden.  

Originally, I had included the "Book a Session" button within the drop-down hamburger menu since it is apart of the main menu so I initially thought this made the most sense. However, after talking with parents, they were having a difficult time finding the button and felt that it was hidden. As a result, I moved this button to the hero section of the homepage so that it was one of the first things people see when visiting the site.  

HIGH FIDELITY PROTOTYPE

Empowering Parents: Enhancing Access to Essential Information on H.E.L.P.'s Website

Clear Service Information: Quick Access to What Matters 

Problem Addressed: Parents expressed a need for a deeper understanding of H.E.L.P.'s services to determine if it matched their child’s educational needs. The challenge was to enhance access to this information without overwhelming visitors.

Design Solution: To address this, I redesigned the homepage to include drop-down tabs for each service, providing a quick overview. This setup provides a snapshot of what H.E.L.P. offers, along with a call-to-action button leading to dedicated landing pages for more detailed information. Each service page is crafted to allow direct, clutter-free access to specific details. This approach streamlined access, allowing parents to click directly on the service they were interested in, bypassing the need to sift through extensive text.

Result: The redesign was met with approval from all user test participants (3 out of 3), who found the new services landing page intuitive and efficient, making it easy to navigate and find the specific information they needed quickly. The clear, direct pathway to relevant information significantly enhanced their site navigation experience. 

Visual Hierarchy: Making Information Flow

Problem Addressed: Users were overwhelmed by dense blocks of text and found it difficult to locate key information about pricing, services, tutors' bios, and the business’s philosophy.

Design Solution: To improve visual hierarchy, I structured the homepage to highlight crucial information such as upfront pricing, service details, and steps to get started. I used brief, scannable text and strategically placed visual elements to guide the user's eye naturally across the page. This design ensured that the content flowed logically, making it easy to digest and understand.

Result: This approach proved effective, as reflected in user feedback, with all participants (3 out of 3) appreciating the simplicity and clarity of the site's navigation. They reported a comprehensive understanding of H.E.L.P.'s values, services, and the potential benefits for their children, highlighting the site's effectiveness in communicating its core message.

Connecting Made Simple

Problem Addressed: Parents needed a straightforward and accessible way to reach out to H.E.L.P. with questions or to start the enrollment process, without having to search through the website. 

Design Solution: Recognizing the importance of easy communication, I integrated a contact form on every page alongside visible phone and email contact options. This ensured that parents could easily reach out through their preferred method without navigating away from the page they were on.

Result: The addition of multiple contact options was highly appreciated by all test participants, who noted the convenience of being able to initiate contact through their preferred method directly from any page without leaving the site. This feature not only met but exceeded user expectations, enhancing their overall experience and satisfaction with the site.

REFLECTION

Closing thoughts

I was excited to with a local business here on Oahu, which aligns with my belief in supporting local. I also love H.E.L.P.'s philosophy on embracing the "whole child" approach to education and taking any approach to get students to enjoy learning.

 Balancing user goals with business finances 
Balancing what users said during interviews and implementing what was financially feasible for the business owner proved to be challenging. However, it was an opportunity for me to manage expectations on what features were realistic to implement according to costs. This was particiularly important to the business owner as she was proud of her competively low prices she is able to offer. 

Working around the client's schedule 
Due to the business owner's hectic schedule, it was challenging to find the time to conduct meeetings and receive feedback throughout the project. We found ourselves meeting over meals or brief, 15-min sessions between her tutoring sessions to discuss iterations.

Interested? Let's Work Together!