Co to jest moodboard i dlaczego warto go stworzyć?

Inspiracja czy naśladowanie? Kiedy jeszcze ładujemy nasze baterie, poszukujemy natchnienia, a kiedy ściągamy pomysły innych? Granica między inspiracją a plagiatem potrafi być bardzo cienka. Warto jednak inspirować się pracami innych i szukać swojej własnej drogi kiedy tego właśnie potrzebujemy.

Spis treści

1. Dlaczego warto inspirować się innymi projektami?
2. Co to jest Moodboard?
3. Dlaczego tworzymy Moodboardy?
4. Dlaczego jest Ci potrzebny mood board?
5. Czym jest Moodboard?
6. W jaki sposób stworzyć digitalowy moodboard?
7. O czym warto pamiętać przy tworzeniu moodboardów?
8. Przykłady Moodboardów
9. Moodboard – inspiracja!
   – Portale, którymi można się inspirować
   – Android/iOS Guildelines
   – Przykłady dobrych projektantów
10. Inspirować się czy się nie inspirować?

Nie ma niczego złego w tym, żeby czerpać z kreatywności innych, inspirować się pracami innych osób i w ten sposób tworzyć własne rozwiązania.Plagiatom mówimy nie, ale do inspirowania się będziemy gorąco zachęcać. Dlatego dzisiaj piszemy o tym czym jest moodboard, jakiego rodzaju jest to tablica inspiracji, jak ją wykonać i do czego wykorzystać.

Dlaczego warto inspirować się innymi projektami?

Żyjemy w świecie, w którym na każdym kroku mierzymy talent i umiejętności.Pomijamy jednak ważny aspekt inspiracji. Inspiracja ma budzić nas do nowych możliwości. Dzięki inspirowaniu się innymi, mamy przekraczać nasze własne ograniczenia. Inspiracja sprawia, że zmieniamy sposób, w jaki postrzegamy nasze własne możliwości. Badania pokazują, że inspiracja może zostać pobudzona, aktywowana i “zmanipulowana”, co wpływa na różne wyniki naszej pracy. 

Praca kreatywna wymaga dużych pokładów kreatywności. Często jednak bywa tak, że zderzamy się ze ścianą. Ze wszystkich sił próbujemy znaleźć odpowiednie rozwiązanie, wygenerować nowe pomysły, ale czujemy wewnętrzne ograniczenie, które utrudnia nam dalszą pracę. Dlatego też warto mieć swoje sprawdzone sposoby szukania inspiracji, które usprawnią nasze działanie i skutecznie usuną blokady.

Ale pamiętaj: Inspiruj się – nie zrzynaj!

Co to jest Moodboard?

Moodboard to tablica inspiracji – wizualne przedstawienie koncepcji projektowej, które ma być tablicą inspiracji. Dosłownie jest to “tablica nastroju” i w taki też sposób postrzegana jest przez wielu projektantów. Ideą moodboardów jest uporządkowanie swoich inspiracji na etapie tworzenia koncepcji, zarówno projektowanej aplikacji (w przypadku naszej firmy), jak i każdej innej pracy kreatywnej – architekta wnętrz, projektanta mody itp…

Moodboard można stworzyć zarówno w wersji cyfrowej, jak i fizycznej, namacalnej. W przypadku pierwszej wersji tworzymy kolaż z wyszukanych materiałów w wybranych programach, w przypadku wersji “offline” wykorzystać możemy arkusz papieru, tablicę korkową a nawet ścianę, do których przypinamy wycinki gazet, materiałów, zdjęć itd. 

Dlaczego tworzymy Moodboardy?

Moodboard tworzony jest zazwyczaj podczas inicjacji projektu. Może być wykorzystywany zarówno na własne potrzeby, jak i na potrzeby grupy tworzącej pewien koncept, czy przekazania klientowi pomysłów, koncepcji i kierunku, jaki chcemy obrać. 

Dlaczego jest Ci potrzebny mood board?

Wykorzystując moodboard możemy uporządkować swoje pomysły. Zestawiając wszystkie koncepcje i inspiracje w jednym miejscu, bardzo szybko i skutecznie mamy możliwość weryfikacji kompozycji i jej harmonii. Może okazać się, że przewidziane kolory, wzory czy motywy, niekoniecznie zgrywają się w spójną całość – moodboard już na samym początku może wyznaczać nasz kierunek i oszczędzać czas na dalszych etapach projektowania. W ten sposób już na samym początku weryfikujemy nasze wyobrażenia i potwierdzamy, czy planowany efekt jest tym docelowym.

Czym jest Moodboard?

