Jak zrobić krojenie ssać mniej: porady i wskazówki dotyczące krojenia PSD
Mam brudny mały sekret, nie znoszę kroić plików Photoshopa. Nie mam na myśli tego, że nienawidzę przekształcania kompilacji PSD w strony internetowe, mam na myśli to, że nienawidzę narzędzi do krojenia w Photoshopie. Cały proces sprawia, że mój PSD wygląda na zajęty, zagracony i nadmiernie skomplikowany, więc zwykle pomijam go całkowicie i zamiast tego wybieram ręczne przycinanie i zapisywanie zdjęć indywidualnie w razie potrzeby.
Aby zwalczyć tę tendencję i spróbować zobaczyć prawdziwą przydatność narzędzi do krojenia w Photoshopie, podjąłem misję poznania wszystkich zawiłości działania krojenia. Poniżej znajduje się zbiór porad i wskazówek, które wyniknęły z tej podróży. Mam nadzieję, że nauczysz się czegoś, o czym nigdy nie wiedziałeś!
Istnieją trzy rodzaje plasterków w Photoshopie
Trzy rodzaje plasterków !? To była jedna z najbardziej interesujących i zaskakujących rzeczy, których się nauczyłam. Nie eksperymentując zbytnio z funkcjami krojenia, po prostu pomyślałem, że jest tylko jeden sposób, aby to zrobić. Myliłem się.
Trzy różne rodzaje plasterków to plasterki użytkownika, plasterki automatyczne i plasterki oparte na warstwach. Na początek porozmawiajmy o dwóch, które prawdopodobnie znasz: Plastry użytkownika i Auto-plasterki. Są one bardzo ściśle powiązane, w rzeczywistości jedno tworzy drugie.
Jak wiadomo, aby pokroić PSD, zacznij od złapania narzędzia Kromka (C) i narysowania ramki wokół obszaru, który chcesz wyeksportować jako samodzielny obraz. Dodając plastry do wszystkich obszarów komputera, w których chcesz to zrobić, możesz szybko i łatwo zoptymalizować i wyeksportować kilka zdjęć jednocześnie.
Kiedy wykonujesz wycinek, powinieneś uzyskać coś takiego jak wynik poniżej.
To, co zrobiłem tutaj, to narysowanie ramki wokół logo u góry strony. Ta jedna akcja utworzyła zarówno plaster użytkownika, jak i kilka automatycznych plasterków. Kiedy tworzysz plasterek, Photoshop zakłada, że Twoim ostatecznym celem jest przekształcenie całego PSD w serię plasterków. Osobiście uważam, że to założenie jest dość irytujące, a później omówimy, jak je obejść. Na razie wiedz tylko, że z powodu tego założenia Photoshop rozszerza krawędzie twojego plasterka na całej długości PSD, tworząc w ten sposób kilka innych sekcji automatycznie. Ilustruje to powyższy obraz.
Sztuczki dotyczące pracy z wycinkami użytkownika i auto
Podczas gdy zajmujemy się tematem User and Auto Slices, przejrzyjmy niektóre oczywiste i niezbyt oczywiste funkcje, abyś mógł naprawdę poczuć, jakie narzędzia i opcje masz do dyspozycji.
Przenoszenie i edycja plasterków
Po utworzeniu plastra powinieneś zobaczyć kontrolki podobne do tych dla darmowej transformacji, które pozwolą ci go przenosić i edytować. Możesz także użyć narzędzia wyboru plasterków, aby mieć pewność, że edytujesz tylko bieżące plasterki, a nie tworzysz nowych. To narzędzie znajduje się pod narzędziem Kromka w menu rozwijanym.
Konwertowanie automatycznych wycinków na wycinki użytkownika
W trakcie całego procesu krojenia Auto Slice są tworzone i aktualizowane w sposób ciągły i pozostają odrębne od plasterków użytkownika. Później przyjrzymy się, jak wyeksportować je jako pliki lub zignorować je podczas eksportowania, ale na razie przyjrzyjmy się, jak zamienić Auto Slice w User Slice.
Proces jest niezwykle prosty. Najpierw musisz wybrać automatyczny plaster za pomocą narzędzia wyboru plasterków. Następnie wybierz Auto Slice, które chcesz przekonwertować i naciśnij przycisk „Promuj” u góry.
Otóż to! Teraz Auto Slice powinien zmienić kolor, wskazując, że jest to teraz Slice użytkownika. Teraz będziesz mieć większą kontrolę nad jego rozmiarem i sposobem eksportowania.
Automatyczne dzielenie plasterków
Kiedy masz szereg obiektów rozmieszczonych poziomo, pionowo lub nawet w siatce, nie musisz tracić czasu, aby przejść i zrobić wycinek wokół każdej jednostki. Zamiast tego możesz zrobić jeden plasterek, który obejmie wszystkie obiekty i powiedzieć Photoshopowi, aby zrobił resztę.
Aby to zrobić, najpierw wykonaj duży plasterek, rysując ramkę wokół wszystkich obiektów. Następnie, przy włączonym narzędziu wyboru plasterków, kliknij przycisk „Podziel” u góry strony.
Powinno to wyświetlić okno dialogowe „Podziel plasterek” pokazane powyżej. Za pomocą tego okna możesz szybko wstawiać dodatkowe pionowe i poziome plastry. Jeśli nie są wyrównane w prawo, możesz je dostosować ręcznie po naciśnięciu przycisku „OK”.
Plasterki z Przewodników
Wielu z was prawdopodobnie znacznie wygodniej pracuje z prowadnicami niż plasterkami w Photoshopie. W rzeczywistości oba działają bardzo podobnie, ale system prowadnic jest wprawdzie nieco płynniejszy.
Jeśli tak się toczy, idealnie wpasowuje się w łatwy proces tworzenia plasterków. Po prostu przeciągnij prowadnice, aby pokroić PSD i całkowicie zignoruj narzędzia do krojenia. Następnie, gdy wszystko będzie gotowe, wybierz narzędzie do krojenia i naciśnij przycisk „Plasterki z prowadnic” u góry.
Nazywanie plasterków
Jedną z irytujących rzeczy, które będą Cię denerwować podczas pierwszej pracy z plasterkami, jest to, że podczas ich eksportowania wszystkie powstałe pliki mają duże brzydkie nazwy, które wcale nie mają znaczenia. Aby to naprawić, musisz upewnić się, że wszedłeś i nazwałeś każdy plasterek odpowiednio. Jakakolwiek przypisana nazwa zostanie przeniesiona jako nazwa pliku podczas eksportu.
Aby nazwać plasterek, wystarczy kliknąć dwukrotnie jego zawartość przy wybranym narzędziu Plasterek. Spowoduje to wyświetlenie poniższego okna dialogowego.
Zauważ, że masz tutaj kilka opcji, w tym ustawienie koloru plasterka, ręczne wprowadzanie wymiarów i przypisywanie nazwy. Jest też mnóstwo rzeczy HTML, takich jak adres URL, cel itp. Okazuje się, że Photoshop może wziąć pokrojony PSD i wydrukować go jako stronę internetową. Niektórzy podważają tę funkcjonalność, ponieważ ustawienia domyślne tworzą układ oparty na tabeli, jednak można je przełączyć, aby korzystać z CSS.
Nie bądź zbyt podekscytowany. Nawet przy wybranych opcjach CSS Photoshop nadal jest dość zepsuty, jeśli chodzi o tworzenie witryny internetowej. O wiele lepiej jest robić to ręcznie lub przynajmniej przestawić na Dreamweaver, co oznacza, że powinieneś całkowicie zignorować wszystkie inne opcje.
Plasterki warstwowe i dlaczego są lepsze
Jedną z głównych cech, które sprawiły, że krojenie jest dla mnie o wiele mniejsze, są Plasterki Warstwowe. Są to szczególne marki segmentów użytkowników, które są lepsze na kilka sposobów.
Jak sama nazwa wskazuje, wycinki te nie są oparte na polu, które rysujesz ręcznie, ale automatycznie dostosowują się do granic warstwy. Aby utworzyć plasterek oparty na warstwach, wybierz warstwę w Palecie warstw, a następnie przejdź do menu i wybierz Warstwa> Nowy plasterek oparty na warstwach. Zauważ, że działa to nawet, jeśli masz zaznaczonych wiele warstw, każda warstwa zostanie po prostu zamieniona we własny kawałek!
Oczywiście, aby to działało poprawnie, musisz być naprawdę dobry w układaniu warstw. W każdym razie powinieneś budować swoje makiety jako pliki w pełni warstwowe i zorganizowane, więc nie powinno to stanowić problemu.
Przewaga
Jednym z głównych powodów, dla których normalne plastry są tak kiepskie, jest to, że stwarza mnóstwo dodatkowej pracy, jeśli chcesz wrócić i poprawić swoje projekty. Po przetasowaniu kompozycji musisz wrócić i przenieść wszystkie plasterki, aby wyrównać z nowym układem. Ta irytacja powoduje, że zawsze po prostu ręcznie oszczędzam poszczególne elementy poprzez kadrowanie.
Jednak plasterki oparte na warstwach są w rzeczywistości dość inteligentne. Kiedy poruszasz się po warstwach, twoje plasterki automatycznie podążają. Jeśli dodasz efekt zmieniający granice, taki jak Blask zewnętrzny, plasterek zostanie rozszerzony, aby go uwzględnić. Jeśli przekształcisz warstwę do 30% jej oryginalnego rozmiaru, plaster zostanie ponownie zaktualizowany automatycznie!
Oczywiście istnieje tutaj wyraźny argument za stosowaniem warstw opartych na warstwach, gdy tylko jest to możliwe, ponieważ oszczędza to niesamowitą ilość czasu na nieuniknionym etapie przeprojektowywania.
Killing the Clutter
Kolejną z moich największych irytacji związanych z krojeniem jest to, że może stworzyć naprawdę zagracony wygląd PSD. Jest to głównie związane z efektem ubocznym Auto Slicing.
Na przykład spójrz na zdjęcie poniżej (tutaj jest to trochę zbyt uproszczone, ale rozumiesz). Tutaj naprawdę chciałem tylko stworzyć trzy plasterki, ale Photoshop automatycznie wszedł i zmienił je w dwanaście plasterków !
Nie wiem o tobie, ale nie tworzę stron internetowych jako jednej wielkiej kolekcji zdjęć, które są zlepione razem. Po prostu nie chcę tych wszystkich dodatkowych plasterków! Nie zamierzam eksportować tych obszarów do obrazów, więc wszystko, co robią, to hałas w moim interfejsie. Kiedy widzę taki dokument, plastry przestają być dla mnie znaczącym narzędziem.
Aby to naprawić, możemy pobrać narzędzie wyboru plasterków i nacisnąć przycisk „Ukryj automatyczne plasterki” u góry ekranu. Robi to dokładnie, co sugeruje nazwa, zamazuje z widoku wszystkie te paskudne automatyczne wycinki.
Zobacz, o ile prostszy staje się nasz dokument! Nieliczne użyte przez nas plastry są jednoznacznie identyfikowalne i dlatego zachowują swoją przydatność. Moim zdaniem ta metoda przeglądania twoich plasterków jest zdecydowanie preferowana. Jest to jeden z tych przypadków, w których Photoshop po prostu zbyt mocno próbuje przewidzieć mój preferowany przepływ pracy i kończy się przesadą funkcji.
Eksportowanie plasterków
W tym miejscu naprawdę przydaje się przydatność krojenia. Bez krojenia musisz oszczędzać każdą porcję swojego komputera pojedynczo. Przepływ pracy mógłby wyglądać następująco: dokonać wyboru, przyciąć, zoptymalizować w Zapisz dla Internetu, zapisać, cofnąć przycięcie i powtórzyć. To wiele niepotrzebnych kroków! Zobaczmy, jak to działa z krojeniem.
Po tym, jak w końcu zrozumiesz wszystkie tajniki krojenia i przygotujesz PSD do pracy, czas przejść do menu Plik i wybrać „Zapisz dla Internetu i urządzeń”. Prawdopodobnie znasz już to okno dialogowe, ale jest trochę inaczej, gdy masz plasterki w dokumencie.
Jeśli masz jakieś plasterki, podgląd twojego dokumentu w tym oknie pokazuje je wszystkie (niestety, obejmuje to również irytujące Auto-plasterki). Tutaj możesz po prostu kliknąć, aby wybrać każdy plasterek i zoptymalizować ustawienia dla każdego z osobna. Obejmuje to typ pliku, jakość itp. Tak więc w jednej sesji możesz skonfigurować eksport trzech plików JPG i PNG, z których każda ma jakość, którą uznasz za odpowiednią.
Po dostosowaniu wszystkiego do swoich preferencji naciśnij przycisk „Zapisz”. Powinno zostać wyświetlone okno dialogowe, w którym możesz wybrać folder, w którym chcesz umieścić wszystkie obrazy. Pamiętaj, że już skonfigurowaliśmy konwencję nazewnictwa, więc zostaw to tak, jak jest. Kluczem tutaj jest upewnienie się, że eksportujesz tylko „Wszystkie segmenty użytkownika” lub „Wybrane segmenty”.
W zależności od pożądanego przepływu pracy jedna z tych opcji działa świetnie. Domyślną opcją jest po prostu „Wszystkie plasterki”, które obejmują nie tylko plasterki użytkownika i warstwy, ale także całkowicie bezużyteczne automatyczne plasterki, które i tak będziesz musiał porzucić. Zaoszczędź sobie kłopotów i porzuć je tutaj przed faktycznym zapisaniem.
Wniosek
Omówiliśmy dzisiaj wiele technicznych rzeczy z Photoshopa, więc postaram się to podsumować. Po pierwsze, krojenie PSD może naprawdę wydawać się niezręcznym procesem, jeśli nie wiesz, co robisz. Upewnij się, że naprawdę rozglądasz się w Photoshopie i eksperymentujesz z powyższymi wskazówkami, aby mieć pewność, że w pełni wykorzystujesz dostępne narzędzia.
Po drugie, pamiętaj, że istnieją trzy rodzaje plasterków: Automatyczne plasterki, plasterki użytkownika i plasterki oparte na warstwach. Automatyczne plastry są dość kulawe i są bardziej niefortunnym efektem ubocznym krojenia niż przydatna funkcja. Nie musisz się ze mną zgadzać, ale jeśli to zrobisz, ukryj je, aby nie rozpraszały. Plasterki użytkownika to po prostu te, które celowo tworzysz. Możesz je dostosować za pomocą narzędzia wyboru plasterków i nazwać je, klikając dwukrotnie zawartość. Plasterki oparte na warstwach są podobne do plasterków użytkownika, tyle że są znacznie mądrzejsze, ponieważ automatycznie dostosowują się do granic danej warstwy. Możesz przesuwać, zmieniać rozmiar i dodawać efekty do warstwy, a plaster będzie aktualizowany na bieżąco.
Wreszcie podczas eksportowania dokumentu z plasterkami wybierz polecenie Zapisz dla Internetu i zoptymalizuj każdy plasterek jako własny plik. Upewnij się również, że eksportujesz tylko plasterki użytkownika lub wybrane plasterki, w przeciwnym razie wszystkie automatyczne plasterki utworzone przez Photoshop wypełnią folder obrazów.
Jest to prawdopodobnie o wiele więcej niż kiedykolwiek chciałeś wiedzieć o krojeniu w Photoshopie, ale mam nadzieję, że pomogło ci to dostrzec nieefektywności w systemie, dzięki czemu możesz dostosować i nadal korzystać z tego użytecznego zestawu narzędzi, nie przeszkadzając mu w jego niezręczności.
Zostaw komentarz poniżej i powiedz nam, jak pokroić PSD. Przepływ pracy, który tutaj skonfigurowałem, jest tylko jednym z wielu możliwych rozwiązań i pragnę usłyszeć od ciebie i uczyć się od Ciebie!
