Project Overview

‍A responsive website designed for Artoonis Cafe Gallery, a creative space offering online art classes and in-person sip-and-paint sessions. The website aims to provide an engaging user experience that encourages visitors to explore, book classes, and connect with the community.

‍

Problem Statement

Challenge: How might we design a seamless, visually appealing, and intuitive website that caters to both online learners and in-person attendees, while showcasing the unique blend of art, social engagement, and refreshments offered by Artoonis Cafe Gallery?

Goals:

Attract art enthusiasts.
Simplify class booking and event registration.
Promote community interaction through an integrated blog or gallery.
Reflect the brand’s artistic and inviting atmosphere.

User Research

Methodology:
- User interviews (e.g., art hobbyists, cafe-goers).
- Competitive analysis (similar platforms like Painting With a Twist).
- Surveys on preferences for online vs. in-person experiences.
Insights:
- Users want easy navigation and clear class descriptions.
- A strong preference for visuals over text-heavy pages.
- High interest in sharing personal art creations online.
- Desire for a streamlined payment and booking process.

Personas

Wireframe

Homepage: Highlights online and in-person offerings, upcoming events, and user testimonials.
Class Listings Page: Filterable list of online and in-person classes.
Booking Page: Easy registration with clear pricing and calendar view.
Gallery/Community Page: Showcasing student artwork and events.
About Us Page: Story of the gallery, team bios, and mission.

UI Design

Style Guide:
- Color palette inspired by art materials (e.g., rich acrylic tones and neutral cafe hues).
- Typography that combines creativity and readability (e.g., a handwritten font paired with a clean sans-serif).
- Iconography that reflects artistic tools (paintbrushes, palettes).
Visual Highlights:
- Hero images of sip-and-paint events and vibrant class environments.
- Custom illustrations for a cohesive and artistic feel.

‍

‍
Prototyping

Interactive prototype demonstrating:

Booking process for a class.
Browsing artwork in the gallery.
Signing up for newsletters or joining the community.

Usability Testing

Goals:
- Test the booking flow and navigation clarity.
- Gather feedback on aesthetic appeal and usability.
Key Outcomes:
- Iterative improvements to the navigation bar and mobile layout.
- Enhanced call-to-action buttons for better conversion.