Cum sa creezi un site Web ?

Te-ai decis sa creezi un site ?  Cel mai probabil va trebui sa faci apel la 2 tipuri de competente pentru a-l realiza : un designer web pentru partea grafica (webdesign) si un programator pentru partea tehnica.

Dar cum sa descrii cu precizie designerului si programatorului ceea ce vrei sa obtii cand de fapt nici tu nu stii prea bine in acest stadiu al proiectului?

Un site e-commerce prost conceput poate avea efecte catastrofale asupra activitatii dvs. : vizitatorii gasesc cu greu produsul cautat, design-ul site-ului, oricat de frumos ar fi, nu este coerent cu consumatorii targetati…

Exista 2 documente esentiale si complementare pe care trebuie sa le redactati pentru a avea toate  sansele de partea voastra inca de la conceperea site-ului : brief de creatie si wireframe (schita propunerii grafice).

Redactarea unui bun brief de creatie pentru site-ul tau

Obiectivul unui brief de creatie este de a permite webdesigner-ului  sa  identifice universul grafic de referinta in care site-ul dvs. trebuie să evolueze. Există coduri grafice speciale in functie de tinta la care facem referinta si nerespectarea lor ar putea pune in pericol identificarea pe segmentul de piata vizat.

De exemplu, daca vindeti haine elegante apartinand unei marci de renume si site-ul dvs. nu reflecta o „atitudine” coerenta cu articolele pe care le vindeti (culori tipatoare, preturi scrise cu carcatere mari si ingrosate….) vizitorii nici macar nu se vor deranja sa  exploreze site-ul. Universul grafic al unui astfel de site consta in culori sobre, cu elemente de design elegante, o punere in pagina aerata si preturi discrete.

Va propunem un sablon de brief de creatie care va va face sa va puneti intrebarile potrivite si va va maximiza sansele obtinerii unui rezultat in concordantă cu asteptarile dvs. In acelasi timp va permite webdesigner-ului sa inteleagă mai bine proiectul dvs. si va castiga timp in crearea acestuia.

1. Definitie proiect

1.1. Conceptul

• Explicati pe scurt ideea.

• Caror nevoi raspunde acest site?

• Care sunt punctele forte ale proiectului?

1.2. Identitate vizuala

• Care este numele site-ului?

• Exista deja un logo? Daca trebuie creat unul, precizati acest lucru.

• Care este ideea de baza a proiectului (sloganul)?

1.3. Care este raportul   „imagine/ preţ” pe care doriti sa il transmiteti?
• Propuneti un produs de marca, sau mai degrabă un produs pentru persoane cu buget de criza?

• Vreti să transmiteti prin intermediul site-ul dvs. imaginea unei firme cat mai aproape de clienti si deschisa in relatia cu clientii sai sau imaginea unui „gigant” in domeniu ?

2. Piata

In ce sector de afaceri vreti sa evoluati?

Cui va adresati?

• Definiţi vizitatorii tinta cat mai exact posibil.

• Care este contextul personal şi profesional, interesele lor, preocuparile lor, valorile lor? De exemplu: persoane juridice, mediu urban, peste 30 de ani, mama tanara, parinti cu copii, persoane sensibile la problemele de mediu, etc). Daca exista mai multe obiective, accentul trebuie pus pe obiectivul cel mai important, care va reprezenta cel mai mare potential de trafic.

• De ce au nevoie clientii de aceste produse, aceste servicii ?

2.3. Cine sunt concurentii?

Această parte este deosebit de importanta, deoarece putem extrage repere concrete despre ceea ce exista deja pe site-urile din sfera noastra de interes, putem vedea tacticile de urmat sau de evitat.

• Identificarea si clasificarea concurentilor in cazul în care există mai multe tipuri + URL-ul site-urilor lor.

• Ce propun ei ?

• Care sunt diferentele in comparatie cu proiectul dumneavoastră?

• Exista lucruri care vă plac din design-ul site-urilor concurente sau functionalitati intresante pe care ei le ofera?

• Ce nu va place la site-urile concurente?

 

3. Site-ul

3.1. Ce ar trebui sa spuna utilizatorii atunci cand ajung pe site-ul (pagina de start sau alta pagina)?

• Hei, in sfarsit un site care iese in evidenta printre altele de acest gen !

• Ce produs minunat! Trebuie sa-l am neaparat!

• Acest site inspira incredere. Pare a fi un loc bun pentru a cumpara produsul pe care il vreau.

• Pe acest site cred ca voi găsi ceea ce vreau mai rapid decât oriunde in alta parte

• Pare a fi multa lume aici! Mi-ar placea să ader la aceasta comunitate.

• Etc …

3.2. Ce ar trebui sa faca utilizatorul odata ajuns pe site-ul dvs. ?

• Lansarea unei cautari pentru a gasi produsul cautat?

• Sa se inscrie pentru a deveni un membru al comunitătii?

• Cumpere un anumit produs?

• Sa isi spuna opinia?

• Etc …

3.3. Care sunt valorile / conceptele pe care trebuie sa le transmită site-ul?

• Ce valori doriţi să transmiteti sau să impartăsiti cu publicul tinta prin intermediul site-ului? De exemplu: incredere, expertiza, proximitate, valorile de comunitate, de schimb de informatii, distractie …?


3.4. Care sunt principalele caracteristici / secţiuni ale site-ului?


Descrierea cat mai exact posibil a continutului secţiunilor site-ului. Daca doriti un meniu care se deschide intr-un anumit fel, sau ca o informatie sa fie pusa in valoare mai mult decat altele. Ideal ar fi sa furnizati o arborescenta a site-ului – Wireframe sau storyboard.

