✅ Kolorowa siatka Efekt wyświetlania zdjęć w Photoshopie

Jak stworzyć efekt fotograficzny Color Grid Photo

W tym samouczku dotyczącym efektów fotograficznych nauczymy się, jak wyświetlać zdjęcie w siatce kwadratów o losowych kolorach! Użyjemy wbudowanej funkcji siatki programu Photoshop jako przewodnika przy ustawianiu początkowych odstępów, a następnie zamienimy ją w siatkę opartą na pikselach, używając kilku rzadko używanych narzędzi zaznaczania Photoshopa. Zobaczymy, jak łatwo wybierać różne kwadraty w siatce za pomocą narzędzia Magiczna różdżka, jak pokolorować je za pomocą warstw dopasowania i trybów mieszania, a także, jak dopasować wygląd samej siatki za pomocą stylów warstw!

Ta wersja samouczka została zaktualizowana do programu Photoshop CS6 i jest również w pełni kompatybilna z programem Photoshop CC (Creative Cloud). W przypadku wersji CS5 i wcześniejszych warto zapoznać się z naszym oryginalnym samouczkiem Color Grid Design.

Oto zdjęcie, z którym będę pracować (zdjęcie kobiety z zimową odzieżą z Shutterstock):

Oryginalny obraz.

Oto, jak będzie wyglądał projekt siatki kolorów, gdy skończymy. Oczywiście możesz użyć dowolnego koloru dla swojego efektu. To tylko przykład:

Efekt końcowy.

Jak stworzyć efekt fotograficzny Color Grid Photo

Krok 1: Utwórz nowy dokument programu Photoshop

Zacznijmy od utworzenia nowego dokumentu dla siatki. Przejdź do menu Plik na pasku menu u góry ekranu i wybierz Nowy :

Przejście do Plik> Nowy.

Otworzy się nowe okno dialogowe Photoshopa. Ten efekt najlepiej działa z dokumentem w kształcie kwadratu, dlatego w tym samouczku ustawię zarówno moją szerokość, jak i wysokość na 1000 pikseli . Oczywiście, możesz śmiało zastąpić moje wartości dowolnymi potrzebnymi wymiarami, ale znowu będziesz potrzebować kwadratowego dokumentu dla najlepszych rezultatów. Nie planuję tego wydrukować (będzie to wyłącznie przeglądanie na ekranie), więc nie musisz się martwić wartością Rozdzielczości (pozostawię domyślną wartość 72 pikseli / cal), ale jeśli jesteś tworząc ten efekt do druku, najprawdopodobniej zechcesz utworzyć dokument większy niż 1000 x 1000 pikseli i ustaw rozdzielczość na około 240 pikseli / cal lub więcej. Kliknij OK po zakończeniu, aby zamknąć okno dialogowe. Nowy dokument pojawi się na ekranie:

Tworzenie nowego dokumentu Photoshopa za pomocą okna dialogowego Nowy.

Krok 2: Włącz siatkę programu Photoshop

Następnie włączymy wbudowaną siatkę Photoshopa, abyśmy mogli użyć jej jako przewodnika do tworzenia naszej siatki opartej na pikselach. Aby włączyć siatkę, przejdź do menu Widok u góry ekranu, wybierz Pokaż, a następnie Siatka :

Idź do Widok> Pokaż> Siatka.

Siatka pojawi się jako nakładka na dokumencie. Następnie wprowadzimy kilka zmian w wyglądzie siatki:

Dokument po włączeniu siatki programu Photoshop.

Krok 3: Dostosuj liczbę linii siatki

Możemy dostosować liczbę linii i sekcji w siatce za pomocą Preferencji Photoshopa. Jeśli używasz Photoshopa na komputerze z systemem Windows, przejdź do menu Edycja u góry ekranu, wybierz Preferencje, a następnie Przewodniki, Siatkę i Plasterki . Na komputerze Mac przejdź do menu Photoshop, wybierz Preferencje, a następnie Przewodniki, tabelę i plasterki :

Wybieranie preferencji prowadnic, siatki i plasterków.

Otworzy się okno dialogowe Preferencje ustawione w preferencjach Prowadnice, Siatka i Plasterki. W sekcji Siatka zmień opcję Linia siatki co na 10 procent, co da nam siatkę 10x10, i zmień wartość poddziałów na 1, aby zapobiec podziałowi siatki na mniejsze sekcje. Miej oko na siatkę w dokumencie, a zobaczysz podgląd zmian podczas ich wprowadzania:

Ustawienie linii siatki co 10 procent i podziałów na 1.