Moodboard jest też lekiem na brak pomysłów. W każdej pracy kreatywnej pojawiają się takie momenty, w których mamy pustkę w głowie i nie wiemy, w którą stronę postawić ten pierwszy krok. Szukając wszystkiego, co nam się podoba, pasuje do naszej koncepcji i nas inspiruje, bardzo szybko możemy nakreślić w jaki sposób wyglądać będzie nasza realizacja. 

W jaki sposób stworzyć digitalowy moodboard?

W naszym artykule, ze względu na profil działalności itCraft i naszych UX/UI designerów, skupimy się na wersji cyfrowej moodboardów. 

O czym warto pamiętać przy tworzeniu moodboardów?

Pamiętaj, że moodboard nie musi być nudnym PDF’em czy arkuszem w Photoshopie, czy innym narzędziu, z którego korzystasz i zamykać się w kilku zdjęciach, które znajdziesz w Internecie. Korzystaj ze wszystkiego, co Cię inspiruje. Muzyka? Video? Fotografia? Kolor? Czerp ze wszystkiego, co sprawia, że generujesz kolejne pomysły i czujesz, że obierasz właściwy kierunek swoich działań. Każdy zbiór zdjęć, wszystkie próbki, materiały – mood board to Twoja tablica inspiracji, więc wykorzystaj go jako zbiór pomocnych materiałów.

Stwórz moodboard w wybranym programie graficznym, kolekcjonuj materiały na portalach takich jak Pinterest, wrzuć wszystko do jednego folderu, jeżeli ten sposób jest dla Ciebie najbardziej skuteczny, skorzystaj z gotowych programów do tworzenia Moodboardów.   

Moodboard ma Cię inspirować i ma pomóc w procesie twórczym a nie być przykrą koniecznością – jeżeli uważasz, że zakładki w przeglądarce będą skuteczniejsze, gromadź materiały w ten sposób. Jeżeli sam musisz stworzyć kolaż, żeby się odnaleźć w zgromadzonych materiałach, zrób to w ten sposób. Tutaj nie ma dobrych i złych sposobów – są tylko właściwe i skuteczne dla Ciebie.

Przykłady Moodboardów

Moodboard pomaga w określeniu kluczowych elementów graficznych, które będą wykorzystywane w dalszych etapach projektu np: kolory wiodące i uzupełniające, styl przycisków, okienek, krój pisma, fonty, ikonografika.

Pełni on także pomocną rolę podczas rozmów z klientem dotyczących koncepcji graficznej projektu. Pozwala zaprezentować zwizualizowane pomysły projektanta i zestawić je z oczekiwaniami Klienta.

Przykładowe Moodboardy, które tworzyliśmy w itCraft podczas projektowania aplikacji mobilnych.

Moodboard dla “pixoo” pozwolił nam określić ogólną stylistykę aplikacji (fonty, kolory, zdjęcia) – dotycząca dzieci, skierowaną do rodziców, członków rodziny.

Był także punktem wyjścia do rozpoczęcia prac nad logotypem aplikacji.

Moodboard dla “Scooter sharing” pozwolił nam na wyselekcjonowanie i określenie stylu najważniejszych, wspólnych elementów interfejsów popularnych na rynku aplikacji sharing’owych, nawigacyjnych. Znalazły się wśród nich:. mapy z punktami, informacje o pojeździe, ekrany onboarding, statystyki, podsumowania. Na jego podstawie wybraliśmy także główne kolory, styl fontów i ilustracji.

Moodboard – inspiracja!

Czym jest moodboard? Inspiracją! Inspirację można znaleźć właściwie wszędzie. Wystarczy się rozejrzeć i czerpać z tego, co nas otacza. Zdarza się jednak, że mamy przed nosem bardziej, lub mniej uporządkowane biurko, które niekoniecznie przynosi nam natchnienie. Dlatego też UX/UI Designerzy w itCraft zrobili swoje małe zestawienie narzędzi, które pomogą w inspirowaniu się i tworzeniu moodboardów. 

Portale, którymi można się inspirować

1. Behance
Portfolio projektantów z całego świata. Wiele działów tematycznych. Szeroki zakres prezentowanych prac – od ikon, przez ilustracje, po całe use case’y, procesy budowania brand’u, identyfikacji wizualnej, czy też aplikacji, stron www.

2. Dribbble – Podobnie jak wyżej, z tą różnicą, że prezentowane grafiki przedstawiane są w krótkich, zwięzłych formach – tzw. shotach.

3. Medium.com – dział design, ux

Wiele ciekawych artykułów dotyczących procesu, warsztatu projektowania,
a także zestawienia ciekawych prac innych projektantów.

4. Pttrns.com i Mobbin
Galerie prezentująca projekty gotowych rozwiązań UI mobile dla iOS i Android.

5. Mobile Design Inspiration
Galerie prezentująca projekty UI web/mobile, a także animacje dotyczące Interaction Design.

