9 of the Best Ways to Present a Website To a Client

9 of the Best Ways to Present a Website To a Client

suunnitteluvaihe verkkosivuston luomisessa on melko vakio useimmille web-suunnittelijoille, mutta kun kyseessä on mallin esittäminen asiakkaalle ennen viipalointia / muotoilun koodaamista, joitakin ongelmia ilmenee, joten menin ulos ja kysyin yhteisöltä, miten he esittävät web-sivuston suunnittelun asiakkaalle.

suodatettuani kaikki vastaukset ja tiivistettyäni ne olen nyt valmis esittelemään teille 9 parasta tapaa esitellä Verkkosivujen suunnittelu asiakkaalle sekä kunkin menetelmän edut ja haitat.

ongelmat

web-taitajina on melko helppo käsittää ja ymmärtää käsitys, että mock-upit ovat vain staattisia kuvia, jotka kuvaavat miltä sivusto näyttäisi. Kuitenkin, mitä monet web-suunnittelijat ovat havainneet, että tämä käsite on uskomattoman vaikea asiakkaille kietoa päänsä ympärille.

me suunnittelijoina ja viestijöinä yritämme tehdä asiakkaille selväksi, että he katsovat staattista ja tasaista kuvaa mahdollisesta sivustosuunnittelustaan. Silti monet kysymykset ja kommentit tulevat asiakkailta, kun esität suunnittelun, kuten Verne Ho luoda Briefing ja monet muut, ovat kokeneet alla:

• mikseivät kaikki linkit toimi?
• Miten muokkaan tekstiä tästä?
• Miksi en voi korostaa tekstiä?
• sivusto on liian pieni (johtuu siitä, että selain on oletuksena kutistanut kuvan)!
• En pidä paikkaa ympäröivästä valkoisesta tilasta.
• Voimmeko keskittää sivuston?

jossain määrin ymmärrän sekaannuksen… he katsovat jotain, joka näyttää verkkosivustolta, joka on selaimen tai kuvankatselijan sisällä, kumma kyllä, se ei toimi kuin Verkkosivusto… ilmeisesti tämä seikka herättäisi kysymyksiä.

selvittääkseni, mitä eri web-suunnittelijat tekevät näiden ongelmien kiertämiseksi, menin kysymään ystäviltäni Twitterissä (Follow Me) ja Facebook (Add Me), mitä he tekevät esittäessään web-design-mallin asiakkaalle.

Methods of Presenting Web Design Mockups

saatuaan vastauksia minun Twitter / Facebook ystävät (iso kiitos) tulin näihin 9 menetelmiä miten esittää web design mock up asiakkaalle. Ei missään tietyssä järjestyksessä:

sijoita kuva verkkosivulle ja lähetä heille linkki.

ihmiset voivat luultavasti paremmin tunnistaa kuvan, kun se näkyy sellaisena kuin he normaalisti näkevät sen, kuten esimerkiksi selaimessa, mutta se herättää paljon enemmän kysymyksiä, kuten edellä esitin.

jos valitset tämän menetelmän, yritä muokata sitä lataamalla se omalle palvelimellesi… käytä hakemistoa/clientname/index.htm. Toinen vinkki tässä oli käyttää ilmaista. tk-verkkotunnuksen tarjoajaa, jotta voit lähettää heille linkin, kuten http://clientsdomain.tk, joka myös näyttää varsin ammattimaiselta. Kiitos tk-vinkistä Herbert.

lähetä JPEG tai PNG sähköpostilla

mallikuvan lähettäminen sähköpostilla on luultavasti yksinkertaisin tapa, mutta se ei ole aina paras… joillakin käyttäjillä on pieniä näyttötarkkuuksia, mikä tarkoittaa, että kuva voi kutistua, mikä tarkoittaa enemmän kysymyksiä yhdessä muiden edellä kuvaamieni kanssa.

käytä jonkinlaista verkkopohjaista sovellusta

