Yen ana siji aspek nggarap Illustrator , aku ora seneng ngowahi gambar seni kanggo gambar SVG kanggo seluler utawa web. Nggunakake Ekspor> Ekspor Minangka menu lan, dadi jujur kanthi jujur, fitur Simpen Kanggo Web - Ekspor> Simpen Kanggo Web - ora persis gampang dipigunakake.
Ngonversi gambar menyang format .svg mbuka kothak dialog sing rada intimidating sing, kanggo wong sing anyar kanggo alur kerja iki, nampilake pilihan array mbingungake, ora kanggo nyatane kasunyatan ana sawetara format ssvg lan mung siji sing bener format. Sawise sampeyan bisa digunakake kanggo alur kerja kasebut, ora ana masalah gedhe, nanging kurva belajar ana ing dhuwur.
Sing kabeh diganti karo fitur Ekspor Kanggo Layar anyar - Ekspor> Ekspor kanggo Layar - lan panel Ekspor Asset sing dikenalaké karo Illustrator CC 2015 ing Juni 2016. Ing "Cara" iki, aku bakal nuduhake sampeyan cara migunakaké fitur. Ayo diwiwiti.
01 saka 04
Cara Ngakses Ekspor Kanggo Layar Ing Adobe Illustrator CC 2015
Duwe dadi panemu Illustrator wiwit Illustrator 88 Aku mikir sampeyan bisa ngeling-eling karepku kanggo nimbang Illustrator minangka alat desain serius kanggo antarmuka web lan seluler lan proyèk.
Nalika artboards dienalake ing versi CS4 2008, aku panginten sing ana tambahan menarik kanggo aplikasi. Nalika aku pisanan weruh fitur Simpen Kanggo Web ing Illustrator maneh, aku nemokake iku menarik nanging aku nemokake fitur sing padha ing Adobe Fireworks sing luwih adoh karo grafis web tinimbang Illustrator.
Kanthi munculé pendekatan seluler pisanan kanggo desain lan ketergantungan sing tambah ing gambar SVG kanggo proyèk seluler, Illustrator minangka piranti "go to" kanggo SVG lan dadi stop kontak penting ing alur desain UI.
Isih, yen aku perlu ngekspor aset kanggo seluler, Sketch 3 lan Photoshop CC 2015 iku alat pilihanku. Illustrator ngetik ing daftar ing Juni 2016 kanthi menu Ekspor kanggo Layar apik banget.
Ing conto ing ndhuwur, aku duwe loro layar sing ditata kanggo iPhone lan ana ing Artboards kapisah sing jenenge "Ngarep" lan "Panggonan". Kanggo ngasilake, aku milih Gambar> Ekspor> Ekspor kanggo Layar. Kothak dialog Ekspor Kanggo Layar mbukak.
02 saka 04
Cara Nggunakake Ekspor kanggo Layar Dialog Box
Nalika kothak dialog katon, klik ing saben artboard sing dipilih. Iku banjur olahraga tandha mriksa. Sampeyan uga bisa klik kaping pindho jeneng artboard kanggo milih lan ngganti. Iki pancen apik kanggo ngerti yen artboards dijenengi "Artboard 1" lan "Artboard 2" sing kanthi terang-terangan ora ngandhani apa-apa.
Sampeyan duwe telung pilihan ing wilayah Pilih:
- Kabeh: Pilihan iki ngekspor saben artboard ing dokumen kasebut minangka file sing kapisah.
- Range: Ketik sawetara artboards kanggo diekspor. Iki utamané migunani kanggo proyèk-projèk karo sawetara rolas artboards.
- Full Document: Pilih iki lan kabeh artboards bakal flattened menyang document siji.
Ekspor Kanggo area ngidini sampeyan milih folder tujuan kanggo output. Folder default bakal dadi lokasi saiki saka Illustrator document.
Format yaiku papan "sihir sing kedadeyan. Sampeyan bakal sok dong mirsani ana telung lambang- iOS. Android lan Gear. Ingkang kapisan wonten panjlajah. Ikon Gear mbukak Setelan Format sing ngidini sampeyan ngontrol carane saben format file ing dhaftar bakal dioptimalake. Setelan iki minangka "format khusus" lan yen sampeyan wis nggawe owah-owahan, klik tombol Simpen Setelan lan owah-owahan bakal diterapake kanggo format sing bakal output.
Sawise sampeyan milih iOS utawa Android, dhaftar bakal diganti kanggo nyakup kabeh resolusi sing kasedhiya ing platform kasebut. Listing iOS bakal nampilake faktor panjaluk kanggo tampilan Retina lan pilihan Android bakal duwe timbangan mulai saka .75x nganti 4x sing nampung prakteke saben piranti Android metu ana.
Yen ana format sing pengin dibusak, klik "x". Yen ana siji sing pengin ditambahake klik tombol + Tambah Skala.
Yen wis rampung, klik tombol Ekspor Artboard lan garis progres bakal nuduhake nalika proses rampung.
03 saka 04
Nggunakake Ekspor Kanggo Layar File saka Adobe Illustrator CC 2015.
Nalika sampeyan mriksa asil Ekspor kanggo Layar, sampeyan bakal nemokake yen Illustrator wis ngasilake versi saben layar sing kacemplung. Ing lumahing permukaan, iki koyone kurang entheng tinimbang yen sampeyan ngira Illustrator wis ngekspor kabeh potongan-potongan kasebut minangka gambar.
Yen sampeyan ngundhuh lan ngeling-eling bab kasebut, iki pancen bener apa sing perlu amarga sampeyan bisa nggunakake output iki ing aplikasi prototyping kayata Adobe Experience Design , Principleformac, Atomic.io , UXPin utawa aplikasi prototyping liyane
Ing conto iki, aku nggunakake Adobe Experience Design (XD) kanggo nggawe klik-thru prasaja. Langkah pisanan ing proses iki yaiku kanggo milih ukuran iPhone 6 sing cocok karo dimensi Illustrator Interface
Nalika antarmuka dibukak, aku milih alat Artboard lan diklik sapisan ing pasteboard kanggo nambah artboard liyane. Aku banjur dijenengi "Ngarep" lan "Panggonan", milih saben artboard lan ngimpor gambar png saka Illustrator menyang papan arti.
Kanggo nggawe "hotspot" kanggo klik-thru, aku nggambar persegi panjang liwat tombol Explore ing layar ngarep lan ngeset sawijining isi lan wates sing ora ana kanthi ora milih situs kasebut ing Properties panel. Aku nindakake bab sing padha karo tombol Back ing kaca Places.
Kanggo nambah Interactivity, aku milih mode Prototype banjur klik ing "hotspot". Aku banjur nyeret panah - disebut kabel - menyang kaca Places lan nyetel target Transisi ing Places, gerakan kanggo Push Left, ease kanggo ease lan duration transisi nganti .6 detik.
Aku ngulang langkah iki karo hotspot ing kaca Places. Bentenipun mung Transition disetel kanggo Push tengen. Nalika aku ngeklik tombol Play aku dites prototypeku.
04 saka 04
Cara Nggunakake Panel Ekspor Asset Ing Adobe Illustrator CC 2015
Bebarengan karo menu Save for Screens Adobe uga nambahake panel anyar - Asset Export - sing ngilangi titik nyeri gedhe ing alur desain UI.
Titik lara iku lambang. Illustrator yaiku aplikasi drawing vektor sing apik nanging kanggo ngasilake, kuduné 10 lambang, ing kaca kanthi 40 utawa 50 ing antarané dibutuhake saben gambar disimpen minangka gambar SVG. Iki kudu ditindakake luwih suwe tinimbang biasanipun kanggo lelungan menyang panel SVG. Titik nyeri iki saiki dadi perkara sing kepungkur.
Panel anyar iki bisa ditemokake ing Window> Asset Export. Nalika panel mbukak, pilih aset sing pengin dikonversi menyang SVG utawa format liyane lan seret menyang panel. Nalika sampeyan ngeculake mouse gambar cilik aset kasebut ditambahake menyang panel. Jeneng asline. Tansah nyeret objek menyang panel nganti rampung.
Pilih item saben Ing wilayah setelan Ekspor, utawa pilih kabeh kanthi nyekel tombol Shift lan ngeklik saben. Pilih format - ing conto iki, aku milih SVG- lan klik tombol Ekspor. Item sing dipilih bakal dituduhake minangka file SVG menyang lokasi sing padha karo file Illustrator.
Ngendi kabeh proses iki dadi luwih apik, sampeyan ora kudu nggunakake Panel Ekspor Asset. Yen sampeyan klik tombol Simpen kanggo Layar ing dhasar panel, kothak dialog mbukak.
Sabanjure, sampeyan bisa klik tab Aset ing panel Simpen kanggo Layar kanggo ngakses panel Asset Export. Contone, yen sampeyan duwe lambang adat ing artboard sampeyan bisa mbukak panel Asset Export ing kotak dialog Simpen kanggo layar banjur seret item kasebut menyang panel Asset Export.