Jak udělat krájení sání méně: Tipy a triky pro krájení PSD
Mám špinavé malé tajemství, nesnáším krájení souborů Photoshopu. Tím nemyslím, že nesnáším proměnu kompilací PSD na webové stránky, nemyslím tím, že nenávidím nástroje pro krájení Photoshopu. Celý proces způsobí, že můj PSD vypadá zaneprázdněn, přeplněný a příliš komplikovaný, takže ho obvykle přeskočím a místo toho se rozhodnu ručně oříznout a uložit obrázky individuálně podle potřeby.
Abych bojoval s touto tendencí a pokusil se vidět skutečnou užitečnost nástrojů pro krájení ve Photoshopu, pustil jsem se do mise, abych se naučil všechny složitosti toho, jak krájení funguje. Níže je sbírka tipů a triků, které vyplynuly z této cesty. Doufejme, že se naučíte něco nebo dvě, které jste nikdy neznali!
Ve Photoshopu jsou tři typy řezů
Tři druhy plátků !? To byla jedna z nejzajímavějších a nejpřekvapivějších věcí, které jsem se naučil. Když jsem s funkcemi krájení příliš ne experimentoval, jen jsem si myslel, že existuje jen jeden způsob, jak to udělat. Mýlil jsem se.
Tři různé druhy řezů jsou uživatelské řezy, automatické řezy a řezy založené na vrstvách. Nejprve si povíme o dvou, které pravděpodobně znáte: User Slices a Auto Slices. Ty jsou velmi úzce spjaty, ve skutečnosti jeden vytváří druhý.
Jak víte, pro krájení disku PSD začnete tím, že uchopíte Nástroj řezu (C) a nakreslíte rámeček kolem oblasti, kterou chcete exportovat, jako samostatný obrázek. Přidáním řezů do všech oblastí vašeho kompasu, do kterých chcete udělat, můžete rychle a snadno optimalizovat a exportovat několik obrázků najednou.
Když provádíte plátek, měli byste získat něco jako výsledek níže.
Zde jsem nakreslil rámeček kolem loga v horní části stránky. Tato jedna akce vytvořila uživatelské řezy i několik automatických řezů. Když vytvoříte řez, Photoshop předpokládá, že vaším konečným cílem je proměnit celé PSD na řadu řezů. Osobně si myslím, že tento předpoklad je docela nepříjemný, a my si později povíme, jak se s tím obejít. Prozatím víme, že díky tomuto předpokladu Photoshop rozšiřuje okraje vašeho řezu po celé PSD, čímž automaticky vytváří několik dalších sekcí. To je znázorněno na obrázku výše.
Triky pro práci s uživatelskými a automatickými řezy
Zatímco jsme na téma Uživatelských a automatických řezů, pojďme se podívat na některé zjevné a ne tak zjevné funkce, abyste si mohli opravdu udělat představu o tom, jaké nástroje a možnosti máte k dispozici.
Přesouvání a úpravy řezů
Po vytvoření řezu byste měli vidět ovládací prvky podobné ovládacímu prvku Free Transform, které vám umožní pohybovat a upravovat jej. Pomocí nástroje Výběr řezů můžete také zajistit, že upravujete pouze aktuální řezy a nevytváříte nové. Tento nástroj se nachází v části Řezový nástroj v rozevírací nabídce.
Převádění automatických řezů na uživatelské řezy
Během celého procesu krájení jsou automatické řezy průběžně vytvářeny a aktualizovány a zůstávají odlišné od uživatelských řezů. Později se podíváme na to, jak je exportovat jako soubory nebo je ignorovat při exportu, ale prozatím se podívejme, jak změnit automatický řez na uživatelský řez.
Tento proces je velmi jednoduchý. Nejprve musíte vybrat automatický řez pomocí nástroje pro výběr řezů. Dále vyberte automatický řez, který chcete převést, a klikněte na tlačítko „Povýšit“ v horní části.
A je to! Nyní by měl automatický řez změnit barvu, což znamená, že se nyní jedná o uživatelský řez. Nyní budete mít větší kontrolu nad jeho velikostí a způsobem, jakým exportuje.
Plátky s automatickým dělením
Pokud máte řadu objektů, které jsou rozloženy vodorovně, svisle nebo dokonce v mřížce, nemusíte mít čas projít a udělat řez kolem každé jednotlivé jednotky. Místo toho můžete vytvořit jeden řez, který pokryje všechny objekty, a povědět Photoshopu, aby udělal zbytek.
Chcete-li to provést, nejprve vytvořte svůj velký kousek nakreslením rámečku kolem všech objektů. Poté s aktivovaným nástrojem pro výběr řezů klikněte na tlačítko „Rozdělit“ v horní části stránky.
To by mělo vyvolat výše uvedené dialogové okno „Rozdělit řez“. Pomocí tohoto okna můžete rychle vložit další svislé a vodorovné řezy. Pokud nejsou zarovnány doprava, můžete je upravit ručně po stisknutí tlačítka „OK“.
Plátky od průvodců
Mnozí z vás pravděpodobně mnohem pohodlněji pracují s průvodci než s plátky uvnitř Photoshopu. Skutečností je, že oba pracují velmi podobně, ale systém průvodců se připouští trochu plynulejší.
Pokud takto postupujete, dokonale se hodí do snadného pracovního postupu pro vytváření řezů. Jednoduše přetáhněte vodítka a rozdělte své PSD a nástroje pro krájení úplně ignorujte. Poté, co skončíte, vyberte Nástroj řezů a v horní části klikněte na tlačítko „Řezy z průvodců“.
Pojmenování řezů
Jednou z nepříjemných věcí, které vás při prvním zpracování se plátky otravují, je to, že když je exportujete, všechny výsledné soubory přijdou s velkými ošklivými jmény, která vůbec nemají smysl. Chcete-li to vyřešit, musíte se ujistit, že jste vešli a každý díl správně pojmenovali. Jakýkoli název, který přiřadíte, bude při exportu převeden jako název souboru.
Chcete-li pojmenovat řez, poklepejte na jeho obsah poklepáním na nástroj řezu. Zobrazí se následující dialog.
Všimněte si, že zde máte několik možností, včetně nastavení barvy řezu, ručního zadávání kót a přiřazení názvu. K dispozici je také spousta věcí HTML, jako je URL, cíl atd. Ukázalo se, že Photoshop může vzít vaše nakrájené PSD a vydat je jako webovou stránku. Někteří tuto funkci podporují, protože výchozí nastavení vytváří rozvržení založené na tabulce, můžete je však přepnout a využít CSS.
Teď se nebuď příliš nadšený. I když jsou vybrány možnosti CSS, Photoshop je stále docela shnilý při vytváření webových stránek pro vás. Je mnohem lepší, když to děláte ručně, nebo alespoň přebíráte Dreamweaver, což znamená, že byste všechny tyto ostatní možnosti měli zcela ignorovat.
Plátky na vrstvě a proč jsou lepší
Jedním z hlavních rysů, které pro mě krájení krájejí, je pro mě mnohem méně plátek. Jedná se o konkrétní značku uživatelských oblastí, které jsou v několika ohledech vynikající.
Jak název napovídá, tyto řezy nejsou založeny na poli, které nakreslíte ručně, ale místo toho automaticky dodržují hranice vrstvy. Chcete-li vytvořit řez založený na vrstvě, vyberte vrstvu v paletě Vrstvy, přejděte do nabídky a vyberte Vrstva> Nový řez založený na vrstvě. Pamatujte, že to funguje, i když máte vybráno více vrstev, každá vrstva se jednoduše změní na svůj vlastní řez!
Samozřejmě, aby to správně fungovalo, musíte být opravdu dobří, jak strukturujete své vrstvy. Mockups byste měli stavět jako plně vrstvené a organizované soubory, takže to by neměl být problém.
Výhoda
Jedním z hlavních důvodů, proč jsou normální plátky tak chromé, je to, že vytváří spoustu práce navíc, pokud se chcete vrátit a vylepšit své návrhy. Poté, co zamícháte kresbu, musíte se vrátit a přesunout všechny své řezy tak, aby odpovídaly novému rozvržení. To je nepříjemnost, proč vždy jen ručně ukládám jednotlivé kousky oříznutím.
Plátky založené na vrstvách jsou však ve skutečnosti docela inteligentní. Když se pohybujete po vrstvách, vaše řezy automaticky následují. Pokud přidáte efekt, který mění hranice, jako je například Outer Glow, řez se rozbalí a zahrne. Pokud vrstvu převedete na 30% původní velikosti, řez se automaticky aktualizuje!
Je zřejmé, že zde existuje jasný argument pro použití řezů založených na vrstvách, kdykoli je to možné, protože vám ušetří neuvěřitelné množství času ve nevyhnutelné fázi přepracování.
Zabíjení nepořádku
Další z mých největších nepříjemností při krájení je to, že dokáže vytvořit skutečně zaplněný vypadající PSD. Většinou se jedná o vedlejší účinek automatického krájení.
Jako příklad se podívejme na níže uvedený obrázek (je zde trochu zjednodušený, ale získáte názor). Tady jsem opravdu chtěl jen vytvořit tři plátky, ale Photoshop se automaticky připojil a proměnil je na dvanáct plátek !
Nevím o vás, ale nevytvářím webové stránky jako jednu velkou sbírku obrázků, které jsou všechny nabity dohromady. Takže prostě nechci všechny tyto další plátky! Nebudu exportovat tyto oblasti do obrázků, takže vše, co dělají, je přidání šumu do mého rozhraní. Když vidím takový dokument, plátky přestanou být pro mě smysluplným nástrojem.
Chcete-li to vyřešit, můžeme chytit nástroj pro výběr řezů a stisknout tlačítko „Skrýt automatické řezy“ v horní části obrazovky. To dělá přesně to, co název napovídá, strhává všechny ty ošklivé Auto Slices z pohledu.
Podívejte se, jak jednodušší je náš dokument! Několik plátků, které jsme použili, je jasně identifikovatelných, a proto si zachovávají jejich užitečnost. Podle mého názoru je tento způsob prohlížení vašich plátků velmi upřednostňován. To je jeden z těch případů, kdy se Photoshop prostě příliš těžko snaží předpovídat můj preferovaný pracovní postup a skončí přeháněním funkcí.
Export plátek
To je místo, kde se užitečnost krájení skutečně projeví. Bez krájení je třeba každou část kompilace zachránit po jednom. Pracovní postup by byl něco jako následující: proveďte výběr, ořízněte, optimalizujte v Uložit pro web, uložte, zrušte oříznutí a opakujte. To je spousta zbytečných kroků! Uvidíme, jak to funguje s krájením.
Poté, co jste konečně přišli na všechny výhody a výřezy krájení a máte PSD připraveni jít, je čas přejít do nabídky Soubor a vybrat „Uložit pro web a zařízení“. Pravděpodobně jste již s tímto dialogem dobře obeznámeni, ale je to trochu jiné, když máte v dokumentu řezy.
Pokud máte nějaké řezy, náhled dokumentu v tomto okně zobrazí všechny (bohužel to zahrnuje i nepříjemné automatické řezy). Odtud můžete jednoduše klepnutím vybrat každý řez a optimalizovat nastavení pro každý jednotlivě. To zahrnuje typ souboru, kvalitu atd. Takže v jedné relaci můžete nastavit export tří JPG a PNG, každý v kvalitě, kterou považujete za vhodnou.
Jakmile vše upravíte podle svých představ, stiskněte tlačítko „Uložit“. Mělo by se objevit dialogové okno, které vám umožní vybrat složku, do které budou umístěny všechny obrázky. Nezapomeňte, že již jsme nastavili konvenci pojmenování, tak to prostě nechte tak, jak je. Klíčem je zde zajistit, že exportujete pouze „Všechny uživatelské segmenty“ nebo „Vybrané řezy“.
V závislosti na požadovaném pracovním postupu funguje jedna z těchto možností skvěle. Výchozí možností je jednoduše „Všechny řezy“, které budou zahrnovat nejen vaše uživatelské a vrstvové řezy, ale také zcela zbytečné automatické řezy, které budete stejně muset zahodit. Zachraňte si potíže a proveďte je zde před provedením skutečného uložení.
Závěr
Dnes jsme prošli spoustou pěkných technických věcí z Photoshopu, takže se to pokusím pěkně shrnout. Zaprvé, krájení PSD se může opravdu cítit jako neohrabaný proces, pokud nevíte, co děláte. Ujistěte se, že se ve Photoshopu opravdu rozhlížíte a experimentujte s výše uvedenými tipy, abyste měli k dispozici co nejvíce nástrojů.
Za druhé, nezapomeňte, že existují tři typy řezů: Automatické řezy, uživatelské řezy a řezy založené na vrstvách. Automatické řezy jsou pěkně chromé a na krájení mají více nešťastných vedlejších účinků než užitečná funkce. Nemusíte se mnou na tom souhlasit, ale pokud ano, schovejte je, aby se tak rozptylovaly. Uživatelské řezy jsou prostě ty, které záměrně vytvoříte. Můžete je upravit pomocí nástroje pro výběr řezů a pojmenovat je dvojitým kliknutím na obsah. Plátky založené na vrstvě jsou stejně jako řezy uživatele, pouze jsou mnohem chytřejší, protože automaticky dodržují hranice dané vrstvy. Do vrstvy můžete přesouvat, měnit velikost a přidávat efekty a řez se bude neustále aktualizovat sám.
Nakonec při exportu dokumentu s řezy vyberte příkaz Uložit pro web a optimalizujte každý řez jako svůj vlastní soubor. Nezapomeňte také exportovat pouze uživatelské řezy nebo vybrané řezy, protože jinak všechny automatické řezy vytvořené Photoshopem vyplní složku obrázků.
To je pravděpodobně mnohem více, než jste kdy chtěli vědět o krájení na plátky ve Photoshopu, ale doufejme, že vám to pomohlo najít neefektivnost v systému, takže můžete tuto užitečnou sadu nástrojů upravit a stále ji využívat, aniž byste byli omezováni její nepříjemností.
Zanechte komentář níže a řekněte nám, jak rozdělujete disk PSD. Pracovní postup, který jsem zde nastavil, je jen jedním z mnoha možných řešení a já se obávám, že vás slyším a učím se od vás!
