Șablon de specificații tehnice pentru dezvoltarea paginii de destinație. Ce este o specificație tehnică? Explicați ce va fi pe fiecare pagină

În vastitate retea mondiala poți găsi nenumărate diverse manuale pe designul paginii de destinație. Cu toate acestea, în cele mai multe cazuri sunt imagini lipsite de context sau, dimpotrivă, teorie solidă fără exemple clare. Acest manual reprezintă o încercare de a combina ambele. Având o specificație tehnică solidă, vă va ajuta să vă creați o imagine clară a muncii dvs. și să vă justificați ideile.

De exemplu, acest articol va analiza crearea unei specificații pentru o pagină de destinație de către Verse pentru viitoarea sa clasă de master despre designul proceselor. Întregul proces este împărțit în 3 etape - definirea obiectivelor și Utilizator final, nuanțe de implementare și modificări iterative.

Obiectivele și înțelegerea utilizatorului

În timpul etapei de planificare, îți definești obiectivele, îți faci o idee despre cine sunt utilizatorii tăi și cum le poți fi de folos. Aceste informații vă vor servi drept un fel de stea călăuzitoare, care nu vă va lăsa să vă rătăciți. calea cea dreaptă.

1. Stabilirea scopurilor și obiectivelor

În primul rând, trebuie să-ți formulezi obiectivele. Și nu orice obiective, ci obiective SMART - cele care îndeplinesc următoarele caracteristici:

  • Specific – obiectivele ar trebui să fie extrem de specifice. Trebuie să aveți o idee clară despre ce trebuie să lucrați.
  • Măsurabil - Obiectivele ar trebui să fie măsurabile, astfel încât să vă puteți măsura progresul.
  • Realizabil - obiectivele ar trebui să fie realizabile. Străduiește-te pentru obiective mari, dar realiste.
  • Relevant - Obiectivele ar trebui să fie semnificative și relevante pentru ceea ce doriți să realizați.
  • Limitat în timp - obiectivul ar trebui să aibă o anumită dată de finalizare, astfel încât să puteți nu numai să evaluați, ci și să vă confirmați progresul.

Cu toate acestea, nu toate obiectivele tale trebuie să fie obiective SMART; unele dintre ele pot fi de o calitate excepțională. De exemplu, un amestec bun este 75% obiective SMART și 25% obiective de calitate.

Mai jos sunt câteva exemple de obiective comune care au fost folosite de Verse:

  • Conduceți traficul către pagina de destinație— 100.000 de vizitatori unici în 1,5 luni de la data lansării.
  • Obțineți adrese E-mail de la cei interesați și de la cei cărora acest curs ar putea fi cu adevărat util. Primiți 2000 de înregistrări în termen de 1,5 luni de la data lansării.
  • Creșteți gradul de cunoaștere a mărcii Verse și creșteți traficul pe blog cu 50%.
  • Într-o manieră clară și concisă, spuneți utilizatorului despre clasa de master Process și pentru cine a fost creată. Trezește interesul.
    • Explicați beneficiile clasei de master.
    • Povestește-ne despre tine și despre experiența ta.

2. Cine sunt utilizatorii tăi?

Pentru ca utilizatorii să fie interesați de pagina ta de destinație, trebuie mai întâi să înțelegi cine sunt, care sunt motivațiile lor etc.

Publicul cheie pentru astfel de cursuri de master sunt designerii care ocupă diferite posturi și au motivații diferite. Verse a împărțit publicul în două grupuri mari - utilizatori primari și secundari și a identificat mai multe portrete ale clienților potențiali în fiecare dintre ele:

Tabelul 1. Utilizatori principali

Directori de creație

Proiectanti principali

Aceștia sunt specialiști care se străduiesc constant să-și îmbunătățească abilitățile profesionale; profesioniști pasionați care au deja ceva experiență și caută idei noi. Acest grup de utilizatori are motivații similare cu grupul descris mai sus. Ei pot deveni principalii motivatori în achiziționarea acestui curs pentru biroul dumneavoastră.

Designeri independenți

Acești oameni sunt dornici să învețe cum să-și facă munca mai productivă. nivel inalt. Ce strategii folosesc cei care taxează mai mult pentru munca lor? Și ce tehnologii folosesc? Acest curs va răspunde la toate aceste întrebări și va dezvălui câteva secrete.

Studenți în design

Pentru acest grup de utilizatori, această clasă de master va fi o investiție excelentă și va da un impuls carierei lor. Ei îl vor putea folosi ca curs intensiv. Aceasta va fi o oportunitate excelentă de a vedea cum lucrează profesioniștii din domeniul lor.

Tabelul 2. Utilizatori secundari

Startup-uri în comerțul electronic

Acestea sunt firme tinere pentru care este important design bun, dar au un buget limitat. Aceștia vor fi interesați de a doua fază a proiectului, în care participanții creează un set de elemente interfața cu utilizatorul(kit UI) în sala de clasă ca produs independent.

Site-uri de designer

Kit-ul UI (și, dacă este posibil, clasa de master în sine) poate fi distribuit și pe unele platforme de design.


3. Nivelul de implicare a utilizatorului

Pagina ta de destinație va fi vizitată de utilizatori cu diferite grade de implicare, iar acest lucru trebuie să fie luat în considerare atunci când se elaborează specificațiile tehnice. Ce le poți oferi oamenilor pentru a-și atinge obiectivele pe care le-ai stabilit?

Să ne uităm la modul în care Verse și-a împărțit utilizatorii.

Utilizatori foarte implicați

Aflați despre Verse
Am văzut lucrarea terminată pe site-ul companiei
Faceți parte din comunitate

Utilizatori cu implicare medie

Am văzut lucrul pe Dribbble, Behance, Pinterest, Designspiration etc.
Nu sunt familiarizat cu site-ul Verse

Ce ai putea să le spui și să le oferi?

  • O scurtă prezentare generală a ceea ce este oferit în cursul de master și cum poate fi util
  • Modalitate de înscriere la curs - înscriere prin e-mail
  • Oferă ceva valoros în avans - Șablon PSD de la curs
  • Dirijați-le către blogul Verse

Utilizatori cu implicare redusă

Utilizatori care nu au idee cine este Verse și ce fel de curs este

