Ewolucja projektowania: 13 najgrubszych poradników Photoshopa (wczoraj i dziś)

W 2008 roku, kiedy ten wpis powstawał po raz pierwszy, nauka designu wyglądała zupełnie inaczej. Nie było YouTube’a wypełnionego poradnikami w 4K, nie było Canvy, a termin “Prompt Engineering” brzmiałby jak science-fiction. Były za to blogi takie jak Noupe, Nettuts+ czy Abduzeedo, a my, początkujący graficy, spędzaliśmy noce na mozolnym odtwarzaniu efektów świetlnych i tekstur krok po kroku.

Oryginalna lista “13 Most Advanced Tutorials” to dziś kapsuła czasu. Warto do niej wrócić nie dla technik (które są przestarzałe), ale by zrozumieć, jak ogromną drogę przeszliśmy. Poniższy tekst opiera się na datach z materiałów Adobe, Figmy, Computer History Museum i archiwalnych publikacji, a każdą datę da się sprawdzić pod podanym linkiem.

#Lista 13 tutoriali Photoshopa z Noupe z 2008 roku

Zestawienie opublikował zespół redakcyjny Noupe 26 listopada 2008 roku pod tytułem “Pushing Photoshop To The Limit: 13 Most Advanced Tutorials”. Po ponownym przejrzeniu strony widać rzecz, którą łatwo przeoczyć po latach: lista tylko w części dotyczyła samego Photoshopa. Trzy z trzynastu pozycji uczyły przerabiania pliku PSD na działającą stronę, a kilka łączyło Photoshopa z Flashem, After Effects albo Cinema 4D.

Tytuły zostawiamy w oryginale, bo tak je znajdziesz w archiwum. Ten skład dobrze opisuje rok 2008. Photoshop był centrum pracy, ale wynik rzadko kończył się na pliku graficznym. Szedł do Flasha, do filmu albo do kodu HTML i CSS.

#Jakie efekty były modne w tutorialach Photoshopa w 2008

1. Skeuomorfizm: Wszystko musiało wyglądać jak prawdziwe. Drewno musiało mieć słoje, metal musiał błyszczeć, a przyciski miały tyle cieni (Drop Shadow) i blasków (Inner Glow), że wyglądały jak żelki.
2. Efekty świetlne i typografia 3D: Abstrakcyjne smugi światła, neony, “kosmiczne” tła, litery wyciągnięte w trzeci wymiar. Tutoriale uczyły nas posługiwania się pędzlami (Brushes) i trybami mieszania (Blending Modes) do granic możliwości, a bryłę liter często budowano w Cinema 4D i składano w Photoshopie.
3. Fotomanipulacja: Łączenie kilku zdjęć w jedną scenę. Wtedy oznaczało to godziny maskowania piórem (Pen Tool), dziś część tej pracy wykonuje zaznaczanie oparte na modelach AI.

#Skąd wziął się Photoshop i kto go napisał

Historię najlepiej udokumentowało Computer History Museum, które w 2013 roku udostępniło kod źródłowy Photoshopa 1.0.1. Według muzeum w 1987 roku Thomas Knoll, doktorant zajmujący się widzeniem komputerowym na University of Michigan, napisał program do wyświetlania i modyfikowania obrazów cyfrowych. Jego brat John Knoll, pracujący w Industrial Light & Magic, uznał narzędzie za przydatne do obróbki zdjęć. Program nazywał się wtedy Display.

Latem 1988 roku bracia doszli do wniosku, że może z tego być produkt komercyjny, i zmienili nazwę na Photoshop. Około 200 egzemplarzy wersji 0.87 trafiło do klientów producenta skanerów Barneyscan pod nazwą Barneyscan XP. W kwietniu 1989 roku Adobe sfinalizowało licencję na dystrybucję rozbudowanej wersji, a wersja 1.0 dla komputerów Apple Macintosh trafiła do sklepów 19 lutego 1990 roku, co Adobe podaje we wpisie na 25-lecie programu.

