Grafik proceduralny, Janusz Jurek

Grafika proceduralna (generatywna) to po prostu tworzenie grafiki kodem, a nie narzędziami graficznymi. W pewnym sensie projektowanie CSS też może być taką sztuką, na bardzo niskim poziomie. Jednak istnieją Twórcy którzy programowanie grafiki proceduralnej opanowali do perfekcji, a ich prace powodują opad szczęki.

Jakiś czas temu na Wykopie trafiłem na użytkownika prezentującego takie właśnie prace. Okazał się nim Janusz Jurek – profesjonalny grafik proceduralny. Nawet Photoshop przez jakiś czas miał na splashu jego grafikę. Warto zapoznać się z jego pracami i się zainspirować.

Tutaj sylwetka i więcej info o generative art

A tutaj strona Jurka i portfolio

Darmowy generator wykresów

Quickchart.io to rewelacyjny system łatwego generowania wykresów w czasie rzeczywistym, poprzez zmianę parametrów w nazwie obrazka wykresu.

Rewelacyjnie to działa. Podajesz tytuły, wartości, typ wykresu, kolory, skale – po prostu wszystko. I aby przyspieszyć cały proces – możesz edytować kod wprost pod powyższym linkiem, a potem wkleić na swoją stronę.

Proste, użyteczne, wygodne. Takich narzędzi szukamy. :)

Sprawdzanie poczucia estetyki UI/UX

Zobaczcie cantunsee.space.

Can’t unsee to pseudo-gra, w której musisz oznaczyć bardziej prawidłowy (ze wszechmiar) projekt elementu interfejsu graficznego.

Na początku jest łatwo i prosto, potem następuje kilka błędów, a potem trzeba się dobrze przypatrzyć, żeby oznaczyć ten dobry obrazek. Trudne, czasochłonne, ale uczące i dające dużo satysfakcji. Szczególnie projektantom. Polecam Can’t unsee – nie będzie to czas zmarnowany!

Postarzanie zdjęć przez Javascript

W dzisiejszych czasach możliwości CSS, js, samych przeglądarek i związanych z nimi dodatków – są niemal nieograniczone. Można wykonać wszystko. Kwestia poświęcenia czasu i zaprogramowania rozwiązania… albo: Odnalezienia gotowego rozwiązania w necie. Bowiem większość rzeczy, które chcesz zrobić – zostało już zrobione i wystarczy dotrzeć do takiego rozwiązania.

Tak też było ze zdjęciami, które Klient chciał mieć postarzone, i to w jednym i tym samym stylu. Mogłem zrobić makro w Photoshopie, ale po co, skoro znalazłem VintageJS – skrypt do modyfikacji zdjęć w locie.

Dostępny dla jQ, Angulara i standalone. Mnóstwo fajnych opcji, można się wtopić w zabawę na długie godziny. Możemy edytować jaskrawość, kontrast, winietę, oświetlenie, kolory (nasycenie, nakładanie, parametry rgb), szum, sepię, ramkę (różnego rodzaju). To dużo opcji. Ale są też fajne gotowce, żeby na szybko coś ogarnąć. Polecam, działa świetnie.

Zrób sobie gluta

Mogłoby się wydawać, że stworzenie grafiki z losowym kształtem, który jednak nie jest totalnie losowy, ale jako-tako pasuje do naszej wizji, jest proste.

I może nawet tak jest – po kilku próbach masz spoko losowy kształt…
Ale potrzebujesz takich jeszcze 10. I muszą się różnić od siebie.

Zaczyna być niełatwo, prawda?

Nieprawda. Bo wystarczy odpalić Blobmakera. To mała webappka która tworzy gluty, bloby, i inne losowe kształty.
Możemy sobie ustawić kolor, złożoność i stopień zakrzywiania nibynóżek. ;)
I możemy wynik ściągnąć w svg.

I to jest spoko, niczego więcej nie trzeba. A teraz kliknij powyżej i zrób sobie gluta.

Fontjoy

Aaaaby szybko dopasować fonty na nową stronę, bez żmudnego, wielogodzinnego wyszukiwania i spasowywania, a potem zmieniania, po coś tam nie pasuje.

Wchodzę na fontjoy i klikam Generate. Klikam, klikam, potem ustawiam parametry (między innymi różnorodność czcionek dla tytułu, podtytułu i tekstu) i klikam jeszcze kilka razy. Po chwili mam – idealną parę (lub trójcę) czcionek dla nowej strony. Wszystko oczywiście z nieocenionego Google Fonts. I jest git? Jest git. :)

Podcast dla grafika

Jakiś czas temu zadałem na grupie FB Co znosi psychika grafika pytanie o podcasty dla grafików. Ilość odpowiedzi przerosła moje oczekiwania, zdecydowanie będę miał czego słuchać w drodze do Klientów przez następne 10 lat.

Tyle że jeśli to zostawię na FB, to zgubię. Dlatego przepisuję tutaj.

Uwaga: Poniższe podcasty są nietestowane (ale będą!).
Są jednak polecane przez grafików i projektantów:

Automatyczne kolorowanie zdjęć dzięki AI

Kiedyś już pisałem o kolorowaniu zdjęć specjalnym algorytmem (o tutaj), jednak tym razem to co innego. Tym razem wszystko dzieje się automagicznie, automatycznie, w oparciu o sztuczną inteligencję (a raczej o uczenie maszynowe, bo prawdziwa AI jeszcze nie istnieje).

Chodzi o colorize-it.com – stronę na której można automatycznie pokolorować zdjęcie. Na przykład takie jak zdjęcie wyróżniające tego posta. Efekty może i są niezłe, ale niezadowalające dla odbiorcy, szczególnie przy zdjęciach które zawierają obszary o nieoczywistych kolorach, a do tego te obszary przenikają się między sobą:

Jednak po kilku drobnych korektach w Photoshopie – algorytm może być bardzo pomocny. Aczkolwiek – jak dla mnie jest to nadal raczej ciekawostka.

BTW. ostatnio obiło mi się o uszy że Google Photos ma mieć za niedługo opcję automatycznego kolorowania. Ciekawe jak się sprawdzi – w końcu GP ma potężną próbkę zdjęć do uczenia maszynowego…

Nietypowa inspiracja

Deadline się zbliża. Trzeba zacząć coś robić, coś projektować. Klient jest fajny, chcesz mu zrobić coś z efektem wow (a przynajmniej żeby to on powiedział ‚wow’). Przeglądasz strony konkurencji i templatki z templatemonstera. Wszystkie są ładne, wszystkie ugłaskane, każdy piksel na swoim miejscu, mniam. Tylko że wszystkie… nudne.

A Ty potrzebujesz czegoś nietypowego, czegoś nowego, świeżego powiewu.

Co wtedy?

Wtedy wchodzisz na theuselessweb.com, klikasz różowy przycisk i patrzysz na te dziwadła, i resetujesz mózg. I znowu klikasz, i klikasz, i klikasz. Aż po 37 kliknięciu w różowy przycisk – mówisz „wow”.

Masz pomysł, robisz Klientowi genialną wow-ową stronę, kosisz hajs, profity i szacun na dzielni, dostajesz następne zlecenia. I następne, i następne, coraz większe.

I klikasz, klikasz ten różowy przycisk.

Tak to działa.