Sèvi ak Illustrator CC 2015 Ekspòte pou ekran Feature

Si gen yon aspè nan travay ak Illustrator ke mwen vrèman pa jwi li se konvèti liy atizay svg imaj pou mobil oswa entènèt la. Sèvi ak ekspòtasyon> Export la kòm meni, epi, yo dwe brital onèt, Save a pou entènèt karakteristik - Export> sove pou sit entènèt - yo pa te egzakteman fasil yo sèvi ak.

Konvèti yon desen nan fòma a .svg louvri yon bwat dyalòg olye entimidasyon ki, pou moun ki nouvo nan workflow sa a, yo ofri yon etalaj konfizyon nan opsyon yo pa mansyone reyalite a te gen yon nimewo nan .Fè fòma ak sèlman youn nan yo te apwopriye a fòma. Yon fwa ou te itilize sa a workflow li pa te gen okenn gwo kontra, men koub la aprann te apik.

Sa ki gen tout chanje ak ekspozisyon nan nouvo ekran pou ekran - Export> Ekspòte pou ekran - ak panèl la Export Byen ki te prezante nan Illustrator CC 2015 nan mwa Jen 2016. Nan sa a "Kijan Pou" mwen pral montre w kouman yo sèvi ak tou de karakteristik. An n kòmanse.

01 nan 04

Kijan Pou Aksè Ekspòte pou ekran nan Adobe Illustrator CC 2015

Atelye Sòti lè l sèvi avèk ekspòte a pou ekran bwat dyalòg.

Èske w gen yon itilizatè Illustrator depi Illustrator 88 Mwen panse ke ou ka konprann repiyans mwen yo konsidere Illustrator kòm yon zouti konsepsyon grav pou interfaces entènèt ak mobil ak pwojè.

Lè atizay yo te prezante nan vèsyon CS4 2008 la, mwen te panse ke se te yon adisyon enteresan nan aplikasyon an. Lè m 'premye wè kounye a-deprecated Save a pou entènèt karakteristik nan Illustrator, ankò, mwen jwenn li enteresan, men mwen te jwenn menm karakteristik nan Adobe Fireworks te pi plis aliyen ak grafik entènèt pase Illustrator.

Ak avènement de yon apwòch mobil-premye nan konsepsyon ak reliance la ogmante sou imaj SVG pou pwojè mobil, Illustrator te "ale nan" zouti pou SVG e li te devni yon arè enpòtan nan workflow la Design UI.

Toujou, si mwen bezwen ekspòte byen pou mobil, Sketch 3 ak Photoshop CC 2015 se zouti mwen nan chwa. Illustrator te antre nan lis la nan mwa jen 2016 ak ekspòtasyon an vrèman debouya pou meni ekran.

Nan egzanp ki anwo a, mwen gen de ekran ki destine pou yon ifon epi yo sou Artboards apa yo te rele "Kay" ak "Andwa". Pou rann yo, mwen te chwazi File> Export> Export pou ekran. Ekspòte pou ekran bwat dyalòg ouvè.

02 nan 04

Kijan Pou Sèvi ak ekspòte pou ekran bwat dyalòg

Atelye Sòti pou iOS ak android pa fè yon kèk chwa ki senp nan bwat dyalòg Save pou ekran an.

Lè bwat dyalòg la parèt, klike sou chak tablo ki dwe chwazi. Li pral Lè sa a, espò yon mak chèk. Ou kapab tou double-klike sou non yon boza a chwazi li epi chanje li. Sa a se yon bon bagay yo konnen si ou artboards yo te rele "Artboard 1" ak "Artboard 2" ki, franchman, di ou pa gen anyen.

Ou gen twa chwa nan zòn nan Chwazi:

Ekspòte a nan zòn pèmèt ou chwazi folder nan destinasyon pou pwodiksyon an. Katab la default pral kote aktyèl la nan dokiman an Illustrator.

Fòma se kote "majik la k ap pase. Ou pral remake gen twa ikon - iOS. Android ak yon Kovèti pou. De premye yo se pwòp tèt ou-eksplikasyon. Icon la Kovèti pou ouvè anviwònman yo Fòma ki pèmèt ou kontwole ki jan chak nan fòma yo dosye nan lis la ap optimize. Anviwònman sa yo se "fòma espesifik" ak yon fwa ou te fè chanjman ou, klike sou bouton an Anviwònman Save ak chanjman sa yo pral aplike nan fòma yo yo dwe pwodiksyon.

Yon fwa ou chwazi iOS oswa android lis la ap chanje genyen ladan yo tout rezolisyon ki disponib sou platfòm sa a. Lis yo iOS pral montre faktè yo eskalade pou ekspozisyon an retin ak seleksyon an android ap gen balans sòti nan .75x 4x ki akomode pratikman tout aparèy android yo deyò.

Si gen yon fòma ki montre ke ou vle retire, klike sou "x la". Si gen yon sèl ou vle ajoute klike sou la + Ajoute Echèl bouton.

