My Friend's Art is a full-stack e-commerce platform for showcasing and selling art prints from independent artists. This application is built on a React, Typescript, Tailwind Frontend, and a Supabase backend with a Stripe integration to handle payments.
myfriendsart.ca
Storybook
Affordable and Meaningful Art
I am a hobby artist. I paint and sketch in all mediums, and I often gift my work to friends and family. I am also blessed with many talented friends who's art I have hanging all over my house. My Friend's Art began as a personal marketplace to showcase my own work and maybe sell a print or two, but after a few weeks I realized it could be so much more than that.
I have so many incredible friends who create art only for themselves and select friends and family. Beautiful, compelling pieces that resulted from paint nights, afternoons at the park, and just general creativity. These talented individuals might never consider themselves artists, and yet I would pay to have their art in my home.
The goal is simple: Create a community where anyone can showcase and sell their work, make it easy for people to purchase meaningful art that was made by a human, and keep the process affordable, friendly, and transparent.
Constraints & Design Goals
Problem
Independent and hobby artists often lack a dedicated, low-friction way to showcase and sell their work. Building a custom storefront from scratch is out of reach for many, and marketing yourself as an artist is a full-time job.
Constraints
The solution had to be maintainable by a solo developer, cost-effective to run, and flexible enough to support multiple artists and product types without becoming overly complex. Performance and accessibility were non-negotiable.
Design Goals
- Focus on the artwork first—clean layouts, intuitive design, minimal clutter.
- Make checkout and order fulfillment straightforward and transparent.
- Create a simple path to sales, but don't make that the only focus.
- Feel friendly and casual, like a local art gallery. Never pressuring people to spend money.
Engineering
The marketplace is built with React and TypeScript for the frontend, with Stripe for payments and Supabase for auth, and database.
Design system strategy: Defining a small, consistent set of tokens keeps the UI cohesive without getting too complex or heavy. Components are built to work across all pages, keeping a simple, clean, and intuitive identity across the site. Overrides are kept to a minimum, and only applied where the page needs its own identity.
All images are stored in WebP format to keep pages fast and images sharp across devices. The product and checkout flows are structured so we can add more artists and product types over time without large rewrites. The database is structured for scalability, and eventual admin and analytics pages as the site grows.
Future Vision
The goal is to grow My Friend's Art into a true community. Rather than focusing on how to make the most money, the goal is to give everyone a place to appreciate and support their friends, especially the ones who are still strangers.
The planned direction is an artist-first experience. Artists should be able to easily manage their profiles, inventory, and personality on the site. Buyers can leave reviews or simply comment on the piece without having to buy it.
I would also love to explore in-person events, collaborations, and popups. Offering physical spaces for artists on the platform to meet each other through night markets, paint nights, and any other creative gatherings.
Long term, the platform should feel like the default place for people in the community to find and support local art, while staying simple enough to maintain and evolve without a large team.
Figma Prototype
Progress & Planning
Milestones
No milestones yet.
Recent issues
No issues yet.
0 open, 0 closed