Web Design, Copywriting, UI/UX
Probabil cea mai importanta parte a procesului, web design-ul este momentul de creație bazat pe noțiuni stricte pe care le punem in aplicare. Când realizam grafica web site-ului suntem întotdeauna axați pe dorințele clientului și pe reacțiile utilizatorilor, astfel reușim să dăm o forma funcțională unei simple schițe.
Începând cu un simplu wireframe (esența paginilor) putem determina o hartă pentru a ghida fiecare pas făcut de vizitator, așezarea secțiunilor, flow-ul paginilor și formele butoanelor sunt elemente ce fac diferența în alegerea făcută. Astfel, rezultatul final este o construcție pe o bază solidă cu un aspect plăcut ce inspira și invita la reacție
Digital design is like painting, except the paint never dries Neville Brody, Graphic Designer
Variante de Prețuri Web Design
Pachetele de prețuri se diferențiază prin atenția la detaliu și, implicit prin timpul necesar livrării serviciilor.
Basic
500€- Grafică simplă bazată pe schițe furnizate de client
- Elemente grafice simple
- Texte în limita a 2000 de cuvinte la nivel de site
Standard
750€- Grafică complexă bazată pe tehnici de UI/UX
- Cromatică și elemente grafice aliniate cu brand-ul clientului
- Texte în limita a 5000 de cuvinte la nivel de site
Profesional
1500€- Grafică complexă, bazată pe tehnici psihologice și de UI/UX
- Strategie de funneling în funcție de rezultatele țintite
- Aliniere forme, cromatică, fonturi, decorațiuni și alte elemente grafice cu branding-ul clientului
- Aliniere forme, cromatică, fonturi, decorațiuni și alte elemente grafice cu branding-ul clientului
- Texte în limita a 10000 de cuvinte la nivel de site
Grafica se referă la macheta site-ului, aspectul general; Elementele grafice se referă la decorațiuni, ilustrații, icon-uri etc.; Cromatica se referă la paleta de culori folosită la grafică; Textele se referă la tot conținutul site-ului, inclusiv inserții scurte, titluri și meniuri.
Pentru mai multe detalii și explicații, te invităm să ne contactezi Contactează-ne!Întrebări Frecvente Web Design
Mai jos vei găsi o colecție de întrebări de care ne lovim în mod repetat.
Cât de implicat trebuie să fiu?
Procesul de web design este în totalitate treaba graficienilor și a departamentului de copywriting, aceștia demarează procedurile imediat după ce este gata brand-ul deoarece website-ul se crează în funcție de logo, forme și culori. Clientul trebuie să fie prezent pentru a aproba materialele primite de la noi și pentru a sugera modificări unde este cazul.
Ce este wireframe-ul în contextul actual?
Wireframe-ul este prima schemă a website-ului, este o bază a acestuia în care definitivăm felul în care vom aranja secțiunile, cum vor fi distribuite butoanele, CTA-urile și imaginile. Acest wireframe este important pentru a crea o ierarhie a paginilor din website și pentru a denota o consistență în elementele grafice folosite în pagini, fără a induce în eroare utilizatorul.
Cum voi primi materialele de web design?
Materialele pe care le realizăm vor fi transmise în format PDF prin intermediul e-mail-ului. De asemenea, uneltele pe care le folosim pot simula cu ușurință funcționalitățile unui website real, așadar clienții noștri pot testa elementele interactive precum: navigarea în pagini, butoanele sau CTA-urile.
Cât durează procesul de web design?
Procesul de web design este unul amplu, dat fiind că un website este format din mai multe pagini. Acesta poate dura de la 2 la 3 săptămâni în funcție de dificultatea paginilor și de abundența informațiilor prezentate. Un factor important este și timpul de răspuns al clientului și dificultatea modificărilor cerute.
Proces de Lucru Web Design
Procesul de webdesign este unul laborios deoarece ține cont de preferințe subiective ale clientului care mai întâi trebuie înțelese pe deplin de către echipa grafică și apoi incorporate în design.
Prima întâlnire (Baseline)
Clienții noștri devin prietenii noștri, tocmai de aceea de la începutul proiectului vrem să știm care este viziunea lor, ce vor să promoveze și mai ales să înțelegem ce îi face speciali pe piață. Astfel reușim să ne apropiem de produs/serviciu și să îl ridicăm ca și cum ar fi al nostru.
Prima întâlnire noastră întâlnire va avea o atmosferă detașată, aici vom vorbi despre elementele ce stau la baza viitoarei prezențe online. De aceea vom discuta despre mesajul pe care afacerea îl va transmite, audiența care va primi acest mesaj și, mai ales, feedback-ul lor. Aceste 3 puncte sunt esențiale pentru o abordare cât mai corectă.
Identitate Vizuală
În prezent, identitatea vizuală a unui brand cântărește enorm, felul în care emblema reflectă scopul afacerii, alegerea culorilor potrivite în funcție de domeniul de activitate, formele folosite pentru a crea consistență sau chiar micile elemente de decor. Toate aceste detalii, aparent mici, fac diferența în momentul în care un utilizator este hotărât sau nu să facă click pe ”Sună acum” sau ”Cumpără”.
Procesul de creare a unei identități vizuale este unul migălos, aici îmbinăm ideile primite de la client cu o cercetare amănunțită asupra domeniului de activitate, realizăm un logo care se potrivește perfect cu așteptările clientului, o cromatică adaptată și ilustrații personalizate.
Creare conținut text (copywriting)
Aici vine partea interesantă! Ce este un website fără conținut text? O simplă imagine. Tocmai de aceea, departamentul nostru de copywriting se ocupă de crearea unei structuri bine definite de texte, ierarhizate și testate cu cele mai bune unelte actuale. Astfel, procesul începe cu un Key Word Research amănunțit, în care țintim subiectele principale, realizarea unei ierarhii a informațiilor și titlurilor pentru a realiza un website aerisit din punct de vedere al textelor și apoi detalierea subiectelor pentru a atinge un nivel cât mai complex de informație.
După finalizarea conținutului text, echipa de copywriting trece prin seria de teste pentru a definitiva corectitudinea. Așadar, aceștia folosesc unelte precum Plagiarism Checker pentru a verifica originalitatea, Key Word Research pentru stabilirea cuvintelor cheie țintite și Readability Testing pentru a verifica ușurința cu care utilizatorul poate parcurge textul.
Creare structură pagini (wireframe)
Înainte să realizăm website-ul în sine, noi folosim o procedură diferită pentru a crea mai mult decât o simplă pagină cu text. Primul pas este realizarea unui wireframe - scheletul website-ului, felul în care sunt distribuite secțiunile, ușurința cu care utilizatorul ajunge la pagina sau informația dorită. Un wireframe se crează folosind concepte precum ”UX Mapping” sau ”Design Thinking”.
”UX Mapping” este o tehnică folosită pentru a facilita călătoria utilizatorului pe o pagină, astfel dacă un utilizator caută o informație pe un site învechit, obișnuit acesta nu va ajunge din punctul ”A” în punctul ”B” ci va trece succesiv prin pop-up-uri sau prin pagini auxiliare. Astfel conceptul este folosit pentru a gândi încă de la început pașii pe care utilizatorul urmează să îi facă și astfel să îl ajutăm să găsească rapid informația într-un website complex.
După ce wireframe-ul a fost creat, urmează popularea acestuia cu elemente cromatice, vizuale și chiar elemente de brand. Aici se definitivează, în funcție de subiect: formele butoanelor, așezarea și dimensiunea textelor și prezentarea imaginilor.
Finalizare interfață grafică
Ultimul pas pe care îl facem este cel al rafinării, momentul în care lustruim produsul final, în care ne asigurăm că fiecare componentă a acestuia este corect realizată. Astfel, ultimul pas are la bază testarea din punct de vedere User Experience pentru a concretiza dacă website-ul este ușor de digerat și din punct de vedere User Interface pentru a contura o interfață grafică simplă, adaptată la cerințele actuale și mai ales aerisită.
În acest pas vom adăuga și toate imaginile sau videoclipurile pe care le-am primit de la client, știm foarte bine că o imagine face cât o mie de cuvinte, așadar le vom alege pe cele mai calitative și reprezentative. După aceea, prezentăm produsul final clientului nostru și facem eventualele modificări.
Software și Tehnici Web Design
Folosim o gamă variată de unelte, de la cele de design, la cele de copywriting, mai jos le vom descrie pe rând.
ahrefs
Preferăm unealta Keyword Explorer din cadrul aherfs deoarece aceasta ne oferă foarte multe informații despre cuvintele cheie despre care trebuie să scriem dar și subiecte derivate precum întrebări sau cuvinte cheie similare.
Topic ResearchSEM Rush
Deși aherefs are propria unealtă de topic research (Content Explorer), considerăm că cea din SEM Rush este superioară datorită algoritmului lor care tinde să genereze rezultate mai relevante.
Copy WritingGoogle Docs
Am ales această unealtă pentru a ne scrie textele deoarece, deși are o interfață simplă și intuitivă, ea se bucură de un sistem bun de proofing dar și de un outline intuitiv.
TestingPlagiarism Checker
Pentru a ne asigura că textele noastre sunt originale, folosim unealta Plagiarism Checker de la SmallSEO Tools.
Envato Market
Deși inisistăm și punem presiune pe fiecare client să investească în imagini proprii realizate în mod profesionist, de cele mai multe ori de ne găsim nevoițiti să cumpărăm imagini ”stock„ iar pentru asta folosim serviciile Envato de unde cumpărăm atât poze, cât și ilustrații.
Photo ProcessingAdobe Photoshop
Principalul instrument de procesare al pozelor rămâne Adobe Photoshop deoarece este o unealtă deosebit de puternică și bine integrată pentru web design. Ocazional, mai folosim și Adobe Lightroom - când primim imagini neprocesate de la client.
Vector ProcessingAdobe Illustrator
Pentru creația și editarea elementelor vectoriale, folosim Illustrator, probabil cea mai complexă unealtă existentă. Doar atunci când clientul o cere, în general când implică materiale imprimabile, folosim Corel DRAW.
UI/UXAdobe XD
Această unealtă ne ajută să realizăm rapid prototipuri (wireframe) și machete datorită interfeței simple dar puternice și capacității de a simula animații și workflow-uri.
Nota Autorului Web Design
Totul a plecat de la o simplă imagine și greutatea de a o potrivi corect cu un text. Acum 3 ani nu mă gândeam că prezentarea unor informații poate fi un lucru atât de greu, că un website este de fapt o călătorie a utilizatorului (dictată de designer). Am parcurs un drum greu până am ajuns să stăpânesc concepte avansate de UI/UX, de UX Mapping, de User Flow și, mai ales, de empatizare cu utilizatorul.
Crearea unui website pleacă din mâinile graficianului, acesta este arhitectul. Analogia este una perfectă, dată fiind dificultatea cu care se realizează. Când am început să creez website-uri bazate pe nevoile utilizatorului, am realizat că o asemenea ”hartă” este un labirint gândit în detaliu și fondat pe conceptul ”Design Thinking”. Organizarea este cheia, o grafică bună are întotdeauna baza într-o noțiune bine definită.
Cu un bagaj încărcat de idei am început să desenez efectiv primele mele schițe, să înțeleg cât mai bine acțiunile utilizatorilor, să gândesc înaintea lor pentru a le pava drumul către o acțiune în pagină. Am realizat wireframe-uri pentru diverse tipuri de website-uri și am învățat ce implică fiecare tip de afacere, astfel am căpătat experiență în domenii diferite în care știu să mă confrunt cu o mulțime de probleme.
Lavinia Stroilescu, CEO CELSO