Mon Impression

An E-Commerce Platform with Real-Time Customization Studio

How we created an interactive design tool allowing customers to customize t-shirts, hoodies, and accessories directly in their browser.

Textile Printing & E-commerce
App Development
3 months
2024
Preview

Project Screenshots

Explore the interface in desktop and mobile view

Mon Impression customization studio
Mobile view of customization studio

Studio — Real-time t-shirt customization

The Challenge

The Problem to Solve

Our client, a textile printing company, was losing sales because customers had to send designs by email and wait for a mockup. The process was slow, prone to communication errors, and didn't allow visualizing the final result before ordering.

1

Slow ordering process — back-and-forth emails for each design

2

Impossible for customers to visualize the final result on the product

3

Frequent errors due to wrong size and placement specifications

4

No e-commerce presence — sales only in person or by phone

The Solution

What We Built

We developed monimpression.ca, a complete e-commerce platform with an interactive customization studio based on HTML5 Canvas. Customers design their products in real time, add text, images, and stickers, then order and pay directly online via Stripe.

Interactive Design Studio

HTML5 Canvas with React Konva allowing text, images, and stickers with free transform (move, resize, rotate).

Multi-Side & Colors

Customization on 4 sides (front, back, sleeves) with real-time product color preview.

Sticker Library

10+ categories of ready-to-use designs (vehicles, camping, Christmas, inspirational) drag-and-drop onto canvas.

Secure Stripe Checkout

Complete shopping cart with tax calculation (GST/QST), shipping options, and secure Stripe checkout.

Technologies

Tech Stack

Frontend

Next.jsTypeScriptTailwind CSSReact KonvaFramer Motion

Backend

SupabaseStripe

Infrastructure

Vercel

Results Achieved

The measurable impact of our solution

6+
Customizable Products
T-shirts, hoodies, crewnecks, mugs, caps, and more
4
Customizable Sides
Front, back, left sleeve, and right sleeve
FR/EN
Languages Supported
Fully bilingual French and English site

Have a Similar Project in Mind?

Book a free consultation to discuss your needs and get an estimate.

How would you like to proceed?

Book a call

Let's discuss your needs directly. It's the fastest way to validate your project.

Send a Message

Describe your project in a few lines and I will reply within 24 hours via email.

Direct Contact

Whether for a SaaS application or a website, I personally guide you.

Email

...

Location

Based in Montreal, QC

Although I work remotely with international clients, I actively serve several regions in Quebec.