Adobe Edge Creative Cloud Apps

• Maijs 17, 2024

HTML5, JavaScript un CSS3 ir kļuvuši gandrīz tikpat populāri kā Flash, lai izveidotu interaktīvu animāciju tīmeklim, planšetdatoriem un tālruņiem. Adobe^R Edge Animate un citas Edge lietotnes ir ļoti lietotājam draudzīga programmatūra ar daudziem iestatījumiem, lai atvieglotu jūsu darbu.

Laika līnijas animācija joprojām ir vispopulārākais animācijas veids, un Adobe to ir atvieglojis ar jaunajiem Edge Animate kustības ceļiem, kas var imitēt reālās pasaules kustības un ar iebūvētu atvieglojumu. Jūs varat viegli pievienot animāciju laika skalā, izmantojot pogu Piespraust, kas laika zīmei pievieno animācijas marķierus, vai arī velkot un nometot objektu novietojumu uz skatuves, kuru Edge Animate automātiski pārveido kustības ceļos. Jūs pat varat izmantot pogu Ierakstīt, kas reģistrē izmaiņas, kas veiktas objektos uz skatuves, un pārveido šīs izmaiņas atslēgas kadra animācijā. Edge ir arī sava darbības paneļa versija, kas ir nepiespiesta katrai darbībai, kurai panelī ir sava cilne. Animācijas ir viegli pārbaudīt, apvienojot Adobe Edge un pārlūku Google Chrome.

Ja esat iepazinies ar Flash animāciju, pamanīsit, ka interaktivitātes pievienošana Edge atgādina Flash darbplūsmu, jo katram animācijas elementam varat izmantot ligzdotus laika grafikus un visbiežāk instalētajām mijiedarbībām un animācijām izmantot iepriekš instalētus koda fragmentus. Šie koda fragmenti apstrādā gan atskaņošanas animāciju, piemēram, atskaņošanu, pauzi, atsākšanu un apturēšanu, gan arī izveido karstas zonas galveno pogas darbību veikšanai, piemēram, klikšķiem, kursoriem un pat hipersaitēm. Lai šiem koda fragmentiem pievienotu pielāgotu kodu, varat rakstīt tieši panelī Darbības. Protams, jūs varat ar rokām kodēt savus HTML5, JavaScript un CSS3 panelī Darbības. Tā kā šāda veida tīmekļa un animācijas programmēšana bieži ir atkarīga no ārējām JavaScript bibliotēkām, jūs pat varat pievienot saites uz šiem ārējiem avotiem.

Animācija ir tikai daļa no tā, ko varat darīt ar lietotņu grupu Edge. Viens no vissvarīgākajiem tīmekļa dizaina aspektiem ir tādas vietnes izveidošana, kas reaģē vai ir elastīga visa veida ekrāniem no galddatoriem līdz mobilajiem tālruņiem. Tas tiek darīts ar multivides vaicājumiem un mainīgiem, uz procentiem balstītiem režģu izkārtojumiem, kas abi ir daļa no rīkiem, kas atrodami Edge Reflow. Edge Reflow ir WYSIWYG darba vide, kas ģenerē kodu jūsu projektam. Šis kods ir atjaunināts ar jaunākajiem tīmekļa standartiem, it īpaši WebKit, kuru arvien vairāk atbalsta viss, sākot ar tīmekļa lapām un beidzot ar e-grāmatu lasītājiem.

Izkārtojuma izveidošana Edge Reflow ir tikpat vienkārša kā HTML div konteineru zīmēšana uz režģa ar lodziņa rīku, un šo dalījumu absolūtais novietojums ļauj tiem mainīt izmērus vai pārveidot pēc nepieciešamības katram ekrāna izmēram. Kā tas darbojas? Noslēpums ir multivides vaicājumi, kurus varat pielāgot Media Query Manager, iestatot minimālos un maksimālos parametrus trīs vai vairāk ekrāna izšķirtspējai. Šie parametri noteiks, kad dizains pārveidosies uz augšu vai uz leju, lai sasniegtu tuvāko ekrāna izmēru. Man ļoti patīk krāsu kodētie vizuālie marķieri katram ekrāna izmēram darbvietas augšpusē, kas palīdz jums vizualizēt, kad notiks šīs izmaiņas.