Po zakończeniu kliknij przycisk OK, aby zamknąć okno dialogowe Preferencje. Powinieneś teraz zobaczyć siatkę o szerokości 10 sekcji i 10 sekcji wysokości. Należy zauważyć, że ta siatka nie jest tak naprawdę częścią dokumentu. Jest to po prostu wizualny przewodnik, którego użyjemy, aby pomóc nam stworzyć własną siatkę opartą na pikselach, co zrobimy za chwilę:

Siatka po zmianie opcji w Preferencjach.

Krok 4: Dodaj nową pustą warstwę i nadaj jej nazwę „Siatka”

Dodajmy nową pustą warstwę, aby utrzymać siatkę opartą na pikselach, którą zamierzamy utworzyć. Naciśnij i przytrzymaj klawisz Alt (Win) / Option (Mac) na klawiaturze, a następnie kliknij ikonę Nowa warstwa u dołu panelu Warstwy:

Kliknięcie ikony Nowa warstwa, przytrzymując Alt (Win) / Option (Mac).

Spowoduje to otwarcie okna dialogowego Nowa warstwa, dając nam szansę nazwania nowej warstwy przed jej dodaniem. Nazwij warstwę „Siatka”, a następnie kliknij OK, aby zamknąć okno dialogowe:

Nazywanie nowej warstwy.

W samym dokumencie nic się nie wydarzy, ale w panelu Warstwy widzimy, że Photoshop dodał nową warstwę „Siatka” nad warstwą tła:

Warstwa siatki pojawi się w panelu Warstwy.

Krok 5: Wybierz narzędzie Namiot jednorzędowy

Aby utworzyć naszą siatkę, użyjemy dwóch bardzo podstawowych i rzadko używanych narzędzi zaznaczania Photoshopa - narzędzia Markiza jednorzędowa i Narzędzie markizy jednokolumnowe. Zaczniemy od narzędzia Namiot jednorzędowy. Domyślnie oba te narzędzia są zagnieżdżone za prostokątnym narzędziem markizy, więc kliknij i przytrzymaj prostokątne narzędzie markizy u góry panelu narzędzi, aż pojawi się wysuwane menu pokazujące inne narzędzia dostępne w tym samym miejscu, a następnie wybierz z menu narzędzie Jednorzędowe markizy :

Kliknij i przytrzymaj prostokątne narzędzie markizy, a następnie wybierz narzędzie Namiot jednorzędowy.

Krok 6: Kliknij każdą poziomą linię siatki

Jak sama nazwa wskazuje, narzędzie Zaznaczanie pojedynczego wiersza wybierze pojedynczy poziomy wiersz pikseli w dokumencie. To wszystko, to wszystko, co robi. Aby z niego skorzystać, wystarczy kliknąć w dowolnym miejscu dokumentu, a Photoshop automatycznie wybierze piksel, który kliknęliśmy, oraz każdy inny piksel w tym rzędzie od lewej do prawej. Użyjemy tego narzędzia do przekształcenia poziomych linii siatki w serię konturów zaznaczenia. Najpierw przesuń kursor bezpośrednio nad górną poziomą linię siatki, a następnie kliknij myszą. Zobaczysz zarys wyboru grubości 1 piksela wzdłuż linii siatki. Okrążyłem miejsce, w którym kliknąłem, ale kliknięcie dowolnego miejsca na linii da dokładnie ten sam wynik. Jeśli zauważysz, że kliknięcie nie było bezpośrednio nad linią siatki, po prostu naciśnij Ctrl + Z (Win) / Command + Z (Mac) na klawiaturze, aby cofnąć i spróbować ponownie:

Kliknij dowolne miejsce na pierwszej poziomej linii siatki u góry, aby zaznaczyć cały rząd pikseli.

Następnie dodamy resztę poziomych linii siatki do naszego wyboru. Naciśnij i przytrzymaj klawisz Shift na klawiaturze i kliknij następną linię siatki poniżej. Spowoduje to wybranie drugiego poziomego rzędu pikseli, a ponieważ przytrzymaliśmy wciśnięty klawisz Shift, Photoshop doda ten drugi wybór do pierwszego. Kontynuuj przytrzymanie klawisza Shift, klikając pozostałe poziome linie siatki, aż na każdym z nich pojawi się kontur wyboru. Po zakończeniu powinieneś zobaczyć łącznie dziewięć wierszy wyboru. Pamiętaj, aby przytrzymać klawisz Shift podczas klikania każdego z nich, w przeciwnym razie po prostu zastąpisz poprzedni wybór nowym:

Naciśnij i przytrzymaj klawisz Shift, a następnie kliknij każdą poziomą linię siatki, aby dodać ją do zaznaczenia.

Krok 7: Przejdź do narzędzia Markiza jednokolumnowa

