PopSart

Sito e-commerce, configuratore delle riparazioni sartoriali e shooting delle borse in studio: il progetto completo per la sartoria PopSart, dalla prima foto all'ultimo ordine

Sito e-commerce per sartoriaE-commerce WooCommerceConfiguratore riparazioni sartorialiConfiguratore preventivi onlinePlugin WooCommerce su misuraCreazione plugin su misuraShooting in studioFoto borse con modellaFotografia e-commerceStill life e prodottoBorse artigianaliSartoria onlinePopSart
PopSart

/ Overview

PopSart è una sartoria che lavora su misura, a mano, e che fa tre cose diverse: ripara i capi, disegna e cuce borse artigianali, crea abiti e accessori su richiesta. Per PopSart ho seguito tutto, dalla A alla Z. Ho progettato e realizzato il sito e-commerce, ho scritto il plugin che permette di preventivare e ordinare una riparazione in pochi clic, e ho fotografato in studio la collezione di borse indossate da una modella: è una di queste foto ad aprire la home del sito. Anche le foto delle borse nel negozio sono mie.

See it Live

/ Project Details

Nome:PopSart

Cliente:PopSart

Categorie:Sito e-commerce per sartoria, E-commerce WooCommerce, Configuratore riparazioni sartoriali, Configuratore preventivi online, Plugin WooCommerce su misura, Creazione plugin su misura, Shooting in studio, Foto borse con modella, Fotografia e-commerce, Still life e prodotto, Borse artigianali, Sartoria online, PopSart

Anno:2025

PopSart
PopSart
PopSart

/ Challenge

Tre servizi con tre logiche di vendita diverse dovevano stare in un solo sito. Le borse sono prodotti veri e propri, con colori e varianti, e online si vendono solo se le foto le fanno toccare con mano. Le riparazioni invece non hanno un prezzo unico: accorciare le maniche costa 15 € su una t-shirt e 25 € su una giacca, e non tutte le lavorazioni si fanno su tutti i capi. Metterle nel negozio come prodotti normali voleva dire centinaia di varianti e un elenco incomprensibile. C'erano poi i capi su misura, che non si comprano ma si chiedono, con misure, tessuto e magari un disegno. Serviva un'esperienza unica, semplice da usare dal telefono, con prezzi chiari e un ordine che arrivasse in sartoria già completo.

/ Provided Services

Sito e-commerce

Progettazione e sviluppo su WordPress e WooCommerce: home, shop, schede prodotto, carrello e checkout, pensati prima di tutto per il telefono.

Plugin configuratore

Un configuratore delle riparazioni scritto su misura: capi, lavorazioni con prezzo per capo, sconti progressivi, note e licenza.

Shooting in studio

Le borse della collezione fotografate indossate da una modella, con luce da studio e fondo neutro, pronte per negozio e social.

Capi su misura

Una pagina di richiesta guidata: dati del capo, tessuto, colori, misure e disegno, per preparare il preventivo.

/ Funzioni

11 funzioni, una per una

01

Una home per tre servizi

La home presenta PopSart e mette subito davanti al cliente le tre cose che può fare: riparare un capo, comprare una borsa, farsi creare qualcosa su misura. Ogni sezione spiega in poche righe come funziona e porta dritta al punto giusto.

  • Apertura con la foto dello shooting e l'invito a creare la propria borsa
  • Il configuratore spiegato in tre passi, con il pulsante "Ripara ora"
  • I punti di forza della sartoria: artigianalità, prezzi trasparenti, assistenza
  • Invito alla consulenza gratuita con una sarta
  • Vetrina delle creazioni e contatori di clienti e capi realizzati
Frontend · il sito
Una home per tre servizi — frontend
02

Lo shop delle borse

Le borse della collezione (Croissant, Marea, Luna, Eva, Stella, Mou e le altre) hanno il loro negozio, con le mie foto di prodotto, i prezzi e le promozioni in evidenza. Accanto alle borse ci sono i prodotti personalizzabili con ricamo.

  • Griglia pulita, con prezzo pieno e prezzo scontato
  • Etichette "Sale!" e percentuale di sconto sulle schede
  • Anteprima veloce del prodotto senza lasciare la pagina
  • Articoli personalizzabili: fiocchi nascita, set di asciugamani ricamati
