Website design on Figma

Joyful Tutors is a website designed for a tutoring center, key pages include homepage, category page, services page and booking form. In this design, I wanted to evoke a happier, flowy and include more organic elements in my design.

Firstly, I identified the content of the website, the target users and also when the website will be used. I then looked for inspiration on existing tutoring websites, I mainly took inspiration on the layout of the website. I then crafted a sitemap to plan how each page would link to each other. I then created a flowchart to visualize how a user would go through the website

When wireframing, I decided on the theme of the website. Since the name of the tutoring center is Joyful Tutors, I wanted to create a more playful design. Thus, I decided to utilize more curvy shapes rather than grids so that the design seems more playful rather than serious

In the mockup, I chose colors that are pastel and colorful to match the joyful part of the tutoring center. I also made use of gradients in the background so that the page doesn't seem bland when compared to the other colors of the elements on the page such as the categories. This is to ensure a cohesive design.

In the prototyping stage, I linked up all my pages and also focused on a lot of interactions. Such as the fade in of the "Why choose us" section on the homepage, the zoom on each card on that section when the user hovers above it. I also made hover effects on the buttons in the website. Another major interaction I created is on the services page, where the whole page will change into a darker blue theme with icons floating in the background when the user scrolls to read more about the different services offered.