Musimy zrobić to samo teraz z pionowymi liniami siatki, co oznacza, że musimy przejść do narzędzia Markiza jednokolumnowa. Kliknij i przytrzymaj narzędzie Markiza jednorzędowa w panelu Narzędzia (pojawi się tam, gdzie wcześniej pojawiła się ikona Narzędzia markizy prostokątnej), aż pojawi się menu rozwijane, a następnie wybierz z menu narzędzie Markiza pojedynczej kolumny :

Kliknij i przytrzymaj narzędzie Markiza jednorzędowa, a następnie wybierz narzędzie Markiza jednokolumnowa.

Krok 8: Kliknij każdą pionową linię siatki

Narzędzie Markiza z pojedynczą kolumną działa tak samo, jak Narzędzie Markiza z pojedynczą kolumną, z tą różnicą, że wybiera kolumny pikseli (od góry do dołu), a nie wiersze, przy czym każda kolumna ma szerokość 1 piksela. Naciśnij i przytrzymaj klawisz Shift i kliknij każdą z pionowych linii siatki od lewej do prawej, aż wszystkie zostaną zaznaczone. Po zakończeniu powinieneś zobaczyć kontury zaznaczenia wzdłuż każdej linii siatki, zarówno poziomej, jak i pionowej:

Wszystkie poziome i pionowe linie siatki zostały dodane do zaznaczenia.

Krok 9: Wypełnij zaznaczenie kolorem czarnym

Stworzymy naszą siatkę, wypełniając zaznaczenia poziome i pionowe kolorem czarnym. Przejdź do menu Edycja u góry ekranu i wybierz Wypełnij :

Przejście do Edycja> Wypełnij.

Spowoduje to otwarcie okna dialogowego Wypełnienie programu Photoshop. Ustaw opcję Użyj u góry na Czarny, a następnie kliknij OK:

Ustawienie opcji Użyj na Czarny.

Photoshop wypełnia zaznaczenie kolorem czarnym, chociaż może to być trudne do zobaczenia z konturami zaznaczenia i własną siatką programu Photoshop. Aby usunąć kontury zaznaczenia (ponieważ już ich nie potrzebujemy), przejdź do menu Wybierz u góry ekranu i wybierz Odznacz :

Przejście do Wybierz> Odznacz.

Następnie, aby wyłączyć siatkę programu Photoshop, przejdź do menu Widok, wybierz opcję Pokaż, a następnie ponownie wybierz opcję Siatka . Znacznik wyboru po lewej stronie słowa Siatka oznacza, że jest on aktualnie włączony. Ponowne wybranie spowoduje usunięcie znacznika wyboru i wyłączenie siatki:

Idź do Widok> Pokaż> Siatka.

Po usunięciu konturów zaznaczenia i siatki programu Photoshop możemy zobaczyć naszą czarną siatkę w dokumencie:

Dokument przedstawiający nowo utworzoną siatkę.

Krok 10: Otwórz zdjęcie, które chcesz wyświetlić w siatce

Otwórz zdjęcie, które będziesz wyświetlać w siatce. Zdjęcie otworzy się we własnym dokumencie z kartami. Oto zdjęcie, którego używam:

Twoje zdjęcie otworzy się w osobnym dokumencie z zakładkami.

Krok 11: Wybierz i skopiuj zdjęcie

W tej chwili nasza siatka znajduje się w jednym dokumencie, a nasze zdjęcie w innym. Musimy przenieść zdjęcie do tego samego dokumentu co siatka. Aby to zrobić, najpierw wybierz zdjęcie, przechodząc do menu Wybierz u góry ekranu i wybierając Wszystkie :

Przechodzę do Wybierz> Wszystkie.

Wokół krawędzi zdjęcia pojawi się kontur wyboru. Następnie przejdź do menu Edycja u góry ekranu i wybierz Kopiuj :

Przejście do Edycja> Kopiuj.

Krok 12: Przejdź do dokumentu siatki

Przełącz się do dokumentu siatki, klikając jego kartę tuż pod paskiem opcji u góry. W moim przypadku dokument nosi nazwę „Untitled-1”:

Przełączanie z dokumentu zdjęcia na dokument siatki.

Krok 13: Wybierz warstwę tła

Po otwarciu dokumentu siatki kliknij warstwę tła w panelu Warstwy, aby ją wybrać. W ten sposób, kiedy wklejamy zdjęcie do dokumentu, Photoshop umieści je na nowej warstwie bezpośrednio między warstwą tła a warstwą siatki:

Wybieranie warstwy tła.

Krok 14: Wklej zdjęcie

Przejdź do menu Edycja, wybierz Wklej specjalnie, a następnie Wklej w miejscu :