3.5. Care sunt site-urile de referinta si cele care va displac?
In cele din urmă, este important să se ia in considerare gusturile dvs. personale caci trebuie sa fiti mandru de site-ul dvs.
• In general, care sunt site-urile care va plac din punct de vedere grafic?

• Care sunt site-urile care va plac din punct de vedere al functionalitatii?

• aceleasi intrebari pe site-uri care nu va plac.

4. Munca ceruta

In primul rand, cereti realizarea de 2 sau 3 exemple de grafica pentru pagina de start, astfel incat sa aveti de unde alege.Daca nu aveti un logo, este timpul să spuneti!


4.2. Lista livrabilelor şi formatul


Livrabilele sunt elementele pe care le veti recupera de la webdesigner. Acesta trebuie să fie foarte specific deoarece acest lucru defineste ce va trebui el sa realizeze in cadrul proiectului dumneavoastra.

Livrabilele sunt paginile pe care trebuie sa le creeze si livreze celui care le va intergra (cel care va dezvolta vizibil site-ul dvs.).

• Acasa

• Pagina motor de căutare

• Pagina de tipul fisa de produs

• Pagina de tipul Profil membru
Toate elementele trebuie sa fie furnizate in format JPEG  si PSD (Adobe Photoshop) sau AI (Adobe Illustrator).

Dacă webdesigner-ul şi programatorul sunt aceeasi persoana, acest proces este simplificat pentru ca el stie ce trebuie sa faca pentru a face site-ul dvs.


4.3 Buget şi timp

Trebuie sa specificati  bugetul pe care puteti sa-l investiti in site? Un subiect controversat. Majoritatea vor spune ca daca specificati bugetul dvs., furnizorii automat incearca sa ramana la limita superioară, in mod justificat sau nu.

Specificati cand doriti ca site-ul sa fie terminat, astfel incat webdesigner-ul sa poata estima cat timp să dedice pentru proiectul dumneavoastra.

Aceasta faza de proiectare este una dintre cele mai importante pentru a asigura buna desfasurare a proiectului. Realizarea Wireframe-ului va permite materializarea concreta si in detaliu a ceea ce va conţine site-ul dvs.

Cum sa proiectezi interfata site-ului ?

 

1. Ce este un wireframe?

Wireframe-ul este o reprezentare schematică a interfetei unui site şi este utilizat pentru a defini:

• structura sa de ansamblu,

• relaţia dintre fiecare intrare sau fiecare pagina

• conţinutul de orice tip (text, titluri, imagini, document video de download) si localizarea lor in pagini,

• ergonomia fiecarei pagini.

Obiectivul acestui document este, prin urmare, pregăatirea pentru faza de proiectare grafica si dezvoltare tehnica a front office-ului.

 

2. Care sunt avantajele wireframe-ului în procesul de proiectare şi de concepere a site-ului?

Cu cat site-ul este mai complex în termeni de conţinut si functionalitate, realizarea wireframe-ului devine un exercitiu necesar.

In cazul unui site e-commerce, wireframe-ul e o cale de a te asigura ca fiecare pagina este optimizata pentru a permite achizitionarea facila  (butoane de cumpărare plasate in locuri strategice, link-ul formularului de contact sau numărul de telefon sa fie vizibile) si, prin urmare vom spera ca o sa avem un site profitabil.

Este nevoie de timp pentru a obţine un rezultat optim, dar este un document de care nu trebuie sa te lipsesti daca vrei să fii sigur că va fi proiectat bine site-ul web.Pentru dvs. avantajele sunt:
wireframe-ul va va face sa va puneti o multitudine de intrebari, pe masura ce reflectati la ceea ce trebuie sa includa fiecare pagină a site-ului.

 

 

Pentru web designer:

•Vizualizeaza exact ce trebuie să puna pe fiecare pagină şi intelege imediat care sunt elementele pe care trebuie sa le scoata in evidenta si care sunt elementele secundare. Webdesigner-ul va putea lucra, prin urmare, mult mai bine, mai repede.Pentru programatori / integratori:
•Ei vizualizeaza imediat modul de functionare al instrumentelor pe care trebuie sa le dezvolte, iar acest lucru permite economisirea de timp semnificativ in explicatii.


Atat pentru webdesigner cat si pentru programatori

Deoarece lucreaza pe baza aceluiasi document, aveti garantia ca inteleg la fel ceea ce vreti sa obtineti, si se vor coordona mai bine intre ei. Din nou,se economiseste timp si eficienta.


3. Cine face wireframe-ul?

In general, wireframe-ul este proiectat de un expert in conceperea de site-uri care stapaneste aspectele grafice, ergonomice, editoriale si tehnice.

Cele mai confortabil (dar, de asemenea si cel mai scump) este sa incredintezi această lucrare, unei agentii.

La fel de eficace (si mai ieftin) este sa apelati la un consultant independent, care se va ocupa de intreaga proiectare a site-ului. Puteţi merge apoi cu wireframe-ul dvs. la un freelancer sau o agentie web.

Ultima opţiune, sa faceti singur un wireframe cu ajutorul instrumentelor dedicate, dar daca va lansati intr-un proiect de e-commerce, fara nicio experienta in acest domeniu, veti avea nevoie de parerea unui profesionist inainte de a incepe faza de creare si dezvoltare a site-ului pentru a va asigura ca rezultatul final va fi unul satisfacator.4. Ce instrumente se folosesc pentru a proiecta un wireframe?

Aici gasiti :Top 7 Instrumente de Wireframe

De asemenea se poate folosi Powerpoint-ul care are meritul de a permite realizarea unor lucruri foarte simple sau foarte complexe in functie de nivelul lor si natura proiectului.


Surse :http://www.conseilsmarketing.fr/
Imagine: mojofat.com