Doclay NYC Pottery Studio
A User-Centered Redesign that Welcomes Newcomers and Boosts Enrollment
Disclaimer: I am not affiliated with Doclay, therefore, this case study is not fully comprehensive as I did not have access to data such as web traffic or conversion rates. This case study was done to redesign the site to enhance my learning and simulate working to reach a client's goals.
Doclay is a ceramics studio for “anyone and everyone” located in the heart of K-town in NYC.
I redesigned their website to empower students to join their studio and streamline the booking process.
My role
UX Designer
Tools
Figma, Figjam, Miro, Optimal Workshop
Timeline
3 weeks; 65 hours
Being the nosy sister I am, I learned that my twin brother took up pottery classes since moving to New York. As someone who has always had an artistic inclination, pottery was a hobby that I was interested in so I snooped on his studio’s website to learn more.
I faced a lot of trouble trying to figure out the layout of the website, what classes would be appropriate for me and I feel like my eyes just didn’t know where to focus. Making inferences on what hand building or wheel throwing was wasn’t ideal and left me wondering if they really meant that this studio was for ”anyone and everyone”.
Why This Redesign?
Identifying Usability Issues with Web Analysis
To gather a baseline understanding of the website’s functionalities, navigation and layout, I ran a quick-and-dirty heuristics evaluation that I could use as objective points to refer back to while designing.
Understanding Users Through Interviews and Usability Testing
To gain deep user insights and assess the efficiency of Doclay's booking process, I conducted user testing sessions with current Doclay students, students at other studios, as well as potential new pottery students. 8 participants between 24-40 years old were interviewed and asked to navigate and interact with the website, revealing key pain points and usability issues. Main pain points and usability findings:
01
Booking a class is frustrating
Users had difficulty navigating the site. The calendar was hard to interpret and didn’t seem relevant, blocking the third party booking. Various class types were put under “multi-week classes” and they weren’t able to filter the options.
02
Lack of class information
Pottery students aren’t sure when its appropriate to join a harder class and new students want to be prepared for their first time. If users wanted to search for a specific class based on their skill level, there was no information to help guide which class is appropriate for them.
03
The text is small and hard to read
This made important information like studio contact information hard to locate.
04
Pages wouldn’t load
Some users experienced long page loading times on the class booking page. 3 of 8 users had to refresh their page multiple times before seeing what classes were available.
An Objective Analysis of the Booking Process
To be able to measure success, I established the control values: How long it takes for the user to get from the home page to clicking “Book” and their perceived ease of use.
Spoiler: the task completion time was reduced by 48% after implementing changes with the redesign.
Defining the problem
01
The website's limited information and functionality create barriers for new students, hindering their confidence and engagement with the studio.
Users aren’t able to tell which class type best suits their needs
The booking process was disorganized, forcing students to manually sort through the list of classes to find the specific class type they want
02
The current booking process is slow, difficult, and confusing to users, causing risk of booking abandonment.
Enhancing accessibility to studio information and streamlining the booking process is vital to help reassure users they can trust this studio to facilitate their growth in this field of art.
Analyzing the Market & Competitors
To understand the pottery studio landscape and identify opportunities for Doclay Studio, a competitive analysis was conducted. This analysis focused on:
Visual Identity: Doclay Studio's use of fun imagery and shapes was a distinct advantage, creating a memorable and engaging user experience.
Content Usability: The competitor sites were often text-heavy and had accessibility issues. This presented an opportunity for Doclay Studio to provide clear and concise descriptions alongside engaging visuals.
Through this analysis, a key opportunity was to revamp the website that balances Doclay’s unique visual identity with a user-friendly content strategy— ensuring users could easily access the information they need while enjoying the studio's creative aesthetic.
Sketching the Foundations
With user goals and pain points in mind, to help Doclay reach their target clientele and conversion rate, I felt that their home page and class pages needed some revamping.
Due to time constraints, I sketched novel ideas where the most changes would occur and created mid-fidelity wireframes for the others.
By restructuring the class and class booking pages, users are able to learn about a class before getting to the book page. In the original design, users were taken directly to a booking page with class details hidden unless each card is clicked into. To validate this design decision, I took this into usability testing.
Time constraints quickly became an issue as I became information overloaded. By revisiting the user’s pain points and needs I made the decision to focus on the immediate user experience of landing on their page and creating the necessary screens to measure another task completion time to compare the original results.
Due to time limitations, I conducted a preliminary round of user testing with 3 participants using mid-fidelity wireframes and received valuable feedback. I was able to validate the overall structure of the website, but still needed to revise some elements:
Validating the IA With User Testing
Problem:
Users assumed the options under “Join us for a class” were the only classes offered instead of class types offered.
There was a split between where users expected to find instructor information.
Solution:
Improved the microcopy to give more clarity to users what services are offered.
Instructor information can be found under About the Studio and linked under Classes.
Testing High Fidelity Wireframes
Ideally, the same 8 participants from my interviews would have been recruited for the high-fidelity prototype, however, due to resource constraints, the final testing group consisted of 5 people (1 current Doclay student, and 4 potential new pottery students between 24-32 years old). With this round of testing, I gathered user’s impressions about the pottery studio and feedback about the overall usability.
Lengthy Scrolling Creates Friction
Users found themselves scrolling a considerable amount to get to the classes they wanted. Additionally, the text over the hero image created accessibility issues.
Horizontal tabs were implemented to help decrease scrolling and better differentiate between the 2 major class types: Single and Semester classes; and a Meet our Instructors CTA replaced the inaccessible text in the hero section.
Content Streamlined, Page Length Still an Issue
The content organization helped reduce the page length, but it still felt considerably long. Users mentioned wishing there was a way to quickly navigate back to the top.
A “Back to Top” button was incorporated on all pages to enhance the user experience and minimize scrolling fatigue
The Positive Outcomes
User satisfaction: All new potential students found the information they needed and appreciated the class descriptions. Navigating the site and booking a class was described as “easy and straightforward”, and users felt that the studio was welcoming and a safe space to learn a new skill.
The task completion time was reduced by nearly 48% and the improved difficulty rating indicated significant improvement in the effectiveness of the design, creating a more efficient and user-friendly booking experience for Doclay.
Average task completion time:
39.2 sec (from 75 sec)
Average difficulty rating:
4.2/5 (from 2.5)
Making the Website Responsive
My design prioritizes the desktop and laptop experience, reflecting my findings from interviews. However, I created mobile-friendly versions of key screens to ensure basic functionality and accessibility across all devices. Some examples:
The Final Prototypes
Considerations for the Future
Gain more baseline knowledge of the user’s initial experience:
To strengthen the comparison between the original and redesigned website, I would have benefitted from more baseline user data. Specifically, gathering insights on potential new students' initial impressions of the studio, including their likelihood of joining a class and their perception of the studio's trust and credibility, would have provided a more comprehensive picture of the design's impact.
Address customer retention:
In my interviews, I learned that current Doclay students are experiencing a pain point of not having space to work in the studio because people are ignoring the open studio space booking.
I would like to explore ways to improve their open studio booking pages to help students make informed decisions on when to head into the studio based on work space availability.
Set a clear scope early in the design process:
Being able to hear others’ recommendations about my feature set earlier would have helped me focus my attention on the screens with the biggest impact (i.e. home page, classes, booking).
While the ‘Instructors’ and ‘About Us’ pages weren't directly tied to the core user task of booking a class, this design exploration provided insights into user needs beyond the immediate booking process, particularly, the desire for information about instructors and studio preparation. By incorporating these insights into my design, I was able to create a more holistic user experience that addresses both booking efficiency and user preparedness, ultimately benefiting both users and the pottery studio through increased class satisfaction and retention.