Przejście do Edycja> Wklej specjalnie> Wklej na miejscu.

Photoshop wkleja i wyśrodkowuje zdjęcie w dokumencie siatki. W moim przypadku (i najprawdopodobniej również twoim) rozmiar zdjęcia będzie musiał zostać zmieniony, ale naprawimy to następnie:

Zdjęcie zostało wklejone do siatki.

Jeśli spojrzymy na panel Warstwy, zobaczymy, że Photoshop dodał zdjęcie na własnej warstwie między warstwami Tła i Siatki, tak jak planowaliśmy:

Zdjęcie pojawi się między warstwami tła i siatki.

Niestety, Photoshop nadał nowej warstwie ogólną nazwę („Warstwa 1”), więc zanim przejdziemy dalej, zmieńmy jej nazwę. Kliknij dwukrotnie jego nazwę, aby ją podświetlić, a następnie wpisz „Zdjęcie” jako nową nazwę. Po zakończeniu naciśnij klawisz Enter (Win) / Return (Mac), aby zaakceptować zmianę nazwy:

Nazwę warstwy zmieniono z „Layer 1” na „Photo”.

Krok 15: Przekształć warstwę fotograficzną w inteligentny obiekt

Za chwilę zmienimy rozmiar zdjęcia, aby lepiej pasowało do siatki, ale zanim to zrobimy, szybko przekonwertujmy jego warstwę na obiekt inteligentny . W ten sposób, jeśli zdecydujemy się później zmienić jego rozmiar, nie stracimy żadnej jakości obrazu zdjęcia. Po wybraniu warstwy Zdjęcie kliknij ikonę małego menu w prawym górnym rogu panelu Warstwy:

Kliknięcie ikony menu.

Wybierz Konwertuj na inteligentny obiekt z wyświetlonego menu:

Wybierz „Konwertuj na inteligentny obiekt” z menu panelu Warstwy.

Wydaje się, że nic się nie wydarzyło w dokumencie, ale w prawym dolnym rogu miniatury podglądu warstwy w panelu Warstwy pojawia się mała ikona Inteligentnego obiektu . To mówi nam, że warstwa jest teraz obiektem inteligentnym:

Miniatura podglądu warstwy pokazująca ikonę Smart Object.

Krok 16: Zmień rozmiar zdjęcia za pomocą bezpłatnej transformacji

Aby zmienić rozmiar zdjęcia, użyjemy polecenia Free Transform programu Photoshop. Przejdź do menu Edycja u góry ekranu i wybierz Free Transform :

Przejście do Edycja> Darmowa transformacja.

Spowoduje to umieszczenie obwiedni swobodnej transformacji i uchwytów wokół obrazu. Jeśli nie widzisz uchwytów, ponieważ krawędzie zdjęcia wystają poza obszar widoczny w dokumencie, przejdź do menu Widok i wybierz Dopasuj na ekranie :

Idź do Widok> Dopasuj na ekranie.

Program Photoshop natychmiast powiększy obraz wystarczająco daleko, aby wszystko, w tym uchwyty swobodnej transformacji, mieściło się w widocznym obszarze dokumentu. Aby zmienić rozmiar zdjęcia, naciśnij i przytrzymaj klawisz Shift, a następnie kliknij jeden z czterech narożnych uchwytów i przeciągnij je. Przytrzymanie klawisza Shift podczas przeciągania spowoduje zachowanie oryginalnego współczynnika proporcji obrazu, aby przypadkowo nie zniekształcić jego wyglądu. Jeśli chcesz zmienić rozmiar zdjęcia ze środka, a nie z rogu, naciśnij i przytrzymaj Shift + Alt (Win) / Shift + Option (Mac) podczas przeciągania dowolnego z uchwytów narożnych. Jeśli chcesz przenieść obraz wewnątrz dokumentu, kliknij dowolne miejsce w obwiedni Swobodna transformacja i przeciągnij go na miejsce. Po zakończeniu naciśnij klawisz Enter (Win) / Return (Mac), aby zaakceptować transformację i wyjść z polecenia Free Transform:

Przeciągnięcie uchwytu narożnego w celu zmiany rozmiaru obrazu wewnątrz siatki.

Jeśli pomniejszyłeś obraz przed chwilą za pomocą polecenia Dopasuj do ekranu i chcesz teraz powiększyć obraz po zakończeniu zmiany rozmiaru obrazu, wróć do menu Widok i wybierz 100% :

Przejdę do widoku> 100%.

Powiązana lektura: Powiększanie i przesuwanie w Photoshopie

Krok 17: Wybierz warstwę siatki

