A więc mamy Pana Klienta. Pan Klient chce stronę internetową. Pan Klient nie ma specjalnych wymagań (przynajmniej na razie – uf, jaka błoga to chwila, cisza przed burzą, oko cyklonu). Pan Klient chce, żeby strona była ładna. Czujesz ten powiew artystycznej wolności, kiedy nagle… wpadasz na ścianę. Zero satysfakcjonujących, oryginalnych pomysłów. To nie pasuje do tematyki, tamto już gdzieś było, a przecież Ciebie nie kręcą powtórki z rozrywki. I co teraz?
Developer myśli: „To nie moja sprawa, ja chcę kodować, dajcie mi grafika!”. Grafik myśli: „Jestem do kitu, wypaliłem się”. A to całkiem normalne, że czasem tryskamy pomysłami na prawo i lewo, a czasem.. po prostu tak nie jest. Zdarza się nieciekawy, nudny temat, zdarza się gorszy umysłowo dzień. Wiem, że w niektórych sytuacjach wystarczy spojrzeć na swojego psa albo wyjść na spacer i już ot tak od razu wpadamy na nasz kolejny genialny pomysł. Jednak to nie zawsze pomaga. Wtedy nie ma co czekać na nagły przypływ weny twórczej.
Chcę podzielić się z Wami moją bazą inspiracji frontowych. Na pewno przyda się każdemu, kto stoi przed zadaniem zaprojektowania strony internetowej od zera.
CALL TO IDEA
Jak sama nazwa wskazuje – to po prostu strona wzywająca inspiracje. Jest podzielona na wiele sekcji – możemy wyszukiwać inspiracje całych stron (np. 404, logowania itd.) lub różnorakich sekcji (np. menu, stopki, formularza, zakładek itd.). Filtracja pomysłów jest naprawdę dobrze zorganizowana. Niestety, CallToIdea nie jest studnią bez dna. Ilość konkretnych pomysłów dla poszczególnych kategorii nie powala na kolana. Różnorodność, świeżość projektów też pozostawia wiele do życzenia. Ważne – każde rozwiązanie to tylko zdjęcie, inspiracja czysto wizualna. Nie mniej jednak uważam to źródło za cenne miejsce w sieci.
Biblioteka podzielona jest na 4 bloki. Pierwszy to spora baza stron wszelakich, które gdzieś tam wiszą na internecie i żyją własnym życiem. Drugi blok to konkretne elementy stron (np. menu, paginacja). Co ważne – znajdziemy tu nie tylko pomysł, ale też jego programistyczne rozwiązanie! Mało tego, gotowe kawałki kodu to nie tylko HTML, CSS i JS, ale też SCSS! Trzeci blok to tzw. triggery – wizualizacje, animacje, różnorakie sposoby interakcji strony z użytkownikiem. Każdy pomysł to opis, zdjęcie oraz link do żywej strony. Czwarty blok nie przyda się w projektowaniu. Wchodząc do ZURB można początkowo odczuć lekki chaos zderzając się z misz maszem różnorodnych inspiracji. Nie są one podzielone na żadne podkategorie, całe szczęście wyszukiwarka świetnie daje sobie radę. Biblioteka jest ogromna i cieszę się, że bazuje na żywych stronach internetowych, jednak jej zaleta stanowi też wadę. Często wchodząc na konkretną inspirację okazuje się, że strona została już przebudowana albo w ogóle nie istnieje.
To stronka pełna linków do innych rewelacyjnych, inspirujących, wzorcowych, żywych stron. Dostępna jest filtracja według tematyki strony. Świetna pozycja, jeśli szukamy ogólnego stylu, koncepcji nowej strony.
Każdy na pewno zna tę pozycję Bardzo podobna do powyższej – stanowi bazę genialnych stron, nagrodzonych dosyć prestiżowymi nagrodami. Filtracja w tym przypadku jest nieco bardziej rozbudowana – oprócz wyboru tematyki, możemy określić kolorystykę, kluczowe tagi lub rodzaj przyznanego wyróżnienia.
Galeria świetnych, żywych stron. Filtrujemy po kolorach, stylu, tematyce. BWG umożliwia głosowanie na wybrane strony, dodawanie komentarzy, podglądanie ich screenshotów. Zebrane inspiracje są różnorodne, każdy znajdzie coś dla siebie!
Kolejna baza stron nominowanych bądź nagrodzonych przez „CSS Nectar”. Znajdziemy tu galerię naprawdę wybitnych, zaawansowanych stron z duszą i sercem. Poza standardową filtracją po kolorach, stylu, temacie, mamy też wybór kraju pochodzenia strony.
To jest kombajn. Nie opiszę Wam różnych sposobów wyszukiwania konkretnych elementów, bo znam tylko jeden – wyszukiwarka. Strona jest dla mnie strasznie nieintuicyjna, nie potrafię swobodnie się po niej poruszać, może mam za mało pofałdowany mózg. Niemniej jednak – to jest po prostu kombajn. Inspiracje całych stron, poszczególnych sekcji, animacji, interakcji, baza darmowych gotowych rozwiązań dostępna bez logowania – wystarczy kliknąć „download”. Ludzie udostępniający te wszystkie cudowności to chyba anioły.
Piękna galeria całych interfejsów. Każda inspiracja to żyjąca, prawdziwa strona internetowa. Standardowa wyszukiwarka. Stronka jest prosta, minimalistyczna, niesamowicie czytelna i ciesząca oko każdego estetę.
Ciekawe źródło designerskich inspiracji. Jednak ciężko tam znaleźć coś konkretnego. Najlepiej traktować Muzli jako kopniaczek dobrych pomysłów – zasubskrybować albo dodać jako rozszerzenie do Chrome.
Tylko i wyłącznie dla zainteresowanych – zbiór inspiracji dotyczących sklepów internetowych lub stron sprzedających cokolwiek. Każdy pomysł to odnośnik to prawdziwej stronki.
Jak sama nazwa wskazuje – baza inspiruje tzw. stronami lądowania. Każda sugestia to rzeczywista, działająca strona. Filtrujemy po kategoriach, które wyznaczają głównie tematykę strony. Nic dodać nic ująć.
Kontynuując wątek tematycznych inspiracji – polecam Wam teraz stronę, która stanowi bazę różnych portfolio. Na pierwszy rzut oka nie robi wrażenia, jednak koniec końców może nieźle pobudzić Waszą wyobraźnię.
Źródło pięknych, żyjących stron internetowych utrzymanych według koncepcji flat designu. Oczywiście standardowo wyszukujemy stronki po tematyce, kolorystyce. Co ciekawsze – możemy też je filtrować według czcionek lub stylu (np. one page, video w tle itd.). Lubię Flat Inspire, naprawdę. Lubię to, że nie muszę doszukiwać się stron według najnowszych trendów – tu każda pozycja jest po prostu świeża, czysta i pachnąca nowością.
Kolejny zbiór inspiracji dla wyznawców flat designu. Co wyróżnia Flat DSGN? Freebies! Możemy znaleźć tu naprawdę nietypowe rozwiązania powszechnych problemów, a potem szybko, łatwo i przyjemnie wdrożyć je w życie.
Ogrom, ogrom, ogrom pomysłów na animacje, wszelaki ruch na naszej stronie. Podział na konkretne elementy (np. przyciski, kalendarze itd). Na stronie najczęściej zobaczymy tylko gifa z prezentacją konceptu oraz linka np. do dribble. Tam mamy szansę doszukać się kawałka kodu Nowością jest tzw. „user flows” – czyli filmiki, na których zobaczymy przeklikiwanie się przez bardziej lub mniej popularne serwisy. Oczywiście w celu wykonania jakiejś konkretnej funkcji. Idealnie obrazuje to intuicyjność portali oraz sposób prezentacji niektórych opcji.
Zbiór wszelakich, dobrych stron internetowych filtrowanych według tematyki oraz stylu. Czy wyróżnia się na tle innych baz tego typu? Na moje nie, jednak być może a nóż widelec to właśnie tutaj znajdziesz swoją idealną inspirację.
j.w.
Ten teges… kolejny zbiór stron, tym razem w koncepcji „one page”. Dla miłośników.
Znajdziemy tutaj ogrom przeróżnych szablonów pod np.: WordPressa, Joomlę, Magento… W sumie każda strona z szablonami może stanowić dobre źródło inspiracji. Jednak w przypadku Template Monster oraz Theme Forest mogę zagwarantować Wam świetną jakość szablonów, dążenie za trendami, praktyczną architekturę. Poza tym, jeśli budujesz stronę dla trudnego, być może niszowego, nieznanego Ci rynku – na bank znajdziesz jakąś inspirację wśród kilkudziesięciu tysięcy szablonów.
Uwaga – mobile inspirations only.
A to ciekawa rzecz! Little big details to portal, który pokazuje jakieś detale na różnych stronach internetowych – są najczęściej na tyle małe, że nie zwracamy na nie uwagi, jednak na tyle istotne, że warto być ich świadomym! Można tu naleźć naprawdę niesamowite przykłady rozwiązania problemów z życia codziennego projektanta stron internetowych. Dobrze byłoby śledzić stronę i chłonąć te wszystkie inspiracje na bieżąco. Niestety strona od pół roku nie była updatowana (chlip). Tak czy siak – w razie funkcjonalnych zagwozdek – polecam.
Mockupy, projektu UI, ikony, animacje i wiele innych. Za friko. Graphic Burger to głównie baza darmowych webowych materiałów do pobrania, jednak stanowi też genialną formę inspiracji.
To tak na zakończenie – tych panów chyba nie trzeba Wam przedstawiać. Warto jednak o nich pamiętać podczas inspiracyjnych poszukiwań. Tak – Pinterest też daje radę
Uffff… Internety są pełne jeszcze innych inspirujących stron. Podałam Wam zaledwie ułamek tego, co piękne, pomysłowe, ożywiające naszą wyobraźnię. Uważam jednak, że ta podstawowa baza poradzi sobie z większością naszych problemów. Rozwijajmy się! Chłońmy to, co użyteczne, a jednocześnie miłe dla oka! Wierzę, że większość ludzi projektujących cokolwiek nie rodzi się z genem „mam sto pomysłów na minutę”. Na dobry produkt składa się doświadczenie autora, ale też chęć rozwoju, otwarcia na nowe, poszerzania horyzontów.
Podzielcie się swoimi linkami, które Was inspirującą!