CASA STUDIO WEBSITE
READ FULL CASE STUDY
READ FULL CASE STUDY
Project Timeline:
Project Timeline:
August 2024
August 2024
Description:
Description:
Website design for a small ceramics studio based in Canada who wanted to showcase their portfolio.
PLEASE VIEW THIS PAGE ON A DESKTOP. MOBILE VERSION COMING SOON!
ROLE: (THE ONLY) UI UX DESIGNER
TIME: 6 MONTHS
My Contribution:
Discovery
Layout & Wireframing
Brand Identification
UI Design
Development (format.com)
Final handover
Project Type:
After attending a panel on creative entrepreneurship, I connected with Jasmine, founder of Casa Studio. A few weeks later, I was designing and building their website.
"Working with Kunal was a fantastic experience. He guided us through each step, helping us capture our unique style with clear communication, regular check-ins, and insightful design advice. Kunal’s work on our portfolio and online store has given us a website that perfectly reflects the aesthetic of our ceramics business. It’s clean, professional, and user-friendly, beautifully showcasing our work and telling our story. We couldn’t be happier!"
-Jasmine Cardenas, Founder, Casa Studio
01. Constraints
The timeline
As an international student with a 20-hour work cap every week, I had only 7 hours per week from Casa Studio to complete the website within a tight three-week timeline. This urgency was driven by an upcoming workshop they planned to host, so I had to quickly master a new development tool while designing the entire website from scratch!
Speaking development before design
Format.com was to be used as a tool for developing this portfolio website. The reason for this was that the client was already familiar with this tool and it would be easier to make updates to the website herself, even after the website is set up.
This tool has limited capabilities in terms of layouts, page types and interactions which had to be studied and taken into consideration before designing the website.
Format focuses on using pre-designed templates over making things from scratch.
There are only a limited number of elements one can add to their Format website
02. Information Architecture
The Gallery is a holistic page that accommodates anything ceramics that Casa studio puts out into the world and not just in-house work.
The footer acts as a gateway to content that is secondary in the information hierarchy so that new users don't miss out on any pages.
03. Building the Layout
Home
Navigation
Feature image
Category wise gallery
Work philosophy/process statement
Merch gallery
Footer
Gallery
Navigation
Photo gallery
Link to custom order form
Collaboration 1
Link to About Casa
Footer
About Casa
Navigation
Founder thought / phrase
Founder photo
About sentences
What do we do? Work categories/types of clay/etc
How do we do it - process of making
Link to Gallery
Footer
Contact
Navigation
Information about offline store / working hours if needed
Contact form
Custom order form link with button
Footer
04. WIreframes
Home page
The home page mainly consists of images of the ceramic works by the studio. The flow of the images is broken by a quote to make the page interesting and non-repetitive. This quote also grounds the website to the studio's work philosophy.
Gallery
The Gallery page is minimal (less functionality and a passive experience), with an exhaustive set of all images of the studio's work and some breaks in between to disturb order.
About Casa
This page has a different layout than the rest of the pages. This page has an in-depth paragraph about the studio, some key aspects of it, and a video illustrating the process followed by artists to make clay objects. Information regarding the studio is conveyed in different formats.
Contact
The contact page is a basic one that also displays a link with contacting the studio for a custom pottery order.
05. Understanding the brand for visual design
Translating brand values into visual design
How would you describe Casa Studio in just one word?
What is a song that describes Casa Studio?
How would you describe Casa Studio as a person?
Next, words were extracted from the answers to the questions above to introduce a visual direction
HIPPIE
HANDMADE
COMPLETE
HOMELY
MEANINGFUL
SHAGGY
RAW
WARM
Choosing the colors
The images reflect handmade textures and bohemian warmth, while words like “hippie” and “raw” capture the brand’s authentic, homely spirit. The earthy, dusky palette echoes the organic feel of the ceramics and their grounded style.
06. Final UI Design - See Live!
This project was a resounding success, delivering a website that perfectly embodies the ceramics business's unique style and vision. By deriving a basic brand language through client conversations, I ensured the design aligned with their aesthetic and values. The clean, professional, and user-friendly platform not only beautifully showcases their work but also supports their growth by enabling an online e-commerce business and an online events marketplace.
