My role:
Design and create a responsive website as a UX designer from research to high fidelity designs.
Duration: 4 weeks
Tools: Figma, Milo, Maze, Squarespace
I designed and created a responsive website for an Alexander Technique (AT) instructor in my local area.
The client started a career of teaching the Alexander Technique just recently, and asked me if I could design her first-ever website.
The purpose of this website is, for the client, to increase the size of student body, while providing helpful information and online booking platform for students.
Difficulty with outreaching and getting more students without any online platforms.
Design and build a website to showcase what she does and a platform for potential students to book a class.
But, the ultimate goal of this design project is to make a website that makes the client happy and is easy to manage throughout her daily life.
"What means a good website for a small business owner who has no experience of managing the website?"
"...But how do I make the website? Is it hard to manage? How much time does it take to create?"
For a person who is very new to start their business and just decided to have their own websites, like my client, it is very overwhelming and nervous moment to think through website designs by themselves.
Throughout the process, I communicated with my client often, and reflected the client's voice as much as possible on the website design.
Although I agreed my client to design her website, I realized that I don't know much about this business and user needs.
I conducted competitive analysis and secondary research to understand more about business needs and user's concerns.
(Why no interviews? Please read "Secondary Research" section.)
In the process, I focused on the difference of contents the competitors offer, and how it is easy and accessible by users.
For an indirect competitor, I chose Thumbtack because I thought potential users would first try to seek instructors from their local community, and Thumbtack works as a directory of most professionals in that community.
By conducting competitive analysis, I was surprised by how not much of websites offer inquiry forms or easy booking systems.
Instead, they tend to send the user to email app to send some inquiries and ask them to pay as a check. I found this later when discussing with my client, but this was the old-school, most trusted way in the AT community to receive payment securely.
Now that I grasped some problems and ideas on features that may be suited for my client's website, I tried to conduct user interviews.
However, there were not much of people who has experiences on AT or booking private lessons or tutoring on online around me.
Struggling a lot to find someone, I instead worked on secondary research to find some insights by looking through online communities and more AT websites.
Based on the questions I prepared for the interview, I sorted the voices of Reddit AT community and other AT websites as below:
I then created an affinity map to better understand people's pain points and desires.
Through the research, the key insights I got were following:
Amanda is a pianist who has been struggling with her tension and bad posture from playing piano.
She is looking to improve her piano performance through taking AT lessons.
George, on the other hand, is an elderly person who has a chronic neck pain.
He looks AT as a last hope to lose the pain.
By discussing with my client, I learned that the instructors try their best to make the potential students less worried and more excited about experiencing the AT, since they are very aware that this is still developing, new area of study.
Increasing the reputation will be such a hard work, and I realized that UX can help those people succeeding their business, no matter what kind of services they are.
I tried to make a site map as simple as possible so that the client can create her own website easily and quickly in the future.
Because the booking process will be designed as in-page feature, not moving through different pages, it doesn't appear on the site map.
The goal of this project is to create a website that provides informative contents about the AT and easy booking system.
When creating an user flow, I especially focused on the booking system flow to make it as simple and straightforward as possible.
These wireframes are for main page and booking process.
For the design of booking process, I adapted some designs from the Squarespace's in-app scheduler called "Acuity Scheduling". This is because the client is going to create her website by herself on the Squarespace, and using pre-designed scheduler would be easier for her. The layout of it, however, was modified a bit to have a better sizing and fit well with my grid.
My client requested to use some pastel colors that would have the website "fun" vibe. It was difficult choose appropriate pastel colors that are accessible.
The logo is actually a picture of my client showing the proper posture to sit on a chair. She is using this logo on her business card, hence I decided to use it for her website.
While making wireframes, it was hard to design the website as simple but having a kind, friendly vibes.
For example, I at first designed main page with no background colors and very simple structures.
However, I later added couple of background colors for some sections separately, and aligned each section alternatively.
I also applied carousels for testimonial section and the page about AT to make them easier to view on mobile screen.
I received some of suggestions and area of improvement I can make, but as I discussed with my client, design revisions will not be made at this point, since the suggestions were mostly on a new feature my client does not want to have. I will upload here if we decide to revise some design.
Although I finished designing websites and my client satisfied with my designs, the project is still in progress.
I will start building a website based on my design, and bring it to the point it would be ready to be used by the client.
The platform I'm planning to use for building website is Squarespace. I at first thought of using Webflow, but thinking of my client's experience of managing the website, Squarespace is more beginner-friendly and easy to operate.
I will continue updating the progress on this case study page, so please keep waiting!