Szczegóły techniczne z tamtego kodu pokazują skalę jednoosobowego projektu. Wersja 1.0.1 to 179 plików i około 128 tysięcy linii, w około 75 procentach w Pascalu i w około 15 procentach w asemblerze 68000. Thomas Knoll mówił muzeum: “W wersji 1 byłem jedynym inżynierem, a przy wersji 2 mieliśmy dwóch” (Thomas Knoll, Computer History Museum, tłumaczenie własne). W rozmowie z Adobe z 2015 roku dodał, że sam wymyślił okno Poziomy (Levels) jako pierwszą dużą funkcję korekcji, a pierwsze wersje celowały głównie w poligrafię i grafików, nie w fotografów (Thomas Knoll, Adobe Blog, tłumaczenie własne).

#Kiedy w Photoshopie pojawiły się warstwy

Warstwy weszły do programu w wersji 3.0 w 1994 roku. Computer History Museum opisuje to jako możliwość podziału obrazu na wiele warstw. Dla tutoriali z listy Noupe ta zmiana była fundamentem: każdy krok w stylu “duplikuj warstwę, ustaw tryb Screen, zmniejsz krycie” zakłada, że obraz składa się z niezależnych plastrów. Przed wersją 3.0 taki tutorial trzeba by pisać zupełnie inaczej, bo każda zmiana od razu nadpisywała piksele.

Z tego samego powodu warstwy są dziś rdzeniem nowych funkcji AI. Adobe opisuje wyniki Generative Fill jako treść tworzoną na osobnych warstwach generatywnych, które można cofnąć bez niszczenia oryginału. Model pracy z 1994 roku przetrwał więc wszystkie późniejsze zmiany interfejsu.

#Od Photoshopa 7 do Creative Suite i Creative Cloud

Numeracja wersji skończyła się na Photoshopie 7. Pod koniec września 2003 roku Adobe zapowiedziało pakiet Creative Suite, łączący nowe wersje Photoshopa, Illustratora, InDesigna i GoLive, a w komunikacie z 27 października 2003 roku, przedrukowanym przez Imaging Resource, ogłosiło wysyłkę pakietu i przedstawiło Photoshop CS jako następcę Photoshopa 7. Od tej pory wersje nosiły nazwy CS, CS2 i kolejne, aż do CS6.

Następna zmiana dotyczyła modelu sprzedaży. 6 maja 2013 roku, na konferencji MAX, Adobe ogłosiło w komunikacie “Adobe Accelerates Shift to the Cloud”, że nie planuje kolejnych wydań Creative Suite, a rozwój oprogramowania kreatywnego skupi na Creative Cloud. Firma zapowiedziała dalsze wsparcie dla CS6. Według serwisu MacTrast, który relacjonował ogłoszenie tego samego dnia, nowe wersje oznaczone jako CC, dostępne wyłącznie w subskrypcji, miały trafić do użytkowników w czerwcu 2013 roku.

Dla osób uczących się z tutoriali ta zmiana miała praktyczny skutek. Poradnik z 2008 roku zakładał konkretną wersję (Flash CS3 wprost w tytule pozycji nr 5). Po przejściu na subskrypcję wszyscy użytkownicy dostawali aktualizacje w tym samym rytmie, więc tutoriale przestały podawać numer wersji jako warunek, a zaczęły odwoływać się do bieżącego stanu programu.

#Gdzie uczono się Photoshopa przed erą YouTube

Płatna nauka oprogramowania graficznego istniała długo przed blogami. Lynda.com założyli w 1995 roku Lynda Weinman i Bruce Heavin. 9 kwietnia 2015 roku LinkedIn ogłosił przejęcie serwisu za około 1,5 miliarda dolarów, co relacjonował PCWorld. Kursy wideo z ustrukturyzowanym programem były więc osobnym rynkiem, równoległym do darmowych wpisów blogowych.

YouTube wystartował w 2005 roku, a pierwszy film, “Me at the zoo”, wgrano 23 kwietnia 2005 roku. W 2008 roku wideo już istniało, ale tekstowy tutorial ze zrzutami ekranu wciąż dominował w zestawieniach takich jak lista Noupe. Wszystkie trzynaście pozycji to artykuły na blogach.

Najbardziej znanym przykładem tej fali jest sieć Tuts+ australijskiej firmy Envato. Według materiałów z serii “10 Years of Envato Tuts+” pierwszy tutorial ukazał się 14 września 2007 roku, a napisał go współzałożyciel Envato Collis Ta’eed. Z serwisu o Photoshopie (Psdtuts+) wyrosła sieć blogów tematycznych, w tym Nettuts+, z którego pochodzą dwie pozycje z listy. W 2014 roku Envato połączyło wszystkie te serwisy w jeden Envato Tuts+.

#Co stało się z tutorialami o Flashu

Trzy pozycje z listy Noupe (nr 4, 5 i 10) dotyczyły Flasha albo przenoszenia plików z Photoshopa do animacji. Tej ścieżki nie da się dziś powtórzyć w przeglądarce. Adobe w lipcu 2017 roku zapowiedziało koniec Flash Playera, przestało go wspierać 31 grudnia 2020 roku, a od 12 stycznia 2021 roku blokuje uruchamianie treści Flash w odtwarzaczu i zaleca jego natychmiastowe odinstalowanie (Adobe, Flash Player EOL).

To dobry przykład, dlaczego stare tutoriale warto czytać selektywnie. Część o przygotowaniu grafiki w Photoshopie (warstwy, maski, eksport) dalej ma sens. Część o osadzaniu efektu na stronie opisuje platformę, która przestała istnieć. Animacje, które w 2008 roku robiło się we Flashu, dziś buduje się w CSS, SVG albo JavaScripcie.

#Jak wyglądała zamiana PSD na HTML w 2008

Trzy ostatnie pozycje z listy Noupe opisują proces, który w 2008 roku był standardem pracy przy stronach internetowych. Grafik rysował całą stronę w Photoshopie jako jeden plik PSD z warstwami. Koder ciął go na fragmenty, eksportował tła i przyciski jako osobne obrazki, a potem odtwarzał układ w XHTML i CSS. Tutoriale z Nettuts+ i CSS-Tricks uczyły dokładnie tej sekwencji: od makiety do kodu, krok po kroku.

Ten model miał wbudowany problem. Plik PSD był obrazem jednego stanu strony, w jednej szerokości. Nie opisywał zachowania na telefonie, stanu najechania kursorem ani tego, co się dzieje, gdy tekst jest dłuższy. Przekazanie projektu do kodu oznaczało ręczne mierzenie odstępów i kolorów w Photoshopie. Właśnie ten etap przejęły później narzędzia projektowe działające w przeglądarce.

#Jak Figma zastąpiła Photoshopa w projektowaniu interfejsów

Figmę założyli w 2012 roku Dylan Field i Evan Wallace. Adobe, w komunikacie o planowanym przejęciu, opisało ją jako narzędzie “urodzone w sieci”, które jako pierwsze przeniosło projektowanie produktów do przeglądarki (Adobe, 15 września 2022, tłumaczenie własne). Darmowy podgląd na zaproszenia ruszył w grudniu 2015 roku, co odnotował wtedy m.in. serwis TechCabal. Pod koniec września 2016 roku, jak podał wtedy niemiecki serwis t3n, Figma wyszła z fazy beta i udostępniła pierwszą publiczną wersję, darmową do końca 2016 roku.

Różnica wobec procesu z PSD była zasadnicza. Projekt żył w przeglądarce, kilka osób mogło pracować na nim jednocześnie, a programista otwierał ten sam plik i odczytywał wymiary, kolory i style bez cięcia obrazków. Komponenty i biblioteki zastąpiły powielanie grup warstw między plikami.

15 września 2022 roku Adobe ogłosiło zamiar przejęcia Figmy za około 20 miliardów dolarów, mniej więcej po połowie w gotówce i w akcjach. Transakcja nie doszła do skutku. 18 grudnia 2023 roku obie firmy ogłosiły wspólne odstąpienie od umowy. Podały, że nie widzą jasnej drogi do uzyskania zgód Komisji Europejskiej i brytyjskiego urzędu ochrony konkurencji (CMA), a Adobe zapłaciło Figmie uzgodnioną wcześniej opłatę za odstąpienie. Dylan Field napisał na blogu Figmy: “nie widzimy już drogi do zgody regulatorów na tę transakcję” (Dylan Field, Figma Blog, tłumaczenie własne). Figma pozostała niezależną firmą, a 31 lipca 2025 roku jej pierwszy inwestor, Index Ventures, opisał jej debiut giełdowy.

#Jakie narzędzia AI w Photoshopie zastąpiły ręczną pracę

Patrząc na tamte tutoriale, uderza jedno: rzemiosło. Wymagały one manualnej precyzji. Dziś narzędzia Adobe (Firefly, Neural Filters) wykonują “czarną robotę” za nas.

• Zamiast Pen Tool: Mamy “Select Subject” (Zaznacz temat) działające na bazie AI.
• Zamiast ręcznego cieniowania: Generative Fill dorabia cienie zgodne z oświetleniem sceny.
• Zamiast szukania tekstur: Tekstury generujemy promptem.

#Kiedy Generative Fill trafił do Photoshopa

Adobe zapowiedziało Generative Fill 23 maja 2023 roku. Według komunikatu Adobe funkcja pozwala dodawać, rozszerzać i usuwać fragmenty obrazu poleceniem tekstowym, a wynik powstaje na osobnych warstwach generatywnych, które można cofnąć. W dniu zapowiedzi była dostępna w aplikacji Photoshop beta oraz jako moduł w Firefly beta, z ogólną dostępnością zapowiedzianą na drugą połowę 2023 roku. Adobe podało też, że model Firefly trenowano m.in. na licencjonowanych zasobach Adobe Stock.

Wersja produkcyjna przyszła 13 września 2023 roku. Terry White z Adobe opisał wtedy, że Generative Fill i Generative Expand działają w wydaniu standardowym Photoshopa, bez wersji beta, i są dopuszczone do użytku komercyjnego (Terry White). Od zapowiedzi do wydania produkcyjnego minęło niecałe cztery miesiące.

Umiejętności, których uczyły tutoriale z 2008 roku (rozumienie światła, maski, porządek warstw), decydują dziś o tym, czy wynik Generative Fill da się poprawić i włączyć do projektu, czy trzeba go odrzucić. Generatywna warstwa jest zwykłą warstwą: można ją maskować, przesuwać i łączyć z innymi tak samo jak w 1994 roku.

#Oś czasu: od programu Display do Generative Fill

#Czy warto wracać do starych poradników Photoshopa

Mimo rewolucji AI, uważam, że przerobienie chociaż jednego “oldskulowego” tutoriala to świetne ćwiczenie. Uczy pokory wobec warstw i zrozumienia, jak światło buduje bryłę.

Link do oryginalnego zestawienia wciąż działa, ale potraktujcie go jako muzeum. Dziś design jest czystszy (Flat/Material), bardziej funkcjonalny i… szybszy. Ale czy ma ten sam “duszę”, co ręcznie “wydłubana” grafika z 2008 roku? To już oceńcie sami.

Retro tutoriale uczą cierpliwości, ale strona, na której lądują dzisiejsze projekty, musi być szybka i czytelna na telefonie. Gdy przenosisz taki dorobek do sieci, zajmiemy się stroną od strony technicznej.

Po stronie wdrożenia ten temat trzymamy pod programistę WooCommerce.