Sari la continut

Agentie e-commerce din 2017 · Shopify Partner

Web design Shopify si UI/UX

Web design Shopify pentru magazine noi si pentru redesign: personalizam o tema din Theme Store pe identitatea brandului sau cream un design custom, de la zero. Pagina de produs, colectiile, cosul si checkout-ul le gandim pentru telefon si pentru conversie, iar redesignul unui magazin existent il facem pe acelasi magazin, cu aceleasi URL-uri.

Anatomia unei pagini de produs Shopify

  1. Cale clara de la colectie la produs
  2. Galerie cu text alternativ
  3. Imagini pentru fiecare varianta
  4. Pret, recenzii si livrare la vedere
  5. Variante usor de atins pe telefon
  6. Butonul de cos, vizibil pe mobil
Proces

Doua variante de web design Shopify

Alegem varianta dupa catalog, buget si cat de diferit trebuie sa arate magazinul. In ambele, facem designul pentru desktop, tableta si mobil.

Tema din Theme Store, adaptata vizual

  1. Alegem tema

    O alegem dupa catalog, dupa paginile de care ai nevoie si dupa cum arata pe telefon. O tema platita se cumpara o singura data, pentru un singur magazin.

  2. Personalizam in editor

    O personalizam in editorul Shopify, pe identitatea brandului: sectiunile si blocurile se adauga, se muta si se ascund fara cod. Ce lipseste din setari adaugam in cod, pe o copie a temei.

  3. Produs, cos si checkout

    Asezam paginile de produs, colectie si cos si ducem brandul in checkout: logo, culori si fonturi, de pe planul Basic in sus.

Livrabile

tema licentiata pe magazinul tau, sabloanele personalizate, designul pentru desktop, tableta si mobil

Design custom, pe identitatea brandului

  1. Directia vizuala

    Stabilim impreuna tipografia, culorile, tonul si felul in care se vad produsele.

  2. Machetele paginilor

    Desenam machetele paginilor principale (homepage, colectie, produs si cos), pentru desktop si mobil. Le aprobi inainte sa trecem la implementare.

  3. Implementarea in tema

    Le construim ca sectiuni si blocuri noi, refolosibile, pe care echipa ta le editeaza apoi din editor, fara cod.

Livrabile

directia vizuala agreata, machetele paginilor principale, sectiunile si blocurile implementate in tema

Ce urmarim pe paginile care vand

Un magazin castiga sau pierde comenzi in patru locuri: pagina de produs, colectiile, cosul cu checkout-ul si telefonul. Le lucram dupa ghidurile Shopify si dupa WCAG 2.2.

Pagina de produs

Tot ce decide cumpararea sta langa butonul de cos.

  • Galerie cu text alternativ pe fiecare imagine
  • Pret, variante si livrare clare inainte de cos
  • Variante si butoane de cel putin 24 x 24 px
Colectii si filtre

Clientul ajunge repede la produsul potrivit, din meniu sau din filtre.

  • Filtre de pret care merg si fara tragere (WCAG 2.2, criteriul 2.5.7)
  • Pret si variante vizibile pe cardul produsului
  • Navigare din tastatura, cu focus vizibil
Cos si checkout

Brandul ajunge pana in checkout, pe toate planurile de la Basic in sus.

  • Logo, culori, fonturi si fundal pe checkout
  • Acelasi stil pe paginile de multumire si de status al comenzii
  • Pasii de informatii, livrare si plata se extind doar pe Shopify Plus
Telefon

Fiecare pagina o desenam si o verificam pe telefon, nu doar o micsoram.

  • Text de cel putin 16 px si contrast de 4,5:1
  • Fara slideshow-uri si video care pornesc singure
  • Butonul de cos vizibil si pe ecranul mic
Abandonul cosului si viteza magazinului

Datele Baymard despre abandon si pragurile Core Web Vitals le detaliem pe pagina de mentenanta Shopify.

Inainte de lansare

Ce verificam inainte sa publicam tema

  • Verificari pe tema noua, inainte de publicare
  • Repere: WCAG 2.2, legislatia din Romania, Core Web Vitals

WCAG 2.2 AA

Accesibilitate

Reperele pe care Shopify le cere temelor din Theme Store, verificate pe tema ta.

  • Contrast de 4,5:1 pentru text si de 3:1 pentru text mare
  • Navigare completa din tastatura, cu focus vizibil
  • Text alternativ pe imagini si tinte de atingere de 24 x 24 px
  • Pentru un magazin existent: audit separat, dupa WCAG 2.2 AA

Informatii legale

Informatiile pentru client

Ce afiseaza magazinul pentru client, pus in tema si verificat inainte de lansare.

  • Functia de retragere online ('retrageti-va din contract aici'), obligatorie din 19.06.2026
  • Nota armonizata despre garantia legala de minimum 2 ani, din 27.09.2026
  • Datele firmei si preturile, afisate cum cere Legea 365/2002
  • Pictograma SAL de la ANPC; fara linkul ODR (platforma e oprita din 20.07.2025)

Cookie-uri

Consimtamant

Cookie-urile neesentiale pornesc doar dupa acordul vizitatorului, cum cere Legea 506/2004.

  • Bannerul nativ Shopify, pentru vizitatorii din SEE
  • Politica de confidentialitate publicata, pe care bannerul o cere
  • Pentru cookie-uri si pixeli terti, un banner tert sau logica proprie, unde e nevoie

Core Web Vitals

Viteza

Reperele din ghidul de performanta Shopify pentru teme, aplicate inainte de lansare.

  • Imaginea principala fara lazy loading, cu fetchpriority high
  • Scripturile necritice cu defer
  • Fonturile gazduite pe CDN-ul Shopify
Verificam ca elementele exista si functioneaza; textele legale le valideaza juristul tau.
Redesign

Redesign Shopify, pe acelasi magazin

Ai deja un magazin Shopify? Redesignul il facem pe acelasi magazin, nu pe unul nou: pregatim tema noua in biblioteca de teme, langa cea actuala, si o publicam abia dupa verificarile de mai sus.

  • Tema noua in bibliotecapana la 20 de teme pe Basic, Grow si Advanced
  • Aceleasi URL-uricaile /products si /collections raman fixe
  • Fara cod ramas de la aplicatiitema noua nu preia codul aplicatiilor dezinstalate

Portofoliu Shopify

Magazine Shopify la care am lucrat

Am mutat Tudor Personal Tailor de pe Magento 1 pe Shopify si am lucrat pe magazinul Cosmetology. Fiecare proiect are pagina lui in portofoliu.

FAQ

Intrebari despre web design Shopify

Ai o intrebare care nu e aici?

Depinde de catalog si de paginile de care ai nevoie, nu de pret: o tema fara cost, ca Horizon sau Dawn, facute de Shopify, ajunge cand structura ei acopera magazinul. In noiembrie 2026, Theme Store avea 1374 de teme, din care 24 fara cost; cele platite costau 100-500 USD, cu plata unica si licenta pentru un singur magazin.

Contact

Hai sa discutam designul magazinului tau

Spune-ne pe ce platforma e magazinul acum, ce pagini vrei sa schimbi si daca pornesti de la o tema sau de la zero. Revenim cu intrebari si cu o estimare dupa analiza.