käyttämällä web-pohjainen sovellus esitellä mock-ups vahvistaa ajatusta, että se on jotain ’näyttö’ ja se ei ole elävä esimerkki, joka voi johtaa vähemmän kysymyksiä.

käytä verkkosivustoa CodedPreview

CodedPreview voit luoda yksinkertaisia HTML-esikatselusivuja, jotka näyttävät, miltä mallin tulisi näyttää koodattuna. (Thanks liamuk7 for this one.) Yritä jälleen muokata sitä niin paljon kuin voit, räätälöityä asiakkaallesi.

luo ”Client Studio”

verkkopohjaisen sovelluksen sijaan voit perustaa oman ”studion” omalle palvelimellesi, jossa asiakas voi kirjautua sisään ja tarkastella mallikuvia (JPG: t html-sivulla), jotka he hyväksyvät… voit laittaa versiot samalle sivulle (uudet jpg: t) ja hyväksytyn jälkeen voit lisätä linkin nähdäksesi käynnissä olevan toimivan sivuston.

tässä on esimerkki Idesignstudiosta. ”Minä sähköpostiohjelmat URL client studio, sekä niiden asiakkaan tunnus, käyttäjätunnus ja salasana. Sinun täytyy olla käyttäjätunnus/ salasana edes päästä ensimmäiseen näyttöön (w / vastuuvapauslauseke ja pudotusvalikosta asiakkaan ID: n). Asiakas voi jatkaa vain omalle asiakasalueelleen (kuten, kaikki asiakkaat voivat nähdä ensimmäisen sivun w/ pudotusvalikosta, mutta voit kirjautua vain 1 asiakasalueelle sen jälkeen).”Voit tarkastella kuvakaappausta sisäänkirjautumisnäytöstä ja asiakasstudion sisältä.

vie mallikuvat PDF-muodossa

sen sijaan, että tallennettaisiin jpeg-tai png-muodossa, joka on vain kuva, joka voidaan avata asiakkaiden oletuskuvan katseluohjelmassa. Etuna on, että siellä on vähemmän odotuksia sen toimimaan kuten verkkosivuilla. Layer comps: n käyttö on hyödyllistä myös PDF-tiedostoissa mallin variaatioiden osoittamiseksi.

Skip photoshop and design in HTML

tästä on käyty muutamia keskusteluja ja yleensä päädytään siihen, mikä prosessi parhaiten mahdollistaa luovuutesi, mutta tämä on sinun päätettävissäsi.

pyydä asiakas tulemaan toimistoosi

vaikka tämä ei aina ole mahdollista, se on yleensä paras tapa esittää verkkomalli asiakkaalle, koska sen avulla voit keskustella koko projektista yhdessä asiakkaan kanssa. Jos sinulla on tämä tilaisuus, tartu siihen aina.

lähetä heille JPEG tai PNG & pyydä heitä tulostamaan se

tämä oli vain idea, jonka keksin… jos lähetät heille täyden JPEG-mallikuvan suunnittelusta ja pyydät heitä tulostamaan sen pois, he eivät usko, että sivusto toimii kuten se normaalisti toimii, mikä puolestaan tarkoittaa vähemmän kysymyksiä. Haittana tästä on kuitenkin se, että sivusto ei ole mittakaavassa.

Original Responses

alla muutamia alkuperäisiä vastauksia ystäviltäni Twitterissä ja Facebook… jälleen kerran kiitos. Seuraa minua Twitterissä ja lisää minut Facebookiin ja kun olet sitä, liity vain luova suunnittelu Facebook-ryhmään.

mariolckers @justcreative Stealth live asenna palvelimelle havainnollistamaan proof-of-concept ja sitten takaisin piirustuspöydälle syötön ja kuulemisen jälkeen.

netbramha @justcreative PNG, entäs Sinä?

brianyerkes @justcreative tallenna se jpeg-tiedostona, lataa se palvelimesi hakemistoon nimeltä /clients/clientname. Tee Hakemisto.html-sivu. Lisää jpg-kuva.