Frontend · il sito
Lo shop delle borse — frontend
03

Schede prodotto con varianti di colore

Ogni borsa ha una scheda con la galleria delle foto, la descrizione del materiale e le varianti di colore da scegliere con un clic. Sotto compaiono i prodotti correlati, per continuare a guardare la collezione.

  • Selettore dei colori a pallini
  • Galleria con le foto della borsa da più angolazioni
  • Descrizione, informazioni aggiuntive e recensioni in schede
  • Prodotti correlati con i loro sconti
Frontend · il sito
Schede prodotto con varianti di colore — frontend
04

Riparazioni: si parte dal capo

Il configuratore delle riparazioni si apre con la griglia dei capi, ognuno con la sua illustrazione: camicia, jeans, cappotto, vestito e gli altri, tredici in tutto. Un'etichetta "% OFF" segnala i capi che hanno lavorazioni in promozione.

  • Tredici capi, dalla t-shirt al cappotto
  • Mostrati solo i capi che hanno almeno una lavorazione disponibile
  • Al clic la pagina scorre da sola alle lavorazioni
  • Utilizzabile anche da tastiera
Frontend · il sito
Riparazioni: si parte dal capo — frontend
05

Le lavorazioni di quel capo, col loro prezzo

Scelto il capo compaiono solo le lavorazioni che si possono fare su quello, ognuna con la sua icona e il suo prezzo: sui jeans sono dieci, sulla t-shirt tre. Il prezzo cambia da capo a capo, perché accorciare un cappotto non è come accorciare una camicia.

  • Diciannove lavorazioni, dall'orlo alla cerniera al rammendo
  • Stessa lavorazione, prezzo diverso per ogni capo
  • Sconti sulla singola lavorazione con prezzo barrato ed etichetta "% OFF"
  • Selezione multipla con un tocco su ogni riga
Frontend · il sito
Le lavorazioni di quel capo, col loro prezzo — frontend
06

Sconti progressivi automatici

Chi porta più lavori insieme risparmia. Le lavorazioni scelte si ordinano dalla più cara: la prima resta a prezzo pieno, la seconda ha il 5% di sconto, la terza il 10%, dalla quarta in poi il 15%. Accanto a ogni prezzo compare lo sconto applicato, così il cliente capisce subito perché conviene.

  • Sconti per seconda, terza e quarta lavorazione in poi
  • Percentuali modificabili dal pannello, senza toccare il codice
  • Le lavorazioni già scontate non entrano nel cumulo
  • Etichetta "extra -5%" e prezzo barrato su ogni riga
Frontend · il sito
Sconti progressivi automatici — frontend
07

Note per la sarta e riepilogo

Sotto le lavorazioni il cliente scrive le sue indicazioni, per esempio di quanti centimetri accorciare o che cerniera vuole, e un riepilogo mostra capo, lavorazioni, sconti e totale, aggiornati a ogni scelta. Il pulsante del carrello si attiva solo quando c'è almeno una lavorazione.

  • Campo note con un esempio già scritto come suggerimento
  • Totale ricalcolato a ogni clic
  • Prezzo finale di ogni lavorazione dopo gli sconti
  • Nessun carrello vuoto: pulsante attivo solo con una scelta
Frontend · il sito
Note per la sarta e riepilogo — frontend
08

Carrello e ordine già completi

Nel carrello la riparazione arriva con tutto quello che serve: il capo, ogni lavorazione con il suo prezzo e lo sconto, le note del cliente. Le stesse informazioni finiscono nell'ordine e nelle email, così in sartoria si apre l'ordine e si sa già cosa fare.

  • Capo, lavorazioni, sconti e note in carrello, checkout ed email
  • Righe d'ordine leggibili anche per chi lavora al banco
  • Compatibile con il carrello e il checkout a blocchi di WooCommerce
