Transparentni GIF u Adobe Illustratoru radi se na sljedeći način. Idite na meni Datoteka > Sačuvaj za Web i uređaji (Alt+Ctrl+Shift+S). U prozoru koji se otvori, u polju Optimizirani format datoteke, prvo morate otići na karticu veličina slike(veličina slike). Činjenica je da cijela stranica po defaultu ulazi u prozor za optimizaciju, a to obično nije potrebno. Stoga, na kartici Veličina slike poništite izbor u polju za potvrdu Isječak na Artboard(Izrežite stranicu tako da odgovara) i kliknite na dugme Primijeni.
Zatim na listi za odabir formata odaberite GIF i potvrdite okvir Transparentnost.
Nakon toga ćemo odrediti koje će boje biti prozirne. Sve boje prisutne na slici nalaze se na kartici tabela boja(Tabela boja) i prikazani su kao kvadrati u boji. Odaberite alat na traci sa alatkama na lijevoj strani prozora kapaljka za oči(pipeta).
Boje se mogu definirati na dva načina. Najlakši način je da navedete boju kapaljkom direktno na slici - nakon toga će boja biti istaknuta na tabeli boja tamnim potezom. Pa, ako tačno znate koja boja treba da bude prozirna, možete je odabrati direktno na tabeli boja klikom na odgovarajući okvir u boji. A u prvom i drugom slučaju, ako trebate odabrati nekoliko boja, morate raditi s pritisnutim tipkom Shift (ili Ctrl). Nakon odabira boje, potrebno je da naložite programu da je učini transparentnom. Da biste to učinili, kliknite na ikonu Mapira odabrane boje u Transparent(Dodajte odabrane boje prozirnosti). Na slici je ovo dugme zaokruženo, a crvena boja je postavljena na prozirnu. Na slici će se pojaviti prozirna oblast, a kvadrat na tablici boja će promijeniti svoj izgled - dio će postati bijeli trokut. Da biste poništili odabranu boju, potrebno je da je odaberete u tabeli boja, a zatim ponovo kliknite na ikonu Mapira izabrane boje u prozirnu.
Nekoliko riječi o načinu postavljanja transparentnosti. Za to je odgovoran padajući meni. Odredite algoritam Transparency Dither, na ruskom - Algoritam za simulaciju transparentnosti (sl. ispod). Postoje četiri izbora: No Transparency Dither - bez algoritma, Diffusion Transparency Dither - difuzni algoritam, Pattern Transparency Dither - algoritam zasnovan na uzorcima i Noise Transparency Dither - algoritam zasnovan na buci. U režimu difuznog algoritma, klizač postaje aktivan Iznos(Količina) koja vam omogućava da promijenite vrijednost difuzije. Šta primijeniti u praksi? U zavisnosti od namjene i slike. Ne koristim ovu opciju i uvijek ostavljam zadanu vrijednost - Bez prozirnosti.
Kliknite na Save - transparentan gif spreman. Rad je obavljen u Adobe Illustrator verziji CS4 (v.14), ali sve radnje i prečice na tastaturi su relevantne za raniju verziju CS3 (v. 13).
Danas nemamo baš uobičajeno Adobe tutorial Ilustrator. Jer ovoga puta nećemo napraviti statičnu sliku, već pravu animaciju. Zamislite da ispadne pomoć od Adobe-a Ilustrator može crtati i crtane filmove :)
A za ovo nam ništa ne treba. Kompetentna organizacija slojeva i izvoz završnog rada u swf format, gdje se svaki sloj pretvara u okvir animacije. U današnjem tutorijalu nacrtat ćemo animaciju odbrojavanja u stilu retro filma. Izlaz bi trebao biti flash film sa istim odbrojavanjem.
Prvo što treba učiniti je nacrtati sve potrebne elemente za buduću animaciju. Da bih to uradio, napravio sam dve pozicije filmskog okvira u zasebnom dokumentu, krug za referencu, koji je izrezan na zasebne sektore, teksturu i vertikalnu ogrebotinu da bih dodao efekat antike, kao i sve brojeve i natpise.
Kada su svi dijelovi našeg crtića spremni, možete početi kreirati samu animaciju. Radi praktičnosti, to je najbolje uraditi u novom dokumentu. U ovom slučaju, slojevi će igrati ulogu okvira animacije. I u samom prvom sloju, samo trebate kopirati kadar filma. Postavite ga na sredinu radnog područja.
Sada kreirajte drugi sloj i kopirajte filmski okvir u njega, u kojem su rupe na rubovima napravljene s pomakom. Takođe treba da bude centriran.
Iz ova dva sloja već možete dobiti animaciju filma u pokretu. Ali kasnije će nam trebati mnogo više slojeva. Dakle, odaberite prva dva sloja, idite na opcije panela i napravite kopiju slojeva.
Na sličan način trebamo akumulirati 12 slojeva sa filmskim okvirima koji definiraju njegovo kretanje.
Sada imamo čitavu gomilu slojeva i svi su vidljivi. U smislu da gornji slojevi blokiraju donje, što nije baš zgodno za rad. Stoga možete isključiti neke slojeve klikom na ikonu oka lijevo od naziva sloja. Da biste isključili ili uključili sve slojeve odjednom, držite pritisnutu tipku Alt dok kliknete na ikonu oka. Uključujući i isključujući slojeve, možete vidjeti šta se tačno nalazi u određenom okviru naše buduće animacije. A sada, da bismo dodali lagani potres kretanju filma, moramo malo pomjeriti primljene kadrove u različitim smjerovima. Da biste to učinili, uključite samo sloj s kojim ćete raditi ovog trenutka, a zatim pomaknite okvir za nekoliko piksela na obje strane.
Kada prođete kroz sve slojeve i dodate malo pomaka, možete početi kreirati animaciju pokretnog kruga. Da biste to učinili, kopirajte krug koji se sastoji od sektora iz dokumenta o dijelovima crtića i stavite ga na prvi sloj na okvir filma.
Ako uklonite odabir iz kruga, tada će izgledati kao jedna cjelina. To je upravo ono što nam treba.
Ali pošto se sastoji od zasebnih sektora, moguće je, promjenom njihove boje, vrlo brzo i jednostavno kreirati animaciju. Da biste to učinili, kopirajte ovaj krug u drugi sloj i učinite prvi sektor svjetlijim. Sjećate se da se film trese tokom kretanja, tako da nije potrebno staviti krug tačno u centar kadra. Stavite ga na oko.
Slično, morate kopirati krug u svaki sljedeći sloj, dok slikate svjetlijom bojom jedan sektor više nego prethodni put. Zajedno, ovih 12 slojeva čine animaciju kretanja filma s krugom punjenja.
Zatim moramo dodati teksturu našim slojevima. Uključite prvi sloj i kopirajte teksturu iz izvorne datoteke sa rezervnim dijelovima.
Zatim uključite sljedeće slojeve redom i kopirajte istu teksturu tamo. Da bi izgledao drugačije na svakom kadru, samo ga zarotirajte za 90 stepeni. Kao što ste možda pretpostavili, moramo dodati teksturu na svih 12 okvira.
Ako ste već prilično umorni od kopiranja, onda vas mogu ugoditi - ostalo je jako malo. Najteži dio je gotov. Ostaje dodati vertikalne ogrebotine, i gotovo sve. Da biste to učinili, ponovo kopirajte originalnu ogrebotinu i stavite je na proizvoljno mjesto u nekoliko slojeva. U mom slučaju, ogrebotine se pojavljuju u samo dva sloja.
Sada kada je glavni ciklus sa filmskom animacijom spreman, ostaje da se dodaju brojevi. Pošto brojimo od 3 do 1 plus riječ Go!!!, potrebno nam je još više slojeva. Ne 12, već čak 48. Da biste to učinili, trebate napraviti još tri kopije gotovih slojeva s filmskom animacijom.
A onda je sve jednostavno. Uključite prvi sloj i tamo stavite broj tri.
Zatim morate kopirati ovu figuru u sljedeće slojeve dok se animacija kruga ne završi. Kada dođete do sljedeće kopije slojeva, gdje će krug ponovo biti potpuno popunjen, morate staviti broj dva. Na isti način kopirajte broj jedan u željene slojeve. A kada dođete do završnih slojeva za oznaku Go!!!, jednostavno izbrišite krug prije nego što kopirate oznaku na željeni sloj.
To je sve sa animacijom. Ovdje je glavna stvar da se ne zbunite. Možete slojevima dati neka zgodna imena, ali sam bio nekako previše lijen :) A ipak, kada završite, obavezno uključite sve slojeve klikom na ikonu oka.
U prozoru postavki izvoza, obavezno postavite Izvezi kao: AI slojeve na SWF okvire. Ova opcija pretvara Illustrator slojeve u okvire animacije. Zatim kliknite na dugme Napredno.
Otvoriće se dodatna podešavanja. Ovdje trebate podesiti Frame Rate. Imam 12 sličica u sekundi. Polje za potvrdu Looping je odgovorno za ciklus animacije. Zahvaljujući njoj, video će se puštati u krug. A opcija Layer Order: Bottom Up prikazuje slojeve ilustratora odozdo prema gore na panelu. Upravo tako smo izgradili našu animaciju.
Kao rezultat, dobijamo flash film sa našom animacijom.
Sada vidite da pravljenje jednostavne animacije u Adobe Illustratoru nije tako teško kao što se čini na prvi pogled.
Ali da biste kreirali dugačke video zapise ili interaktivne aplikacije, ipak je bolje koristiti Adobe Flash ili druge flash uređivače. Na primjer, napravio sam ovu mačku u starom Macromedia Flash-u koji sam iskopao na poslu.
Također u posljednje vrijeme, HTML5 i CSS3 se sve više koriste za kreiranje animacije. Ovaj kod podržavaju moderni pretraživači i ne zahtijeva korištenje flash playera.
Roman aka dacascas posebno za blog Bilješke mikrostock ilustratora
Pretplatite se na naš newsletter kako ne biste propustili ništa novo:
Zdravo! Danas ću pokušati da opišem karakteristike programa Adobe Illustrator, upoređujući to sa mogućnostima ispiranja. Ovo neće biti globalna analiza programa za kosti, već opis nekih od zanimljivih čipova koje sam otkrio u ovom programu. Sakupljao sam informacije dio po dio dok sam ih proučavao kako bih sve stavio u jedan post. Moram odmah priznati da nisam super iskusan korisnik ilustratora, samo ga zadnjih šest mjeseci koristim u crtanju (prije toga sam sve crtao blic). Mnogi se žale da je ilustrator složen, ne uvijek intuitivan. Donekle se slažem da je ovaj program nakon flasha težak. Ali glavna stvar ovdje nije odustati, već nastaviti učiti. I nakon par sedmica se nameće misao, kako sam se prije snašao bez toga!
Dakle, ono što mi se svidjelo kod ilustratora, a ono što sam pronašao za sebe nije u flashu.
1. Počeću s najjednostavnijim, ali u isto vrijeme neophodnim. Pokušajte da u blic rasporedite predmete u krug. Ranije je bio Deco Tool, ali je uklonjen, očigledno smatran nepotrebnim. Odlučili smo da bi bilo zabavnije to raditi ručno. Illustrator ima ovu funkciju: Efekat - Distort&Transform - Transform.
Sve je brzo i jednostavno, vrijednosti (udaljenost između objekata, broj kopija) postavljamo sami u postavkama.
2. Cik-cak
Još jednostavnija, ali ipak korisna stvar. Činilo bi se sitnica, ali u flashu morate crtati rukom, u ilustratoru je to pitanje sekundi.
3. Deformacija objekata (Warp)
Ništa slično ovome nema u Flashu. U primjeru ispod, pokazao sam samo 2 načina za deformaciju jednostavnih oblika (Efekat - Warp - Arc / Fish). Zapravo, ima ih 15 u najnovijoj verziji programa.
4. Automatsko zaokruživanje uglova (Round Corners)
To se može uraditi ručno: na grafičkom objektu, kada se izabere u uglu (u svim uglovima), pojavljuje se bijela tačka i znak zaobljene linije. Prevucite mišem, prilagodite svom ukusu.
Ali ovo se odnosi samo na oblike, s linijom olovke malo drugačije - primijenite efekat zaokruživanja ( Efekat - Stilizacija - Zaobljeni uglovi). Na izlazu dobijamo isti rezultat.
5. Roughen
Efekat se primenjuje na jednostavne forme (Effect-Distort&Transform-Roughen). Kao rezultat, dobijamo nešto što liči na low-poly 3D modele. Mislim da je cool :) I što je najvažnije - vrlo jednostavno.
6 Pucker&Bloat(Uvucite i naduvajte)
Primjer na slici ispod:
7. Ekstenzija obrasca (Offset Path)
U flash-u postoji funkcija Expand Fill (popuna ekstenzija), ona uopće ne radi sa olovkom, za razliku od ilustratora.
8. Četke (Umjetnički kist, Kist za uzorke, Scatter Brush)
Pogledajte sliku ispod za primjere:
9. Četkica za teksturu (četke za teksturu)
U ilustratoru ima i mnogo četkica za teksturu o kojima sam pisao i kako su se pojavili nova verzija blic - . Primijećeno je da je upotreba četkica u Adobe Animateu užasno spora. To je to:(
10. Nisam siguran da li je ovo trik, ali želim da se fokusiram na kist sa smiješnim imenom mrljaČetka. Smješten na alatnoj traci, vrlo lijepa četka za korištenje. Ima gomilu podešavanja, sviđa mi se više nego inače. Teško je riječima opisati njegove prednosti, bolje je jednom probati.
10.Split to Grid
Još jedna korisna funkcija je Split to Grid (Object-Path-Split to Grid) funkcija koja vam omogućava da izrežete obrazac na jednake segmente. Na šta nas ovo podsjeća? Tako je - prozori u visokoj zgradi. Što se mene tiče, super stvar za crtanje, na primjer, urbanih pejzaža;)
Drugi koristan alat, predstavljen u ilustratoru, vjerovatno od njegovog prvog izdanja. Pomoću njega možete kreirati, na primjer, teksture drveta:
12. Pomakni (desno - Transformiraj - Pomjeri)
Pomaknite objekt za datu udaljenost. Ako želite, možete odmah kreirati kopiju koja će biti postavljena na željenoj udaljenosti od odabranog objekta horizontalno/ili okomito. Ranija verzija flash-a imala je dodatak koji je imao ovu funkciju. Nažalost, ne sjećam se njegovog imena.
Vrlo je zgodno kreirati bešavne uzorke u ilustratoru ( Objekat-uzorak-napravi). Sjećam se kako sam mahnito briljirao u bljesku sa stvaranjem . U ilustratorskoj verziji CC 2015 sve je automatizirano, gomila postavki pomoći će vam da kreirate uzorak u desetinama varijacija, sa samo nekoliko grafičkih elemenata pri ruci. U više rane verzije programi su se morali raditi ručno, kao do sada u flashu.
(Napomena - uzorak se može učiniti vektorskim objektom koji se može uređivati pomoću funkcije parse ( Object-Expand Appearance).
14. Objektni mozaik (Mozaik)
Kreirajte paletu boja na osnovu postojeće slike. Zatim uvezite sliku koja vam se sviđa u ilustraciju (Otvori). Objekt - Kreirajte objektni mozaik. U postavkama određujemo frekvenciju podjele po visini i širini.
I na izlazu dobijamo:
15.Blend (miksanje)
Koristi se za kreiranje gradijenata. Možete kreirati prelaze korak po korak, kao, na primjer, na slici. Ne mogu reći da ga često koristim, ali možda nekome dobro dođe. Čini mi se da se može koristiti za kreiranje jednostavnih pozadinskih slika.
Alat se također može koristiti za kloniranje objekata. Postavljamo dva objekta na udaljenosti jedan od drugog i primjenjujemo Blend Options, biramo broj koraka (broj kloniranih objekata).
16. Alat za izgradnju oblika. Vrlo zgodna stvar za rad sa primitivcima. U trenu, kako mi se činilo, manje je zgodno.
Držeći Alt i klikom na odabrane segmente - izbrišite segmente. Ako jednostavno prevučemo miša preko nekoliko odabranih područja - veze.
Dodatak - alat koji pomaže u automatskom rezanju, povezivanju itd. odabrane forme. Što se mene tiče, nije baš zgodno, češće ga koristim Buildoblikalat.
(umjetničke ploče)
18.Custom Tool Panel
Mogućnost kreiranja vlastite alatne trake, odbacivanja nepotrebnih i odabira samo onih koje koristite.
U flashu, umjetničke ploče, odnosno scene ( Scena 1,2,3..) nalaze se odvojeno i potrebno je da prelazite između njih (Shift + F2). U illustratoru, sve se mogu postaviti pred vašim očima. Zgodno je kada napravite nekoliko verzija istog crteža, tako da vam sve opcije budu pred očima radi poređenja.
19.Izometrija sa Grafički stilovi
I posljednja stvar je kreiranje izometrije bez korištenja 1 klika (ili bolje rečeno, 3 klika, jer imamo 3 strane;) korištenjem grafičkih stilova ( Grafički stilovi). Kako se to radi, pisaću sledeći put.
Ono što ilustrator ima zajedničko sa flash-om je mogućnost snimanja objekta u simbol (simbol) i ovaj simbol se takođe može bez problema prenijeti na flash (otvorite .ai fajl u flash-u, tako što ćete Uvoz - uvoz u pozornicu).
Simbol u ilustratoru ima ista svojstva kao u flashu.
I na kraju ću napisati šta je u ilustratoru, po mom mišljenju, inferiorno u odnosu na flash. Da, da, i postoji. A ovo je alat za punjenje ( kantica). Koliko god se trudio da se naviknem na illa-u, u flashu je zgodnije.
Ako su vam moje bilješke postale korisne ili želite nešto sami dodati - dobrodošli u komentare! Sretno svima ;)
Optimizacija web grafike
Grafičke informacije se prenose mnogo sporije od tekstualnih, a vrijeme učitavanja slika je proporcionalno veličini njihovih grafičkih datoteka. Dakle brzo učitavanje Web stranice zahtijevaju malu veličinu grafičkih slika ugrađenih u njih, što se postiže njihovom optimizacijom. Optimizacija slike se podrazumijeva kao njena transformacija, koja osigurava minimalnu veličinu datoteke uz zadržavanje potrebne ovaj slučaj kvaliteta slike, koja se postiže prvenstveno smanjenjem broja boja u grafičkim slikama, korištenjem komprimiranih i posebnih formata datoteka, te optimizacijom postavki kompresije za pojedinačne fragmente slike.
Illustrator ima ugrađene alate za optimizaciju slike koji pružaju razne metode pregledajte brz i efikasan proces optimizacije. Pregled daje prilično točnu ideju o tome kako će optimizirana slika izgledati u stvarnom vremenu, što pomaže u procjeni rezultata optimizacije i uspješnom odabiru željenih postavki. Možete optimizirati i slike kreirane direktno u Illustratoru i druge, kao što su fotografije koje namjeravate staviti na web stranicu.
U prozoru se postavljaju parametri optimizacije Sačuvaj za Web(Sačuvaj za Web), poziva se istoimenom komandom iz menija fajl(File). Program nudi korištenje jednog od četiri načina pregleda, ali dva su najbolja za procjenu kvaliteta optimizacije:
- 2-Up(dve opcije) - istovremeno gledanje originalne i optimizovane slike u skladu sa navedenim postavkama (slika 1);
- 4-Up(četiri opcije) - u ovom modu, okvir za prikaz je podijeljen u četiri prozora (slika 2) za prikaz originalne slike i tri verzije optimizovane: prva verzija se kreira na osnovu postavljenih vrijednosti optimizacije, a druge dvije su opcije za trenutne postavke optimizacije.
Oba načina vam omogućavaju da značajno uštedite vrijeme na pretraživanju. najbolja opcija optimizacije, jer eliminišu potrebu za pohranjivanjem slika iz različite postavke optimizacija i njihovo naknadno vizuelno poređenje. Osim toga, moguće je procijeniti ne samo kvalitetu optimizirane slike, već i njenu veličinu i vrijeme preuzimanja za različite opcije povezivanja. Za usporedbu, najprikladniji način je 4-Up (četiri opcije), koji vam omogućava da vizualno procijenite učinak kompresije ili smanjenja palete na kvalitetu i veličinu slike i na kraju odredite najbolji parametri optimizacija.
Illustrator vam omogućava da optimizirate web grafiku ne samo u formatima GIF, JPG, PNG-8 i PNG-24, već iu SWF i SVG. Indeksirane slike imaju mala količina boje se čuvaju kao GIF. Za spremanje slika u punoj boji i sivih tonova - fotografije i grafike bogate bojama, kao što su gradijentne ispune - koristite JPG format. Za slike u punoj boji sa prozirnim područjima, primijeniti PNG format, koji vam omogućava da sačuvate i indeksirane i slike u punoj boji, dok je u PNG-8 maksimalni mogući broj boja optimizovane slike 256, a u PNG-24 slika može imati milione boja, pa je stoga slična u JPEG format. Razlika između PNG-24 i JPEG je u tome što metoda kompresije koja se koristi za optimizaciju PNG-24 slika ne dovodi do gubitka kvaliteta, ali povećava veličinu datoteke. SVG i SWF formati kombinuju grafiku, tekst i interaktivne komponente i takođe se mogu optimizovati.
Razmotrimo konkretan primjer optimizacije slike. Recimo, u programu Illustrator je razvijen amblem sajta (slika 3), originalno sačuvan u AI formatu. Pokušaj da se odmah optimizuje za Web neće dovesti do ničega dobrog, jer će u tom slučaju slika biti automatski izrezana, što neće uzeti u obzir pravi položaj natpisa dobijenog kao rezultat deformacije (slika 4 i 5).
Stoga, hajde da pokušamo da izvezemo amblem u PSD format tim Datoteka=>Izvoz(File=>Export) - veličina kreirane slike će biti 143 KB. Otvorite rezultirajuću PSD datoteku i koristite naredbu Datoteka=>Sačuvaj za Web(Datoteka=>Sačuvaj za Web). S obzirom na ograničen broj boja uključenih u sliku, u ovom slučaju, GIF format je optimalan, sa specifičnim postavkama za koje se morate odlučiti. Eksperimentiranjem s postavkama to možete vidjeti najbolji kvalitet daje zadani algoritam kompresije programa selektivno(Selektivno). Što se tiče anti-aliasinga, onda je, s obzirom na prisutnost gradijenta ispune, bolje odabrati algoritam s generiranjem šuma - buka(Sl. 6). Veličina rezultirajuće datoteke za optimizaciju iznosiće 6,729 KB (slika 7), dok će pozadinska prozirnost biti očuvana, što je lako provjeriti pohranjivanjem slike u GIF formatu zajedno sa HTML datotekom (slika 8). Kao rezultat toga, u ovom primjeru, datoteke emblem.html i emblem.gif su dobijene u folderu Primer1.
Dugmad
Neizostavan specifični element dizajna svake web stranice su grafičke kontrole – dugmad. Jednostavno je nemoguće zamisliti stranicu bez njih. Crtanje dugmadi danas je postalo poseban žanr, a Illustrator vam omogućava da kreirate najsloženije opcije. Na primjer, dugmad dizajnirana kao mrežasti objekti i (ili) sa maskama izgledaju mnogo efektnije od uobičajenih.
Razmotrite opciju kreiranja okruglog podignutog dugmeta u Illustratoru. Nacrtajte vektorski objekat ispunjen proizvoljnom bojom u obliku kruga (slika 9) i konvertujte ga u mrežu pomoću naredbe Object=>Kreiraj Gradient Mesh(Object=>Create Gradient Mesh) navođenjem četiri reda i četiri kolone i na listi Izgled(Prikaži) odabirom opcije Do centra highlight(Pozadinsko osvetljenje) na 60 (Slika 10). Odaberite alat Direktan odabir i kliknite na lijevo gornji ugao objekta, ističući čvorne tačke koje se tamo nalaze (slika 11). Promijenite boju odgovarajuće ćelije u bijelu odabirom na paleti Swatchevi(Sl. 12).
Uzmi alat Elipsa(Elipsa), postavite marker miša na centar kruga kreiranog prije i, dok držite pritisnute tipke alt i Shift, razvucite novi krug na vrh starog tako da bude veći od starog za 1-2 piksela sa svih strana. Neka bude crni okvir Moždani udar) širine 1-2 px i ispunite ga radijalnim gradijentom od crvene do bijele (slika 13). Prevucite kreirani vektorski objekat 1-2 piksela udesno i dole, a zatim, bez uklanjanja selekcije, kliknite desnim tasterom miša na njega i od kontekstni meni odaberite tim Raspored=>Pošalji nazad(Organiziraj=>Pošalji nazad). Kao rezultat, dobijamo prazninu za dugme prikazano na Sl. četrnaest.
U pravilu, na bilo kojoj web stranici postoji nekoliko gumba istog tipa, koji se razlikuju, na primjer, samo u smjeru strelica koje su nacrtane na njima, što ukazuje na smjer kretanja po stranici. Razmotrimo najjednostavniji slučaj sa dva dugmeta, od kojih će jedno, sa strelicom nadole, značiti prelazak na sljedeća stranica, a dugme sa strelicom nagore prelazi na prethodni. Kao prazan prostor za strelicu, uzmimo pravilan trougao nacrtan alatom Poligon(Poligon) ispunjen crnom bojom i takođe stilizovan kao mrežasti objekat za veći efekat. Pomaknite strelicu na dugme i podesite položaj svih objekata jedan u odnosu na drugi pomoću odgovarajućih dugmadi na paleti Poravnajte(Poravnanje). Prvo od primljenih dugmadi je prikazano na sl. 15. Napravite kopiju sloja pomoću dugmeta odabirom naredbe Duplikat sloja Slojevi, - kao rezultat dobijamo dva identična sloja. Zatim odaberite strelicu na kopiji sloja i zarotirajte je za 180° odabirom naredbe iz kontekstnog izbornika Transform=>Rotiraj- Transformacija=>Rotacija. Dobijamo isto dugme kao što je prikazano na sl. 16. Imajte na umu da je mnogo praktičnije pohraniti sve tipke istog tipa jednog projekta u jednu datoteku na različitim slojevima, što je prikazano u ovom slučaju.
Sada morate da sačuvate optimizovane opcije za svako dugme. Prvo, učinite donji sloj nevidljivim - u ovom slučaju, dugme na gornjem sloju će biti sačuvano. Odaberite tim Datoteka=>Sačuvaj za Web(File=>Save for Web), konfigurišite parametre optimizacije dugmeta, na primer, kao što je prikazano na sl. 17, kliknite na dugme Sačuvaj(Sačuvaj) i unesite naziv datoteke. Dugme sačuvano kao rezultat prikazano je na Sl. 18. Sada učinite donji sloj vidljivim, gornji sloj nevidljivim i sačuvajte drugo dugme na isti način, dajući mu drugačije ime. Rezultat je prikazan na sl. devetnaest.
Sada ostaje samo da se uverite da dugmad dobro izgledaju na veb stranici i da ih postavite na prilagođenu stranicu (slika 20). Kao rezultat toga, u ovom primjeru, datoteka Primer2.html i dvije grafičke slike su dobijene u folderu slika (fascikla Primer2).
Po želji, tokom procesa optimizacije, dugme se lako može pretvoriti u krišku. U ovom slučaju, nakon odabira naredbe Datoteka=>Sačuvaj za Web(Datoteka => Sačuvaj za Web) i postavke optimizacije treba izabrati iz alata palete alata Slice Select(Odabir kriške) i dvaput kliknite na sliku, koja će se automatski pretvoriti u krišku sa serijskim brojem 1 (Sl. 21). Ponovnim dvostrukim klikom otvorit će se prozor Slice Options(Slice Options), u kojoj ćete morati navesti vezu i po želji promijeniti naziv slice-a (slika 22), a zatim sačuvati optimiziranu sliku. Rezultat će u ovom slučaju biti datoteke Primer3.html (slika 23) i Primer3.gif (fascikla Primer3).
Interaktivni elementi
Jedan od načina da začinite stranicu je uvođenje elemenata dizajna koji ih mijenjaju izgled(ili stanje) ovisno o ponašanju miša ili, rjeđe, u slučaju bilo koje druge situacije: zumiranje, pomicanje, učitavanje, greške itd.
Među tim elementima najpoznatiji su rollovers (od engleskog roll over - roll, roll over) - elementi koji mijenjaju oblik pod utjecajem miša. Animirana dugmad su primjeri tipičnih prevrtanja. Rollovers se često koriste kada se kreiraju drugi elementi za navigaciju web stranice. Zapravo, bilo koje prevrtanje nije jedna, već nekoliko (do četiri) slike, od kojih svaka odgovara određenom događaju. Glavnim događajima se smatraju sljedeći: Normalno - normalno stanje, Over - prelazak kursora miša preko elementa i Dolje - pritiskanje lijevog gumba miša kada se lebdi iznad njega. Teoretski, događaji kao što su Click - otpuštanje lijeve tipke miša nakon klika, Gore - nakon otpuštanja tipke, Out - kada se napušta aktivna zona mogu biti uključeni. Međutim, u praksi se češće ograničava na promjenu elementa samo za prva tri ili čak dva događaja.
Klasična prevrtanja
U klasičnom smislu, rollover je niz grafičkih slika u GIF formatu i njihovog odgovarajućeg HTML koda, zahvaljujući kojem, ovisno o ponašanju miša, jedna slika zamjenjuje drugu u prozoru pretraživača.
Illustrator nije dizajniran za direktno kreiranje prevrtanja u klasičnom smislu, ali može pomoći u razvoju početnih elemenata za njih. Ideja u ovom slučaju je kreiranje sloja sa slikom koja odgovara prvom događaju. Zatim napravite kopiju sloja i transformirajte sliku da odgovara drugom događaju, i tako dalje. Rezultirajuća slojevita slika se izvozi u PSD datoteku sa očuvanim slojevima, na osnovu čega se kreira rollover u programu Image Ready. Prednost korištenja Illustratora, kao iu mnogim drugim slučajevima, je niz njegovih zanimljivih funkcija koje nisu dostupne u drugim slučajevima. softverski alati, zajedno sa pogodnošću transformacije vektorske grafike.
Pokušajmo napraviti prevrtanje u obliku natpisa koji mijenja boju ovisno o ponašanju miša. Otvorite Illustrator i kreirajte oblik u obliku zaobljenog i ispunjenog crnim pravougaonikom (slika 24), napravite njegovu kopiju i postavite je u slobodan dio ekrana. Pretvorite prvu kopiju pravougaonika u mrežni objekat sa istaknutim u sredini (komanda Object=>Kreiraj Gradient Mesh- Object=>Create Gradient Mesh), navodeći četiri reda i deset kolona (slika 25). Aktivirajte drugu kopiju pravougaonika i postavite za nju gradijentnu ispunu, slično onom prikazanom na sl. 26. Prekrijte objekt gradijenta na vrh mreže, smanjite neprozirnost gradijent objekta na oko 80%, a veličinu na oko 1 piksel da biste simulirali efekat ispupčenja na kraju. I onda preko objekata ispisati natpis. U svom izvornom obliku, neka ima bijelu boju koja će odgovarati Normalnom stanju (Sl. 27), a onda kada se promijeni stanje prevrtanja, boja natpisa će se promijeniti, na primjer, u zelenu - kada marker miša se lebdi iznad njega (Preko stanje) i na plavo - kada se pritisne tipka miša (Dolje stanje).
Obratite pažnju na paletu Slojevi- u ovoj fazi ima samo jedan sloj. Napravite dvije kopije ovog sloja koristeći naredbu Duplikat sloja(Duplicate Layer) iz menija palete Slojevi, - u paleti će biti tri sloja (slika 28). Zatim u prvoj kopiji sloja promijenite boju natpisa u zelenu, a u drugoj u plavu (Sl. 29). Kao rezultat toga, dobit će se potrebno prazno mjesto za prevrtanje.
Izvezite kreiranu sliku u PSD format sa sačuvanim slojevima pomoću naredbe Datoteka=>Izvoz(File=>Export) i odabirom RGB modela boja (Sl. 30). Otvorite kreiranu PSD datoteku u ImageReadyju (slike 31 i 32). Kreirajte okvire na osnovu slojeva odabirom naredbe Napravite okvire od slojeva(Kreirajte okvire iz slojeva) iz menija palete animacija. Prozor animacije će izgledati kao na sl. 33. U isto vrijeme u paleti Prevrtanja U početku će se stvoriti jedno normalno stanje.
Zatim u prozoru animacija izaberite okvir koji odgovara stanju lebdenja, dok je u paleti Slojevi sloj se automatski bira Kopija sloja 1(Sl. 34). Idi na paletu Prevrtanja i kliknite na dugme Kreirajte stanje preokreta(Kreirajte stanje prevrtanja) - sl. 35, što će uzrokovati pojavu stanja Over State u paleti Prevrtanja(Sl. 36). Kreirajte državu na isti način Down State. Aktiviraj stanje Normalno u paleti Prevrtanja i izbrišite u paleti animacija svi okviri osim onog koji bi trebao odgovarati stanju Normalno. Kao rezultat, za svako stanje prevrtanja u paleti animacija biće samo jedan okvir (sl. 37, 38 i 39).
Rice. 38. Pogled na sliku, prozor animacije i palete slojeva i preokretanja za stanje preko
Provjerite rezultat klikom na dugme Pregled u zadanom pretraživaču(Pregled pretraživača) na traci sa alatkama i odlaskom u prozor pretraživača (Slika 40). Nakon toga, sačuvajte datoteku pomoću naredbe Datoteka=>Optimizirano spremanje(File=>Save with optimization) i navođenje opcije HTML i slike (*.html). Kao rezultat toga, u ovom primjeru, dobijena je datoteka Primer4.html i niz grafičkih slika u folderu slika.
Rice. 40. Prozor pretraživača sa Rollover elementom
SVG rollovers
Sve popularniji SVG (Scalable Vector Graphics) format, kreiran na bazi XML standarda, takođe vam omogućava da dobijete razne interaktivne elemente, posebno rollovers, samo što se u praksi to implementira na potpuno drugačiji način. Vrijedi napomenuti da kreiranje interaktivnih SVG rollovera, za razliku od klasičnih, kada se odgovarajući HTML kod generiše potpuno automatski, zahtijeva poznavanje jezika JavaScript i razumijevanje osnovnih principa objektno orijentisanog programiranja.
Posebna paleta je dizajnirana za rad sa SVG objektima. SVG interaktivnost, koji se lako otvara komandom Prozor=>SVG interaktivnost(Prozor=>SVG interaktivnost) - sl. 41.
Razmislite ovu opciju kreiranje prevrtanja na primjeru interaktivnog gumba, boja naljepnice na kojoj će se mijenjati iz crne u plavu kada se miš pređe preko i vraća se u crnu kada miš napusti aktivno područje.
Napravite pravougaono dugme sa zaobljenim ivicama i odaberite odgovarajuću ispunu gradijenta za njega, na primer, kao što je prikazano na sl. 42. Podesite prozirnost dugmeta u paleti Transparentnost(Transparentnost) - u ovom primjeru, vrijednost parametra Opacity(Neprozirnost) je postavljena na 50%. Napravite kopiju dugmeta, popunite ga tamnozelenom (Sl. 43), a zatim ga konvertujte u mrežasti objekat komandom Object=>Kreiraj Gradient Mesh(Object=>Create Gradient Mesh) navođenjem četiri reda i deset stupaca i na listi Izgled(Prikaži) odabirom opcije Do centra(Prema centru) i postavljanje vrijednosti highlight(Highlight) na 100. Smanjite neprozirnost sloja mrežnog objekta na oko 40% (Slika 44). Stavite mrežasti objekat na gradijent objekat i dugme će izgledati kao ono prikazano na Sl. 45.
Rice. 44. Pretvaranje kopije dugmeta u objekat mreže
Dopunite dugme predviđenim natpisom i podesite njegov položaj pomoću odgovarajućih dugmadi na paleti Poravnajte(Poravnanje). Rezultirajuća slika će sadržavati jedan sloj sa tri objekta koji su postavljeni jedan na drugi (slika 46). Planirani događaji će se odnositi na tekstualni objekat, pa zbog pogodnosti promijenite njegovo ime u Tekst dvostrukim klikom na objekt i unosom novog imena. Slično, promijenite naziv sloja iz Od sloja 1 do sloja(Sl. 47).
Obrada događaja uključuje korištenje JavaScript procedura, tako da morate uključiti datoteku s opisom ovih procedura. Zove se Events.js i pohranjuje se na disk u folderu Sample Files\Sample Art\SVG\SVG kada se instalira Adobe softver Ilustrator. Da biste uključili datoteku Events.js, koristite naredbu JavaScript datoteke SVG interaktivnost(Sl. 48). Zatim morate pritisnuti dugme Dodati(dodaj) i pronađi željeni fajl na hard disku. Kada se njegovo ime pojavi u polju URL(sl. 49), kliknite na dugme Gotovo(Odjaviti se).
Rice. 48. Odabir komande JavaScript datoteke
Nakon toga trebate definirati reakciju na događaje miša za objekt Tekst. Odaberite objekt Tekst u polju događaj(Događaj) palete SVG interaktivnost odaberite događaj onmouseover elemColor(evt, "Text", "#3333FF")- to će značiti da kada je miš iznad objekta Tekst njegova boja će se promijeniti u plavu (Sl. 50). Da bi se boja teksta promijenila u crnu nakon što miš napusti aktivnu zonu, potrebno je kreirati još jedan događaj onmouseout- izaberite ga u polju događaj(Događaj) palete SVG interaktivnost. Zatim u redak akcije unesite tekst elemColor(evt, "Tekst", "#000000")- ovo će vratiti crnu boju (Sl. 51).
Rice. 51. Konačni izgled SVG palete interaktivnosti za objekt Text
Sačuvajte generisani prelazak kao SVG datoteku pomoću naredbe Datoteka=>Sačuvaj kao(Datoteka=> Vrsta datoteke formatu SVG, a zatim podešavanje opcija za čuvanje SVG datoteke kao što je prikazano na sl. 52. Nakon snimanja dobiće se samo jedan fajl sa ekstenzijom SVG, a ne dva, kao u slučaju klasičnog rollover-a - u ovom slučaju se dobija datoteka Primer5.svg (Primer5 folder). Međutim, da bi rollover zaista funkcionisao, morate dodatno kopirati datoteku Events.js sa opisom JavaScript procedura u fasciklu sa SVG datotekom. Nakon toga možete provjeriti performanse prevrtanja - rezultat će izgledati kao što je prikazano na Sl. 53.
SVG animacija
SVG format se takođe može koristiti za prenošenje animacije. Pokušajmo napraviti jednostavan element animacije (u ovom slučaju to će biti informacija o kompaniji), koji će se pojaviti na ekranu kada se miš pređe preko odgovarajućeg grafičkog objekta i nestati kada se miš ukloni iz interaktivnog elementa.
Kreirajmo otprilike takvu seriju grafičkih i tekstualnih objekata, kao što je prikazano na Sl. 54. Preimenuj zgodan način sve kreirane objekte uzastopnim klikom na naziv sljedećeg objekta u paleti Slojevi i unosom željenog naziva (Sl. 55). Imajte na umu da je istaknuto na sl. 56 objekata — Tekst1, Tekst2, Tekst3 i Put1- uvijek će biti vidljivo, a svi ostali - samo kada pređete mišem preko objekta Tekst1.
Rice. 54. Originalni pogled na sliku
Uključite datoteku Events.js sa opisom JavaScript procedura koristeći naredbu JavaScript datoteke (JavaScript datoteke) iz palete SVG interaktivnost pritiskom na dugme Dodati(Dodaj) odabirom željene datoteke na tvrdom disku i klikom na dugme Gotovo(Odjaviti se).
Definirajte odgovor na događaj miša za objekt Tekst1. Odaberite objekt Tekst, na terenu događaj(Događaj) palete SVG interaktivnost odaberite događaj onmouseover i u red ispod unesite tekst elemShow(evt, "Text4"); elemShow(evt, "Puta2"). Kao rezultat, kada je miš iznad objekta Tekst1 objekti će postati vidljivi Tekst 4 i Put 2. Imajte na umu da ako se nekoliko radnji mora izvršiti kada se događaj dogodi, one moraju biti specificirane kroz znak “;”. Zatim uradite isto za događaj onmouseout, unošenjem teksta za njega, što će značiti sakrivanje objekata (Sl. 57).
Sačuvajte rezultat kao SVG datoteku pomoću naredbe Datoteka=>Sačuvaj kao(Datoteka=>Sačuvaj kao), navodeći naziv datoteke, birajući u polju Vrsta datoteke SVG formatu, a zatim postavljanje opcija za čuvanje SVG datoteke u skladu sa sl. 58. Nakon pohranjivanja, dobiće se datoteka Primer6.svg (fascikla Primer6). Ne zaboravite da kopirate datoteku Events.js u fasciklu sa ovom datotekom. Ako nakon toga trčite coz dati fajl, vidjet ćete rezultat prikazan na sl. 59. Ovo je skoro ono što vam treba. Jedina stvar koja nije bila uključena u naše planove je prvobitni izgled objekata Tekst 4 i Put 2 prilikom utovara. Da biste se riješili ovog nedostatka, odaberite oba ova objekta odjednom i kreirajte akciju za njih elemHide(evt, "Tekst4"); elemHide(evt, "Put2") na događaju onload(Sl. 60). Ponovo sačuvajte datoteku i provjerite jesu li objekti sada Tekst 4 i Put 2 vidljivo samo kada se mišem pređe preko objekta Tekst1.
GIF animacija
Bilo koja web stranica je nezamisliva bez web animacije, uključujući animirane gifove. Jedna od opcija za njihovo kreiranje je korištenje Adobe ImageReady aplikacije koja, između ostalog, omogućava kreiranje animacije iz slojeva. Istovremeno, sama višeslojna slika može se pripremiti u različitim aplikacijama, uključujući Adobe Illustrator.
Vrlo je lako napraviti animaciju na osnovu elemenata iz palete Simboli(Simboli) otvara naredba Prozor=>Simboli(Prozor=>Simboli) ili iz jedne od biblioteka simbola koja se može otvoriti pomoću naredbe Prozor=>Biblioteke simbola(Prozor=>Biblioteke simbola).
Na primjer, pokušajmo povećati veličinu bilo kojeg simbola objekta, ključne faze procesa povećanja objekta moraju biti postavljene na odvojenim slojevima. Prvo jednostavno postavite objekte simbola jedan iznad drugog, a zatim povećajte veličinu svakog sljedećeg objekta, na primjer, kao što je prikazano na sl. 61. Kao rezultat, u paleti Slojevi kreiraće se jedan sloj sa više objekata (slika 62). Ako ovu sliku direktno izvezete u PSD format, to neće raditi, jer postoji samo jedan sloj, a naravno, kada otvorite PSD datoteku u ImageReady-u, postojat će i samo jedan sloj. Stoga prvo morate postaviti objekte na različite slojeve. To se može učiniti na različite načine - najlakši način je prvo odabrati sloj Sloj 1 u paleti slojeva i koristite naredbu Otpustite na sloj(Izdavanje u slojevima). Rezultat će biti premještanje svakog od objekata u svoj vlastiti sloj, ali će svi biti ugniježđeni u sloju Sloj 1. Stoga ćete morati ručno prevući sve ugniježđene slojeve na vrh palete slojeva tako da budu iznad sloja Sloj 1, a zatim prazan sloj Sloj 1 lako se uklanja (Sl. 63). Izvezite sliku u PSD format koristeći naredbu Datoteka=>Izvoz(File=>Export) sa postavkama kao na sl. 64.
Učitajte kreiranu PSD datoteku u program ImageReady (sl. 65 i 66). Otvorite meni palete animacijaNapravite okvire od slojeva(Kreirajte okvire od slojeva). Kao rezultat, biće kreirano pet okvira, od kojih će svaki odgovarati svom sloju i prozoru palete animacijaće izgledati kao na sl. 67.
Nakon toga podesite trajanje svakog od kreiranih okvira - u ovom slučaju, za sve okvire, trajanje je postavljeno na 0,2 s. A zatim sačuvajte optimiziranu animaciju pomoću naredbe Datoteka=>Optimizirano spremanje(Datoteka=>Sačuvaj uz optimizaciju). Dobijeni rezultat može ličiti na sl. 68.
Još je praktičnije koristiti funkcije Live Blends Illustrator softver. Ova kombinovana upotreba Illustrator i ImageReady značajno ubrzava proces kreiranja GIF animacija.
Na primjer, nacrtajte dva proizvoljna raznobojna objekta, a zatim ih spojite s odgovarajućim parametrima (slika 69). Nemoguće je koristiti ovu datoteku direktno za kreiranje animacije, jer se slika nalazi na jednom sloju (Sl. 70). Stoga ćete prvo morati postaviti svaki element blend objekta na poseban sloj. Da biste to učinili, u prozoru Slojevi označite liniju
Rice. 70. Početno stanje prozora slojeva
Izvezite kreiranu datoteku u PSD format pomoću naredbe Datoteka=>Izvoz(Datoteka=>Izvoz). Otvorite kreiranu PSD datoteku u ImageReady (slika 73). Imajte na umu da će se svi slojevi kreirani u programu Illustrator pojaviti u prozoru slojeva (Sl. 74), a u prozoru animacija biće samo jedan okvir.
Aktivirajte meni paleta animacija, klikom na crnu strelicu u gornjem desnom uglu palete i odabirom naredbe Napravite okvire od slojeva(Kreirajte okvire iz slojeva) - kao rezultat, u ovom primjeru će biti kreirano pet okvira, a prozor palete animacija poprimiće oblik u skladu sa sl. 75. Izaberite sve okvire držeći taster Shift, i postavite odgovarajuće trajanje okvira - u ovom primjeru, isto vrijeme od 0,2 s uzima se za svaki od okvira. Zatim sačuvajte datoteku naredbom za optimizaciju Datoteka=>Optimizirano spremanje(File=>Save with optimization) postavke na listi Vrsta datoteke opcija Samo slike (*.gif). Animacija će ličiti na sl. 76.
Mnogo interesantnije nije kretanje, već glatka promjena veličine blend objekata. Na primjer, možete koristiti već kreirani prijelaz blende. U ovom slučaju, nakon kreiranja zasebnih slojeva za svaki element prijelaza blende, stavite sve objekte jedan na drugi pomoću dugmadi Horizontalno poravnanje centra(Poravnanje u odnosu na horizontalni centar) i Vertical Align Center(Okomito centralno poravnanje) palete Poravnajte(Sl. 77).
Izvezite kreiranu datoteku u PSD format ( Datoteka=>Izvoz- File => Export) i otvorite kreiranu PSD datoteku u programu ImageReady (Sl. 78). Kreirajte okvire animacije na osnovu slojeva ( Napravite okvire od slojeva- Kreirajte okvire od slojeva) i odaberite odgovarajuće trajanje za njih (Sl. 79). A zatim, da bi animacija bila efikasnija, kopirajte postojeće okvire, ali unutar obrnutim redosledom- tako da se slika prvo povećava, a zatim smanjuje, i tako u krug (Sl. 80). Zatim sačuvajte datoteku za optimizaciju ( Datoteka=>Optimizirano spremanje— Datoteka=>Sačuvaj uz optimizaciju). Rezultirajuća animacija je prikazana na sl. 81.
Rice. 80. Stanje prozora animacije nakon dupliciranja okvira
Rice. 81. Gotova animacija
Flash File Format (SWF) se zasniva na vektorska grafika i dizajniran je za skalabilnu, kompaktnu grafiku za web. Budući da je ovaj format datoteke zasnovan na vektorskoj grafici, objekt zadržava kvalitet slike u bilo kojoj rezoluciji i idealan je za kreiranje okvira animacije. U Illustratoru možete kreirati pojedinačne okvire animacije na slojevima, a zatim izvesti slojeve slike kao pojedinačne okvire za korištenje na web stranici. Također možete definirati simboli u Illustrator datoteci da smanjite veličinu animacije. Kada se izveze, svaki simbol je definiran samo jednom u SWF datoteci.
Naredba za izvoz (SWF)
Pruža najveću kontrolu nad animacijom i kompresijom bitova.
Pruža veću kontrolu nad mješavinom SWF i bitmap formata u fragmentiranom rasporedu. Ova naredba nudi manje opcija slike od naredbe Izvoz (SWF), ali koristi najskorije korištene opcije komande Izvoz (pogledajte ).
Imajte na umu sljedeće smjernice kada pripremate objekt za spremanje kao SWF.
Koristite aplikaciju Device Central da vidite kako će Illustrator grafika izgledati u aplikaciji Flash Player na raznim ručnim uređajima.
Umetanje Illustrator grafike
Grafički objekat kreiran u Illustratoru može se brzo, lako i lako kopirati i zalijepiti u Flash aplikaciju.
Kada zalijepite Illustrator grafiku u Flash aplikaciju, sljedeći atributi se čuvaju.
Debljina poteza
Definicije gradijenata
Tekst (uključujući OpenType fontove)
Povezane slike
Blend Modes
Konture i oblici
Osim toga, Illustrator i Flash podržavaju sljedeće funkcije prilikom lijepljenja grafike.
Prilikom odabira slojeva u Illustrator umjetničkom djelu vrhunski nivo U cijelosti i lijepljenjem u Flash aplikaciju, slojevi i njihova svojstva (vidljivost i blokiranje) su sačuvani.
Illustrator formati boja koji nisu RGB (CMYK, sivi formati i prilagođeni formati) se pretvaraju pomoću Flasha u RGB. RGB boje se ubacuju na uobičajen način.
Kada uvezete ili zalijepite Illustrator ilustracije, možete koristiti različite opcije da sačuvate određene efekte (kao što je sjena teksta) kao Flash filtere.
Flash sprema Illustrator maske.
Izvezite SWF datoteke iz Illustrator-a
SWF datoteke izvezene iz Illustrator-a su istog kvaliteta i kompresije kao SWF datoteke izvezene iz Flash-a.
Kada izvozite, možete birati između niza unaprijed definiranih stilova za optimalan izlaz i specificirati kako želite koristiti više artboarda, kako se simboli, slojevi, tekst i maske pretvaraju. Na primjer, možete odabrati da izvezete Illustrator simbole kao filmove ili grafiku i kreirate SWF simbole iz Illustrator slojeva.
Uvoz Illustrator datoteka u Flash aplikaciju
Da biste kreirali kompletan izgled u Illustratoru, a zatim ga uvezli u Flash u jednom koraku, možete sačuvati svoje umjetničko djelo u Illustrator izvornom (AI) formatu i uvesti ga s velikom vjernošću u Flash koristeći naredbe File > Import To Workspace. oblast" ili " Datoteka" > "Uvezi u biblioteku".
Ako Illustrator datoteka sadrži više grafičkih ploča, u dijaloškom okviru Flash Import odaberite montažnu ploču za uvoz i odredite postavke za svaki sloj u toj montažnoj ploči. Uvezuju se svi objekti u odabranoj montažnoj ploči Flash program kao jedan sloj. Kada uvezete drugu montažnu ploču iz iste AI datoteke, objekti sa te ploče se uvoze u Flash kao novi sloj.
Prilikom uvoza Illustrator umjetničkih djela kao AI, EPS ili PDF aplikacija Flash zadržava iste atribute kao i kada umetnete Illustrator grafiku. Također, ako Illustrator datoteka koju uvozite sadrži slojeve, možete ih uvesti na jedan od sljedećih metoda.
Pretvorite Illustrator slojeve u Flash slojeve.
Pretvorite Illustrator slojeve u Flash okvire.
Pretvorite sve Illustrator slojeve u jedan Flash sloj.