Lè fini, klike sou Bouton Ekspòte Ekspòtasyon an ak yon ba pwogrè pral montre w lè pwosesis la fini.

03 nan 04

Sèvi ak ekspòtasyon an pou Screens Files soti nan Adobe Illustrator CC 2015.

Ka pwodiksyon an dosye soti nan Illustrator fasil pou ajoute nan nenpòt ki kantite aplikasyon pou prototype tankou Adobe eksperyans Design.

Lè ou tcheke rezilta yo nan Export pou ekran, ou pral dekouvri ke Illustrator gen pwodiksyon yon vèsyon aplati nan chak ekran. Sou sifas la, sa a ka sanble yo yon ti jan fèb espesyalman si ou te espere Illustrator yo te ekspòte tout nan Bits yo ak moso tankou imaj.

Si ou etap tounen ak panse sou li pou yon ti moman, sa a se aktyèlman ekzakteman ki sa ou bezwen paske ou ka itilize pwodiksyon sa a nan yon aplikasyon prototype tankou Adobe eksperyans Design , Principleformac, Atomic.io , UXPin oswa lòt aplikasyon prototype

Nan egzanp sa a, mwen lè l sèvi avèk Adobe eksperyans Design (XD) yo kreye yon senp klike-thru. Premye etap la nan pwosesis la te chwazi iPhone a 6 gwosè ki matche dimansyon yo nan Interface a Illustrator

Lè koòdone a louvri, mwen chwazi zouti nan Artboard epi klike yon fwa sou graf la ajoute yon lòt atizay. Mwen Lè sa a, yo te rele yo "Kay" ak "Andwa", chwazi chak artboard ak enpòte imaj la png soti nan Illustrator nan atizay la.

Pou kreye "otspo" yo pou klike sou la-a, mwen te trase yon rektang sou bouton an Eksplore sou ekran an lakay yo epi mete valè ranpli li yo ak fwontyè pa youn pa deselanje pwopriyete sa yo nan panèl la Pwopriyete. Mwen te fè menm bagay la ak bouton an tounen sou paj la Andwa.

Pou ajoute entèaktivite a, mwen te chwazi mòd Pwototip ak Lè sa a, klike sou "otspo la". Mwen Lè sa a, trennen flèch la - rele yon fil - nan paj la Andwa, li mete sib la tranzisyon nan kote yo, mosyon an Pouse Left, ti soulajman a fasilite soti ak dire a nan tranzisyon an .6 segonn.

Mwen repete etap sa a ak otspo a sou paj la Andwa. Diferans lan sèlman te tranzisyon an mete nan Pouse Dwa. Lè mwen klike sou bouton an Jwe mwen teste pwototip mwen an.

04 nan 04

Kijan Pou Sèvi ak Komèsyal Komèsyal Byen nan Adobe Illustrator CC 2015

Custom ikon ka ekspòte kòm dosye SVG lè l sèvi avèk panèl la Export Byen.

Ansanm ak Save a pou ekran meni Adobe tou te ajoute yon nouvo panèl - Export Export - ki retire yon gwo doulè pwen nan workflow la Design UI.

Pwen doulè a ​​te ikon. Illustrator se yon aplikasyon vektè gwo desen men bay pwodiksyon, kite a di 10 ikon, sou yon paj ki gen 40 oswa 50 nan yo mande chak moun sove kòm yon imaj SVG. Sa a inevitableman mande plis tan pase mèsi abityèl nan vwayaj siksesif nan panèl la SVG. Pwen doulè sa a se kounye a yon bagay nan tan lontan an.

Ka Panèl sa a nouvo ka jwenn nan Window> Byen Export. Lè panèl la louvri, chwazi avantaj ou vle konvèti nan SVG oswa lòt fòma epi trennen nan panèl la. Lè ou lage sourit la yon thumbnail nan avantaj la te ajoute nan panèl la. Non avantaj la. Kenbe trenen objè yo nan panèl la jiskaske ou fini.

Chwazi chak atik Nan zòn nan anviwònman Export, oswa chwazi yo tout pa kenbe desann kle a chanjman epi klike sou chak youn. Chwazi fòma ou - nan egzanp sa a, mwen te chwazi SVG-, epi klike bouton ekspòtasyon an. Atik yo chwazi yo pral pwodiksyon kòm dosye SVG nan menm kote a kòm dosye a Illustrator.

Ki kote pwosesis sa a tout vin menm neater se ou pa bezwen sèvi ak panèl la Export Byen. Si ou klike sou Save a pou ekran bouton nan pati anba a nan panèl la bwat la dyalòg ouvè.

Kontrèman, ou ka klike sou tab la Byen nan panèl la Save pou ekran jwenn aksè nan panèl la Export Byen. Pou egzanp, si ou gen yon icon koutim sou yon atizay ou ka louvri panèl la Export Byen nan bwat dyalòg Save pou ekran epi trennen atik sa a nan panèl la Export Byen.