Hvordan eksportere alle lag til separate filer i Photoshop. Riktig eksport av designmodeller fra AI til PSD


5. mai 2011

Nå for tiden kan du i økende grad møte grensesnittdesignere som har forlatt bruken av det gode gamle Adobe Photoshop i favør vektorverktøy. Med andre ord til fordel Adobe Illustrator. Fordelene er åpenbare: ved å jobbe med en vektorkilde kan vi bedre kontrollere hele prosessen enn å jobbe med et rasterbilde (selv om det er delt inn i lag). I vektor editor en tegnet sirkel forblir en tegnet sirkel, men i Photoshop er det bare mange fylte piksler. Til slutt, i en vektorredigering er det mye enklere å lage alternativer for skjermer med forskjellige pikseltettheter (hei, Retina Display!).

Det er imidlertid en oppfatning at overgangen av designere til Adobe Illustrator lover mange problemer for layoutdesignere. Layoutdesignere er for det meste konservative mennesker og er fiendtlige til nye trender. Så de nekter som oftest kategorisk å godta kildekodene til designoppsett i AI-format. Denne posisjonen er basert på to myter:

  1. Å eksportere oppsett fra AI til PSD er svært vanskelig og tidkrevende.
  2. Når du eksporterer oppsett fra AI til PSD, lider kvaliteten på bildet sterkt.

Begge disse utsagnene er bare sanne hvis du handler "head-on". Ta kildekoden i AI, ring "eksport"-funksjonen, skaff deg en PSD, og ​​prøv deretter å sortere ut rotet av lag i den, og korriger samtidig små feil som ikke var i vektorkildekoden. Så alt vil virkelig være langt og smertefullt. Som du kanskje har gjettet, tar vi en annen rute.

Den riktige måten å eksportere designmodeller fra AI til PSD på består av tre trinn:

Trinn én: ordne ting. Plasser alle tekstobjekter på et eget lag (eller flere separate lag). Vi grupperer intelligent alle andre objekter i lag. I PSD vil hvert av disse lagene være helt flate, så på dette stadiet er det på tide å tenke og bestemme hvilke deler som kan flates ut og hvilke som er bedre separert i forskjellige lag. Det er også viktig å sørge for at alle effektene av å legge gjenstander oppå hverandre forblir inne i lagene, ellers blir det skam.

Som et resultat bør vi ha et relativt lite sett med tydelig navngitte lag:

Trinn to: rasteriser den. For alle lag unntatt tekstlag, bruk Rasterize-effekten i Type Optimized-modus.


Det høres paradoksalt ut, men det er akkurat dette som må gjøres. Bare denne metoden for rasterisering gir et resultat som samsvarer nøyaktig med det vi ser i vektorkilden. Mer om dette merkelig funksjon Adobe Illustrator Jeg skrev på bloggen vår for 7 år siden: . Overraskende nok har ikke den generelle situasjonen endret seg siden den gang.

Trinn tre: eksport. Som et resultat får vi en PSD, bildet som er de minste detaljene samsvarer med originalbildet i AI.

Alle programmer i samlingen er gratis. Selvfølgelig kan de ikke sammenligne med funksjonaliteten til Photoshop, men med enkle oppgaver vil takle. Som et minimum kan du ganske enkelt åpne PSD-filen som et bilde, og noen av disse programmene åpner til og med lag.

1. GIMP

  • Operativsystem: Windows, Mac og Linux.
  • russisk språk: støttes.

Dette er en av de mest interessante gratis analoger Photoshop. GIMP leser PSD-filer uten å installere ekstra plugins, slik at du kan åpne filen på samme måte som vanlige bilder: Fil → Åpne.

GIMP åpner lagene i PSD-dokumentet for redigering. Men det er fallgruver her: programmet leser ikke alle lag; GIMP kan heller ikke lagre endringer i PSD på riktig måte. Etter dette kan det hende at filen ikke åpnes i Photoshop. Det siste burde ikke plage deg hvis du åpnet filen for mindre redigeringer og lagret bildet som en JPEG.

  • Operativsystem: starter fra Windows 7.
  • russisk språk: støttes.