brownaddesign @justcreative julkaisen vain mallin web-palvelimellani, asiakkaalle luomassani hakemistossa ja lähetän heille linkin nähtäväksi.

MARNIEB @justcreative JPG-muodossa. 🙂

metalgod @justcreative kokoan PDF-tiedoston, jossa on merkintöjä, ja lähetän sen asiakkaalle. Sitten kehotan heitä käymään sen läpi.

trisnadi @justcreative onko asiakas nähnyt luonnoksen aiemmin? Teen yleensä täyden kävelyn, ennen kuin annan heidän koskea siihen tai kysyä kysymyksiä.

ClarkleSparkle @justcreative Email.

bradsherrill @justcreative ovat asiakkaan tulevat toimistoon ja anna heidän tarkastella 1: 1 mittakaavassa mieluiten jpeg-muodossa. Jos et pysty siihen, lähetä heille sähköpostia.

jessjoyce @justcreative-We send / upload .pngs of the Photoshop/Illustrator docs

spinfly321 @justcreative – Design in photoshop and present as a jpg

biwerw @justcreative – Create a web page with the .jpgs käsitteitä sitä ja lähettää heille linkin. Toivottavasti tämä auttaa.

liamuk7 @justcreative – vain kuvana tai käyttämällä http://www.codedpreview.com

idesignstudios @justcreative – annan asiakkaille pääsyn omaan ”client studioonsa” – he voivat kirjautua sisään ja katsella mallikuvia (jpg: t html pg: llä) hyväksyessään…laitan versiot samalle sivulle (new jpg: t). Kun hyväksytty lisään linkin tarkastella toiminnallisen sivuston käynnissä.

marcoslhc @justcreative-I generally deliver some physical sketches (paper and colour penciles) to the second meeting, and digital ones to the 3rd

stevemoseley @justcreative-Depends on 2 things: projektin koko, ja pickiness asiakkaan. Jos joko-photoshop mockup. Jos kumpikaan, html: n ensimmäinen leikkaus.

adellecharles @justcreative tallennan yleensä Webiin ja asetan ja HTML doc / upload palvelimelle vain, jotta asiakas voi nähdä

craftisan @justcreative mitä teen riippuu asiakkaasta… joskus live web esikatselut tai pdf/jpg mockups… enimmäkseen JPG.

randaclay @justcreative JPG-tiedosto tai joskus PDF

EliteByDesign @justcreative yleensä vain JPG sähköpostitse tai ladattuna sivustolleni. Ei mitään hienoa, onhan se vasta ensimmäinen luonnos!

pointlessramble @justcreative Stick it in a HTML file with any backgrounds needed / etc.

RyanDownie @justcreative esitelläkseni mallikuvia laitan kuvan hakemistoon palvelimelle /nimelle ja sitten lisään taustakuvan tile full browser

Herbert Facebookiin: lataan yleensä verkkosivun, jossa on ilmainen verkkotunnus www.yourdomain.tk, se on helppo ohjata polku hosting vapaa domain.

Steve Facebook-palvelun kautta: meillä on a web.yourcompany.com setup ja antaa asiakkaalle URL web.yourcompany.com/client.

Patrick McColley Facebook-palvelun kautta: yleensä postaan sen palvelimelleni tai jos he antavat minun, heidän.

Jatkokeskustelut

alla on muutamia lisäartikkeleita aiheesta mallikuvat ja esittely.

• Photoshop Mockups vs Client Expectations
• Improve Your Creative Process, Better Design, Quicker Approvals
• Why Give Clients More Than Just one Mock Up?
• Live By the Mockup, Die By the Mock Up
• Client Web Site Mockups & Comps: Do you trough?
• Design Mock upit eivät toimi

ne, joihin tässä artikkelissa on jo linkitetty:

• mallikuvien hallinta
• Design Isn ’t About Tools
• Why we Don’ t Skip Photoshop
• Design, Mock Ups & Tools

so I ask you, how you do you present your web design mockups and after seeing the methods suggested, what Do You believe is the best way?

ja ansaitusti diggattaisiin. Kiitos.