Cloudové aplikace Adobe Edge Creative Cloud
HTML5, JavaScript a CSS3 se staly téměř stejně populární jako Flash pro vytváření interaktivních animací pro web, tablety a telefony. AdobeR Edge Animate a další aplikace Edge jsou velmi uživatelsky přívětivý software s mnoha předvolbami, které vám usnadní práci.

Animace na časové ose je stále nejoblíbenějším způsobem, jak animovat, a Adobe to usnadnilo díky novým pohybovým cestám Edge Animate, které mohou napodobovat pohyby ve skutečném světě a vestavěné uvolňování. Animaci můžete snadno přidat na časovou osu pomocí tlačítka Připnout, které přidá na animovanou značku animace nebo přetažením polohování objektů na jevišti, které Edge Animate automaticky převede na pohybové cesty. Můžete dokonce použít tlačítko Záznam, které zaznamenává změny, které provedete na objektech na jevišti, a převede je na animaci klíčových snímků. Edge má také svou vlastní verzi panelu Akce, která je přehledná, přičemž každá akce má na panelu svou vlastní kartu. Testování vašich animací je snadné díky kombinaci Adobe Edge a prohlížeče Google Chrome.

Pokud jste obeznámeni s animací Flash, všimnete si, že přidání interaktivity v Edge se podobá pracovnímu postupu Flash, protože můžete použít vnořené časové osy pro každý prvek animace a použít předinstalované úryvky kódu pro nejběžnější interakce a animace. Tyto úryvky kódu zpracovávají jak animaci přehrávání, jako je přehrávání, pauza, pokračování a zastavení, tak vytvářejí horké oblasti pro základní akce tlačítek, jako jsou kliknutí, vznášení a dokonce i hypertextové odkazy. Chcete-li k těmto fragmentům kódu přidat vlastní kód, můžete zadat přímo do panelu Akce. Samozřejmě můžete na panelu Akce ručně kódovat vlastní HTML5, JavaScript a CSS3. Protože tento typ programování webu a animací často závisí na externích knihovnách JavaScriptu, můžete do těchto externích zdrojů přidat odkazy.

Animace je pouze součástí toho, co můžete dělat se skupinou aplikací Edge. Jedním z nejdůležitějších aspektů webdesignu je vytvoření webu, který je citlivý nebo flexibilní pro všechny typy obrazovek od stolních po mobilní telefony. Děje se to pomocí dotazů na média a rozložení mřížky založené na procentech, které jsou součástí nástrojů nalezených v Edge Reflow. Edge Reflow je pracovní prostředí WYSIWYG, které generuje kód pro váš projekt. Tento kód je aktuální pro nejnovější webové standardy, zejména WebKit, který je stále více podporován vším od webových stránek po čtenáře elektronických knih.

Vytvoření rozvržení v Edge Reflow je stejně snadné jako kreslení kontejnerů HTML div na mřížku pomocí nástroje Box a absolutní umísťování těchto divů jim umožňuje měnit velikost nebo transformovat podle potřeby pro každou velikost obrazovky. Jak to funguje? Tajemství jsou dotazy na média, které si můžete přizpůsobit ve Správci dotazů médií nastavením minimálních a maximálních parametrů pro tři nebo více rozlišení obrazovky. Tyto parametry určují, kdy se návrh transformuje nahoru nebo dolů na nejbližší velikost obrazovky. Moc se mi líbí barevně označené vizuální značky pro každou velikost obrazovky v horní části pracovního prostoru, které vám pomohou vizualizovat, kdy dojde k těmto změnám.

Jednou z časově nejnáročnějších funkcí Edge je to, jak můžete snadno znovu použít své vlastní styly CSS3 v několika projektech a udržovat tak konzistentní styly. Díky tomu je aktualizace téměř automatická. Společnost Adobe z toho učinila součást vašeho pracovního postupu pomocí panelu Edge Reflow Styling. Aby byly věci přehledné, má každý styl, například pozadí nebo hranice, svou vlastní samostatnou sekci. Přímo z těchto karet můžete ovládat barvu a další parametry, stejně jako hierarchii vrstev. Tyto přizpůsobené styly jsou automaticky převedeny na pravidla stylů CSS, která pak mohou být kopírována / vložena pro opětovné použití.

V minulosti bylo nutné pro náhled webové stránky uložit změny, přepnout do webového prohlížeče a aktualizovat stránku. Společnost Adobe snížila počet těchto kroků pomocí kombinace Edge Inspect a prohlížeče Chrome. Nyní si můžete prohlédnout, jak se bude váš projekt zobrazovat na více zařízeních, od stolních počítačů, tabletů až po mobilní telefony. Jednou z funkcí, která se mi opravdu líbí, je možnost pořídit si snímek těchto náhledů a odeslat je e-mailem klientům a členům týmu nebo použít pro spolupráci ve službě Creative Cloud.

A konečně, pro ty z nás, kteří stále rádi pracují se surovým kódem, má Adobe Edge Code. Okno kódu je přehledné s několika ovládacími prvky vlevo a Edge Code se integruje do prohlížeče Google Chrome a poskytuje vám živý náhled. Když se váš kód stane dlouhým a nepohodlným, můžete procházet až na úroveň jednotlivých prvků pomocí funkce Rychlé úpravy, která uvádí všechny styly připojené k prvku v překryvném okně. Protože aplikace Edge jsou součástí Creative Cloud, můžete používat písma Adobe Edge Web Fonts, Google Web Fonts a Typekit přímo přímo z Edge Code. Kód Edge vygeneruje značku skriptu záhlaví, která se táhne v externím písmu.

Protože HTML5, JavaScript a CSS3 rychle nahrazují starší animační techniky z důvodu popularity mobilních zařízení, jsou tyto integrované aplikace Edge i jejich integrace s ostatními aplikacemi Adobe další generací pracovního postupu vývoje a vývoje více zařízení.

Zveřejňování: Tento článek mi nebyl finančně kompenzován. Společnost Adobe poskytla pro účely této kontroly členství v Creative Cloud.Názory jsou podle mých zkušeností zcela moje vlastní.

Copyright 2018 Adobe Systems Incorporated. Všechna práva vyhrazena. Snímky obrazovky produktů Adobe přetištěné se souhlasem společnosti Adobe Systems Incorporated. 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 a Flash Paper je / jsou [a] registrovanou ochrannou známkou (značkami) nebo ochrannou známkou (značkami) společnosti Adobe Systems Incorporated ve Spojených státech a / nebo jiných zemích.


Video Návody: Autodesk Fusion Team pro spolupráci na konstrukčních zakázkách (Březen 2024).