Paint.NET er bedre standard Microsoft Maling, men like oversiktlig og enkel å bruke. Hvis du ikke vet hva du skal gjøre med en fil i GIMP, åpner du Paint.NET.

Programmet leser PSD, men bare etter å ha installert riktig plugin. Slik gjør du dette:

  • Last ned plugin.
  • Pakk ut filene fra det nedlastede arkivet.
  • Kopier filen PhotoShop.dll.
  • Gå til installasjonsmappe Paint.NET (f.eks. C:\Program Files\paint.net).
  • Lim inn PhotoShop.dll-filen i FileTypes-mappen.
  • Start Paint.NET.

  • Operativsystem: hvilken som helst, siden applikasjonen åpnes i nettleseren.
  • russisk språk: støttes.

Photopea er en nettjeneste hvis grensesnitt ligner Photoshop eller GIMP. Fordelen er at du ikke trenger å installere noe. Programmet åpnes i en nettleser på hvilken som helst enhet. Men nettapplikasjoner er ofte ikke like praktiske som installerte programmer. Photopea er intet unntak, men det lar deg jobbe med lag i et PSD-dokument.

  • Operativsystem: Windows (det finnes en versjon for Linux og macOS).
  • russisk språk: støttes kun i standard og utvidet versjon.

XnView er en slags grafisk arrangør der du kan åpne og organisere samlinger av bilder på din PC. XnView har primitive redigeringsfunksjoner: du kan endre fargepalett, legg til et filter eller en effekt.

Programmet er upopulært, men med god grunn: det kan åpne bilder i mer enn 500 formater og lagre dem i ytterligere 70. Så installer det som en primitiv PSD-editor eller -konverter.

I grunnleggende versjon Bare engelsk, fransk og tysk støttes.

  • Operativsystem: Windows.
  • russisk språk: støttes.

IrfanView, som XnView, er designet for å vise og konvertere grafiske filer. Men IrfanView støtter færre formater. Programmet åpner PSD-en som et bilde. Du kan ikke redigere lag, men du kan redigere et vanlig bilde. For å få flere behandlingsalternativer, må PSD-filen først konverteres til et annet format.

IrfanView fungerer raskt og er lett ( installasjonsfiler tar opp litt mer enn 3 MB).

Hvis ingen av alternativene passer deg, kan du konvertere PSD til JPG ved å bruke Go2Convert eller en annen konverter. Du kan også åpne PSD-en som et bilde i Google Disk.

Hvordan overføre en illustrasjon, nettstedsdesign eller brukergrensesnitt fra Illustrator til Photoshop uten å bruke smart objektkopiering? Samtidig ønsker jeg å beholde objektvektoren etter overføring. Bør hjelpe med dette standard funksjon eksporter til PSD, men er det sant?

I Illustrator, i menyen Fil → Eksporter → PSD er det et alternativ "Skriv lag" med elementet "Maksimal redigerbarhet", men resultatet er tilfeldige rasterlag som vektorobjekter gjøres om til. Det ser ikke ut som "maksimal redigeringsevne" i Photoshop.

Til tross for eksportalternativer ble to ruter til ett rasterlag i PSD

Å finne en løsning

Vi må bekjempe utviklerne av Adobe med urettferdighet. Jeg ser etter russiskspråklige, vestlige artikler (jeg kom over en interessant fra 2011 fra Turbomilk), leksjoner, videoer på YouTube. Nesten overalt handler det om å gruppere objekter i illustrasjonen, sortere etter lag (rekkefølgen i lag er nyttig for arbeid, ikke bare for eksport) og videre manuell rasterisering via Objekt → Rasteriser i selve Illustrator eller automatisk under eksport. Men jeg vil beholde objektvektoren i PSD.

Eksporter fra AI i henhold til Turbomilk-artikkelen. Ordne i grupper, lag, men alt er raster

Krever Illustrator versjon CS6 og høyere

Skriptet sjekker alle objekter i dokumentet, uavhengig av hvilket lag eller gruppe de er på. Etter å ha funnet et objekt med ensfarget fyll, bruker han en handling på det med Lag sammensatt form-operasjonen. For å lagre vektorstrøk til objekter, må du bruke Objekt → Bane → Omrissstrek.