Ce ai putea să le spui și să le oferi?

  • O scurtă prezentare generală a ceea ce este oferit în cursul de master și cum poate fi util
  • Modalitate de înscriere la curs - înscriere prin e-mail
  • Oferă ceva valoros în avans - șablon PSD de la curs
  • Dirijați-le către blogul Verse
  • Confirmați-vă nivelul nu numai cu un link către munca terminată, ci și cu calitatea paginii de destinație în sine.

După cum puteți vedea, cu cât un utilizator este mai puțin implicat, cu atât mai mult trebuie să comunicați cu el.

Sfat: dacă pagina dvs. de destinație are un formular de abonare, luați în considerare să îl oferiți utilizatorilor în schimbul adresei lor de e-mail.

Deci, de ce veți avea nevoie pentru a satisface obiectivele utilizatorului și ale dvs.:

  • Formular de prospect pentru ca utilizatorii să se înregistreze.
  • Detalii sau exemple din atelier – demonstrate prin video, text, design vizual sau imagini.
  • Spuneți utilizatorilor ce lucruri noi vor învăța de la cursul de master (lucrul cu grile, tipografie, machete și cum să rezolve diverse probleme).
  • Explicați cum acest atelier le poate crește valoarea ca designeri. Design vizual frumos și tipografie. Este important să se demonstreze un design robust care se bazează pe toate principiile menționate.
  • Spune o poveste adevărată. Fii tu însuți și transmite atmosfera cursului.
  • Prezintă-ți munca și povestește despre tine.

4. Poveștile utilizatorilor

Poveștile utilizatorilor sunt similare cu , cu excepția faptului că sunt mai specifice și acționează ca o cerință mai funcțională. in orice caz diferența cheie Accentul aici este pus pe ceea ce dorește utilizatorul, mai degrabă decât doar pe cerințe tehnice:

Puteți face și mai bine înlocuind utilizatorul cu un anumit public țintă ex: ca director de creație, vreau..., [pentru că...].

Implementare tehnica

Deci, te-ai hotărât asupra obiectivelor tale și ai creat cel mai clar portret posibil potential client, ceea ce înseamnă că este timpul să lucrați la partea principală a specificațiilor tehnice - nuanțele implementării.

1. Găsirea unui șablon potrivit

Căutați tot ce vă poate fi util: modele de design, lucruri care funcționează, cum ar fi, pot fi relevante pentru proiect. Păstrează totul pentru tine și revino pe măsură ce mergi. Aceasta este sursa ta de inspirație pentru a te ajuta să-ți formulezi propriile idei. , pe lângă designer, oferă acces la galerie pagini gata făcute, unde paginile de destinație sunt prezentate pentru o serie de categorii populare.

2. Structură și interacțiuni

Luați în considerare structura paginii, precum și toate interacțiunile utilizatorului și componentele necesare pentru a vă atinge obiectivele.

Elaborați un aspect schematic și treceți la componenta vizuală. Secvența în cazul versului este următoarea:

  1. Prezentați utilizatorului cursul. Postați formularul de înregistrare.
  2. Spuneți utilizatorului despre principalele beneficii ale cursului și despre ce poate lua din acesta.
  3. Explicați cui este destinat acest curs.
  4. Un exemplu de lecție și o imagine a unuia dintre ecranele clasei de master.
  5. Declarația finală a sarcinii și scopul acestui curs.
  6. Ultimul formular de înregistrare.
  7. Scurte informații biografice despre autor.

Fără îndoială, în timpul procesului de proiectare au apărut noi idei și s-a schimbat structura site-ului. Aceasta este frumusețea lucrului la propriul proiect: poți oricând să te întorci și să-l schimbi.

3. Vizualizarea

Pagina de destinație s-a bazat pe grila și pânza site-ului web Verse, precum și pe fonturile Chronicle Display și Gotham utilizate în designul său.

Începeți prin a elabora un detaliu (în exemplul descris a fost) și, de îndată ce sunteți mulțumit de el, treceți la următorul, construind treptat toate detaliile în jurul acestei chei. element vizual. Inițial, pânza arăta cam așa:

A ieșit destul de bine, dar mai era ceva de făcut. Accentul a fost puternic deplasat spre stânga și a existat și o lipsă de dinamism:

Această opțiune i s-a părut cea mai potrivită pentru Verse. Dar, deoarece autorii nu aveau drepturi asupra imaginii macbook, au recreat ceva similar folosind forme vectoriale.

În același timp, se lucra în restul paginii de destinație. Mai multe capturi de ecran de la master class au fost postate sub formă de carduri. În plus, utilizatorului i s-a explicat ce va primi de la acest curs:

Versiunea rezultată nu a fost în niciun caz versiunea finală. După ce au verificat scopurile și obiectivele inițiale, autorii au dezvoltat versiune noua pagini. În comparație cu primul, a transmis mai bine valoarea cursului. În plus, au fost adăugate mai multe pentru a angaja utilizatorul și, astfel, a crește numărul de share-uri pe pagină.

Modificări și iterații

Ați ajuns în punctul în care vă lansați în sfârșit pagina de destinație. Pagina ta de destinație nu este încă perfectă, ci doar punând-o într-un mediu live și obținând-o părere de la utilizatori, veți înțelege ce poate fi îmbunătățit în continuare de dvs. Modificările și iterațiile sunt cheia pentru site-uri web și produse de succes.

Vă rugăm să rețineți că informațiile sunt prezentate aici ca un proces liniar doar în scopul de a face mai ușor de perceput și asimilat. În practică, în majoritatea cazurilor trebuie să mergi frecvent înainte și înapoi și, în plus, mulți pași pot apărea simultan.

Lupta pentru perfecțiune este bună, dar dacă repararea a 1% durează atât timp cât repararea a 99% din restul, este mai bine să o lași așa cum este. Chiar dacă acesta nu este 1%, ci toate 10%, este mai bine să lansați produsul și să-l îmbunătățiți periodic (mai multe despre). Trebuie să înțelegem că nimic nu este vreodată finalizat cu adevărat; poate fi considerat complet doar în acest moment anume. Peisajul digital este în continuă schimbare, iar produsele pe care le creați trebuie să se schimbe și ele.

Rămâneți deschis la schimbare și optimizare constantă este ceva ce trebuie să faceți dacă doriți să obțineți rezultate grozave. Determinați obiectivele campaniei dvs., studiați-vă publicul și alegeți un șablon și personalizați-l pentru a se potrivi nevoilor dvs. sarcina tehnica iar modificările de testare în timpul fiecărei iterații vă vor ajuta.