6. Designspiration Przykłady prac projektantów z różnych dziedzin. Baza inspiracji dotyczących np. doboru kolorów, kształtów i fontów.

7. Pinterest – wśród zbioru różnych obrazów, można znaleźć wiele inspirujących projektów graficznych np, pod frazą: “clean ui for mobile app” lub ”rwd website design” i przypiąć je (“pin”) do własnej “tablicy” tworząc coś na wzór prywatnych moodboard’ów…

8. ABDUZEEDO
Spora baza inspiracji z różnych dziedzin od projektowania graficznego przez fotografię aż po grafikę trójwymiarową.

Android/iOS Guildelines

Projektując grafiki dla urządzeń mobilnych należy pamiętać o tym, że posiadają one pewne ograniczenia i nawet najpiękniejszy projekt może okazać się bezwartościowy lub trudny w implementacji, jeżeli nie był przygotowany zgodnie z wytycznymi producentów systemu operacyjnego na dane urządzenie.

W uniknięciu tego typu “wpadek” pomagają “guidelines”, które można znaleźć na stronie firm Apple i Google. Zawierają one mnóstwo wartościowych dla projektantów, wskazówek, przykładów użycia np. natywnych komponentów, a także gotowych do pobrania zasobów.

iOS – “Human Interface Guidelines”
https://developer.apple.com/design/human-interface-guidelines/

Android – “Material design”
https://material.io/develop/android/

Przykłady dobrych projektantów

Blind Agency/ blind.com

Mają w swoim portfolio prace dla takich marek jak Microsoft, Harman/Kardon, czy zespół Coldplay. Pomimo zdobycia wielu nagród nadal na swoich kanale na YouTube, jako thefutur.com, dzielą się wiedzą z zakresu projektowania graficznego ux i ui, z innymi, edukują i inspirują.

Aaron Draplin

Projektant graficzny, który współpracował z Nike, Burton oraz Ford. Poprzez liczne filmy online, TED Talks, Google, opowiada w bardzo przystępny sposób o procesach w projektowaniu graficznym. .

Ales Nesetril 

Młody utalentowany projektant na stanowisku Design Team Lead w firmie STRV. Na swoim koncie ma wiele realizacji między innymi dla Tinder, Boosted Boards, Lufthansa czy Flip. Jego projekty charakteryzują się prostymi i przemyślanymi rozwiązaniami. 

Gleb Kuznetsov

Bez wątpienia jest to wybitny projektant. W swoich realizacjach najczęściej łączy interfejs z video. Co w rezultacie daje niesamowity efekt końcowy. Liczne koncepty w jego portfolio są olbrzymią bazą inspiracji dla wielu projektantów.    

Gdzie szukać gotowych elementów?

Różnego rodzaju zasoby do Sketch:
https://www.sketchappsources.com/

Bank darmowych fotografii:
https://unsplash.com/

Ikony:
https://www.flaticon.com/
https://material.io/resources/icons/

Różnego rodzaju zasoby graficzne np. mockup’y, fonty, ikony:
https://graphicburger.com/

Fonty:
https://www.fontsquirrel.com/
https://fonts.google.com/

Inspirować się czy się nie inspirować?

Odpowiedź jest bardzo prosta. Inspirować, jeśli tego potrzebujemy. W inspiracji nie ma niczego złego, o ile nie prowadzi do plagiatowania. Zdobycie natchnienia nie jest rzeczą prostą. Nawet jeżeli na co dzień zajmujesz się pracą kreatywną i jest to dla Ciebie chleb powszedni. Trzeba szukać własnego stylu, ale nie zamykać się na to, co tworzą inni. Obserwacja tego, co robią inni może nas bardzo rozwijać, dodawać kolejne pokłady kreatywności i sprawiać, że nasze własne działania będą jeszcze lepsze. 

„Nie warto czekać na przypływ inspiracji, należy wyjść jej naprzeciw i znaleźć ją samemu” – Jack London

Inspiracja kimkolwiek ani czymkolwiek nie jest jednak koniecznością. Jeżeli masz gotową koncepcję, nie potrzebujesz dodatkowych bodźców i sam generujesz pomysły, nie musisz się dodatkowo inspirować.Inspiracja ma być narzędziem pomocniczym, kiedy uważasz, że jest Ci to potrzebne. Warto mieć wtedy na uwadze, że są sposoby i narzędzia, które mogą być w takiej chwili przydatne i pomogą obrać właściwy kierunek i działać dalej.

Przeczytaj więcej na temat UX Design

Czy UX/UI aplikacji mobilnych ma znaczenie?
Jak zacząć UX design – User Flow oraz Interaktywny Prototyp
Mapa ekranów aplikacji – podstawa dobrego UX/UI design
Dlaczego powinieneś przeprowadzić warsztaty UX/UI Design dla swojej aplikacji?