W początkowym etapie pracy z projektem strony internetowej często będziesz korzystał z różnych materiałów typu zdjęcia, fonty, zbiory kolorów itp. Gdy skończysz projekt, wysyłasz do Klienta i wtedy następuje etap uzupełnienia treści. Klient dostarcza odpowiednie grafiki lub tekst, do przygotowanego wcześniej projektu, lub akceptuje te, które użyłeś ze zbiorów.
W dzisiejszym artykule podrzucam kilka ciekawych stron/aplikacji, które przyspieszą etap projektowania strony/aplikacji. W przyjemny sposób dobierzesz odpowiednie grafiki, kolory i fonty do projektu. Wszystkie opisane narzędzia są w pełni darmowe.
- Coolors.co
Nie masz pomysłu na paletę kolorów dla nowego projektu? Zerknij do biblioteki kolorów aplikacji Coolors. Znajdziesz tam zbiór ciekawych połączeń kolorów jak również wygenerujesz swoją paletę wskazując tylko kolor bazowy. Zbiór jest często aktualizowany i zawiera również ranking użytkowników. Baw się i testuj!
https://coolors.co/palettes/trending
- UnDraw
Ok, masz już kolory, teraz czas na grafiki. Znudziły Ci się nudne stockowe obrazki? Zerknij na ilustracje w serwisie undraw.co. Możesz przeszukiwać bibliotekę ilustracji za pomocą słów kluczowych, a w dodatku dopasować obrazek do wybranego przez siebie koloru. Ostatnio do zbioru zostały dodane rysunki własnoręczne. Ilustracje możesz pobrać do formatu svg oraz png. Wszystko oczywiście darmowe.
https://undraw.co/illustrations
- Doodle Ipsum
Jeszcze jeden zbiór ilustracji z większą możliwością dostosowania (proporcje, kolory). Wybierasz tematykę, proporcję oraz decydujesz czy wybrany obrazek ma być generowany z tłem lub z przezroczystością. Możesz pobrać obrazek lub skorzystać z wygenerowanego URL’a.
- Google Fonts
Czas na typografię. Dobry i czytelny tekst to połowa sukcesu. Dobierz odpowiednią typografię do swojego projektu, aby użytkownik chciał przeczytać to co napisałeś.
Google Fonts to zbiór darmowych fontów, gdzie znajdziesz interesujące i przyciągające wzrok fonty. Serwis umożliwia weryfikację rozmiarów, grubości, parowanie z innymi stylami i oczywiście pobieranie wybranego stylu.
Zapoznaj się z najchętniej wybieranymi fontami i poznaj te, które dopiero zyskują na popularności. Oprócz zbioru fontów w google fonts znajdziesz minimalistyczne ikonki, które możesz użyć w swoim projekcie.
Bonus 1 – Responsinator
Skończyłeś już projekt? Sprawdź jak się zachowuję w różnych rozdzielczościach i urządzeniach za pomocą narzędzia Responsinator → https://www.responsinator.com/
- Wejdz na stronę: https://www.responsinator.com/
- Wpisz adres projektu
- Zobacz na wizualizacjach jak zachowuje się Twój projekt na różnych urządzeniach
Bonus 2 – Cleanup pictures
Znalazłem ostatnio świetne narzędzie do usuwania niepotrzebnych elementów na zdjęciu. Nie musisz instalować żadnych programów typu photoshop czy gimp. Wgrywasz obrazek komputera, a na koniec zaznaczasz myszką element, który chcesz usunąć. Algorytm wykrywa element i odpowiednio wycina i uzupełnia zaznaczony fragment. Moim zdaniem działa genialnie, zresztą zobacz sam ->
Artykuł polecany dla Ciebie – Narzędzia do testowania stron internetowych