Completarea brief-ului este o chestiune responsabilă, de care depind în mare măsură soarta întregului proiect și eficiența comunicării dintre client/interpret. Pentru a vă ajuta să vă dați seama, am scris manualul nostru. Citit!

Noțiuni de bază

Brief (din engleză „brief” - instrucțiuni, rezumat) - cel mai important document care vă permite să notați pozitii cheie comanda, specificati nevoile clientului.

Crearea unei liste are un singur scop - de a simplifica interacțiunea dintre client/interpret, de a spune cum, ce și de ce trebuie finalizat proiectul. Este recomandabil să începeți cooperarea între părți prin completarea unui astfel de document (rețineți că acest lucru este relevant pentru toate domeniile de activitate).

Lista ajută la descrierea detaliată a esenței comenzii, la prezentarea antreprenorului și a clientului, prin urmare, în mod tradițional, include mai multe secțiuni principale (informații de contact, istoricul companiei, produs/serviciu, dorințe privind viitorul proiect).

Rezumat pentru pagina de destinație - condiție cerută lucrând pe o pagină. Astăzi vom analiza în detaliu secțiunile principale ale manualului standard, vom oferi explicații și vom oferi materiale pentru descărcare.

Cu puțin înaintea subiectului, să spunem următoarele - atunci când completați formularul, nu puteți lăsa rândurile documentului goale. Este mai bine să studiați toate graficele de mai multe ori, verificați cu persoana de contact/ interpret momente diferite, dar scrie tot ce ai nevoie. O cantitate mare de informații aici va avea doar un efect pozitiv, va stimula creativitatea, ca să spunem așa.

Deci, oferim manualul nostru.

„Pălărie” conține informații de contact reprezentant al clientului cu care va avea loc comunicarea directa. Este foarte important să scrieți datele de contact ale unei/două persoane responsabile de un anumit proiect, deoarece acest lucru va facilita foarte mult munca ambelor părți și va crește cu siguranță eficiența.

Deci, „antetul” conține de obicei următoarele elemente:

  • companie;
  • persoana de contact, post;
  • numar de contact;
  • site-ul web;
  • e-mail;
  • alt tip de comunicare (Skype, ICQ).

Despre companie

Următoarea secțiune propune să spunem informatii complete despre brand. Enumerăm principalele formulare oferite pentru completare:

Fiecare dintre punctele pe care le descrieți va fi folosit direct sau indirect munca de calitate asupra proiectului.

De exemplu, prezența identității corporative a unui brand va da un impuls muncii designerilor. În plus, conformitatea resursei web cu stilul unic special al companiei arată întotdeauna prezentabil și atractiv.

Același lucru este valabil și pentru logo. Prezența sa este o condiție prealabilă pagina de destinație de calitate. Dacă nu există logo, este indicat să comandați dezvoltarea acestuia.

Aici exemplu clar identitate corporativă, logo „vorbind” de la dezvoltatorii LPgenerator.

De asemenea, în ceea ce privește amplasarea geografică a biroului și distribuția mărfurilor. Dacă lucrați cu toată Rusia, asigurați-vă că indicați acest moment. Dacă sunteți limitat la o regiune sau mai multe, indicați de asemenea. Această informație este obligatoriu. În mod tradițional, este plasat imediat pe pagina principală (vezi exemplul anterior).

Următorul exemplu, de altfel, demonstrează importanța promoțiilor și reducerilor - o tehnică de marketing funcționează aproape întotdeauna, crescând conversia.

Descrierea produsului/serviciului este o parte obligatorie a planului. Utilizatorul trebuie să vadă ce cumpără și, cel mai important, de ce. Aici trecem fără probleme la subiectul beneficiilor. Mai jos este un exemplu de antet, în care întrebarea specificată este imediat dezvăluită în ofertă.

În contextul beneficiilor, ar fi cazul să menționăm un interesant split testing, acesta a fost realizat de specialiști în marketing de la o companie din Noua Zeelandă – SpaceShips. Domeniul său de activitate este închirierea de mașini. Experții au decis să verifice ce imagine pagina principala va aduce mai multe conversii.

Prima ilustrație îl arată pe șofer privind peisajele frumoase, mașina este aproape invizibilă în cadru.

Al doilea este chiriașii mulțumiți masina buna, atenția se concentrează în primul rând pe mașină.

În mod surprinzător, prima versiune a câștigat. Specialiştii în marketing au găsit o explicaţie: legătura emoţională a vizitatorului cu produsul a jucat un rol. Peisajul frumos a demonstrat beneficiul utilizatorului de la închirierea unei mașini, deoarece poate vedea multe locuri frumoase doar urcându-se la volan. Conversia a crescut cu 8,5%. Iată un fapt atât de „profitabil”.

Beneficiile mărcii sunt poate cea mai preferată secțiune în rândul oamenilor de afaceri. O expresie cunoscută: dacă nu te lauzi, nimeni nu te va lăuda :) Landing este o platformă în care textele laudative moderate sunt binevenite. Vă prezentăm bun exemplu, unde sunt dezvăluite câteva avantaje principale ale companiei care organizează spectacolul de foc, dar, rețineți, nu există nicio senzație de intruzivă.

Aș dori, de asemenea, să subliniez separat „ o scurtă istorie companie" - din păcate, clienții studiourilor web neglijează adesea concizia, făcând astfel o mare greșeală. Vizitatorii nu sunt interesați să citească opuse lungi; cumpărătorul trebuie doar să știe de ce poate avea încredere în tine. Așa arată o soluție de succes de la un brand de catering.

Certificate, diplome, recenzii, scrisori de recunoștință - toate acestea dovada sociala, ele servesc drept argument convingător „pentru” compania dumneavoastră. Nu neglija niciodată acest bloc, altfel riști să anulezi întregul efect de marketing al resursei web.

Prin completarea acestei secțiuni a briefului dezvoltarea aterizării pagina, amintiți-vă mai des recomandarea noastră principală. Este mai bine să scrieți mai mult, o astfel de decizie va avea întotdeauna un impact pozitiv.

Despre pagina de destinație

