30 dni projektowania – studium przypadku brandingu

Jest kilka ważnych aspektów, o których należy pamiętać podczas pracy z klientami — spełnienie oczekiwań i terminów to dwa z nich. Na pewnym etapie kariery każdego projektanta pojawi się klient, który pilnie potrzebuje swojego projektu. To projekty, które uczą sztuki dotrzymywania terminów i tego, jak szalona może być.

Zazwyczaj są dwa rodzaje projektów, z którymi każdy projektant napotka w swojej karierze: „Potrzebuję projektu zorientowanego na użytkownika, który będzie odpowiadał mojemu projektowi, bez ścisłych terminów; Chcę tylko najlepszego rozwiązania”… To marzenie każdego projektanta. Ale spójrzmy prawdzie w oczy; w rzeczywistości rzeczy są zawsze trudniejsze.

„Chcę nieszablonowego, innowacyjnego i kreatywnego rozwiązania — dobrego UX, naprawdę ładnego interfejsu użytkownika… i potrzebuję go wczoraj”.

Co się stanie, gdy zdasz sobie sprawę, że na stworzenie logo i zaprojektowanie głównych elementów marki, strony internetowej, mobilnych interfejsów użytkownika i reklam/grafik w mediach społecznościowych pozostało 30 dni?

Po małym ataku paniki zdajesz sobie sprawę, że mądra praca to jedyna droga.

Przygotowanie planu i przemyślenie wszystkiego z wyprzedzeniem pomoże zwiększyć produktywność, precyzję i jakość projektu. Jak w przypadku każdego udanego przedsięwzięcia, ciężka praca i długie godziny pracy to tylko niektóre z obowiązkowych warunków, aby to się stało.

Bez względu na wszystko, zawsze są te dręczące pytania:

• Czy warto robić z takimi ograniczeniami czasowymi?
• Czy ograniczenia czasowe doprowadzą do niskiej jakości projektu?
• Czy wykonałbym lepszą pracę, gdybym miał więcej czasu?

Zdecydowanie tak!

Jak w przypadku każdego projektu, zawsze istnieją zalety, wady i ograniczenia, które jako projektanci musimy znaleźć sposób, a nawet wykorzystać na naszą korzyść, aby wymyślić kreatywne rozwiązania.

Posiadanie jasnego wyobrażenia o zadaniach, które należy wykonać, aby pomyślnie zakończyć projekt, jest kluczowe, a także dyplomatyczne poinformowanie klienta, że ​​krótki termin może potencjalnie negatywnie wpłynąć na ogólną jakość projektu. Jednak presja miażdżącego terminu nie jest wymówką, by nie dać z siebie wszystkiego w swoim rzemiośle – użyj go, aby zmusić się do wykonania najlepszej możliwej pracy. Badanie przeprowadzone przez Harvard Business School na temat kreatywnej pracy wykonywanej pod presją czasu wykazało, że:

Badanie to sugeruje, że menedżerowie podejmują kroki w celu ochrony czasu pracowników na zaangażowanie w kreatywne przetwarzanie poznawcze, szczególnie tych pracowników, których praca wymaga wysokiego stopnia kreatywności. […] Jest całkowicie prawdopodobne, że kreatywne pomysły nie będą często powstawać przy całkowitym braku jakiejkolwiek presji czasu, czy to narzuconej przez siebie, czy narzuconej z zewnątrz.

Wyniki te wskazują, że duży nacisk na pracę twórczą może działać przeciwko pracy twórczej, ale jednocześnie badanie sugeruje również, że rozsądny poziom presji na pracę twórczą może być przydatny w tworzeniu lepszych projektów.

Zawsze wyzwaniem jest zrobienie wszystkiego, gdy pracujesz jako freelancer z wieloma aktywnymi projektami, ale jest to świetna okazja, aby pilnie trzymać się swojego harmonogramu i sprawić, by Twój ograniczony czas pracował dla Ciebie! Wykonywanie pracy zdalnej dla Ciebie jest proste, ale nie łatwe. Połącz to z solidnym planem, a otrzymasz przepis na sukces.

Dni 1-2: Najpierw najważniejsze rzeczy — plan!

