Photoshop - wycinanie grafik z psd.

pytanie zadane 5 sierpnia 2016 w HTML i CSS przez Kalif Użytkownik (640 p.)

Pisze ja sobie stronki www. Na razie samym HTML i CSS, ogólnie idzie mi coraz lepiej, ale zazwyczaj, kiedy przychodzi mi wstawienie jakiegoś img to po prostu ustalam wysokość i szerokość i daje jakiś background color. Zazwyczaj koduję w oparciu o darmowe PSD. Jak na przykład z takiej strony: https://dcrazed.com/free-photoshop-psd-website-templates/ . Gdzie znajdę jakiś tutorial/tutoriale gdzie będzie pokazane jak wycinać z takiego PSD. Znaczy ogólnie pewnie to nie problem, ale kiedy przyjdzie wyciąć tło z drugiego od góry (z strony wcześniej podanej, las) PSD'ka to już średnio bym powiedział. Szukając na YT, zazwyczaj trafiałem na jakieś tutoriale dla designerów którzy mają dopiero coś takiego zaprojektować... Ktoś coś?
I na czym właściwie polega "cięcie PSD"?

4 odpowiedzi

odpowiedź 5 sierpnia 2016 przez Adam Jakś Dyskutant (8,940 p.)
edycja 5 sierpnia 2016 przez Adam Jakś

Layouty w formacie .psd są tworzone i zapisywane w ten sposób, aby każdy jego element był na oddzielnej warstwie. Wystarczy więc w programie znaleźć warstwę zawierającą tło z obrazka i zapisać go jako niezależny plik (już w zwyczajnym formacie graficznym, jak .jpeg czy .png).

Jeśli tego nie odkryłeś to zakładam, że operujesz na jakimś podglądzie gotowego szablonu (zwykłym obrazku typu jpeg), a nie pliku psd (do którego otwarcia z zachowaniem wszystkich właściwości potrzebujesz programu Photoshop).

Wycinanie szablonu to nic innego jak wyodrębnianie jakiegoś fragmentu obrazka i zapisywanie go w osobnym pliku. Operacja ta potrzebna jest tylko wtedy, gdy dany, różniący się od sąsiadującego z nim elementu, unikalny fragment nie posiada osobnej warstwy, więc nie można go zapisać bez uprzedniego podzielenia obrazka. Robisz to np. za pomocą narzędzia cięcie na plasterki. Z reguły powinno się wykorzystywać html i css do granic możliwości. Dodawanie zewnętrznej grafiki jest uzasadnione tylko wtedy, gdy czegoś nie da się zrobić poprzez napisanie kodu.

komentarz 5 sierpnia 2016 przez Kalif Użytkownik (640 p.)

Aha, czyli jak ktoś mówi (na przykład w ogłoszeniu o pracę - wymagania): umiejętność cięcia PSD, to chodzi po prostu o to, żeby potrafić wyodrębnić jakiś obrazek, na przykład tło?

komentarz 5 sierpnia 2016 przez Adam Jakś Dyskutant (8,940 p.)

Chodzi o to, żeby umiał z pliku .psd zrobić stronę w html'u. Jeśli wymagają tego okoliczności to również wyodrębniał jakiś obrazek, na przykład tło.

odpowiedź 5 sierpnia 2016 przez Barttyyy Gaduła (4,680 p.)

Nie lepiej samemu robić tą grafikę? Nie jest to nic trudnego nauczyć się posługiwać PS a ta umiejętność jest bardzo przydatna. Do tworzenia takiego tła jest potrzebne głownie wyobraźnia i troche znajomośći photoshopa

komentarz 5 sierpnia 2016 przez Kalif Użytkownik (640 p.)

Znaczy się, tak, mam zamiar nauczyć się obsługi PS do tego stopnia, żeby samemu sobie coś takiego przygotować, ale na razie chciałem się skupić na pisaniu, a dopiero potem ogarnąć dokładniej PS. W tym momencie potrzebna mi tylko umiejętność wyciągania tych grafik z PS. Nie mam zwyczajnie czasu aktualnie, żeby ogarniać i pisanie i PS - kiedy dojdę do jako takiego poziomu w Html/Css - wtedy się za to zabiorę.

1	komentarz 5 sierpnia 2016 przez Adam Jakś Dyskutant (8,940 p.) Czekamy na przykładowe prace Twojego autorstwa, @Barttyyy

komentarz 6 sierpnia 2016 przez Hubert Murawski Stary wyjadacz (11,990 p.)

@Adamsky97 - zgadzam się z Tobą i również oczekuję na prace @Barttyyy. Strasznie irytuje mnie takie podejście, autor zadał tutaj jasne pytanie związane z cięciem layoutów, nie pytał o to czy i jak zrobić taką grafikę, nie każdy lubi bawić się godzinami przy jednym projekcie, nie jest do tego stworzony, czy zwyczajnie nie chce. To tak jak byś podszedł do malarza, z zapytaniem o koszty obrazu, a on by Ci opowiedział, a weź se sam kurde namaluj "Nic trudnego nauczyć się posługiwać pędzlem".

odpowiedź 5 sierpnia 2016 przez kubaapk Nałogowiec (44,270 p.)

W czym masz problem, bo nie rozumiem. Przeważnie w szablonach masz zachowaną strukturę folderów i warstw.

1. Znajdujesz interesującą Cię warstwę.

2. Klikasz ctrl + lewy na tą warstwę.

3. ctrl + c

4. ctrl + n

5. ctrl + v

6. shift + ctrl + s

7. profit

komentarz 5 sierpnia 2016 przez Adam Jakś Dyskutant (8,940 p.)

1. PPM na warstwę

2. Eksportuj jako

odpowiedź 5 sierpnia 2016 przez Kalif Użytkownik (640 p.)

Ogólnie wykombinowałem, że daję alt+prawy na obrazek, przez co mi się warstwa (bo domyślam się, że to są te warstwy - chyba, że nie rozumiem znaczenia słowa layer),zaznaczam jakiś tam obszar z obrazkiem, klikam na nią prawym, konwertuje do Smart Object i zapisuje (do Web a nie zwykły zapis) do PNG. Nie przekombinowałem?

komentarz 5 sierpnia 2016 przez Adam Jakś Dyskutant (8,940 p.)

Nie wiem czy we wszystkich wersjach PS jest taka opcja, ale u mnie (w najnowszym- CC) - wystarczy kliknąć na na warstwę w panelu warstw: http://prntscr.com/c23zeq prawym przyciskiem myszy i wybrać opcję wyeksportuj. We wszystkich wersjach powinny być dostępne podobne opcje.