W tym momencie ciężka praca jest wykonywana. Stworzyliśmy naszą siatkę, skopiowaliśmy i wkleiliśmy nasze zdjęcie do dokumentu siatki, a także zmieniliśmy rozmiar i przenieśliśmy zdjęcie na miejsce. Jesteśmy gotowi na zabawę w kolorowaniu siatki! Najpierw kliknij warstwę Siatka w panelu Warstwy, aby ją wybrać:

Wybieranie warstwy siatki.

Krok 18: Wybierz narzędzie Magiczna różdżka

Aby pokolorować siatkę, potrzebujemy sposobu na wybranie poszczególnych kwadratów, i możemy to łatwo zrobić za pomocą narzędzia Magic Wand Tool programu Photoshop. Domyślnie narzędzie Magiczna różdżka jest zagnieżdżone za narzędziem Szybkie zaznaczanie w panelu Narzędzia, dlatego kliknij i przytrzymaj narzędzie Szybkie zaznaczanie, aż pojawi się menu rozwijane, a następnie wybierz Narzędzie Różdżka z menu:

Kliknij i przytrzymaj narzędzie szybkiego wyboru, a następnie wybierz narzędzie Różdżka.

Krok 19: Wybierz kwadraty krawędzi zewnętrznej

Aby wybrać kwadrat w siatce, upewnij się, że masz zaznaczoną warstwę Siatki w panelu Warstwy (bardzo ważne!), A następnie po prostu kliknij wewnątrz kwadratu za pomocą narzędzia Magiczna różdżka. Zarys wyboru pojawi się wokół zewnętrznych krawędzi kwadratu. Aby następnie dodać dodatkowe kwadraty do zaznaczenia, naciśnij i przytrzymaj klawisz Shift i kliknij wewnątrz kolejnych kwadratów. Wybierz każdy nowy kwadrat, który klikniesz w środku, a wybór zostanie dodany do wcześniej wybranych kwadratów. Zacznijmy od zaznaczenia wszystkich kwadratów wokół zewnętrznej krawędzi siatki. Najpierw kliknij wewnątrz kwadratu w lewym górnym rogu siatki. Wokół niego pojawi się zarys wyboru. Aby łatwiej zobaczyć, który kwadrat wybrałem, pokolorowałem go na żółto na zrzucie ekranu. To nie jest częścią efektu; tylko po to, aby łatwiej zobaczyć, który kwadrat jest wybrany:

Kwadrat w lewym górnym rogu siatki jest zaznaczony.

Następnie naciśnij i przytrzymaj klawisz Shift i kontynuuj klikanie za pomocą narzędzia Magiczna różdżka wewnątrz każdego kwadratu wokół zewnętrznych krawędzi siatki, aby dodać je wszystkie do zaznaczenia. Ponownie pokolorowałem tutaj wybrane kwadraty na żółto, aby ułatwić widzenie na zrzucie ekranu. Żółty nie jest częścią rzeczywistego efektu, więc nie martw się, że nie widać go w dokumencie:

Wszystkie kwadraty wokół zewnętrznych krawędzi siatki są teraz zaznaczone.

Dodam jeszcze kilka kwadratów do mojego wyboru, ponownie naciskając i przytrzymując klawisz Shift oraz klikając wewnątrz nich, aby dodać je do wcześniej wybranych kwadratów:

Moje początkowo wybrane kwadraty.

Krok 20: Dodaj nową warstwę poniżej warstwy siatki

Wypełnimy te początkowe kwadraty kolorem białym, który utworzy ramkę dla efektu. Naciśnij i przytrzymaj Ctrl + Alt (Win) / Command + Option (Mac) na klawiaturze i kliknij ikonę Nowa warstwa u dołu panelu Warstwy:

Kliknięcie ikony Nowa warstwa, trzymając wciśnięty klawisz Ctrl (Win) / Command (Mac).

To wyskakuje, otwierając okno dialogowe Nowa warstwa. Nazwij tę nową warstwę „Białą”, a następnie kliknij OK:

Nazywanie nowej warstwy „Białym”.

Photoshop dodaje nową pustą warstwę o nazwie „Biała” pomiędzy warstwami Siatka i Zdjęcie:

Panel Warstwy pokazujący nową białą warstwę.

Krok 21: Wypełnij zaznaczenie kolorem białym

Przejdź do menu Edycja u góry ekranu i ponownie wybierz polecenie Wypełnij . Tym razem, gdy pojawi się okno dialogowe Wypełnij, zmień opcję Użyj na Biały, a następnie kliknij OK:

Ustawienie opcji Użyj na Biały.

Photoshop wypełnia wybrane kwadraty kolorem białym. Aby usunąć kontur zaznaczenia wokół kwadratów, przejdź do menu Wybierz i wybierz Odznacz lub po prostu naciśnij Ctrl + D (Win) / Command + D (Mac) na klawiaturze:

Wokół obrazu pojawi się ramka białych kwadratów.

Krok 22: Ponownie wybierz warstwę siatki

Wybierzmy kilka różnych kwadratów do pokolorowania. Najpierw musimy mieć aktywną warstwę Siatki w panelu Warstwy, więc kliknij ją, aby ją wybrać. Pamiętaj, że zawsze musisz wybrać warstwę Siatki, zanim będziesz mógł wybrać kwadraty:

Upewnij się, że wybierasz warstwę siatki przed próbą wybrania jakichkolwiek kwadratów.

Krok 23: Wybierz różne kwadraty

Gdy warstwa siatki jest ponownie aktywna, naciśnij i przytrzymaj klawisz Shift, a następnie klikaj wewnątrz innych losowych kwadratów za pomocą narzędzia Różdżka, aby je wybrać. Jeśli zmienisz zdanie i chcesz usunąć kwadrat z zaznaczenia, zwolnij klawisz Shift i naciśnij i przytrzymaj klawisz Alt (Win) / Option (Mac), a następnie kliknij wewnątrz kwadratu, aby go odznaczyć. Tutaj wybrałem jeszcze kilka kwadratów (i pokolorowałem je na żółto, abyśmy mogli zobaczyć, które wybrałem):

Naciśnij i przytrzymaj klawisz Shift i kliknij wewnątrz kilku różnych kwadratów, aby je wybrać.

Krok 24: Wybierz warstwę zdjęć

Po zaznaczeniu kwadratów kliknij warstwę zdjęć (obiekt inteligentny) w panelu Warstwy, aby ją wybrać:

Wybieranie warstwy zdjęć.

Krok 25: Pokoloruj kwadraty warstwą odcienia / dopasowania

Pokolorujemy te kwadraty za pomocą warstwy dopasowania Barwa / Nasycenie. Kliknij ikonę Nowa warstwa dopasowania u dołu panelu Warstwy:

Kliknięcie ikony Nowa warstwa dopasowania.

Wybierz Barwa / Nasycenie z wyświetlonej listy:

Wybór warstwy dopasowania Barwa / Nasycenie.

Elementy sterujące i opcje warstwy dopasowania Barwa / Nasycenie pojawią się w panelu Właściwości programu Photoshop. Najpierw wybierz opcję Koloruj, klikając wewnątrz jej pola wyboru. Następnie wybierz kolor, za pomocą którego chcesz pokolorować wybrane kwadraty, przeciągając suwak Barwa . W przypadku tych kwadratów faktycznie opuszczę suwak Odcień do końca w lewo (jego domyślna pozycja), co daje mi kolor czerwony . Oczywiście możesz wybrać dowolny kolor. Po wybraniu koloru za pomocą suwaka Barwa można dostosować jego nasycenie do własnych upodobań, przeciągając suwak Nasycenie w lewo lub w prawo. W moim czerwonym kolorze ustawię wartość nasycenia na około 50 . Miej oko na swój dokument, przeciągając suwaki, aby wyświetlić podgląd wyników:

Kliknij opcję Koloruj, a następnie wybierz kolor za pomocą suwaków Barwa i Nasycenie.

Krok 26: Zmień tryb mieszania warstwy dopasowania na Kolor

Jeśli spojrzymy na panel Warstwy, zobaczymy warstwę dopasowania siedzącą bezpośrednio nad warstwą Zdjęcie. Upewnij się, że jest zaznaczony (podświetlony na niebiesko), a następnie przejdź do opcji Tryb mieszania u góry panelu Warstwy i zmień tryb mieszania z Normalny (tryb domyślny) na Kolor . To pozwala nam zmieniać tylko kolory na obrazie, a nie wartości jasności:

Zmiana trybu mieszania warstwy dopasowania na Kolor.

Oto mój dokument po pokolorowaniu kwadratów na czerwono:

Pierwszy z pokolorowanych kwadratów.

Krok 27: Zmień nazwę warstwy dopasowania

Ponieważ do pokolorowania siatki będziemy używać wielu warstw dopasowania Barwa / Nasycenie, sprawdźmy, która z nich jest używana dla którego koloru, zmieniając ich nazwę. Ponieważ użyłem tej pierwszej warstwy Barwa / Nasycenie dla koloru czerwonego, dwukrotnie kliknę jej nazwę w panelu Warstwy i zmienię jej nazwę z ogólnego „Barwa / Nasycenie 1” na „Czerwony”. Naciśnij klawisz Enter (Win) / Return (Mac) na klawiaturze, aby zaakceptować zmianę nazwy:

Zmiana nazwy warstwy dopasowania Barwa / Nasycenie na podstawie koloru.

Krok 28: Wybierz i pokoloruj więcej kwadratów

Powtórz kroki 22–27, aby wybrać i pokolorować więcej kwadratów. Najpierw wybierz warstwę Siatka w panelu Warstwy, a następnie naciśnij i przytrzymaj klawisz Shift, a następnie kliknij wewnątrz kilku kwadratów za pomocą narzędzia Magiczna różdżka, aby je zaznaczyć. Kliknij warstwę Zdjęcie w panelu Warstwy, aby ją wybrać, a następnie kliknij ikonę Nowa warstwa dopasowania i wybierz Barwa / Nasycenie . W panelu Właściwości zaznacz opcję Koloruj, a następnie wybierz kolor za pomocą suwaka Barwa i poziom nasycenia za pomocą suwaka Nasycenie . Zmień tryb mieszania nowej warstwy dopasowania na Kolor, a następnie zmień nazwę warstwy dopasowania na podstawie wybranego koloru.

Możesz także użyć warstwy dopasowania Barwa / Nasycenie, aby całkowicie zdenaturować niektóre kwadraty, pozostawiając je czarno-białe. Aby to zrobić, zaznacz kilka kwadratów, a następnie dodaj warstwę dopasowania Barwa / Nasycenie, jak zwykle, ale zamiast wybierać kolor za pomocą suwaka Barwa, po prostu przeciągnij suwak Nasycenie do końca w lewo (do wartości -100 ), który usunie cały kolor:

Przeciągnięcie suwaka Nasycenie do końca w lewo spowoduje obrócenie wybranych kwadratów na czarno-białe.

Oto mój wynik po wybraniu i pokolorowaniu większej liczby kwadratów. Użyłem w sumie sześciu warstw dopasowania Barwa / Nasycenie - jedna dla czerwonego (odcień: 0, nasycenie: 50), żółty (odcień: 40, nasycenie: 50), zielony (odcień: 120, nasycenie: 20), niebieski ( odcień: 200, nasycenie: 20) i fioletowy (odcień: 300, nasycenie: 20), plus jeden dla czerni i bieli (nasycenie: -100):

Efekt po pokolorowaniu większej liczby kwadratów.

I tutaj możemy zobaczyć wszystkie sześć moich warstw dopasowania Barwa / Nasycenie w panelu Warstwy, każda nazwana zgodnie z kolorem:

Panel Warstwy pokazujący warstwy dopasowania.

Krok 29: Zmień kolor linii siatki na biały

Teraz, kiedy pokolorowaliśmy nasze kwadraty, zmieńmy wygląd samych linii siatki, najpierw zmieniając ich kolor z czarnego na biały. Kliknij warstwę Siatka w panelu Warstwy, aby ją wybrać:

Kliknięcie warstwy siatki, aby ją wybrać.

Następnie kliknij ikonę Zablokuj przezroczyste piksele tuż poniżej opcji Tryb mieszania u góry panelu Warstwy:

Kliknięcie ikony Zablokuj przezroczyste piksele.

Po włączeniu opcji Zablokuj przezroczyste piksele wszystko, co zrobimy z warstwą, wpłynie tylko na same linie siatki. Nie będzie to miało wpływu na przezroczyste obszary warstwy. W ten sposób, jeśli wypełnimy warstwę, powiedzmy, białą (co zamierzamy zrobić), tylko linie siatki zostaną wypełnione białą. Przezroczyste obszary pozostaną przezroczyste.

Przejdź do menu Edycja i ponownie wybierz Wypełnij . Kiedy pojawi się okno dialogowe Wypełnij, opcja Użyj powinna być już ustawiona na Biała, ponieważ właśnie to ustawiliśmy na ostatni raz, więc po prostu kliknij OK, aby zamknąć okno dialogowe:

Pozostaw opcję Użyj ustawioną na Białą i kliknij OK.

Photoshop wypełnia linie siatki białym:

Efekt po zmianie koloru linii siatki na biały.

Krok 30: Dodaj styl warstwy obrysu

Jeśli chcesz zwiększyć grubość linii siatki, kliknij ikonę Style warstw (ikona „FX”) w dolnej części panelu Warstwy:

Kliknięcie ikony Style warstw.

Wybierz Obrys z wyświetlonej listy:

Wybór stylu warstwy Obrys.

Spowoduje to otwarcie okna dialogowego Styl warstwy programu Photoshop z ustawionymi opcjami Obrys w środkowej kolumnie. Najpierw zmieńmy kolor obrysu na biały. Kliknij próbkę koloru po prawej stronie słowa Kolor :

Kliknięcie próbki koloru w opcjach Obrys.