Pierwszym krokiem jest rozbicie projektu na mniejsze części i obliczenie, ile czasu zajmie ukończenie każdego etapu projektu. Wyznaczanie celów zwiększa motywację i osiągnięcia. Nauka o osiąganiu celów zaleca rozbicie twojego wielkiego celu na jasne, zdefiniowane kroki działania – zrobienie tego da ci wielką przewagę w wysiłkach na rzecz jego osiągnięcia.

Jeśli chodzi o branding design, dobrą praktyką jest stworzenie kilku wersji projektu, aby klient miał do wyboru różne opcje. Moją osobistą preferencją jest stworzenie trzech iteracji projektów logo i głównych elementów marki, takich jak typografia, palety kolorów, obrazy i zestawy ikon. Wykonanie tego w pierwszej kolejności pozwoli Ci przenieść koncepcję i pomysły wizualne do następnego kroku.

Twórz procesy pracy i śledź je.

Tworzenie procesów pracy ułatwi przepływ pracy i odpowiedzialność związaną z każdym projektem. Poniżej przedstawiam moje typowe podejście do typowego projektu projektowego, czy to brandingu, czy projektowania interfejsu użytkownika:

Badania

Dowiedz się wszystkiego o działalności Twojego klienta:

• Jaka jest podstawa ich działalności i jaka jest ich główna działalność?
• Kim jest ich grupa docelowa i jakie są ich potrzeby?
• Jakie są ich cele i jaki problem należy rozwiązać za pomocą designu?
• Kim jest konkurencja i jak możesz być lepszy?

Kwestionariusz lub brief projektowy to jeden z najwygodniejszych i najskuteczniejszych sposobów zbierania ww. informacji.

Utwórz tablicę nastroju

Jedną z rzeczy, do których możesz użyć moodboardu, jest stworzenie koncepcji — niezbędnej części każdego projektu. Uzyskaj szerszy obraz — weź wszystkie swoje badania i umieść je na jednym dużym płótnie, aby zobaczyć wszystkie elementy, które powinny zostać włączone do projektów. Istnieje kilka darmowych narzędzi, które ułatwiają tworzenie moodboardów.

Jeśli nie interesujesz się narzędziami online, program Adobe Illustrator działa dobrze, ponieważ możesz tworzyć, dodawać i swobodnie przenosić elementy. Pomyśl o tym jako o kolażu — nie przejmuj się zbytnio rozmieszczeniem szczegółów; możesz wszystko zaaranżować według własnych upodobań. Podstawowym celem jest sprawdzenie, jak kolory, zdjęcia, ikony, typografia itp. współpracują ze sobą — wizualnie i w opowiadaniu historii.

Dzień 3: Stwórz koncepcję projektu

Stworzenie koncepcji jest kolejnym krokiem po skompletowaniu moodboardu i stanowi podstawę całej przyszłej pracy. Powstaje koncepcja jako model eksperymentalny do testowania wykonalności funkcji projektowych.

Tablica nastrojów będzie pomocna we wczesnym wyznaczaniu kierunku wizualnego, który powinien odpowiadać docelowej grupie odbiorców i celom firmy. Koncepcja będzie podstawą Twojego kierunku UX i dlatego jest częścią 10 najlepszych projektantów UX Deliverables, z których korzystają.

Ważne jest, aby docenić, jak ważny jest ten krok, ponieważ solidna koncepcja pomaga w ponownym opowiedzeniu fascynującej historii, nawet na pierwszych etapach projektu. Główny nacisk należy brać pod uwagę raczej uczucia i doświadczenia, z jakimi stykają się użytkownicy, gdy mają do czynienia z elementami wizualnymi, niż to, czym one są.

Jeden z najbardziej wpływowych konsultantów marketingowych i mówców motywacyjnych w branży, Simon Sinek, wygłosił znakomitą prezentację TED na ten temat.

Tablica nastrojów może pomóc w stworzeniu kilku krótkich sloganów lub może ustawić styl ikon i zdjęć w koncepcie. Ponieważ dobrze jest mieć typografię, którą można szybko przeczytać niezależnie od medium, należy również wziąć pod uwagę typografię przyjazną dla Internetu i druku. To kluczowy element dobrego designu, a także jedna z zasad obowiązujących w uniwersalnych praktykach projektowych.

Dzień 4: Zaprojektuj wizualizacje marki

Proces budowania marki może stać się żmudny i czasochłonny, jeśli zostaniesz przyłapany na niewłaściwym podejściu od samego początku. Najlepiej zacząć od stworzenia iteracji logo, gdy masz zatwierdzoną koncepcję i gotowe pliki ze wskazówkami wizualnymi. Daje Ci to pewność, że zmierzasz we właściwym kierunku, i pozwoli Ci stawić czoła wyzwaniom związanym z brandingiem w inteligentny i efektywny czasowo sposób.

Niezbędne jest wykonanie małych szkiców piórem i papierem swoich pomysłów projektowych. Zajmie to mniej czasu, jeśli najpierw naszkicujesz, a następnie przejdziesz do programu Illustrator, Sketch itp., aby pracować nad swoim logo. Ten krok pomógł mi zaprojektować trzy różne propozycje logo, które są w kierunku wizualnym wybranym dla marki. Zajęło to kilka dni:

Mogą pojawić się dodatkowe zmiany i poprawki w projekcie logo, ale gdy klient zdecyduje się na logo i zatwierdzi inne elementy, takie jak kolory, typografia, ikony i styl fotografii, skończysz z podstawowymi elementami brandingu.

Dni 7-15: Projekt strony internetowej

Rozwój marki obejmuje nie tylko logotyp — obejmuje prawie wszystkie aspekty projektowania, w tym stronę internetową. Rozpoczęcie pracy z witryną internetową może być przydatne, ponieważ możesz dodać do koncepcji wizualnej, stosując reguły wizualne i sprawdzając, jak ze sobą współpracują. Dzieje się tak szczególnie wtedy, gdy tworzysz stronę internetową, która ostatecznie ma podobny cel i elementy do aplikacji mobilnej.

Mapa strony

Mapa witryny to lista stron witryny, do której mają dostęp roboty lub użytkownicy. Może to być albo dokument, który jest używany jako narzędzie do planowania do projektowania stron internetowych, albo strona, która prezentuje strony witryny w sposób hierarchiczny.

Jest to duża pomoc, jeśli klient ma już mapę witryny, ponieważ daje jasny wgląd we wszystkie strony należące do witryny. Jeśli otrzymasz projekt, w którym potrzebna jest mapa strony, będziesz musiał współpracować z klientem, aby ją złożyć.

Może to oznaczać zadanie klientowi kilku pytań:

• Jaka jest liczba stron w serwisie?
• Jakie strony są najważniejsze?
• Czy są jakieś podstrony?

Dzięki temu uzyskasz jasny obraz struktury witryny i zrozumiesz zakres projektu.

Najpierw kopiuj

Uważam, że warto poprosić klienta z góry o przekazanie mi całej kopii i treści, które chce umieścić na stronie. Najlepszą praktyką jest sprawienie, aby projekt działał wokół kopii, zamiast tworzyć najpierw interfejs użytkownika, a następnie próbować dopasować kopię.

Podejście „kopiuj w pierwszej kolejności” oszczędza Tobie i programistom dużo czasu. Jeśli pójdziesz w drugą stronę, możesz napotkać problemy. Chociaż czasami jest to przydatne, użycie fikcyjnego tekstu może negatywnie wpłynąć na rzeczywisty projekt, zwłaszcza gdy projekt w dużym stopniu opiera się na typografii i jest zaprojektowany wokół treści. Projekt skoncentrowany na kopiowaniu nie ma wad i pomaga jedynie w realizacji twórczej pracy o wyjątkowej jakości.

Projekt strony głównej

Wykonując wszystkie poprzednie kroki, masz już ogólne wskazówki wizualne, mapę witryny i kopię. Teraz możesz przejść do projektowania stron serwisu.

Strona główna jest pierwszą rzeczą, jaką widzą użytkownicy, gdy wchodzą na stronę internetową, dlatego jest to najważniejsza strona. Stosowanie zasady Pareto pokazuje, że strona główna zajmuje 80% kierunku projektowego (kontekst, typografia, kolory, powtarzalne elementy itp.), a reszta stron 20%.

Dobrym pomysłem jest rozpoczęcie procesu od grupowania i wybierania sekcji na stronie głównej. Pełna treść i kopia zwykle pomagają mi uporządkować całą stronę i zobaczyć, których aspektów brakuje, a także sekcje, które można dodać, aby zmaksymalizować wpływ i zachęcić użytkowników do zakupu/korzystania z produktu lub usługi.

Aby podkreślić usługę lub produkt, spróbuj użyć dobrze widocznych sekcji wezwania do działania. Są doskonałym sposobem na reklamę, a także przyciągnięcie uwagi użytkowników do zakupu produktu, zapisania się do newslettera, zapisania się itp.

Jeśli pozwala na to technologia, grupa docelowa i rodzaj działalności klienta, dodanie projektu ruchu, takiego jak GIF lub animacja, może nadać całej witrynie podkontekst, a także podkreślić sekcję wezwania do działania. Projektanci powinni jednak uważać, aby nie posunąć się za daleko i stworzyć coś, co zajmie dużo czasu.

Dni 15-25: Zastosuj uniwersalny projekt

Projekt uniwersalny, jak opisali jego twórcy, „może być stosowany do oceny istniejących projektów, kierowania procesem projektowania i edukowania zarówno projektantów, jak i konsumentów na temat cech bardziej użytecznych produktów i środowisk”.

Koncepcja projektowania uniwersalnego jest jednym z najbardziej optymalnych rozwiązań do zastosowania w projektach o dużym zakresie – ujednolicona koncepcja i ukierunkowany kierunek wizualny dla brandingu, stron internetowych i aplikacji mobilnych są bardzo przydatne przy projektowaniu w ramach ograniczeń czasowych.

Konieczność powtarzania elementów może być sama w sobie wyzwaniem. Dzieje się tak, gdy napotykasz wymagania techniczne. Responsywne strony internetowe i platformy mobilne mają zupełnie inną filozofię i zestaw zasad, dlatego mogą stać się problemem, jeśli nie zostaną odpowiednio rozwiązane. Niemniej jednak tworzenie elementów, które mogą być używane na wielu platformach, jest jednym z filarów sukcesu każdego projektu — w tej konkretnej sytuacji nie byłoby możliwe objęcie tak wielu platform/urządzeń bez ujednoliconego projektu, który jasno wyznacza kierunek dla marki rozwój.

Minusem napiętego terminu i projektowania dla wielu platform jest to, że możesz nie wykorzystywać pełnego potencjału każdej z platform, dla których projektujesz. W takich przypadkach, ze względu na ograniczenia czasowe, cennym pomysłem może być proste „kuloodporne” rozwiązanie, które jest znane użytkownikom.

Na przykład: ponownie zastosuj jeden pomysł na wielu stronach i przemodeluj go dla każdego urządzenia. Wzory są zasadniczo podobne, co jest na twoją korzyść. Może to być sposób wyświetlania podstawowych informacji lub zapraszania użytkowników do zakupu produktu. W takim przypadku nawet pasek wyszukiwania może być podobny, jeśli nie taki sam.

Schemat blokowy

Projektowanie strony jest zakończone i masz jaśniejszą wizję UX dla aplikacji.

Jednym ze sposobów ułatwienia i przejrzystości procesu tworzenia UX jest stworzenie schematu blokowego użytkownika.

Istnieje wiele metod i narzędzi, których można użyć do tworzenia schematów blokowych — typową praktyką jest tworzenie diagramów graficznych z krótkimi tytułami i, w razie potrzeby, tekstem objaśnienia. Preferuję w tym celu program Sketch lub Illustrator, ale każde narzędzie, które pozwala tworzyć i przenosić elementy, jest odpowiednie do tego zadania.

Will Little podał świetną interpretację tego:

W tym miejscu inżynier(y) i kreatywni(cy) muszą ściśle ze sobą współpracować, aby zdecydować, jakie narzędzia programowe najlepiej obsługują zamierzone interfejsy i zachowanie kliknięcia/przeciągnięcia, aż do każdej ostatniej karty, podpowiedzi, lightboxa, ikony itp. .

Uczyń go wysoko, czyniąc go niskim

Odkrycie głównego celu aplikacji pomoże zdefiniować UX. Może to być pomoc użytkownikowi w zakupie produktu lub pomoc w korzystaniu z produktu — doświadczenie użytkownika musi to uwzględnić. Makiety o niskiej wierności utworzone na papierze, a następnie przeniesione do wyższej wierności w programie Sketch lub Photoshop mogą znacznie ułatwić ten proces.

W tym przypadku wystarczyły makiety o niskiej wierności, ponieważ aplikacja jest prosta i wystarczy tylko śledzić szczegóły wizualne ze strony internetowej.

Jeśli możesz, zorganizuj mały test dla swojego UX. Będziesz potrzebować testowej grupy przyszłych użytkowników, aby sprawdzić, czy makiety i przepływ UX mają sens. Po teście zostaniesz uzbrojony w cenne spostrzeżenia i możesz przejść do kolejnego kroku (tworzenie interfejsu użytkownika).

Ujednolicony projekt

Po wprowadzeniu kilku poprawek w UX masz wszystko, czego potrzebujesz do stworzenia logicznego i dobrze zdefiniowanego interfejsu użytkownika, umożliwiającego dostosowanie go do wymagań wizualnych platform iOS i Android. Ponieważ iOS ma bardzo szczegółowe wytyczne projektowe, które mogą uniemożliwić Ci dostęp do Apple App Store, musisz poznać te zasady i dokładnie sprawdzić, jak Twój projekt jest wdrażany na etapie rozwoju.

Możesz stworzyć ujednolicony projekt dla platform iOS i Android, jednocześnie wykorzystując ich największe atuty, przestrzegając wytycznych i zasad podczas projektowania interfejsu użytkownika.

Dni 25-30: Tworzenie reklam zsynchronizowanych z budowaniem marki

W tym momencie powinieneś już zaprojektować logotyp, elementy brandingu, stronę internetową i aplikacje mobilne. Chociaż zaprojektowałeś to wszystko w mniej niż 25 dni, jest za wcześnie na świętowanie, ponieważ wciąż należy rozważyć jeszcze jeden krok — tworzenie reklam w sieciach społecznościowych i drukowanych. W tym przypadku koncepcja, którą stworzyłeś na początku, będzie bardzo pomocna.

Postępowanie zgodnie z tymi wskazówkami podczas projektowania reklam i materiałów w mediach społecznościowych znacznie poprawi jakość, poziom zaangażowania i ogólną kreatywność Twoich materiałów wizualnych:

• Wykorzystaj żywe i jasne kolory, które się wyróżniają.
• Pokazywanie szczęśliwych i aktywnych ludzi pomaga w dynamice i odczuciach związanych z twoją grafiką.
• Ruch, aktywność i podekscytowanie ludzi zawsze przyciągają wzrok i pomagają w ogólnie przekazywanych uczuciach.

Wszystkie te zasady pomogą Ci w tworzeniu wyjątkowej grafiki do reklam. W razie potrzeby skorzystaj z palety kolorów, typografii i innych elementów wizualnych używanych w witrynie, znakowaniu i aplikacjach. Pomoże Ci to zachować spójność w projektach i będzie działać na Twoją korzyść, gdy pracujesz pod presją czasu.

Nigdy nie zobowiązuj się do terminu, którego nie możesz dotrzymać

Czasami każdy może nie docenić ilości wysiłku i pracy, jaką może wykonać jeden projekt — dlatego planowanie każdego kroku ma kluczowe znaczenie na początku projektu. Cele i realistyczne cele podzielone na małe części mają kluczowe znaczenie dla wykonania solidnej pracy na czas.

Benjamin Franklin ujął to najlepiej: „Nie przygotowując się, przygotowujesz się na porażkę”.

Zawsze, nigdy nie przestawaj się przygotowywać i nigdy nie zapominaj o możliwości, że nie doceniłeś pracy pod względem czasu wymaganego do jej wykonania. Chociaż klienci mogą mieć terminy, powinieneś mieć umiejętności, które pomogą Ci określić, czy projekt jest wykonalny, a nawet wart rozważenia w pierwszej kolejności. Nie pozwól jednak, aby była to wymówka, aby nie podejmować osobistego wyzwania, które ostatecznie może pomóc Ci stać się bardziej zręcznym projektantem i menedżerem swojego czasu.

• • •

Dalsza lektura na blogu Toptal Design:

• Najlepsze praktyki projektowania interfejsu użytkownika i typowe błędy
• Puste stany – najbardziej pomijany aspekt UX
• Prostota jest kluczem – odkrywanie minimalistycznego projektowania stron internetowych
• Zasady heurystyczne dla interfejsów mobilnych
• Projektowanie pod kątem czytelności — przewodnik po typografii internetowej