Tag: grafika

Depikselowanie awatarów

Algorytmy potrafią robić niesamowite rzeczy.
Narzędzie Face Depixelizer (offlineowe) zgaduje, jaka twarz została zapikselowana. Robi to w bardzo prosty sposób – generuje twarz, zapikselowuje ją i sprawdza czy kolory pikseli pasują do obrazka wejściowego. Jeśli nie – generuje poprawione zdjęcie tak żeby lepiej pasowało. I tak aż nie „zgadnie” twarzy zapikselowanej. Oczywiście jest ona tylko podobna do oryginalnej (btw fajna metoda na tworzenie podobnych osób). Ale działa. Ciekawostka, być może użyteczna.

Łatwy kreator animacji CSS

Wreszcie. Doczekałem się.

Jest dostępny on-line’owy program do animowania. Prawie jak flash, ongiś. Prawie. No dobra, do flasha ongiś brakuje naprawdę dużo, ale zapowiada się bardzo dobrze. Teraz wszystkie moje strony będą się ruszały. :)

Spróbuj: https://keyframes.app/animate/

Deep Image – inteligentne zwiększanie rozdzielczości zdjęć

Deep Image Beta to webaplikacja, umożliwiająca powiększanie rozdzielczości zdjęć z użyciem uczenia maszynowego (które jest nazywane sztuczną inteligencją). Dodatkowo usuwa artefakty JPEG. Usuwania artefaktów nie testowałem, ale powiększanie rozdzielczości naprawdę nieźle działa. Warto znać.

The Bézier Game – bądź mistrzem graficznego pióra!

Kolejna gra dla grafików: Tym razem musimy prowadzić linię po ścieżce, używając narzędzia „pióro” które prowadzi krzywe Beziera. Mamy do dyspozycji ograniczoną ilość punktów kotwiczących. Liczy się precyzja i też myślenie. Gra jest momentami niełatwa. Ale bardzo wciąga. :)

bezier.method.ac

Filtry CSS

Wiedzieliście że CSS umożliwia bardzo szerokie manipulacje za pomocą filtrów? Wszystkie takie jak powyżej w ilustracji, poniżej są w kodzie:

.saturate {-webkit-filter: saturate(3);}
.grayscale {-webkit-filter: grayscale(100%);}
.contrast {-webkit-filter: contrast(160%);}
.brightness {-webkit-filter: brightness(0.25);}
.blur {-webkit-filter: blur(3px);}
.invert {-webkit-filter: invert(100%);}
.sepia {-webkit-filter: sepia(100%);}
.huerotate {-webkit-filter: hue-rotate(180deg);}
.rss.opacity {-webkit-filter: opacity(50%);}

Niby z przedrostkami -webkit, ale działa też w Firefoxie… :)

Tutaj można zobaczyć działający przykład:
https://codepen.io/rss/pen/ftnDd

Gra dla grafików: The boolean game

Prosta gra ćwicząca mózg i rękę. Każdy grafik powinien ją przejść bez trudności. Są to w zasadzie puzzle: Dostajesz figury geometryczne, i kształt do ułożenia. Układasz figury, a potem je łączysz na różne sposoby (sumą, różnicą, maską lub częścią wspólną. Wynik musi być taki jak kształt do ułożenia. Polecam :)

boolean.method.ac

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