Se estas unu aspekto labori kun Ilustristo, ke mi vere ne ĝuas, ĝi transformas linion arton al svg-bildoj por poŝtelefono aŭ la retejo. Uzante la Eksporti> Eksporti Kiel menuo kaj, por esti brutale honesta, la Konservo por Retejo - Eksporti> Konservi Por Retejo - Ne estis facile facila uzi.
Konverti desegnon al la .svg-formato malfermis iom timigantan dialogon, kiu, por homoj novaj al ĉi tiu fluo de laboro, proponis konfuzon pri opcioj por ne mencii la fakton, ke ekzistas kelkaj .svg-formatoj kaj nur unu el ili estis konvena formato. Unufoje vi kutimis ĉi tiun laborfluon, ĝi estis nenio granda, sed la lernanta kurbo estis kruta.
Tio ŝanĝis ĉion kun la nova Eksporta Ekranoj - Eksportado> Eksportado por Ekranoj - kaj la Grupo de Asset-Exportado, kiu estis enkondukita al Ilustristo CC 2015 en junio 2016. En ĉi tiu "Kiel Al" Mi montros al vi kiel uzi ambaŭ Trajtoj. Komencu.
01an de 04
Kiel Aliri Eksportadon Por Ekranoj En Adobe Illustrator CC 2015
Estis Ilustrista uzanto ekde Ilustristo 88 Mi opinias, ke vi povas kompreni mian retuzencon konsideri Ilustriston kiel seriozan ilon por interfacoj kaj projektoj retejo kaj moveblaj.
Kiam artverboj estis enkondukitaj en la CS4-versio 2008, mi pensis, ke tio estis interesa aldono al la apliko. Kiam mi unue vidis la nun-senŝanĝan Servilon por Retejaĵo en Ilustristo, denove mi trovis ĝin interesa, sed mi trovis la saman trajton en Adobe Fireworks, kiu estis pli vicigita kun retpaĝaj grafikoj ol Illustrator.
Kun la alveno de mobile-unua aliro al dezajno kaj la kreskanta fido sur SVG-bildoj por moveblaj projektoj, Ilustristo estis mia "iri al" ilo por SVG kaj iĝis grava halto en la UI Design workflow.
Ankoraŭ tiel, se mi bezonus eksporti aktivojn por telefonoj, Skizo 3 kaj Photoshop CC 2015 estas miaj iloj elektitaj. Ilustristo eniris la liston en junio 2016 kun la vere nifia Eksportado por Ekranoj-menuo.
En la supra ekzemplo, mi havas du ekranojn destinitajn por iPhone kaj ili estas sur apartaj Artboards nomataj "Hejmo" kaj "Lokoj". Por eligi ilin, mi elektis File> Export> Export for Screens. La dialogo de Eksportado por Ekranoj malfermiĝas.
02 de 04
Kiel Uzi Eksportadon por Ekranoj Dialogo-Skatolo
Kiam la dialogo aperas, klaku sur ĉiu artordo por esti elektita. Ĝi tiam sportos markilon. Vi povas ankaŭ duobligi la nomon de artboard por elekti ĝin kaj ŝanĝi ĝin. Ĉi tio estas bone scii, ĉu viaj artbirdoj estas nomataj "Artboard 1" kaj "Artboard 2" kiuj sincere diras nenion al vi.
Vi havas tri elektojn en la Elektita areo:
- Ĉiuj: Ĉi tiu elekto eksportas ĉiun artkarton en la dokumento kiel aparta dosiero.
- Rango: Eniru gamon de artverkoj por esti eksportitaj. Ĉi tio estas speciale utila por projektoj kun kelkaj dekdu artverkoj.
- Plena Dokumento: Elektu ĉi tion kaj ĉiuj artverboj estos ebenigitaj en ununura dokumento.
La areo Eksporti al ebligas elekti la cellokosierujon por la eligo. La defaŭlta dosierujo estos la nuna loko de la Ilustra dokumento.
Formatoj estas kie la "magio okazas. Vi rimarkos, ke estas tri ikonoj- iOS. Android kaj Gear. La unuaj du estas memkomplikaj. La ikono de ilaroj malfermas la formatajn agordojn, kiuj permesas kontroli vin kiel ĉiu el la dosieroj en la listo estos optimumigita. Ĉi tiuj agordoj estas "formato specifaj" kaj kiam vi faris viajn ŝanĝojn, alklaku la butonon Konservi Agordojn kaj tiuj ŝanĝoj aplikiĝos al la formatoj por esti eligo.
Kiam vi elektas iOS aŭ Android, la listo ŝanĝos por inkludi ĉiujn rezoluciojn haveblajn en tiu platformo. La lerta de iOS montros la faktorojn de grimpita por la ekrano Retino kaj la selektado de Android havos skvamojn kiuj iras de .75x al 4x, kiu akceptas preskaŭ ĉiuj mekanismoj Android tie.
Se ekzistas formato montranta, ke vi volas forigi, klaku la "x". Se ekzistas unu, vi volas aldoni klaku la butonon Aldoni Scale.
Kiam finita, alklaku la butonon Eksportu Artranon kaj progresa stango montros al vi kiam la procezo finiĝos.
03 de 04
Uzante La Eksportaĵojn por Ekranoj Fajliloj de Adobe Illustrator CC 2015.
Kiam vi kontrolos la rezultojn de Eksportado por Ekranoj, vi trovos, ke Ilustristo ellasis platigitan version de ĉiu ekrano. Sur la surfaco, ĉi tio ŝajnas esti iomete malforta, precipe se vi atendis Ilustriston eksporti ĉiujn pecojn kaj pecojn kiel bildojn.
Se vi reagas kaj pensas pri ĝi dum momento, tio vere estas precize, kion vi bezonas, ĉar vi povas uzi ĉi tiun eliron en prototipoj kiel ekzemple Adobe Experience Design , Principleformac, Atomic.io , UXPin aŭ alia prototipoj.
En ĉi tiu ekzemplo mi uzas Adobe Experience Design (XD) por krei simplan klakon. La unua paŝo en la procezo estis elekti la iPhone 6 grandecon kiu egalis la dimensiojn de la Ilustra Interfaco
Kiam la interfaco malfermiĝis, mi elektis la Artboard-ilon kaj alklakis unufoje sur la keston por aldoni alian artrankon. Mi tiam nomis ilin "Hejmo" kaj "Lokoj", elektis ĉiun artŝrankon kaj importis la bildon de bildoj de Ilustristo en la artrankon.
Por krei la "hotspots" por la klako, mi desegnis rektangulon super la Esploru butono en la hejma ekrano kaj starigis ĝian plenigon kaj landlimajn valorojn per neŝlosi tiujn proprietojn en la Propra panelo. Mi faris la saman aferon kun la Malantaŭa butono sur la paĝo de Lokoj.
Por aldoni la Interactivecon, mi elektis Prototipan reĝimon kaj poste klakis sur la "hotspot". Mi tiam trenis la sagon nomitan draton - al la paĝoj de Lokoj kaj starigis la Transiron-celon ĉe la Lokoj, la moviĝon al Push Maldekstre, la malfortiĝon por trankviligi kaj la daŭron de la transiro al .6 sekundoj.
Mi ripetis ĉi tiun paŝon kun la hotspot en la paĝo de Lokoj. La nura diferenco estis la Transiro al Push Right. Kiam mi klakis la Ludan butonon mi provis mian prototipon.
04 de 04
Kiel Uzi La Eksportan Agordan Panelon En Adobe Illustrator CC 2015
Kune kun la menuo Konservi por Ekranoj, Adobo ankaŭ aldonis novan panelon - Asset Export - kiu forigis grandegan doloron en la fluo de laboro de UI Design.
La doloro punkto estis ikonoj. Ilustristo estas granda vektoro-desegna apliko sed al eligo, ni diru 10 ikonoj, sur paĝo kun 40 aŭ 50 el ili postulis ke ĉiu estas konservita kiel SVG-bildo. Ĉi neeviteble postulis pli da tempo ol kutime danke al pluaj vojaĝoj al la SVG-panelo. Ĉi tiu doloro-punkto nun estas afero de la pasinteco.
Ĉi tiu nova panelo troviĝas ĉe Window> Asset Export. Kiam la panelo malfermiĝas, elektu la aktivon, kiun vi volas konverti al SVG aŭ al alia formato kaj trenu en la panelo. Kiam vi liberigas la muson, aldonas al la panelo bildeton de la valoraĵo. Nomu la valon. Tenu trenante objektojn en la panelo ĝis vi finos.
Elektu ĉiun eron En la Eksporta agordo, aŭ elektu ilin ĉiujn per tenado de la ŝlosilo Shift kaj alklakante ĉiun. Elektu vian formaton - en ĉi tiu ekzemplo, mi elektis SVG- kaj alklaku la Eksportan butonon. La elektitaj eroj estos elsenditaj kiel SVG-dosieroj al la sama loko kiel la Ilustra dosiero.
Kie ĉi tiu tuta procezo akiras eĉ pli neta, vi ne devas uzi la Asset Export-panelo. Se vi alklakas la butonon Konservi por Ekranoj ĉe la malsupro de la panelo, malfermiĝas la dialogo.
Male, vi povas alklaki la pestaña Asignoj en la panelo Save for Ekranoj por aliri al la Panelo de Eksporta Eksportado. Ekzemple, se vi havas kutiman ikonon sur artbordo, vi povas malfermi la Asignan Eksportan panelon en la dialogo-Skatolo por Konservi Ekranon kaj treni tiun eron en la Panelo de Eksporta Eksportado.