- - Készítsen webes animációs és interakciós mintákat HTML 5-ben az Adobe Edge segítségével

Készítsen webes animációs és interakciós mintákat HTML 5-ben az Adobe Edge használatával

A legújabb webes szabványok, a HTML5 és a CSS3a JavaScripttel való együttesen valóban csökkent a grafikus, szöveges és animációs webhelyek létrehozásához szükséges idő és erőfeszítés. A HTML5 lehetőségeinek felhasználásával többé nem kell kézzel írnia a kódot a multimédia tartalom beágyazására, míg a CSS3 rugalmasabbá, robusztusabbá, és ami még fontosabb, könnyebben kezelhetővé teszi a webes felhasználói felület elemeit. Ha olyan webes tervező eszközt keresett, amely lehetővé teszi a legújabb webes szabványok maximális kihasználását anélkül, hogy kényszerítené az egyes felhasználói felület elemek kódjának kézi bevitelét, akkor a frissen elindított Adobe Edge valószínűleg csak az, amire szüksége van.

Az Adobe Edge kifejezetten azvizuális, webes és interakciós tervezők, akik gyakran küzdenek a webes mozgás és animált tartalom létrehozásával HTML5, CSS3 és JavaScript webes szabványok felhasználásával. Alapvetően webes mozgás- és interakciótervező eszköz animált tartalom létrehozásához HTML5, CSS3 és JavaScript segítségével. Bár magában foglalja az összes alapvető eszközt a webes felhasználói felület létrehozásához, szerkesztéséhez, finomításához és megtervezéséhez, intuitív animációs koreográfust kínál, amely egyszerűen létrehozhat és módosíthat animált tartalmat az Ön weboldalán. Ezenkívül nem kényszeríti Önnek, hogy új projektet indítson a semmiből, importálhatja a HTML-fájlt, hogy új felhasználói felület-összetételeket tartalmazzon, és ügyeljen a meglévő felhasználói felület elemekre, például táblázatokra, szövegstílusokra, képárnyékokra, helyzetre, betűtípus, tároló igazítása és így tovább.

A fő interfész három részre oszlik. A bal oldali sáv tartalmazza a kiválasztott felhasználói felület elemösszetétel-eszközöket, a jobb oldali sávban megtalálhatók az összes főbb webes felhasználói felület elemlista, beleértve az árnyékhatásokat, képeket, szöveget, míg az alsó rész tartalmazza a koreográf animációk idővonal-szerkesztőjét.

Fő él 2

Az Elemek ablaktábla lehetővé teszi a kiválasztott megjelenítését / elrejtésételemre, és zárja le a további szerkesztés elkerülése érdekében. Amikor kiválaszt egy elemet a főképernyőről, akkor azonnal kiemeli azt az Elemek ablaktáblán, így könnyebben elrejthető vagy lezárható. Ha az egérmutatót az Elemek alatt felsorolt ​​elemek fölé vitte, az elnevezi az osztály kezdőbetűit névvel, így könnyen azonosítható a CSS fájlban.

elemek fő

Megjelenik a bal oldali tulajdonságok ablaktáblakompozíciós eszközök a weboldal kiválasztott felhasználói felület eleméhez. A kiválasztás után megváltoztathatja a hely méretét, átlátszóságát, a betűtípus-családot, a méretet és a szövegstílusokat, beállíthatja az átalakítás eredetét, a kép forgatását és így tovább.

3. él

Az idővonal-szerkesztő lehetővé teszi az idővonal megtekintésétminden animált elemből. Ha egy hatalmas CSS-fájlkal foglalkozik, akkor kattintson a szűrő gombra, hogy csak az animált elemeket jelenítse meg az Elemek ablaktáblában, hogy gyorsan szerkeszthesse helyzetüket, színüket, méretüket stb. Az ablaktábla bal alsó sarkában van egy zoom gomb az idővonal nagyításához. az összes animált elem allokált idejének és átmeneti hatásának ellenőrzésére.

animált elemek

Eltekintve a böngészők közötti kompatibilis létrehozásárólanimált tartalom az összes széles körben népszerű böngésző számára, beleértve a Firefox, a Chrome, az Internet Explorer 9 alkalmazást, az ezen eszköz segítségével létrehozott webtartalom zökkenőmentesen fog működni az iOS és az Android platformon is. A hivatalos közösség szerint az Edge Preview aktív fejlesztés alatt áll, és hamarosan számos szolgáltatással frissül. Az Adobe Edge Windows Vista és Windows 7 rendszereken működik.

Töltse le az Adobe Edge alkalmazást

Hozzászólások