Frontend · il sito
Carrello e ordine già completi — frontend
09

Un prezzo che non si può manomettere

Il prezzo che il cliente vede lo calcola il browser, ma quello che paga lo ricalcola sempre il server, con le stesse regole. Ho confrontato i due calcoli su 272 combinazioni reali del listino: coincidono sempre, e chi prova a modificare la pagina paga comunque la cifra giusta.

  • Ogni lavorazione deve appartenere al capo scelto
  • Nessuna riparazione nel carrello senza configurazione
  • Il prezzo base del prodotto non si può mai pagare al posto della riparazione
  • Prezzi sempre allineati al listino, anche con il carrello aperto
Frontend · il sito
Un prezzo che non si può manomettere — frontend
10

Capi su misura su richiesta

Per chi vuole un capo o un accessorio nuovo c'è la pagina "Crea il tuo progetto": il cliente indica tipo di capo, tessuto, colori e fantasia, le sue misure e può caricare il suo disegno. PopSart riceve una richiesta completa e prepara il preventivo.

  • Dati del capo: tipo, tessuto, colori, fantasia e quantità
  • Misure di vita, bacino e lunghezza
  • Caricamento del disegno o del bozzetto
  • Domande frequenti sulla stessa pagina
Frontend · il sito
Capi su misura su richiesta — frontend
11

Il listino gestito dal pannello

Nella bacheca di WordPress c'è il menu Configuratore: capi e lavorazioni si creano come un articolo, con titolo e illustrazione, e dentro ogni capo una tabella indica quali lavorazioni si possono fare e a che prezzo. Da lì si gestiscono anche gli sconti progressivi e la licenza del plugin.

  • Capi, Lavorazioni, Sconti e Licenza in un unico menu
  • Tabella prezzi per capo: spunta, prezzo base e sconto
  • Prezzi conservati anche quando una lavorazione viene disattivata
  • Licenza verificata dal mio CRM, con un avviso chiaro se scade
PopSart
PopSart
PopSart

/ Solution

Ho costruito il sito su WordPress e WooCommerce, con una home che presenta subito i tre servizi e li porta ognuno alla sua strada. Le borse hanno il loro shop, con schede prodotto, varianti di colore e le foto che ho scattato. Per le riparazioni ho scritto un plugin su misura: il cliente sceglie il capo, vede solo le lavorazioni possibili su quel capo con il loro prezzo, le seleziona, scrive le sue indicazioni e mette tutto nel carrello. Gli sconti su più lavorazioni si applicano da soli, e il prezzo lo calcola sempre il server, così nessuno può modificarlo dal browser. Per i capi su misura c'è una pagina di richiesta con misure, tessuti, colori e il caricamento del disegno. In studio ho fotografato la collezione di borse indossate da una modella, su fondo neutro: immagini coerenti per la home, il negozio e la comunicazione del brand.

/ Tech stack

WordPress e WooCommerce

Negozio, varianti di prodotto, carrello e ordini, con le scelte del configuratore dentro ogni riga d'ordine.

Elementor

Pagine costruite a blocchi, che PopSart può aggiornare da sola senza toccare il codice.

Plugin su misura in PHP

Due archivi, Capi e Lavorazioni, una tabella prezzi per ogni capo e il calcolo del prezzo sul server.

AJAX e JavaScript

Le lavorazioni compaiono al clic sul capo e il riepilogo si aggiorna a ogni scelta, senza ricaricare la pagina.

Sony A7 IV e Tamron 28-75 f/2.8

Shooting in studio con luce controllata: f/6.3, 1/200 e ISO 100, per borse nitide e colori fedeli.

PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart
PopSart

/ Mobile Preview

PopSart
1 / 4

/ Desktop Preview

PopSart
PopSart
1 / 4
Web Site
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Video
Daniele Raho STUDIO
Web Site
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Foto
Daniele Raho STUDIO
Fissa un appuntamentoRichiedi un preventivo
Scrivimi