Kuidas viilutamist vähem imeda: näpunäiteid PSD viilutamiseks
Mul on räpane väike saladus, ma vihkan Photoshopi failide viilutamist. Selle all ei pea ma silmas seda, et ma vihkan PSD-de kompuutrite muutmist veebisaitideks, ma mõtlen, et ma vihkan Photoshopi viilimistööriistu. Kogu protsess muudab minu PSD-d hõivatuks, segaduseks ja liiga keeruliseks, nii et ma jätan selle tavaliselt üldse vahele ja valin selle asemel pildi käsitsi kärpimiseks ja salvestamiseks vastavalt vajadusele.
Selle kalduvuse vastu võitlemiseks ja Photoshopi viilutamisriistade tõelise kasulikkuse proovimiseks asusin missioonile õppida kõiki viilutamise toimimise keerukusi. Allpool on kogumik näpunäiteid ja nippe, mis selle teekonna tulemusel tekkisid. Loodetavasti õpid midagi või kahte, mida te kunagi ei teadnud!
Photoshopis on kolme tüüpi viilusid
Kolm tüüpi viilu !? See oli üks kõige huvitavamaid ja üllatavamaid asju, mida ma õppisin. Kuna ma pole viilutamisfunktsioonidega liiga palju katsetanud, arvasin lihtsalt, et sellel on ainult üks viis. Ma eksisin.
Kolm erinevat tüüpi viilu on kasutaja viilud, automaatsed viilud ja kihil põhinevad viilud. Alustuseks räägime kahest, millega olete tõenäoliselt tuttavad: kasutaja viilud ja automaatsed lõigud. Need on väga tihedalt seotud, tegelikult loob üks teise.
Nagu teate, hakake PSD viilutamiseks haarama viilutööriista (C) ja joonistama kasti ala ümber, mida soovite eraldiseisva pildina eksportida. Kui lisate viilud kõikidele oma kompilaatori aladele, kuhu soovite seda teha, saate kiiresti ja hõlpsalt optimeerida ja eksportida mitu pilti korraga.
Lõigu sooritamisel peaksite saama midagi sellist, nagu allpool näha.
See, mida ma siin teinud olen, on lehe ülaosas logo ümber kastike joonistamine. Selle ühe toiminguga loodi nii kasutajalõik kui ka mitu automaatset lõiku. Lõigu loomisel eeldab Photoshop, et teie lõppeesmärk on muuta kogu PSD viilude seeriaks. Ma isiklikult arvan, et see eeldus on üsna tüütu ja arutame hiljem, kuidas sellest mööda saada. Praegu tean lihtsalt, et selle eelduse tõttu laiendab Photoshop teie viilu servi PSD-s täielikult, luues seeläbi automaatselt mitu muud jaotist. Seda illustreerib ülaltoodud pilt.
Nipid kasutaja- ja automaatsete viiludega töötamiseks
Kui käsitleme kasutajate ja automaatsete viilude teemat, siis vaatame üle mõned ilmsed ja mitte nii ilmsed funktsioonid, et saaksite tõesti teada, millised tööriistad ja võimalused teie käsutuses on.
Lõikude teisaldamine ja muutmine
Kui olete lõigu teinud, peaksite nägema tasuta teisenduse jaoks sarnaseid juhtelemente, mis võimaldavad teil seda teisaldada ja redigeerida. Võite kasutada ka viilude valimise tööriista, et veenduda, et redigeerite ainult praeguseid viilusid, mitte ei loo uusi. Selle tööriista leiate menüüst Lõikeriist.
Auto viilude teisendamine kasutaja viiludeks
Kogu viilutamisprotsessi vältel luuakse ja värskendatakse pidevalt automaatseid viilusid ning need eristuvad kasutaja viiludest. Hiljem uurime, kuidas neid failidena eksportida või eksportimisel ignoreerime, kuid vaatame nüüd, kuidas muuta automaatne viil kasutajaks.
Protsess on äärmiselt lihtne. Esiteks peate Slice Select Tool abil valima automaatse Slice'i. Järgmisena valige automaatne viil, mida soovite teisendada, ja klõpsake ülaosas nuppu “Edendamine”.
Ongi! Nüüd peaks automaatne viil värvi muutma, näidates, et see on nüüd kasutaja viil. Nüüd saate paremini kontrollida selle suurust ja eksporti.
Viilude automaatne jagamine
Kui teil on rida objekte, mis on jaotatud horisontaalselt, vertikaalselt või isegi ruudustikus, ei pea te võtma aega, et läbi minna ja teha üksikute üksuste ümber viil. Selle asemel võite teha ühe viilu, mis katab kõik objektid, ja käskida Photoshopil teha ülejäänud.
Selleks tehke kõigepealt oma suur viil, joonistades kõigi objektide ümber kasti. Seejärel, kui funktsioon Slice Select Tool on sisse lülitatud, klõpsake lehe ülaosas nuppu Divide (Jaga).
See peaks avama ülaltoodud dialoogiboksi “Jaga viil”. Selle akna abil saate kiiresti lisada täiendavaid vertikaalseid ja horisontaalseid viilusid. Kui need ei joondu õigesti, saate neid käsitsi reguleerida pärast nupule „OK“ vajutamist.
Viilud juhenditest
Tõenäoliselt on paljudel teist juhenditega töötamine palju mugavam kui viiludena Photoshopis. Reaalsus on see, et nad mõlemad töötavad väga sarnaselt, kuid giidide süsteem tunneb end muidugi pisut sujuvamalt.
Kui nii veeretate, sobib see viilude loomiseks hõlpsalt hõlpsaks töövoogudeks. PSD viilutamiseks lohistage lihtsalt juhendid välja ja ignoreerige viilimisriistu täielikult. Kui olete kõik lõpetanud, valige Slice Tool ja klõpsake ülaosas nuppu “Slice from Guides”.
Viilude nimetamine
Üks tüütu asi, mis viiludega esimest korda töötades viga teeb, on see, et nende eksportimisel tulevad kõik failid suured koledad nimed, millel pole üldse tähendust. Selle parandamiseks peate veenduma, et olete sisse läinud ja nimetanud iga viilu asjakohaselt. Ükskõik, mis nime te määrate, kantakse see eksportimisel failinimena üle.
Viilu nimetamiseks topeltklõpsake selle sisu valitud Slice Tool-i abil. See avab alloleva dialoogi.
Pange tähele, et siin on mitu võimalust, sealhulgas viilu värvi määramine, mõõtmete käsitsi sisestamine ja nime määramine. Seal on ka hunnik HTML-i asju, näiteks URL, sihtmärk jne. Selgub, Photoshop saab võtta teie viilutatud PSD-d ja väljastada selle veebilehena. Mõni peksab seda funktsiooni, kuna vaikeseaded loovad tabelipõhise paigutuse, kuid CSS-i kasutamiseks saate neid vahetada.
Nüüd ärge liiga põnevil. Isegi kui valitud CSS-i suvandid on, on Photoshop teile veebisaidi loomisel endiselt üsna mäda. Teil on palju parem teha seda käsitsi või vähemalt üle anda see Dreamweaverile, mis tähendab, et peaksite kõiki neid muid võimalusi täielikult ignoreerima.
Kihipõhised viilud ja miks nad paremad on
Üks peamisi omadusi, mis pani viilutamise minu jaoks palju vähem imema, on kihil põhinevad viilud. Need on konkreetsed kasutajaviilude kaubamärgid, mis on mitmeti paremad.
Nagu nimest järeldada võib, ei põhine need lõigud käsitsi joonistatud kastil, vaid kinnitavad automaatselt kihi piire. Kihipõhise viilu loomiseks valige kiht kihtide paletist, minge seejärel menüüsse ja valige Kihi> Uus kihtpõhine viil. Pange tähele, et see töötab isegi siis, kui teil on valitud mitu kihti, muudetakse iga kiht lihtsalt oma viiluks!
Ilmselt selleks, et see korralikult töötaks, peate oma kihtide struktureerimisel olema väga hea. Peaksite nagunii oma makete üles ehitama täielikult kihiliste ja korrastatud failidena, nii et see ei tohiks olla probleem.
Eelis
Üks peamisi põhjuseid, miks tavalised viilud on nii lamedad, on see, et see loob palju lisatööd, kui soovite tagasi pöörduda ja oma disainilahendusi näpistada. Pärast kunstiteose ümberpaigutamist peate siis tagasi minema ja kõik viilud uue paigutusega joondamiseks liikuma. Selle tüütuse tõttu päästan üksikud tükid kärpimise teel alati käsitsi.
Kihipõhised viilud on tegelikult üsna intelligentsed. Kihtide ümber liikudes järgnevad teie viilud automaatselt. Kui lisate efekte, mis muudavad piire, näiteks Outer Glow, laieneb viil selle kaasamiseks. Kui muudate kihi 30% -ni selle algsest suurusest, värskendatakse viilu jälle automaatselt!
Ilmselt on siin selge argument kihtidel põhinevate viilude kasutamiseks igal võimalusel, kuna see säästab uskumatult palju aega paratamatus ümberkujundamise etapis.
Süüte tapmine
Teine minu suurim vihastamisega seotud tüütus on see, et see võib tekitada tõesti segadusega PSD-d. See on enamasti seotud automaatse viilutamise kõrvaltoimega.
Näiteks vaadake allolevat pilti (see on siin natuke liiga lihtsustatud, kuid saate punkti). Siin soovisin tegelikult luua ainult kolme viilu, kuid Photoshop on automaatselt sisse läinud ja muutnud selle kaheteistkümneks viiluks !
Ma ei tea sinust, aga ma ei ehita veebilehti ühe suure pildikogumikuna, mis on kõik kokku pandud. Nii et ma lihtsalt ei taha kõiki neid lisalõike! Ma ei kavatse neid alasid piltideks eksportida, nii et kõik, mida nad teevad, on müra lisamine minu liidesele. Kui näen sellist dokumenti, lakkavad viilud minu jaoks tähendusrikkaks tööriistaks.
Selle parandamiseks võime haarata Slice Select Toolist ja vajutada ekraani ülaservas nuppu „Hide Auto Slices“. See teeb täpselt seda, mida nimetus vihjab, jaotab kõik need vastikud automaatsed lõigud vaate alt.
Vaata, kui palju lihtsamaks meie dokument saab! Need mõned lõigud, mida kasutasime, on selgelt tuvastatavad ja säilitavad seetõttu oma kasulikkuse. Minu arvates on see teie viilude vaatamise meetod väga eelistatud. See on üks neist juhtudest, kus Photoshop proovib minu eelistatud töövoogu lihtsalt liiga kõvasti ennustada ja jõuab funktsioonidega üle pingutada.
Viilude eksportimine
See on koht, kus viilutamise kasulikkus tõepoolest mängu tuleb. Ilma viilutamiseta peate oma kompli iga osa korraga salvestama. Töövoog oleks järgmine: tehke valik, kärpige, optimeerige jaotises Salvesta veebis, salvestage, tühistage kärpimine ja korrake. See on palju ebavajalikke samme! Vaatame, kuidas see viilutamisega töötab.
Kui olete lõpuks kõik viilutamise sisemised küljed välja mõelnud ja PSD-d valmis, siis on aeg minna menüüsse Fail ja valida „Salvesta veebile ja seadmetele”. Selle dialoogiga olete ilmselt tuttav, kuid see on natuke erinev, kui dokumendis on viilud.
Kui teil on viilusid, kuvatakse selles aknas teie dokumendi eelvaade need kõik (kahjuks hõlmab see neid tüütuid automaatlõikeid). Siit saate iga lõigu valimiseks lihtsalt klõpsata ja iga üksiku jaoks eraldi sätteid optimeerida. See hõlmab failitüüpi, kvaliteeti jne. Nii saate ühe seansi ajal seadistada kolme JPG ja PNG eksporti, millest igaüks peab teie arvates sobivat kvaliteeti.
Kui olete kõik oma maitse järgi kohandanud, klõpsake nuppu Salvesta. Peaks avanema dialoogiboks, mis võimaldab teil valida kausta, kuhu kõik pildid paigutada. Pidage meeles, et me oleme juba nimestiku seadistanud, nii et jätke see alles. Siinkohal on oluline veenduda, et ekspordite ainult kas „Kõik kasutaja viilud” või „Valitud lõigud”.
Sõltuvalt soovitud töövoodist töötab üks neist variantidest suurepäraselt. Vaikevalik on lihtsalt “All Slices”, mis hõlmab lisaks teie kasutaja- ja kihipõhistele viiludele ka täiesti kasutuid automaatlõike, mille peate niikuinii minema viskama. Salvestage endale häda ja kraavige need siia enne, kui tegelik päästmine aset leiab.
Järeldus
Käisime täna läbi palju päris tehnilisi Photoshopi asju, nii et proovin selle kenasti kokku võtta. Esiteks võib PSD tükeldamine tunduda kohmaka protsessina, kui te ei tea, mida teete. Vaadake Photoshopis tõesti ringi ja katsetage ülaltoodud näpunäidetega, et saaksite kasutada kõiki teie käsutuses olevaid tööriistu.
Teiseks pidage meeles, et viilusid on kolme tüüpi: automaatsed viilud, kasutaja viilud ja kihil põhinevad viilud. Automaatsed viilud on üsna lahjad ja on pigem viilutamise kahetsusväärne kõrvalmõju kui kasulik funktsioon. Te ei pea minuga selles kokku leppima, kuid kui te seda teete, peidake neid, et nad ei segaks nii palju. Kasutajaviilud on lihtsalt need, mille loote tahtlikult. Saate neid Slice Select Tool-iga kohandada ja sisu nimele topeltklõpsuga nimetada. Kihipõhised viilud sarnanevad kasutajaviiludega, ainult need on palju nutikamad, kuna järgivad automaatselt antud kihi piire. Saate kihti teisaldada, selle suurust muuta ja efekte lisada ning viil värskendatakse pidevalt iseseisvalt.
Lõpuks valige viiludega dokumendi eksportimisel käsk Salvesta veebis ja optimeerige iga viil oma failina. Ekspordi kindlasti ka ainult kasutaja viilud või valitud lõigud, vastasel juhul täidavad kõik Photoshopi loodud automaatsed viilud teie piltide kausta.
See on ilmselt palju rohkem, kui olete Photoshopis viilutamise kohta teada tahtnud, kuid loodetavasti on see aidanud teil märgata süsteemi ebatõhususi, nii et saate seda kasulikku tööriistakomplekti kohandada ja ikkagi ära kasutada, ilma et selle ebamugavus häiriks.
Jäta kommentaar allpool ja ütle meile, kuidas viilutate PSD-d. Töökorraldus, mille olen siin üles seadnud, on lihtsalt üks paljudest võimalikest lahendustest ja ma soovin, et teie kuulda ja õppida teie käest!
