9 najlepszych sposobów na prezentację strony internetowej dla Klienta

 makieta-dzięki uprzejmości renewleeds na Flickr

makieta-dzięki uprzejmości renewleeds na Flickr

Faza projektowania tworzenia strony internetowej jest dość standardowa dla większości projektantów stron internetowych, jednak jeśli chodzi o prezentowanie makiety klientowi przed krojeniem / kodowaniem projektu, pojawiają się pewne problemy, więc poszedłem i zapytałem społeczność o to, jak przedstawiają projekt strony internetowej klientowi.

po przefiltrowaniu wszystkich odpowiedzi i ich podsumowaniu jestem teraz gotowy przedstawić Wam, 9 najlepszych sposobów na zaprezentowanie projektu strony Klientowi, wraz z zaletami i wadami każdej metody.

problemy

jako osoby znające się na sieci, łatwo jest zrozumieć i zrozumieć koncepcję, że makiety są po prostu statycznymi obrazami, które przedstawiają wygląd witryny. Jednak wielu projektantów stron internetowych odkryło, że ta koncepcja jest niezwykle trudna do opanowania przez klientów.

my, jako projektanci i komunikatorzy, staramy się wyjaśnić klientom, że to, na co patrzą, to statyczny i płaski obraz ich potencjalnego projektu witryny. Mimo to wiele pytań i komentarzy przychodzi od klientów po przedstawieniu projektu, takich jak te, które Verne Ho tworzenia briefingu i wiele innych, doświadczyło poniżej:

  • dlaczego żaden z linków nie działa?
  • jak edytować tekst na tym?
  • dlaczego nie mogę podświetlić tekstu?
  • strona jest za mała (dzieje się tak dlatego, że przeglądarka domyślnie skurczyła obrazek)!
  • nie podoba mi się biała przestrzeń, która otacza stronę.
  • czy możemy wyśrodkować stronę?

do pewnego stopnia Rozumiem zamieszanie … patrzą na coś, co wygląda jak strona internetowa, która znajduje się w przeglądarce lub przeglądarce obrazów, jednak, co dziwne, nie działa jak strona internetowa… oczywiście ten fakt rodziłby pytania.

aby dowiedzieć się, co robią różni projektanci stron internetowych, aby obejść te problemy, poszedłem i poprosiłem moich znajomych na Twitterze (Śledź mnie) i Facebooku (Dodaj mnie), aby zobaczyć, co robią, gdy prezentują klientowi makietę projektu internetowego.

metody prezentacji makiet Web designu

 makieta-dzięki uprzejmości _Marcel_

makieta-dzięki uprzejmości _Marcel_

wiadomość sponsorowana

Rabat Adobe Creative Cloud

po otrzymaniu odpowiedzi od moich znajomych z Twittera / Facebooka (Wielkie dzięki) doszedłem do tych metod 9, jak zaprezentować klientowi makietę projektu strony internetowej. W żadnej konkretnej kolejności:

umieść obraz na stronie internetowej i wyślij do nich link.

ludzie mogą prawdopodobnie lepiej zidentyfikować obraz, gdy pojawia się tak, jak zwykle go widzą, na przykład w przeglądarce internetowej, jednak tworzy to o wiele więcej pytań, jak wcześniej opisałem powyżej.

jeśli wybierzesz tę metodę, spróbuj ją spersonalizować, przesyłając ją na własny serwer … użyj katalogu / clients/clientname / index. htm. Kolejną wskazówką było skorzystanie z bezpłatnego dostawcy domen. tk, abyś mógł wysłać im link taki jak http://clientsdomain.tk, który również wygląda dość profesjonalnie. Dziękuję za. TK napiwek Herbert.

Wyślij JPEG lub PNG przez e-mail

wysłanie makiety przez e-mail jest prawdopodobnie najprostszym sposobem, jednak nie zawsze jest najlepszy… niektórzy użytkownicy mają małe rozdzielczości ekranu, co oznacza, że obraz może się kurczyć, co oznacza więcej pytań wraz z innymi, które opisałem powyżej.

użyj jakiejś aplikacji internetowej

