+48 535377771 biuro@madecki.pl
Zaznacz stronę

Na początku nigdy nie jest tak, że nam się nie chce. Tylko za co się zabrać? Chcielibyśmy iść o krok dalej, nauczyć się czegoś nowego, ale nie mamy pojęcia skąd czerpać inspiracje. Postanowiłem, że stworzę cykl o nazwie 3 darmowe źródła, który będzie polegał na cyklicznym dodawaniu trzech sprawdzonych przeze mnie, darmowych źródeł pomysłów, materiałów, grafik i tym podobnych. Po prostu po to żeby nie musieć przegrzebywać wyników Google, mieć pod ręką dobre konkrety. Ten artykuł postanowiłem poświęcić designom, layoutom, szablonom… zwał jak zwał. Jak nie masz pomysłu na wygląd swojej strony lub aplikacji – to za chwilę będziesz mieć. Zapraszam!

Źródła pod aplikację Figma

Oczywiście ze względu na to jak ulotne jest życie serwisów internetowych, podrzucę nieco więcej niż 3 źródła. W tym artykule będzie bardziej chodzić o źródła dedykowane na trzy najpopularniejsze platformy. Pierwsza z nich to darmowa Figma, a moją pierwszą rekomendacją jest…

FIGMACRUSH

Sam miałem okazję korzystać z paru template’ów z tej strony. Niestety nie każdy pobiera się w taki sam sposób. Musisz czasem przeklikać parę stron żeby dojść do “mięska” i się go naszukać, ale summa summarum powinno się to skończyć pobraniem pliku .fig, który możemy odpalić w aplikacji natywnej albo przeglądarkowej. 

Ciekawostka: podczas realizacji kursu z RWD i animacji użyłem tego designu, właśnie z FIGMACRUSH. Jak widać nie wszystkie przychodzą w wersji desktop + mobile, ale wytłumaczyłem tam jak poradzić sobie z takimi sytuacjami i za pomocą doświadczenia oraz intuicji zrobić “mobilkę” samemu. 

UI Store

Całkiem przyzwoite, oczywiście darmowe źródło designów stworzonych pod Figmę i nie tylko. Niestety oprócz landing page’ów znajdziemy tutaj też paczki z ikonami i inne tego typu materiały. Jest to nieco irytujące, bo nie ma możliwości równoczesnego filtrowania na podstawie apki oraz typu resource’ów, ale jak to mawiał mój przyjaciel “za darmo to i sól słodka”. 

Adobe XD

Chyba nigdy nie przywyknę do tej nazwy, chociaż jest to poziom humoru jak rysowanie dziwadeł po zeszytach w gimnazjum. Jakkolwiek specyficzną nazwę wybrało Adobe, nie można tej aplikacji odmówić użyteczności lub popularności. Tym bardziej, że od niedawna dostępna jest darmowa, praktycznie w pełni funkcjonalna wersja o nazwie Starter.

XD Guru

Serwis w głównej mierze dedykowany designom do Adobe XD, ale oferujący również proste kursy oraz artykuły dla osób, które interesują się UI/UX. Pod tym adresem można znaleźć darmowe templatki pod aplikacje mobilne, desktopowe, ale także proste strony. Niektóre designy oferują nawet dark mode. Autorzy próbują co jakiś czas przemycać treści płatne, ale kto nam każe je kupować – można scrollować dalej. Samo pobieranie jest szybkie i sprawne, bez większych pułapek.

XDFile

To miejsce to po prostu bank template’ów. Tylko, ale i aż, bo decydując się na taką specjalizację, zrobiono dobrą robotę. Mamy wygodny pasek szybkich filtrów, który pozwala nam zawęzić wyszukiwania do designów na mobile, desktop, mamy także mocki urządzeń – czyli takie szablony, które pozwalają zasymulować wygląd na danym urządzeniu, wraz z nim samym (działa to lepiej na wyobraźnię klienta, więc na pewno warto to wykorzystać będąc freelancerem!). Mały niesmak za CSS’owy babol , który tworzy tę śmieszne puste miejsce widoczne na zdjęciu powyżej 🙂

Photoshop

„Last but not least”, czyli póki co nadal niekwestionowany król programów graficznych. Wykorzystywany do usuwania pryszczy ze zdjęć oraz tworzenia memów ze zdjęć znajomych, ale również do bardziej zaawansowanych zastosowań, na przykład projektowania UI. Co prawda nie jest to darmowa aplikacja, ale można dostać ją za naprawdę niewielkie pieniądze w miesięcznej subskrypcji (sprawdź promocje i opcje dla studentów!).

Freepik

Portal, który zawsze kojarzył mi się tylko jako baza tanich (a co za tym idzie, średnich jakości zdjęć stockowych). Jak się okazuje, oferuje też całą paletę innych materiałów graficznych, a wśród nich są pliki PSD zawierające kompletne layouty stron i aplikacji. Pod tym adresem możemy znaleźć aż 13 tysięcy darmowych szablonów! Są to głównie projekty „stronek”, w przeciwieństwie do XD Guru i XDFile, które skupiały się bardziej na apkach. Tak czy siak – jest w czym przebierać, ale to przebieranie może nieco potrwać przy tej ilości zasobów. No, ale jak to mówił mój przyjaciel, za darmo to i…

Freebiesbug

Kolejny bank darmowych szablonów stron internetowych, tym razem z ukierunkowaniem na Photoshopa. Warto podkreślić na samym początku, że poza plikami PSD oferuje także pliki pod Illustratora i Sketch’a oraz całą bazę mockupów, ikon. Skupmy się jednak na tych pierwszych. Jest ich sporo ponad tysiąc i choć do wielokrotnie mniej niż na Freepiku, niech Cię to nie zwiedzie. Jeżeli chodzi o jakość, nowoczesność i unikatowość, to przewaga leży zdecydowanie po stronie Freebiesbuga. Choć sam interfejs portalu nieco odstrasza, to warto dać mu szansę!

Bonus!

Źródłem moich inspiracji była też bardzo często pewna strona, która znana jest chyba każdemu webdesignerowi i frontendowi. Być może jednak na Twojej drodze jeszcze nie pojawiło się to zbiorowisko najciekawszych, najbardziej oryginalnych i nieszablonowych stron, którym jest…

Awwwards

To portal, który zbiera kandydatów na najlepsze designy stron internetowych. Są tam nawet projekty polskich firm, w tym przede wszystkim jednej, którą uważam za niekwestionowanego lidera w kwestii webdesignu – Boldare.

Ciekawe projekty możesz zobaczyć na stronie głównej Awwwards, ale warto nieco się rozejrzeć i sprawdzić nominowanych, ostatnich zwycięzców, designy roku. To ważne szczególnie na początku ścieżki frontend developera – trzeba wyrobić sobie wyczucie smaku, podstawowe zrozumienie designu.