Hvis du har en gruppe på hundrevis av små objekter, for eksempel hår, pels eller tekst konvertert til kurver tegnet med en pensel, er det bedre å kombinere slike elementer i Compound Path ved å bruke Cmd + 8-tastene (Ctrl i Windows) før utfører skriptet, slik at skriptet skriver hvert objekt, en bokstav jeg ikke behandlet det separat.

Unntak

Hvis filen inneholder objekter som Photoshop-effekter er brukt på (skygge, glød, støy osv.), må de rasteres manuelt i Type Optimized-modus før du kjører skriptet.

På grunn av spesifisiteten til noen typer objekter (gradienter, mønstre, masker og en rekke andre), ifølge testresultater, kan ikke alle eksporteres fra AI til PSD, gjenværende vektor, men de kan gjøres til separate raster lag uten langvarig sortering i grupper og lag i Illustrator. For å gjøre dette brukes et annet triks: skriptet lager separat en separat gruppe fra hvert slikt objekt.

2 ruter i AI separate grupper etter eksport til PSD

Kort oppsummering

  • Når vi eksporterer fra AI til PSD, beholder vi gjennomsiktighetsparametrene og lagblandingsmodusene.
  • Ved å bruke Make Compound Shape kan du lagre vektorobjekter i PSD.
  • Gradienter, mønstre, masker, objekter med rastereffekter, former med streker rastreres.
  • Konvertering av hvert rasterisert objekt til en gruppe gjør at det kan lagres etter eksport separat lag i Photoshop.
  • Flate ikoner, UI-elementer, illustrasjoner - etter klargjøring kan du få dem inn PSD-fil helt i vektorform.
  • Å klargjøre filen med Ai2Psd-skriptet bidrar til å redusere antallet selvlaget for filer med et stort antall gjenstander.

Mateusz Nowak: "Takk for Ai-to-Psd-manus!"
Dilyana Aleksandrova: "ai to psd reddet rumpa mi på jobben mann, takk for at du delte det!"
Weyn Cueva: «Dette er fantastisk! Jeg har lett etter noe lignende fordi jeg jobber mer i Photoshop. Takk."
Maggie Stilwell: «Dette er kjempebra! En flott tidsbesparer. Takk for at du deler det."
WashIrving: «Ser jævla nyttig ut. takk bror"
zmotion: “Flott manus. Jeg er sikker på at dette vil være veldig nyttig for mange, inkludert meg!»

Og for eksempel en vektorillustrasjon som ble behandlet av et skript og eksportert til PSD-format.

173 objekter i AI ble behandlet på 40 sekunder. I den endelige PSD-en er alle lag vektorformer

Jeg bruker dette Photoshop-skriptet nesten hele tiden når jeg lager samlinger for nettstedet mitt. Dette gjelder hovedsakelig bilderedigering. Og inn i dette tilfellet batchbehandling sparer betydelig tid. Til å begynne med trenger vi naturligvis et Photoshop-dokument som skal ha flere lag. Deretter, gjennom menyen, kaller vi opp en spesiell dialogboks, der vi angir banen for å lagre bildene, prefikset for filnavnet, velger filtype (for det meste jpg) og setter bildekvalitetsnivået. Så kjører vi manuset og får ferdige bilder.

Trinn 1
Så vi har et Photoshop-dokument med flere lag (i dette tilfellet 11), som vi faktisk ønsker å konvertere til separate filer.

Trinn 2
I menyen velger du banen "Fil" (Fil)> "Skript" (Skript)> "Eksporter lag til filer"

Trinn 3
Fyll ut følgende felt i dialogboksen som åpnes. Velg hvor du vil lagre bildet på datamaskinen din ved å bruke "Bla gjennom...". Du trenger ikke å spesifisere et filnavn, siden skriptet fortsatt vil lagre filene under sine egne navn. Jeg pleier å gi nytt navn til alle filene selv. Hvis du bare trenger å ta bilder synlige lag, merk av i boksen for Bare synlige lag. Velg deretter filtypen. Klikk deretter Kjør.

Trinn 4
Skriptet gir muligheten til å velge disse filtypene. Den mest nyttige jpg her for meg.