wiadomość sponsorowana

Korzystanie z aplikacji internetowej do prezentacji makiet wzmacnia pomysł, że jest to coś na „wyświetlaczu” i nie jest to żywy przykład, który może prowadzić do mniejszej liczby pytań.

użyj strony CodedPreview

CodedPreview pozwala na tworzenie prostych stron podglądu HTML, pokazujących jak powinien wyglądać szablon podczas kodowania. (Dzięki liamuk7 za ten) Ponownie, spróbuj spersonalizować go tak bardzo, jak to tylko możliwe, dostosowane do klienta.

Utwórz „Studio klienta”

zamiast korzystać z aplikacji online, możesz założyć własne „studio” na własnym serwerze, gdzie klient może się zalogować i przeglądać makiety (jpg na stronie html), które zatwierdzi… możesz umieścić wersje na tej samej stronie (nowe jpg), a po zatwierdzeniu możesz dodać link, aby zobaczyć funkcjonalną witrynę w toku.

oto przykład z IDesignStudios. „Wysyłam klientom e-maile z adresem URL do studia klienta, a także ich identyfikatorem klienta, nazwą użytkownika i hasłem. Musisz mieć nazwę użytkownika / hasło, aby nawet dostać się do pierwszego ekranu (w / disclaimer i rozwijane ID klienta). Klient może przejść tylko do własnego obszaru klienta (tak jak w, wszyscy klienci mogą zobaczyć pierwszą stronę z rozwijanym menu, ale możesz zalogować się tylko do 1 obszaru klienta po tym).”Możesz zobaczyć zrzut ekranu logowania i wewnątrz studia klienta.

Eksportuj makiety w formacie PDF

zamiast zapisywać w FORMACIE JPEG lub png, który jest tylko obrazem, który można otworzyć w domyślnym oprogramowaniu do przeglądania obrazów klientów, posiadanie go w formacie PDF oznacza, w większości przypadków, że muszą otworzyć witrynę w programie Adobe Reader. Zaletą tego jest to, że jest mniej oczekiwań, aby działał jak strona internetowa. Użycie kompozycji warstw jest również przydatne w plikach PDF do wyświetlania odmian projektu.

Pomiń Photoshopa i projektowanie w HTML

jest kilka debat na ten temat i zwykle sprowadza się do tego, jaki proces najlepiej umożliwia Twoją kreatywność, jednak ten jest dla ciebie, aby zdecydować.

poproś klienta, aby przyszedł do Twojego biura

chociaż nie zawsze jest to możliwe, zwykle jest to najlepszy sposób na zaprezentowanie klientowi makiety internetowej, ponieważ pozwala porozmawiać o całym projekcie razem z klientem. Jeśli masz taką możliwość, zawsze z niej korzystaj.

Wyślij im JPEG lub PNG & poproś o wydrukowanie

to był tylko pomysł, który wymyśliłem… jeśli wyślesz im makietę JPEG w pełnej skali i poprosisz o wydrukowanie, nie będą myśleć, że strona będzie działać tak, jak zwykle, co z kolei oznacza mniej pytań. Wadą tego jest jednak to, że strona nie będzie skalować.

oryginalne odpowiedzi

wiadomość sponsorowana

logo Twitter-logo Facebook

logo Facebook - logo Facebook

poniżej kilka oryginalnych odpowiedzi od moich znajomych na Twitterze i Facebooku … jeszcze raz dziękuję. Facebook i dołącz do grupy Just Creative Design na Facebooku.

marioOlckers @ justcreative Stealth Live zainstaluj na serwerze, aby zilustrować proof-of-concept, a następnie wróć do tablicy rysunkowej po wprowadzeniu i konsultacji.

netbramha @ justcreative PNG, a Ty?

brianyerkes @justcreative zapisz go jako jpeg, prześlij go do katalogu na twoim serwerze o nazwie / clients / clientname. Zrób indeks.strona html. Dodaj obraz jpg.

brownaddesign @ justcreative po prostu umieszczam projekt na moim serwerze WWW, w katalogu, który tworzę dla klienta, i wysyłam im link do obejrzenia.

marnieb @ justcreative w formacie JPG. Met

metalgod @justcreative składam plik PDF z adnotacjami i wysyłam go do klienta. Potem dzwonię, żeby ich przez to przeprowadzić.

trisnadi @justcreative czy klient widział już projekt? Zwykle robię pełny spacer, zanim pozwolę im go dotknąć lub zadać pytania.

ClarkleSparkle @justcreative Email.

wiadomość sponsorowana

bradsherrill @ justcreative niech klient przyjdzie do Twojego biura i niech ogląda w skali 1: 1 najlepiej w FORMACIE jpeg. [odpowiedz] Jeśli nie możesz tego zrobić, napisz do nich.

jessjoyce @justcreative-wysyłamy / przesyłamy. [Odpowiedz ]pngs of the Photoshop / Illustrator docs

spinfly321 @justcreative-Projektowanie w Photoshopie i prezentowanie jako jpg

biwerw @justcreative-Tworzenie strony internetowej z .jpgs pojęć na nim i wysłać im link. Mam nadzieję, że to pomoże.

liamuk7 @justcreative-tak jak obraz lub za pomocą http://www.codedpreview.com

idesignstudios @justcreative – daję klientom dostęp do ich własnego „client studio” – mogą się zalogować i przeglądać makiety (jpg na html pg), jak zatwierdzają…umieszczam wersje na tej samej stronie (nowe jpg). Po zatwierdzeniu dodaję link, aby zobaczyć funkcjonalną stronę w toku.

marcoslhc @ justcreative – generalnie dostarczam szkice fizyczne (Papier i kredki) na drugie spotkanie, a Cyfrowe na trzecie

stevemoseley @justcreative-zależy od 2 rzeczy: wielkość projektu i wybredność klienta. Jeśli albo-photoshop makieta. Jeśli nie, najpierw Wytnij html.

adellecharles @justcreative Zwykle zapisuję na web i wstawiam do html doc / upload na serwer, aby klient mógł zobaczyć

craftisan @justcreative to, co robię, zależy od klienta … czasami podgląd na żywo lub makiety pdf / jpg … głównie JPG.

randaclay @ justcreative plik JPG, lub czasami PDF

EliteByDesign @justcreative Zwykle tylko JPG przez e-mail lub przesłany na moją stronę. Nic wymyślnego, przecież to tylko pierwszy szkic!

pointlessramble @justcreative umieść go w pliku HTML z dowolnym tłem potrzebnym/itp.

RyanDownie @justcreative aby zaprezentować makiety umieszczam obrazek w katalogu na serwerze / nazwie a następnie dodaję obrazek do pełnej przeglądarki

przez Facebooka: zazwyczaj wgrywam stronę z darmową domeną www.yourdomain.tk, łatwo jest przekierować ścieżkę z hostingu do darmowej domeny.

Steve via Facebook: mamy web.yourcompany.com skonfiguruj i podaj klientowi adres URL web.yourcompany.com/client.

Patrick McColley przez Facebooka: Zwykle umieszczam go na moim serwerze lub jeśli mi pozwolą, ich.

dalsze dyskusje

poniżej kilka dalszych artykułów na ten temat makiet i prezentacji.

  • makiety Photoshopa a oczekiwania klientów
  • Popraw swój proces twórczy, lepszy projekt, szybsze zatwierdzanie
  • dlaczego dać klientom więcej niż jedną makietę?
  • Live By the Mockup, Die By the Mock Up
  • makiety strony klienta & Comps: do you Bother?
  • makiety projektowe nie działają

te już powiązane z tym artykułem:

  • Zarządzanie makietami
  • Projektowanie nie polega na narzędziach
  • dlaczego nie pomijamy Photoshopa
  • projektowanie, makietami& narzędzia

więc pytam cię, jak prezentujesz swoje makiety projektowe i po obejrzeniu sugerowanych metod, co uważasz za najlepszy sposób?

a gdyby tak było, to digg byłby mile widziany. Dziękuję.

Leave a Reply

Twój adres e-mail nie zostanie opublikowany.