Să trecem la a treia secțiune a documentului, este dedicată direct proiectului. Am pus acolo următoarele componente.

  1. Acțiune de conversie așteptată de la utilizator: efectuați o achiziție, lăsați contacte, descărcați un fișier etc.
  2. Stilul dorit pentru viitoarea pagină de destinație (strict, business, vintage, ultra-modern, altele)
  3. Preferințe speciale în ceea ce privește culorile
  4. Ce secțiuni ați dori să vedeți? Vă reamintim că următoarele sunt considerate obligatorii:
    • antet (unde sunt plasate oferta, sigla, elementele CTA);
    • Informații despre produs;
    • avantajele companiei;
    • secțiunea de interacțiune cu clienții (formular de clienți potențiali, elemente de îndemn);
    • dovada sociala;
    • subsol (adresa, harta locatiei, adresa legala).
  5. Ce materiale grafice puteți furniza pentru lucrul cu site-ul? De exemplu, design de etichetă, diapozitive etc.
  6. CMS dorit al site-ului
  7. Este necesară adaptarea? traficul mobil?
  8. Ai nevoie de integrare cu retele sociale, sisteme de statistici pe Internet?
  9. Ai nevoie de contoare (temporizator de promovare)?

Deci, în ordine. Acțiunea de conversie cerută de proprietarul unei afaceri este factorul determinant atunci când vorbim despre proiectarea unei pagini de destinație. Alegerea structurii depinde de obiectiv, elemente de îndemn la acțiune in sfarsit, ce text sa scriu. Ca exemplu, vă oferim o serie de exemple de butoane CTA diferite, în funcție de obiectivul ales.

Aici obiectivul de conversie este achiziționarea (produse selectate).

Aici, ei primesc contactele utilizatorului, așa că se oferă doar să facă un calcul.

În ceea ce privește stilul/schema de culori dorită, este puțin probabil ca dorința proprietarului site-ului să fie un adevăr imuabil. Bineînțeles, părerea lui este luată în considerare, dar în realitate, ideile de design se schimbă de mai multe ori, în special cele de design, sunt „ajustate” foarte persistent (culori, fonturi, dimensiuni de bloc și multe altele se schimbă).

Referitor la secțiunile pe care un antreprenor online dorește să le vadă. Structura standard în mod tradițional nu se schimbă, deoarece este singura corectă care duce la conversie. Puteți adăuga alte blocuri, de exemplu, un minicatalog cu prețuri, dacă este cazul, exemple de lucru, din nou, atunci când domeniul de activitate al companiei o permite.

Aici, de exemplu, sunt descrise regulile pentru plasarea unei comenzi.

Adaptarea pentru traficul mobil este o necesitate. În acest fel, interesele vizitatorilor care navighează adesea pe internet folosind smartphone-uri, tablete și motoare de căutare. Yandex, Google, giganții de căutare, identifică pe cei „obraznici” folosind algoritmi speciali, și pesimiză fără milă.

Apropo, folosind LPgenerator, puteți dezvolta imediat versiuni mobile.

Contoare - poate s-au spus atât de multe despre ele încât până și repetările sunt inutile. Trebuie doar să știți că acestea cresc conversiile creând un sentiment de presiune a timpului pentru utilizator. Simțiți-vă liber să plasați blocuri similare pe site-ul dvs. Asigurați-vă că nu există un singur aspect fără un contor :) Puteți să vă uitați la testarea divizată pe acest subiect.

Cerințe suplimentare

Acesta este numele următoarei secțiuni din lista de creare a unei pagini. ÎN Cerințe suplimentare Fiecare companie își pune propriile puncte, dar de obicei acesta este ceva ce nu poate fi atribuit altora. Aplicabil unei pagini de destinație - componenta tehnică a resursei (necesită selectarea unui nume de domeniu, administrare, găzduire). Tot aici il poti intreba pe antreprenorul online daca va comanda separat copywriting, sau sa-i ceri sa ii ofere resursele care ii plac pentru a-i intelege gustul si dorintele.

Pentru client, sfatul este același - scrieți cât mai mult. Dacă nu doriți să vă deranjați, aveți încredere în contractor că îl va alege pe cel potrivit Numele domeniului, asigurați-vă că indicați cerințele dvs.

Utilizatori Platforme generatoare LP aici este un câștig-câștig. Oferim servicii complete: de la alegerea unui aspect, consultarea cu specialiști și până la găzduire și selectarea domeniului.

Am primit versiunea finală a designului și acum trebuie să facem în sfârșit aspectul. Dar înainte de a găsi un designer de aspect și de a face aspectul, trebuie să scriem o specificație tehnică pentru aspectul site-ului. Am scris principalele puncte pe care cred că orice designer de layout trebuie să le cunoască; fie vă va întreba acest lucru, fie îi veți spune acest lucru în specificația tehnică.

„Creează un site web de o pagină.” Scrieți un e-mail pentru a primi aplicații. „Funcții de aspect”. După cum vă amintiți, lățimea site-ului nostru este de 1000 de pixeli, am indicat acest lucru în design și aici îl repetăm. „Codarea site-ului” Nu vă îngrijorați prea mult de ce sau de ce, trebuie doar să faceți acest lucru. Apoi totul se va deschide normal pe toate browserele sau dispozitivele, nu vor fi prostii cu textul. „Font” - Cuprum Regular. Se întâmplă să am Cuprum Regular, îl voi atașa împreună cu specificațiile tehnice. Dacă aveți alt font, atunci indicați ce fonturi trebuie utilizate. „Fără CMS, doar CSS + HTML + JS.” De ce este așa? iubesc sisteme CMS, acestea sunt sisteme de management al conținutului. Mulți clienți doresc să vadă un CMS pe site-urile lor, dar eu consider că un site web și o pagină de destinație sunt lucruri puțin diferite și este mai bine să creați o pagină de destinație fără un CMS. De ce? Pentru că nu este nevoie să umpleți pagini, multe pagini, cu informații. Aici trebuie să corectați doar câteva blocuri, momente și așa mai departe, de exemplu. Toate acestea se fac foarte rapid și ușor, fără un CMS. Acesta este primul. În al doilea rând, sistemele CMS sunt de obicei gratuite. CMS gratuit sisteme - aceasta este una dintre cele mai mari găuri în protecția site-ului dvs., adică site-ul dvs. poate dispărea pur și simplu din cauza unui virus, a unui fel de program rău intenționat și așa mai departe, dacă nu vă îngrijiți în mod corespunzător de CMS. Presupun că sunteți oameni de afaceri, nu programatori, așa că nu vă va păsa în mod special de CMS și de găzduire.

Specificații de aspect - căutăm un designer de aspect - Caracteristici de aspect

„Granițele ar trebui să continue pe fundal.” Ce înseamnă? Aceasta înseamnă că ar trebui să existe și un fundal pe părțile laterale. Nu ar trebui să se termine doar la 1000 de pixeli, ar trebui să continue. "La dimensiune mai mică ecran, mai puțin de 1000 de pixeli, aspectul nu ar trebui să funcționeze.” O problemă foarte comună pentru designerii de layout este că aspectul începe să meargă greșit, așa că vom verifica totul. După ce ni se potrivesc. „Textul trebuie să fie text”, adică acolo unde avem text, trebuie să existe text. Amuzant, dar adevărat. Majoritatea designerilor de layout sunt atât de neglijenți încât pur și simplu copiază imaginile împreună cu textul. Este greșit, avem nevoie de text. „Butoanele ar trebui să răspundă la hover.” E clar aici. Ceea ce avem la hover este că butonul ar trebui să-și schimbe pur și simplu culoarea și așa mai departe. „La trecerea cu mouse-ul în Straturi de aspect, Dezactivat implicit”. Toate acestea sunt în design, sunt în psd, adică. Când treceți cu mouse-ul, butonul se schimbă. Puteți vedea totul și designerul de layout știe și el. „Ar trebui să existe text pe butoane, la fel ca și pe aspect (proiectat programatic, nu un desen”, adică butoanele trebuie să fie așezate programatic.


Specificații de aspect - căutăm un designer de aspect - Aspectați un site web de o pagină, sarcină

Majoritatea designerilor de layout încearcă să înșele oamenii în acest fel și creează butoane de imagine, de exemplu. nu poți schimba textul de pe ele, nu le poți schimba în niciun fel, apar multe probleme. Trebuie să te asiguri că sunt butoane soft, plus că durează mai puțin timp pentru a se încărca și așa mai departe. Ar trebui să se deschidă butoanele „comandați un apel invers”: sunteți direcționat către un formular cu câmpul „introduceți numărul de telefon” și butonul „comandați un apel invers”. Totul este clar aici. Aici am luat o opțiune din specificația tehnică veche, dar nu am corectat-o. „Forma tavanului, capotei, ușilor, arcadelor și portbagajului ar trebui să răspundă la plutire: în același timp, atunci când plutește, imaginea ar trebui să se întunece ușor, iar textul de sub imagine ar trebui să fie evidențiat într-o culoare diferită.” Sau doar schimbați, veți vedea mai târziu. Și „atunci când dați clic pe formulare, formularul pop-up „comandați o consultație” ar trebui să se deschidă cu câmpul „introduceți numărul de telefon” și butonul „comandați o consultație”. Ei bine, aici totul este logic. „Toate formularele ar trebui să primească cereri prin e-mail”, pe care am indicat-o mai sus. Aici punct important. „Aplicația trebuie să conțină și: sursă: sursă utm, expresie cheie: termen utm.” De exemplu, cumpărați inele de puțuri directe și din beton armat. Acum vă voi arăta cum ar trebui să arate. Iată, de exemplu, un formular de cerere, ce formular. Utilizați formularul pentru a comanda o consultație, e-mail telefonic, întrebare, pagină de destinație. Iată transcrierea, versiunea în limba rusă a paginii de destinație, sursa și fraza cheie.


Specificații layout - căutăm un designer de layout - Exemplu de aplicație dintr-un formular

De ce este necesar acest lucru? Pentru că atunci, mai devreme sau mai târziu, veți dori să verificați din ce sursă, de exemplu, Direct sau AdWords, vin mai multe aplicații, dar nu veți putea face acest lucru. Sau poți, dar o vei face prin Metrica, de exemplu. Și aici puteți pur și simplu să analizați toate e-mailurile, să căutați după litere, de exemplu, după surse Direct, sau după surse AdWords, pentru a înțelege de unde provin mai multe aplicații. Totul aici este foarte simplu și ușor. Același lucru este valabil și pentru cuvintele cheie. Dacă este necesar, puteți colecta cel puțin câteva statistici pentru anumite fraze cheie. În continuare, vă puteți conecta deja sistem CRM, de exemplu, către AMO CRM. Puteți conecta aplicații și veți avea statistici complete despre unde vin oamenii, din Direct, din AdWords, din care fraze cheie etc. „Dacă această aplicație este pentru tavan, hotă, podea arc, portbagaj, atunci cu notele corespunzătoare.”


Specificații de layout - căutăm un designer de layout - Sarcină detaliată pentru un designer de layout

Adică, astfel încât aplicațiile noastre să ajungă exact în conformitate cu cerințele clientului nostru. Dacă comandă un portbagaj, atunci se observă că cererea este pentru un portbagaj; dacă aceasta este o cerere pentru o clasă mică, clasă de mijloc, clasa business, apoi marcată cu clasa auto. Totul este, de asemenea, logic. Dacă cererea sună din nou, apoi sună înapoi. Dacă este doar o aplicație, atunci o aplicație. Dacă „Vreau același rezultat”, amintiți-vă că aveam un astfel de buton „Vreau același rezultat”, o aplicație din rezultat. Dacă întrebarea este mai jos, atunci întrebarea. „Tabelul de prețuri ar trebui să fie un tabel aranjat.” Același lucru, să vedem. Aici este - „pe baza dorințelor tale, aici este masa și aici ar trebui să fie așezată, și nu să fie o imagine, ca multe.


Specificații de aspect - căutăm un designer de layout - Tabelul de dorințe trebuie așezat

Restul, în principiu, nu este semnificativ. Acest lucru este suficient pentru ca programatorul să înțeleagă ce trebuie făcut.

Și acum trebuie să găsim un designer de layout. Puteți căuta pe toate aceleași site-uri - freelance.ru, Work-zilla.com și altele asemenea. Vă voi arăta un șablon despre cum să o faceți pentru a obține cu adevărat aspect bun. În primul rând, nu spune niciodată „inventează pagina de destinație, pagina de destinație”. și altele asemenea, pentru că de îndată ce scrii cuvântul landing page, totul devine mai scump de câteva ori. Vrei să proiectezi un site web cu o singură pagină. Și nu păcăliți pe nimeni pentru că este o singură pagină. Preț. Maxim 3000 de ruble. Știu precedente că pentru 1250 de ruble fac un aspect foarte bun. Timpul de executie este de 2 zile, ceea ce este suficient. Opțiuni de plată – fără plată anticipată, deoarece nu veți avea rezultat final, până când plătiți, în orice caz. Mai întâi te vei uita la munca designerului de layout pe găzduirea lui și abia după plată îți dă toate fișierele. Metoda de plată – alegeți-o singur, în cazul meu bani electronici. Specializare. Este clar aici că programarea web și descrierea proiectului. Este necesar să proiectați un site web de o pagină folosind PSD. PSD ai. Fără CMS, doar CSS + HTML + JS. Poza este atașată. Imaginea înseamnă psd în formă jepg. Specificația tehnică va fi transmisă candidatului. Nu trebuie să inventați nimic, doar așezați-l ca pe aspect. Trimite două link-uri către site și exemple de aspect. Aici am adăugat încă trei link-uri către site-uri de lucru din aspectul dvs. Oricum trei, doi. Și apoi analizează candidații, selectează doar pe cei care au trimis cel puțin câteva link-uri, vezi cum funcționează totul și alege după gustul tău.


Specificații layout - căutăm un layout designer - Aplicație pentru un designer de layout independent

Să decidem asupra conceptului și structurii site-ului și, pe baza viziunii dumneavoastră asupra problemelor publicului țintă, vom întocmi specificații tehnice pentru dezvoltarea unui design de o pagină

Marea majoritate a studiourilor sunt axate pe bugete medii și funcționează după o schemă simplificată. Specificațiile tehnice sunt întocmite de către client însuși fără ajutorul unui antreprenor, iar la proiect lucrează de obicei două persoane - un manager și un designer care combină sarcinile unui specialist în uzabilitate. Aspectul este dezvoltat imediat, fără prototip. Cu această schemă de lucru, multe depind de client - de înțelegerea acestuia a psihologiei vizitatorilor și de capacitatea de a-și exprima gândurile într-un limbaj pe care designerul îl înțeleg. Dacă vă aflați într-o situație similară, principalul lucru este să redactați corect termenii de referință pentru dezvoltarea designului unui site web cu o singură pagină.

Ce ar trebui să conțină termenii de referință pentru dezvoltarea unui design de site web de o pagină?

Sarcina ta nu este doar să descrii cerințele de proiectare cât mai detaliat posibil, ci să faci documentul clar, structurat și ușor de înțeles. Este foarte important să folosiți marcajele de puncte, astfel încât, în timpul discuțiilor ulterioare cu privire la termenii de referință pentru dezvoltarea unui design de site web de o pagină, oricare dintre părți să se poată referi pur și simplu la, de exemplu, punctul „4 B”, și să nu explice că despre care vorbim despre momentul descris la pagina 3 în al doilea paragraf din jos.

Comandați specificații tehnice de la 500 de ruble

Deci, termenii de referință de bază pentru dezvoltarea designului unui site web de o pagină ar trebui să conțină:

  • 1. Descrierea generală a unui site de o pagină

    Care sunt obiectivele site-ului, cine este publicul țintă al acestuia? Ce sentimente ar trebui să trezească vizitatorilor - încredere, bucurie, soliditate, originalitate etc. Cu ce ​​ar trebui să fie asociat? Ar trebui să fie amintit? Cu alte cuvinte, în acest moment trebuie să vă concentrați pe caracteristicile emoționale ale viitorului design. Nu recomand să reduceți acest punct la o descriere precum „Design frumos care ar trebui să evoce emoții pozitive" Crede-mă, conceptul de frumusețe și pozitivitate dintre tine și designer poate fi foarte diferit.

  • 2. Structura site-ului sub forma unei diagrame

    O reprezentare schematică a relațiilor dintre secțiuni, categorii și tipuri de pagini, care poate fi însoțită de o scurtă descriere.

  • 3. Dorințe generale de design:

    • optiuni de preferinta pentru schema de culori, de preferință cu exemple care pot fi generate folosind serviciul Colorscheme.ru;
    • dimensiunea sitului (fluid, fix, multi-dimensiuni) și rezoluția la care va trebui adaptat;
    • structura de bază a paginii: numărul de coloane, prezența antetului și a subsolului și a altor elemente transversale;
    • alte dorințe care se referă la puncte specifice aspect site de o pagină.
  • 4. Descrierea blocurilor end-to-end

    Aproape toate site-urile cu o pagină au cel puțin trei blocuri de la capăt la capăt în care conținutul este același - antet, subsol și meniu. Pentru a nu descrie aceste blocuri, le puteți pune într-un singur paragraf.

    • Un capac: Care este scopul lui? Ar trebui să atragă atenția sau invers – să nu fie vizibilă? Ce blocuri de informații ar trebui plasate acolo? etc.
    • Subsol- asemănător cu o pălărie. Scop, conținut, accent.
    • Meniu Descriere trebuie să conțină o listă de legături (sau blocuri de legături) în ordine ierarhică. Dacă este necesar, trebuie să clarificați ce puncte trebuie subliniate și ce dorințe aveți în ceea ce privește proiectarea și evidențierea legăturilor.
  • 5. Descrierea blocurilor (ecranelor) unui site de o pagină

    Descrierea fiecărui bloc trebuie să includă:

    • acțiunea vizată pe care utilizatorul trebuie să o efectueze pe această pagină (înregistrare, selectare a unui produs, lasă o recenzie, plătire etc.);
    • o listă cu toate elementele pe care le va conține partea de conținut (imagini, tabele, text, formular de feedback etc.);
    • scopul paginii (introduce utilizatorul in avantajele companiei? arata produsul? informa in detaliu despre caracteristicile unui anumit produs? etc.);
    • dacă este necesar, o listă de elemente asupra cărora ați dori să concentrați atenția vizitatorilor (necesar doar în cazurile în care aceste elemente nu au legătură cu scopul paginii descrise mai sus).
  • 6. Descrierea elementelor grafice individuale

    Dacă intenționați să dezvoltați un logo, pictograme sau diagrame, acestea trebuie descrise și în specificațiile tehnice. Chiar dacă întocmiți o specificație tehnică foarte detaliată, după ce o citiți proiectantul ar trebui să aibă întrebări clarificatoare

http://xn--80ahnerbbccukm3exc.xn--80aswg/wp-content/uploads/2017/05/Why-do-you-have-simple-and-convenient.jpg 360 950 Un pager http://xn--80ahnerbbccukm3exc.xn--80aswg/wp-content/uploads/2018/01/hand.pngUn pager 2017-05-25 10:34:57

3 voturi

O zi bună, dragi cititori. Când vor înceta clienții să-i învețe pe designeri cum să lucreze? Indiferent de ce ai crea și de cât de mult ai munci, întotdeauna va exista vreun nenorocit care va spune că totul este greșit și să-l refacem.

Probabil că unul dintre cele mai dificile momente în munca oricărui dezvoltator este predarea proiectului și discuția cu clientul. Desigur, te întâlnești des clienti buni care înțeleg de ce studiem și avem încredere completă în lucrare, dar pentru aceasta trebuie să ne dovedim și să creăm impresia corectă. Acest lucru nu este posibil pentru toată lumea și nu întotdeauna.

Astăzi vom vorbi despre ce ar trebui să fie brief-ul pentru o pagină de destinație și cum să comunicăm cu clientul pentru a-i arăta ușor cine este un profesionist aici și cine este un simplu muritor care nu înțelege nimic despre design și, prin urmare, nu ar trebui să implicați-vă în această muncă și comandați acolo unde nu ar trebui, chiar dacă clientul are întotdeauna dreptate.

Cum să fii un bărbat alfa cu care clienții nu se ceartă

Mai întâi, să discutăm câteva aspecte generale. Acest lucru este foarte important, deoarece totul depinde de ei munca in continuareși cantitatea de timp care va fi apoi cheltuită pentru livrarea și acceptarea proiectului.

Cel mai important lucru în afacerea noastră este să te prezinți competent imediat. Există o linie foarte fină aici. Pe de o parte, trebuie să fii prietenos, astfel încât o persoană să te recomande (atât de minunat) prietenilor lor, iar pe de altă parte, trebuie să dovedești că ești un bărbat alfa (femeie), cu care este mai bine să nu nu pentru a te certa din nou, vei face totul mișto fără sfaturi și instrucțiuni inutile.

Principala greșeală a studiourilor web de nivel mediu, care nu le permite să avanseze mai departe. Nu face asta și poți obține mai mult.

Pe portalurile unor companii puteti vedea briefs pt Pagina de destinație. Clientul merge pe site, descarcă, completează și așteaptă ca proiectul să fie gata. Desigur, înțeleg că aceste companii cel mai probabil foarte ocupatși își pot permite.

Cu toate acestea, ar fi mult mai eficient dacă un manager ar lucra cu fiecare client. Acest lucru le-ar putea permite să crească prețul. Cei care sunt capabili să plătească bani mari vor să fie linși și tratați cu respect și venerație, el plătește în cele din urmă.

Serviciile de calitate sunt baza oricărei afaceri în secolul XXI.

Desigur, vă recomand să utilizați această abordare pentru a lucra; să comunicați prin Skype cu clientul sau, mai bine, să vă întâlniți. Completați singur brief-ul și abia apoi trimiteți-l spre aprobare împreună cu alte documente.

În primul rând, clientul simte imediat o atitudine și un interes deosebit din partea ta. Primul semn că proiectul va avea succes. În al doilea rând, în timp ce comunici, poți afla mai multe detalii în ceea ce privește dorințele.

Clienții nu știu întotdeauna ce vor și este posibil să nu răspundă la toate întrebările. Trebuie să-i conduci în această conversație. Ești un expert. În al treilea rând, îți creezi o impresie competentă despre tine și o plasezi în timpul unei întâlniri sau comunicări. Nu va fi atât de greu de făcut. Amândoi sunteți interesați de încheierea favorabilă a cooperării.

Ghid pas cu pas: întâlnirea perfectă cu clientul

Care ar trebui să fie planul tău de acțiune? Vii la întâlnire, scoți brief-ul de dezvoltare și îl completezi. După aceea, vino acasă, completează-l în pdf și trimite-l prin poștă clientului pentru a te asigura că totul este compilat corect.

Având în vedere că blocați accesul la editare, o persoană va putea să-și scrie toate celelalte dorințe fie într-o scrisoare, fie în document text. Crede-mă, vor fi mult mai multe dacă deschideți accesul la editări direct în document. Acest mic truc, foloseste-l.

Apoi, te întâlnești din nou cu clientul și îi dai un contract de proiectare, un brief de creație, un deviz, să semneze. Toate acestea în fișiere separate(Nu vreau să spun termen de calculator), pe fiecare document contactele dvs., numărul de telefon, sigla.

Crede-mă, acesta este un lucru atât de mic și ei vor găsi mai puține vine cu tine.

Am scris deja despre asta, este foarte simplu. Ei bine, un logo poate fi realizat profesional, eficient și ieftin folosind www.logaster.ru . Ei bine, asta în cazul în care cineva are nevoie de el.


Dacă nu puteți întâlni clientul în persoană, puteți obține cu ușurință totul Documente necesare prin intermediul internetului. Nu uitați de capacitatea oamenilor de a imprima și scana, deși în unele cazuri puteți utiliza FedEx sau ceva de genul ăsta. Îți poți imagina cât de cool și profesionist vei arăta?

Cum să scrii corect un scurt

Așadar, te întâlnești cu un client (sau comunici cu el prin internet), scoți brief-ul de pe pagina de destinație și începi să-i pui întrebări. Notează cât mai multe. Toate acestea pot fi utile. Chiar dacă nu îl strângeți în versiunea finală pentru semnare, îl veți ști. Super. Nu există prea multe informații.

Dacă utilizați documentul meu, care poate fi descărcat la sfârșitul acestui articol, vă rugăm să rețineți că unele întrebări sunt repetate acolo. Așa ar trebui să fie, asta este corect și bine.

Prin reformularea întrebării puteți obține mai multe informații utile. O persoană se poate obișnui să fie întrebată despre beneficii și să răspundă automat, dar dacă sunteți interesat de modul în care compania sa diferă de un anumit concurent, atunci poate apărea ceva nou aici.

În plus, clientul însuși nu vrea să arate ca un idiot; el va încerca să nu se repete și să caute răspunsuri diferite la aceleași întrebări.

Să ne uităm acum la exemplul meu și să vorbim despre ceea ce trebuie să aflați de la un potențial client. Ce întrebări și categorii importante există?

  • Contacte

Acest lucru vă va fi util în orice caz și cum mai multe contacte, cu atât mai bine. Chiar dacă aveți deja numărul de telefon al clientului, cereți Skype, contul VKontakte și așa mai departe. Asigurați-vă că i-o dați în cazul în care are nevoie de ceva. Arată-i interes pentru el și arată-i că ești gata să ia legătura.

Nu uitați să întrebați dacă compania are propriul site web. Puteți găsi multe acolo Informații suplimentare, care va ajuta la crearea unei pagini de destinație. Probabil cea mai gravă greșeală pe care o poate face un dezvoltator este să nu se uite la site-ul web al companiei cu care lucrează.

  • Despre companie.

Publicul țintă este unul dintre cei mai mulți probleme importante. Chiar și câștigurile tale vor depinde de asta!

Să presupunem că veți face o lucrare de o pagină pentru un magazin de uși. O parte a gamei de produse este destinată cumpărătorilor de bunuri de lux pentru care prețul nu este deloc important. Pentru ei, prioritatea este stejarul masiv și faptul că copacul a crescut pe partea de sud a Munților Urali pe vreme însorită.

Ei sunt dispuși să plătească orice sumă pentru lemnul care a fost prelucrat de castori adevărați și protejat de intemperii de veverițe. Desigur, chiar și mențiunea unei reduceri îi poate face să se îndoiască de calitatea produsului și de activitatea veverițelor.

O altă parte a ușilor din același magazin sunt mai ieftine, sunt concepute pentru persoanele care sunt preocupate în primul rând de reduceri. De ce să nu oferi clientului să facă două landing pages? Apropo, pentru unele produse puteți și ar trebui să creați mai multe pagini de destinație.

Dacă aceste informații sunt noi și interesante pentru tine, atunci îți recomand să te uiți curs de Serghei Sadovnikov . Aici vei gasi multe Informatii utile despre cum să faci pagini interesante de vânzări, să lucrezi cu clienții și să filmezi rapid un proiect după altul.


Cursul constă din două părți. Primul conține multă teorie cu privire la ceea ce avantajează clientul și, prin urmare, crește nivelul profesional al dezvoltatorului. Și a doua parte este dedicată părții tehnice, despre cum să petreceți nu mai mult de o oră pe această lucrare.

  • Informații despre bunuri și servicii.

Dacă te uiți la eșantionul meu, vei vedea că acest punct nu este altceva decât concentrarea unei întrebări multiplicate: numește avantajele produsului tău, cum diferă serviciul tău de alții, după ce criterii ești mai bun decât concurenții.

Pentru a preveni clientul să creadă că ești un idiot, încearcă să te angajezi în dialog cât mai mult posibil în această parte a sondajului. Nu recomand să pui pur și simplu o întrebare după alta dintr-o listă, altfel clientul se va sătura să-ți răspundă și va fi foarte supărat că trebuie să comunice cu un nemernic. El nu știe despre planul tău insidios.

Folosiți-vă abilitățile de vorbire, adresați întrebări suplimentare care vă vor ajuta să direcționați gândurile într-o direcție diferită. Dacă simțiți că clientul începe să-și piardă cumpătul, lăsați-l să plece și treceți la următorul punct și reveniți la acesta puțin mai târziu.

  • Publicul țintă

Pentru cine vom crea un site web de o pagină? Cine beneficiaza de aceasta oferta? Dacă acestea sunt femei, atunci vom folosi fonturi ornamentate în design. Dacă pentru bărbați, atunci albastru, simplu și direct.

Repet încă o dată, dacă ai o mulțime de informații, atunci ești liber să alegi din ele, iar dacă lipsește ceva, atunci ești pus la dispoziție cu gaguri și prostii pe site. Nu vă supărați, lipsa de informații se reflectă prost chiar și asupra muncii profesioniștilor, deși nu vor face niciodată o astfel de greșeală. Cu siguranță vor cere exact cât este nevoie.

  • Blocuri care ar trebui să fie pe site

Acesta este un alt motiv pentru a nu prezenta brief-ul imediat clientului. Sunteți un profesionist, nu trebuie să lăsați clientul să intre în ceva în care nu trebuie să intre. Nu a fost suficient ca el să te învețe cum să lucrezi! Marcați totul singur și apoi aprobă. Desigur, va trebui să eliminați din listă acele blocuri pe care le considerați inutile.

Să zicem că crezi că pentru un fier de călcat de 300.000 nu este necesar să organizezi și să descrii o promoție. Nu-i așa că este mai bine să descriem cât de exclusivist și minunat este, ne amintim de veverițele cu coada, pe care de data aceasta le foloseau pentru a lustrui suprafața.

Desigur, puțini oameni se vor îndrăgosti de ofertă doar pentru că pierzi câteva mii la livrare. Oamenii care sunt gata să cumpere un fier de călcat cu 300.000 nu sunt interesați de acțiuni. În text (și nu numai acolo) trebuie să acordați atenție calității incredibile a materialelor, unicității produsului și numelor mari care folosesc acest lucru.

Clientul tău îi atrage atenția asupra ideii „geniale”, văzând modulul „Promoție” din brief-ul tău și spune că este vital pentru el. E misto, hai să dăm și fierului de călcat o batistă!

Amintiți-vă, este posibil ca clientul dvs. să nu fie el însuși publicul țintă. Nici măcar nu poate cumpăra o mașină pentru banii ăștia, dar nu-i spune asta. Știți mai bine cum ar trebui să arate totul, dar nu este nevoie să vă certați. Uneori este mai bine să ascundeți pur și simplu unele informații și să nu provocați un conflict.

  • Stabilirea unui obiectiv

Scopul nu va fi întotdeauna o vânzare, mai ales dacă nu există un buton corespunzător. Cum poate un vizitator LP să cumpere ceva de la tine dacă tot ce ai pe pagină este un buton pentru a comanda un apel înapoi? Desigur, în acest caz scopul va fi altul.

După ce brief-ul este completat și semnat, puteți crea site-ul web. Apropo, acest document ar trebui să devină o anexă la acordul dumneavoastră. În ciuda faptului că este întocmit în formă liberă, are încă greutate legală.

Descărcați Brief-ul meu și folosiți-l pentru sănătatea dumneavoastră

Dacă v-a plăcut acest articol, asigurați-vă că vă abonați la newsletter-ul meu de blog. Poți obține mai mult publicații utile, care vă va ajuta să vă organizați munca pe Internet în mod competent. Ne revedem și mult succes în munca ta.