Trinn 6
Etter å ha fullført oppgaven, vil skriptet vise følgende melding om vellykket fullføring av eksport av lag til filer.

Trinn 6
Vel, på stedet der du angav, vil 11 separate filer i jpg-format vises.

Et dokument i Adobe Illustrator består av lag.

Hvorfor trengs lag?

Hvert lag består av underlag eller underlag, hvert underlag inneholder 1 objekt (kurve, linje, punkt, enkel figur).

Hovedfunksjonene til lag i Illustrator:

  • Enkel håndtering (utvelgelse, gruppering, flytting, skjule/visning) av enkeltobjekter, dette gjelder spesielt når illustrasjonen er kompleks, det er mange objekter og de overlapper hverandre.
  • Overføring av designattributter (egenskaper) mellom lag
  • Guidekontroll
  • Opprette komplekse bilder ved hjelp av hierarkiske kjeder (det vil si at de objektene som er på underlaget tar på seg parametrene til laget de tilhører)
  • Manuell sporing (opprette et mallag)

Poenget er at lag i Illustrator (Adobe Illustrator), så vel som i Photoshop, er nødvendig for mer fleksibelt arbeid med individuelle objekter.

Vi kan jobbe med lag inn Lagpalett. Lagpaletten er inne Vindu/lagmeny, og som standard er det på skrivebordet.

Det nye dokumentet består av 1 lag.

For å lage et nytt lag i Adobe-programmet Illustrator må finnes ikonet nederst på lagpaletten, som kalles Opprette et nytt lag. Eller du kan bruke hurtigtaster alt+ctrl+L

Hvert lag kan inneholde ett eller flere objekter.

Flere lag eller objekter i lag kan kombineres til grupper. Gjenstander i grupper kan flytte sammen, forvandle, men samtidig egenskaper (farge, strek) for hvert objekt forbli individuell og uforanderlig.

Lag kan byttes For å gjøre dette, må du ta tak i firkanten til høyre for lagnavnet med musen og dra den høyere eller lavere i lagpaletten. Det øverste laget i lagpaletten overlapper lagene under.

Lag i paletten kan opprettes, slettes, gis nytt navn(gi nytt navn med to museklikk på lagnavnet). For å fullstendig kopiere et helt lag med innholdet, dra laget til ikonet Opprette et nytt lag nederst på lagpaletten.

Velg objekter mulig med et verktøy Utvalg eller på Lagpalett, klikk på sirklene i kolonnen til høyre, som er ved siden av de blå rutene (forresten, rutene kan ha en annen farge, det avhenger av laget de er plassert på).

Lag det kan være synlig Og ikke synlig. For å gjøre dette, finn øyet i lagpaletten for ønsket lag og klikk på det, det vil forsvinne. Hvis øyet er blekgrå, må du først returnere synlighet til det overordnede objektet. For å skjule (vise) alle lag unntatt ett, klikk på ønsket lag og hold nede samtidig ALT.

Hver eneste lag eller gruppe lag kan være blokkere, i dette tilfellet et objekt, lag eller gruppe i Illustrator vil slutte å skille seg ut. Låsing er nødvendig hvis du er redd for ved et uhell å flytte, endre eller slette et objekt i Illustrator (Adobe Illustrator). Et låst objekt vil ha en lås (se illustrasjon), for å fjerne det må du klikke på det i lagpaletten, hvis låsen er blekgrå, må du først fjerne låsen fra det overordnede objektet, laget. Føringer plassert i det låste laget slutter også å virke (bevege seg) og snapping til slike guider kan ikke utføres.

Hurtigtaster for arbeid med lag, objekter på lag i Illustrator (Adobe Illustrator).

Ctrl+[— flytt objekt 1 opp

Ctrl+]— flytt objekt 1 ned

Shift+ctrl+[— flytt objektet til bakgrunnen

Shift+ctrl+]— flytt objektet til forgrunnen

Ctrl+G— kombinere flere objekter til en gruppe

Shift+Ctrl+G- avbryt gruppering

Skifte— lar deg velge flere objekter eller lag samtidig

Denne leksjonen er en del av kurset mitt