Spowoduje to otwarcie Próbnika kolorów . Wybierz biały jako nowy kolor obrysu, a następnie kliknij OK, aby go zamknąć:

Wybieranie bieli w Próbniku kolorów.

Z białym teraz jako kolorem obrysu, ustaw opcję Położenie na Zewnątrz, a następnie dostosuj szerokość obrysu, przeciągając suwak Rozmiar. Prawdopodobnie nie będziesz chciał bardzo zwiększać rozmiaru. Ustawię mój na 2 px :

Ustawienie pozycji na zewnątrz i rozmiaru na 2 piksele.

Kliknij OK po zakończeniu, aby zamknąć okno dialogowe Styl warstwy. Oto mój efekt z białymi i nieco szerszymi liniami siatki:

Obraz po zastosowaniu stylu warstwy Obrys.

Krok 31: W razie potrzeby przenieś i zmień rozmiar zdjęcia

W tym momencie, po zakończeniu projektowania siatki, możesz zdecydować o konieczności zmiany rozmiaru i / lub położenia zdjęcia. W moim przypadku wydaje mi się, że jestem całkiem zadowolony z wyglądu, ale jeśli musisz przenieść lub zmienić rozmiar zdjęcia, kliknij warstwę Zdjęcie w panelu Warstwy, aby ją wybrać:

Ponowne wybieranie warstwy zdjęcia.

Następnie po prostu użyj tych samych kroków, które omówiliśmy w kroku 16, aby zmienić rozmiar i / lub przenieść obraz. Najpierw przejdź do menu Edycja i wybierz Free Transform (lub naciśnij Ctrl + T (Win) / Command + T (Mac) na klawiaturze), aby wyświetlić pole Free Transform i uchwyty wokół zdjęcia. Jeśli nie widzisz uchwytów, ponieważ twoje zdjęcie wystaje poza widoczny obszar dokumentu, przejdź do menu Widok i wybierz Dopasuj na ekranie (lub naciśnij Ctrl + 0 (Win) / Command + 0 (Mac) na klawiaturze ). Naciśnij i przytrzymaj klawisz Shift podczas klikania i przeciągania dowolnego z narożnych uchwytów, aby zmienić rozmiar zdjęcia, lub naciśnij i przytrzymaj klawisze Shift + Alt (Win) / Shift + Option (Mac), aby zmienić rozmiar zdjęcia od jego środka, a nie od rogu. Aby przenieść zdjęcie, po prostu kliknij i przeciągnij w dowolne miejsce w polu Bezpłatna transformacja. Przeciągnę trochę moje zdjęcie w dół, ale pozostawiam taki sam rozmiar jak wcześniej:

Ponownie dostosuj rozmiar i położenie zdjęcia (w razie potrzeby) za pomocą opcji Przekształcanie swobodne.

Pamiętaj, że ponieważ w kroku 15 przekonwertowaliśmy zdjęcie na obiekt inteligentny, możemy bezpiecznie zmienić jego rozmiar bez utraty jakości obrazu. Gdy jesteś zadowolony z ostatecznego rozmiaru i położenia obrazu, naciśnij Enter (Win) / Return (Mac), aby go zaakceptować i zamknąć polecenie Free Transform. Następnie, aby powiększyć obraz, przejdź do menu Widok i wybierz 100% (lub naciśnij Ctrl + 1 (Win) / Command + 1 (Mac) na klawiaturze):

Ostateczny rozmiar i pozycja zdjęcia.

Krok 32: Przytnij obraz (opcjonalnie)

Ten ostatni krok jest opcjonalny, ale jeśli chcesz wyciąć część białej ramki wokół siatki, wybierz narzędzie Kadrowanie w programie Photoshop z panelu Narzędzia:

Wybór narzędzia do przycinania.

Po wybraniu narzędzia Kadrowanie ustaw opcję Proporcje obrazu po lewej stronie paska opcji na Proporcje oryginału :

Ustawienie opcji Format obrazu na Format oryginalny.

Zobaczysz ramkę przycinania pojawiającą się wokół krawędzi dokumentu, ze znakami przycięcia na wszystkich czterech bokach iw rogach. Naciśnij i przytrzymaj klawisz Alt (Win) / Option (Mac) na klawiaturze, klikając i przeciągając jeden z czterech narożnych znaczników przycięcia do wewnątrz, aby usunąć część białej ramki:

Naciśnięcie Alt (Win) / Option (Mac) i przeciągnięcie znacznika przycięcia w rogu.

Naciśnij klawisz Enter (Win) / Return (Mac) na klawiaturze, aby przyciąć obraz, i gotowe! Oto, po usunięciu części granicy, mój końcowy wynik: