9 dintre cele mai bune modalități de a prezenta un site Web unui Client

 machetă - prin amabilitatea renewleeds pe Flickr

Mock Up-Amabilitatea renewleeds pe Flickr

faza de proiectare a creării unui site web este destul de standard pentru majoritatea designerilor web, însă atunci când vine vorba de prezentarea machetei unui client înainte de a tăia / codifica designul, apar unele probleme, așa că am ieșit și am întrebat comunitatea despre modul în care prezintă un design de site web unui client.

după ce am filtrat toate răspunsurile și le-am rezumat, sunt gata să vă prezint 9 dintre cele mai bune modalități de a prezenta un design de site web unui client, împreună cu avantajele și dezavantajele fiecărei metode.

problemele

ca indivizi web-savvy, este destul de ușor să înțeleagă și să înțeleagă conceptul că mock-up-uri sunt pur și simplu imagini statice care descriu cum ar arăta un site. Cu toate acestea, ceea ce mulți designeri web au descoperit este că acest concept este incredibil de dificil pentru clienți să-și înfășoare capul.

noi, ca designeri și comunicatori, încercăm să le clarificăm clienților că ceea ce privesc este o imagine statică și plană a potențialului lor design de site. Cu toate acestea, multe întrebări și comentarii provin de la clienți după ce prezentați designul, cum ar fi cele pe care Verne Ho le-a creat Briefing și multe altele, au experimentat mai jos:

  • de ce nu funcționează niciuna dintre legături?
  • cum editez textul pe aceasta?
  • cum se face că nu pot evidenția textul?
  • site-ul web este prea mic (apare deoarece browserul a micșorat imaginea în mod implicit)!
  • nu-mi place spațiul alb care înconjoară site-ul.
  • putem centra site-ul?

într-o oarecare măsură, pot înțelege confuzia… se uită la ceva care arată ca un site web care se află într-un browser sau vizualizator de imagini, cu toate acestea, ciudat, nu acționează ca un site web… evident, acest fapt ar ridica întrebări.

pentru a afla ce fac diferiți designeri web pentru a rezolva aceste probleme, m-am dus și i-am rugat pe prietenii mei de pe Twitter (Urmați-mă) și Facebook (adăugați-mă) să vadă ce fac atunci când prezintă o machetă de web design unui client.

metode de prezentare a machetelor de Design Web

 machete - prin amabilitatea _Marcel_

Mock Up-Amabilitatea _Marcel_

mesaj sponsorizat

reducere Adobe Creative Cloud

după ce am primit răspunsuri de la prietenii mei de pe Twitter / Facebook (mulțumesc mult), am ajuns la aceste 9 metode de prezentare a unei machete de web design unui client. În nici o ordine specială:

plasați imaginea pe o pagină web și trimiteți-le un link.

oamenii pot identifica mai bine o imagine atunci când apare așa cum o văd în mod normal, cum ar fi într-un browser web, dar creează mult mai multe întrebări așa cum am subliniat anterior mai sus.

dacă alegeți această metodă, încercați să o personalizați încărcând-o pe propriul server… utilizați directory/clients/clientname/index.htm. Un alt sfat aici a fost să folosiți furnizorul de domeniu .tk gratuit, astfel încât să le puteți trimite un link precum http://clientsdomain.tk, care arată, de asemenea, destul de profesional. Vă mulțumim pentru sfatul. tk Herbert.

trimiteți un JPEG sau PNG prin e-mail

trimiterea unei machete prin e-mail este probabil cea mai simplă cale, dar nu este întotdeauna cea mai bună… unii utilizatori au rezoluții de ecran mici, ceea ce înseamnă că imaginea se poate micșora, ceea ce înseamnă mai multe întrebări împreună cu celelalte pe care le-am subliniat mai sus.

utilizați un fel de aplicație bazată pe web

mesaj sponsorizat

folosind o aplicație bazată pe web pentru a prezenta machete întărește ideea că este ceva pe ‘display’ și nu este un exemplu viu care poate duce la mai puține întrebări.

utilizați site-ul web CodedPreview

CodedPreview vă permite să creați pagini simple de previzualizare HTML, arătând cum ar trebui să arate un șablon atunci când este codat. (Multumesc liamuk7 pentru asta.) Din nou, încercați să-l personalizați cât de mult puteți, adaptat clientului dvs.

creați un ‘Client Studio’

în loc să utilizați o aplicație online, puteți configura propriul ‘studio’ pe propriul server unde clientul se poate conecta și vizualiza machete UPS (jpg pe o pagină html) pe care le aprobă… puteți pune revizuiri pe aceeași pagină (jpg noi) și odată aprobat puteți adăuga un link pentru a vizualiza site-ul funcțional în curs.

Iată un exemplu din IDesignStudios. „Am e-mail clienti cu URL-ul pentru studio client, precum și ID-ul lor de Client, numele de utilizator și parola. Trebuie să aveți un nume de utilizator/parolă pentru a obține chiar și în primul ecran (w/ disclaimer și dropdown de ID-ul clientului). Un client poate continua doar pe propria zona de client (ca în, toți clienții pot vedea prima pagină w/ dropdown, dar vă puteți conecta numai la 1 zona de client după aceea).”Puteți vizualiza o captură de ecran a ecranului de conectare și în interiorul studioului client.

exportați machete în PDF

în loc să salvați în format jpeg sau png, care este doar o imagine care poate fi deschisă în software-ul implicit de vizualizare a imaginilor clienților, având-o în format PDF înseamnă, în majoritatea cazurilor, că trebuie să deschidă site-ul web în Adobe Reader. Avantajul acestui lucru este că există mai puține așteptări pentru ca acesta să funcționeze ca un site web. Utilizarea comps strat este, de asemenea, util în PDF-uri pentru a arăta variații ale unui design.

săriți photoshop și design în HTML

există câteva dezbateri pe aceasta și, de obicei, se reduce la orice proces care vă permite cel mai bine creativitatea, dar acesta este pentru dvs. să decideți.

Obțineți clientul să intre în biroul dvs.

deși acest lucru nu este întotdeauna posibil, de obicei este cel mai bun mod de a prezenta o machetă web unui client, deoarece vă permite să discutați despre întregul proiect împreună cu clientul. Dacă aveți această oportunitate, luați-o întotdeauna.

trimiteți-le un JPEG sau PNG & cereți-le să-l tipărească

aceasta a fost doar o idee cu care am venit… dacă le trimiteți o machetă JPEG la scară completă a designului și le cereți să-l tipărească, atunci nu vor crede că site-ul web va funcționa așa cum face în mod normal, ceea ce la rândul său va însemna mai puține întrebări. Un dezavantaj al acestui lucru este însă că site-ul nu va fi la scară.

răspunsuri originale

mesaj sponsorizat

logo - ul Twitter-Logo-ul Facebook

Twitter Logo - Facebook Logo

mai jos sunt câteva dintre răspunsurile originale de la prietenii mei de pe Twitter și Facebook… încă o dată vă mulțumesc. Urmați-mă pe Twitter și adăugați-mă pe Facebook și în timp ce la ea, se alăture grupului Facebook doar Creative Design.

marioOlckers @justcreative Stealth live instalați pe server pentru a ilustra dovada conceptului și apoi înapoi la placa de desen după intrare și consultare.

netbramha @ justcreative PNG, ce zici de tine?

brianyerkes @justcreative salvați-l ca jpeg, încărcați-l într-un director de pe serverul dvs. numit /clienți/clientname. Faceți un index.pagina html. Adăugați imagine jpg.

brownaddesign @justcreative doar postez designul pe serverul meu web, într-un director pe care îl creez pentru client și le trimit un link pentru vizualizare.

marnieb @justcreative în format JPG.

metalgod @justcreative am creat un PDF cu adnotări și l-am trimis clientului. Apoi am urmat cu un apel pentru a le merge prin ea.

trisnadi @justcreative a mai văzut clientul proiectul? În mod normal, fac o plimbare completă înainte de a-i lăsa să o atingă sau să pună întrebări.

ClarkleSparkle @justcreative e-mail.

mesaj sponsorizat

bradsherrill @ justcreative au clientul vin în biroul dvs. și să le vizualizați în 1:1 scară de preferință format jpeg. Dacă nu poți face asta e-mail-le.

jessjoyce @justcreative – trimitem/încărcăm .PNG-urile documentelor Photoshop / Illustrator

spinfly321 @justcreative – Design în photoshop și prezent ca jpg

biwerw @justcreative – creați o pagină web cu .JPG-uri ale conceptelor de pe ea și le trimite link-ul. Sper că acest lucru vă ajută.

liamuk7 @justcreative – la fel ca o imagine sau folosind http://www.codedpreview.com

idesignstudios @justcreative – le dau clienților acces la propriul „studio client” – se pot autentifica și vizualiza machete (jpg pe un PG html) pe măsură ce aprobă…am pus revizuiri pe aceeași pagină (New jpg ‘ s). Odată aprobat, adaug un link pentru a vizualiza site-ul funcțional în curs.

marcoslhc @ justcreative-în general livrez câteva schițe fizice (hârtie și creioane colorate) la a doua întâlnire, iar cele digitale la a 3-a

stevemoseley @ justcreative-depinde de 2 lucruri: dimensiunea proiectului și alegerea clientului. Dacă fie-photoshop mockup. Dacă nici unul, mai întâi tăiat de html.

adellecharles @justcreative de obicei salvez pentru web și introduc în și html doc / upload pe server doar pentru ca clientul să poată vedea

craftisan @justcreative ceea ce fac depinde de client… uneori previzualizări web live sau machete pdf/jpg… mai ales JPG-uri.

randaclay @justcreative fișier JPG, sau uneori PDF

elitebydesign @justcreative de obicei, doar un JPG prin e-mail sau încărcat pe site-ul meu. Nimic fantezist, la urma urmei, este doar un prim proiect!

pointlessramble @ justcreative Stick-l într-un fișier HTML cu orice medii necesare/etc.

RyanDownie @ justcreative pentru a prezenta machete am pus imaginea într-un director de pe server / nume și apoi adăugați o imagine de fundal pentru a tile browser complet

Herbert prin FaceBook: de obicei, încărc site-ul web cu un domeniu gratuit www.yourdomain.tk, este ușor să redirecționați calea de la găzduirea dvs. către domeniul gratuit.

Steve prin Facebook: avem o web.yourcompany.com setup și să dea clientului URL-ul web.yourcompany.com/client.

Patrick McColley prin Facebook: de obicei îl postez pe serverul meu sau dacă mă lasă, al lor.

discuții suplimentare

mai jos sunt câteva articole suplimentare pe această temă de machete și prezentare.

  • Machete Photoshop vs așteptările clienților
  • îmbunătățiți procesul creativ, Design mai bun, aprobări mai rapide
  • de ce să oferiți clienților mai mult decât o singură machetă?
  • trăiește după machetă, Mori după machetă
  • machete de site-uri Client & Comps: te deranjezi?
  • Design Machete Ups nu funcționează

cele deja legate în acest articol:

  • gestionarea machetelor UPS
  • designul nu este despre instrumente
  • de ce nu omitem Photoshop
  • Design, Machete UPS & instrumente

așa că vă întreb, cum vă prezentați machetele de design web și după ce ați văzut metodele sugerate, care credeți că este cea mai bună cale?

și dacă merită, un digg ar fi apreciat. Mulțumesc.

Leave a Reply

Adresa ta de email nu va fi publicată.