Viena no visvairāk laika taupošajām Edge funkcijām ir tas, kā jūs varat viegli atkārtoti izmantot savus pielāgotos CSS3 stilus vairākos projektos un tādējādi uzturēt nemainīgus stilus. Tas arī padara atjaunināšanu gandrīz automātisku. Adobe to ir padarījis par jūsu darbplūsmas daļu ar Edge Reflow Styling paneli. Lai lietas nebūtu nepiesārņotas, katram stilam, piemēram, fonam vai apmalēm, ir sava atsevišķa sadaļa. Jūs varat kontrolēt krāsu un citus parametrus, kā arī slāņu hierarhiju tieši no šīm cilnēm. Šie pielāgotie stili tiek automātiski pārveidoti CSS stila noteikumos, kurus pēc tam var nokopēt / ielīmēt atkārtotai izmantošanai.

Agrāk, lai priekšskatītu savu tīmekļa lapu, jums vajadzēja saglabāt izmaiņas, pārslēgties uz tīmekļa pārlūku un atsvaidzināt lapu. Adobe ir samazinājis šo darbību skaitu, izmantojot Edge Inspect un Chrome pārlūka kombināciju. Tagad jūs varat priekšskatīt, kā jūsu projekts tiks parādīts vairākās ierīcēs, sākot no galddatoriem, planšetdatoriem un beidzot ar mobilajiem tālruņiem. Viena no funkcijām, kas man ļoti patīk, ir spēja nofotografēt šo priekšskatījumu ekrānuzņēmumu, lai nosūtītu e-pastu klientiem un komandas locekļiem vai izmantotu Creative Cloud sadarbībai.

Visbeidzot, tiem no mums, kuriem joprojām patīk strādāt ar neapstrādātu kodu, Adobe ir Edge Code. Kodu logs ir nepiesārņots, tikai ar dažām vadības pogām kreisajā pusē, un Edge Code ir integrēts ar Google Chrome, lai jūs varētu tiešsaistē tiešsaistē redzēt. Kad jūsu kods kļūst garš un nepatīkams, varat izmantot detalizēto informāciju līdz atsevišķa elementa līmenim, izmantojot ātrās rediģēšanas funkciju, kurā uzskaitīti visi stili, kas elementam ir pievienoti pārklājuma logā. Tā kā Edge lietotnes ir daļa no Creative Cloud, Adobe Edge Web Fonts, Google Web Fonts un Typekit fontus varat izmantot tieši no Edge Code. Edge Code ģenerēs galvenes skripta tagu, kas ievelk ārējo fontu.

Tā kā HTML5, JavaScript un CSS3 mobilo ierīču popularitātes dēļ ātri aizstāj vecākas animācijas tehnikas, šīs integrētās Edge lietotnes, kā arī to integrācija ar citām Adobe lietotnēm ir nākamās paaudzes vairāku ierīču projektēšanas un izstrādes darbplūsma.

Informācijas atklāšana: Man par šo rakstu netika piešķirta finansiāla kompensācija. Šīs pārskatīšanas vajadzībām Adobe piegādāja Creative Cloud dalību.Balstoties uz manu pieredzi, šie atzinumi ir pilnīgi mani.

Autortiesības 2018 Adobe Systems Incorporated. Visas tiesības aizsargātas. Adobe produkta ekrānuzņēmums (-i) ir pārpublicēts ar Adobe Systems Incorporated atļauju. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper ir / ir vai nu [a] reģistrēta preču zīme (-es), vai Adobe Systems Incorporated preču zīme (-es) Amerikas Savienotajās Valstīs un / vai citās valstīs.

Video Instrukcijas: Building a Mobile App with Adobe Creative Cloud | Adobe Creative Cloud (Maijs 2024).