Hogyan készítsünk flash animációt. Új fájl (dokumentum) létrehozása a Flash CS6-ban

A webhely összes része


Flash animáció létrehozása flash

Flash létrehozása és szerkesztése

Téma létrehozása és szerkesztése mindenféle flash objektum: videó, rajzfilm, transzparens, webhely "- nagyon érdekes, lehet, hogy nem lesz Profi, de MINDENKINEK ismernie kell az" alapokat "és alkalmazni kell ezeket a tudásokat a gyakorlatban!

Mi az egyedi vaku technológia? Természetesen rengeteg előnye van, dinamikusabbá, élénkebbé, interaktívabbá tette a világhálót, lehetővé tette színes céges prezentációk, reklámok, bannerek stb. stb.

Ez a banner kattintható :-)

Ennek a technológiának köszönhetően először animáció készítése nemcsak az elit (szakemberek), hanem amatőrök milliói számára is elérhetővé vált.

A probléma megoldására sok program létezik - kicsik és nagyok, egyszerűek és összetettek, erősek és nem annyira. Különálló (mindenekelőtt) a két szörny ezen a területen!

Ez a Macromedia (Adobe) Flash és Macromedia Flash Professional 8-as verzió- ő mindenki kedvenc Macromedia Flash 8 szakembere

Nézzük meg közelebbről ezt a két "szörnyet"

Macromedia Flash MX esetén nehéz vállalni, mert joggal tekintik
az egyik legnehezebben elsajátítható számítógépes program.

Először is, nagyon bonyolult. Egyszerűen irreális, hogy egy normális ember megértse és megtanulja az Action Scriptet (az úgynevezett script programkódot).

A vágy itt nem elég! Vastürelemre, kitartásra van szüksége, és olyan lelkesedéssel közelítse meg a tanulmányt ...

Másodszor, ennek a programnak megfelelően egyszerűen nincs többé -kevésbé érthető videólecke és videó tanfolyam (kivéve egyet), és a program tanulmányozása vastag tankönyvekből, amelyeket szakemberek írtak ebben a kérdésben, és az Ön "abszurd" nyelvén - mondhatjuk, hogy a medvék biciklizni tanítanak.

Ha akarod, próbáld ki :-)

De a Macromedia Flash 8 Professional segítségével a dolgok szórakoztatóbbak lesznek

És maga a program könnyebben és érthetőbben tanulható, és a képzés
Sok mindenfélét megtalálsz belőle!


Úgy tűnik: vedd el – nem akarom. Azonban a vastag könyvek tanulmányozása sem számít.
egyszerűek, és valamiért egyáltalán nem olcsók. A legjobb mód
tanulási programok – oktatóvideók. Nos, a LEGJOBB a videó tanfolyam

Természetesen jobb egyszer látni és hallani, mint olvasni
hogyan lehet flash videókat, rajzfilmeket, bannereket készíteni és szerkeszteni.

Mint minden képzés - a Macromedia Flash 8 Professional rendszerben található oktatóvideók fizetett és ingyenes részekre vannak osztva.

És mint mindig, a fizetősek természetesen jobb minőségűek (persze nem képek, hanem az edzés minősége).

Bár van 11 ingyenes , de NAGYON jó és jó minőségű videó oktatóanyagok a flash létrehozására és szerkesztésére szolgáló program kezdeti tanulmányozására.

Ha önállóan akar tanulni létrehozni vagy szerkeszteni kész flash videókat, akkor egyszerűen nem nélkülözheti az erről a témáról szóló videotanfolyamot. Nem könnyű egyedül elsajátítani az ilyen programokat.

És ezek a videó oktatóanyagok nagyon jó segítséget nyújtanak a Flash animációval való munkavégzés készségeinek fejlesztéséhez.

Ahhoz, hogy valóban elsajátítsa a vaku technológiáját, komolyabb videóleckékre van szüksége. Természetesen már nem lehetnek szabadok. Érted miért :)

A Flash-technológiák olyan szorosan beépültek a webdizájnba, hogy manapság egy modern weboldal elemévé válik az animált elemek megjelenése a dizájnban - splash képernyők, flash képek, bannerek és más hasonló betétek - az oldal aktív elemei.

Ezek az elemek mintegy "animálják" a webhely dizájnját, kellemesebbé és kényelmesebbé teszik a webhely felhasználóit, lehetővé teszik az oldal megjelenését és eredetibbé és korszerűbbé tételét.

Vaku olyan elemeket, mint animációs videók, a webdesign legújabb vizuális eszközét képviselik, Macromedia Flas technológiával készültek.

És a webhelyen való jelenlétükkel a gyönyörű flash meghajtók megkülönböztetik webhelyét a többitől, mert jelenleg a leghatékonyabb módszer az információk tömörített méretben és időben történő megjelenítésére.

Ha úgy dönt, hogy gyönyörű flash oldalakat hoz létre, és jó pénzt keres vele ...

Írja be a Yandexet, kérje: " flash webhelyek árai"... és látni fogja, hogy a professzionális Flash-webhely gyártásának ára általában 1000 dollárról indul.

Miért? Ilyen áron több html-oldalt is készíthet? "Igen, tényleg megteheti, de mely oldalak? Ghost-oldalak? Az önépítés weblapjai, ha egyszer hozzájutunk, azonnal el akarunk menekülni.

És végül is az ilyen erőforrások tulajdonosai a sötétben vannak, és nem értik, miért nem ír nekik senki vagy hívja őket. Több tízmillió ilyen webhely található az interneten ...

Gondolod, hogy az ilyen "csodálatos" oldalak tulajdonosai valóban érdekelhetik a látogatókat? A válasz kézenfekvő - semmi haszna az ilyen alkotásoknak!

És ha a professzionális Flash-webhely gyártásának ára általában 1000 dollárról indul, akkor ha professzionális Flash-oldalt rendel, akkor az ár megduplázódik ... és 2000 dollárból lesz!

Amikor az emberek azt látják, hogy egy cég vagy egy személy megengedheti magának egy komoly flash weboldalt, teljesen más a hozzáállása egy ilyen céghez.Az Ön webhelye az arcod és a megjelenésed az interneten.

Más szóval, ami pozitív érzelmeket okoz, később emlékeznek rá, és mint tudják: "Az érzelem az eladások királynője."

Így kiderül, hogy egy professzionális, stílusos Flash webhely valójában egy valódi eszköz a jó pénzkereséshez és a webes kép sikeres elhelyezéséhez a hálózaton.

Sőt, azok az emberek, akik ezeket a szolgáltatásokat kínálják az ilyen webhelyek létrehozásához, soha nem fogják elmondani vagy megmutatni, hogyan jött létre a Flash webhely. A forrásért pedig további díjat kell kérni.

Egy kis példa:

Voltál már nyaralófalvakban? Figyelt a tarka épületekre, minden csíkból, amelyek közül időről időre kiemelkednek a szilárd épületek, gyönyörű homlokzattal, dizájnnal stb.

Az esetek 90% -ában ilyen házakat nem egy autodidakta, hanem egy szakembergárda épített, egy szabványos, kész, szabványos terv szerint, amely szerint tucatnyi hasonló épület készült különböző területeken.

Arra a tényre, hogy ezek az emberek tudják, hogyan kell megfelelően betölteni az alapokat, falakat, tetőt, ablakokat üvegezni stb., Vagy más szóval, profik, mindegyik a saját területén, így a ház szépnek és megbízhatónak bizonyul .

Ugyanez a helyzet a professzionális Flash webhelyek létrehozásával is, tehát egy professzionális Flash webhely létrehozásához a semmiből többszakúnak kell lennie.

Vagyis legalább „három az egyben” össze kell kapcsolni.

1.) Legyen képes kézzel rajzolni egy professzionális, elektronikus táblagépen
(nem egérrel, hanem kézzel). Ismerje az animáció alapjait.

2.) Tudjon programozási nyelveket: Acton Script 2 és Acton Script 3
(amit évek óta tanulmányoznak, még a programozási alkalmassággal rendelkezők is).

3.) Legyen tehetséged, kitartásod és rengeteg szabadidőd.

Tehát a Flash-tervezők túlnyomó többsége világszerte és Oroszországban egyedi készítésű webhelyeket hoz létre tipikus, kész projektek alapján, amelyek az úgynevezett:

"Kész források a Flash-webhelyekhez, professzionális tervezők és programozók csapata által."

Az ilyen forrás létrehozásának sémája nagyon egyszerű: egy fejlesztői csapat összegyűlik, és nagyon gyorsan és harmonikusan több forrást, flash-webhelyet készít, és mindegyik a saját dolgát végzi.

Természetesen ilyen forrásokat szereznek be: professzionális, bemutatható és kiváló minőségű. Ezután online eladásra bocsátják. És több százezer ilyen forrás van az interneten ...

Csak egy árnyalat van ... Kevesen tudják, hogyan kell szerkeszteni őket, mert a Macromedia Flash programban készülnek, amelyet joggal tekintenek a világ egyik legösszetettebbnek.

Most sikerült megoldást találni. Könnyen szeretne tanulni bármilyen flash forrás szerkesztése egyedül ?!

Íme egy rövid és tömör leírás a videó tanfolyam leckéinek témáiról:

Bevezetés. Ebben a leckében megtudhatja, hogy a Macromedia Flash mely eszköztárait fogjuk használni a videó tanfolyam során.

1: A logó szerkesztése. Megtanulja, hogyan kell megfelelően szerkeszteni egy grafikus vagy szöveges logót
a legjobban nézett ki a Flash oldalon.
2: A menü szerkesztése. Lépésről lépésre megmondja, hol keressen többrétegű fájlokat, amelyek dinamikus jellemzőket állítanak be animált Flash menü.
3: Az oldalak szövegének szerkesztése. A lecke során részletesen végigjárjuk a teljes fájlkönyvtárat, és megtanuljuk, hogyan kell megfelelően szerkeszteni az összes oldalon található szövegblokkokat.
4: Címsorok szerkesztése további, híroldalakon. Elég kiterjedt anyag a banner gombok szerkesztéséről magán a Flash oldalon.
5: A szöveg szerkesztése további oldalakon. Egy másik blokk a kulcskeretek megtalálására és a megfelelő dinamikus szövegblokkok megváltoztatására.
6: A hiperhivatkozások szerkesztése 1. rész. Ez a rész döntő fontosságú a hivatkozások helyes írása szempontjából az Action Script programozási nyelv formátumában.
7: A hiperhivatkozások szerkesztése 2. rész. Az anyag a hiperhivatkozások gombjainak létrehozására szolgál, és a lecke befejezése után megtanulja, hogyan hozhat létre önállóan további gombokat a hiperhivatkozásokhoz.
8: A zene beírása.
Ebben az oktatóanyag -sorozatban megtanulhatja, hogyan ágyazhat be bármilyen zenei fájlt egy Flash webhelyre.
9: Optimalizálás és közzététel.
Nagyon fontos téma a forrás sikeres optimalizálása és az összes mappa és fájl internetre való feltöltése szempontjából.
10: Flash + Php űrlap üzenet küldéséhez közvetlenül a Flash webhelyről. Ebben az oktatóanyag -sorozatban megtudhatja, hogyan lehet testreszabni egy űrlapot az üzenetek teljes forrásverzióban történő küldéséhez.

Szerencsére az aktív internetezők többsége képes flash játékot létrehozni. Ebben már az alapvető programozási ismeretek is jó segítséget jelentenek a kezdőknek (mellesleg nem is olyan nehéz megszerezni - lenne rá vágy). Szüksége lesz azonban egy kis időre, hogy elsajátítsa a sok speciális flash-játékok (például Macromedia Flash) egyikét.

Sok szoftveroldal többek között csak ilyen fejlesztőket tartalmaz. Telepítésük számítógépre általában nem okoz különleges problémákat a felhasználó számára. Ne feledje, hogy a kiválasztott programot regisztrálni kell, és minden szükséges módosítást telepíteni kell - akkor hűségesen, azaz megszakítás nélkül szolgál majd. A játékkonstruktorok többsége angol nyelven készül, de kereshet egy repedést vagy egy orosz változatot. Gyakran a beállításokban van egy ablak, ahol beállíthatja anyanyelvét.

Hogyan készítsünk flash játékot: előzetes felkészülés

Még mielőtt leülne a konstruktőrt elsajátítani, már rendelkeznie kell a játék durva forgatókönyvével, történetével. Érdemes előre átgondolni az animációt és a tervezést – ezzel jelentősen megtakaríthatja az időt. A flash játék létrehozása előtt döntse el a kívánt játék típusát. Inspirációért keresse fel a flash játékkönyvtárakat bemutató webhelyeket.

A szakemberek azt javasolják, hogy a kezdők egyszerű alkalmazások, például arcade játékok létrehozásával kezdjék. És csak ezután lehet majd továbblépni a bonyolultabb játéktípusokhoz, és akár saját stratégiákat is létrehozni. Ugyanazon kivitelezőben választhatja ki a jövőbeli játék típusát, ahol minden műfaj kényelmesen válogatható. Aktiváljuk például az árkádot (dupla kattintás).

Flash -játék létrehozása: a játéktervezőben dolgozva

Nyissa meg a sablont, és húzza rá a kívánt objektumokat az Animációs objektumok és a Statikus objektumok szakaszból. Hozzon létre hátteret a textúra és a szín kiválasztásával. Objektumok esetén válassza ki a színpaletta segítségével. Az animációs lejátszó segítségével ellenőrizze, hogy mely egyéb funkciók nincsenek használatban. A beállításokban állítsa be a játék karaktereinek (árkádok) vagy tárgyak (logikai játékok) mozgási szintjét.

Ha mindent megtett, akkor indítsa el a hibakeresőt. Ebben a módban a saját játékát végigjátszhatja, bármilyen szintről kiindulva - ez fontos a teljesítmény teszteléséhez. Távolítsa el a talált hibákat, és ellenőrizze újra a flash játékot. Ha minden rendben van, mentse el a módosításokat.

Hogyan készítsünk flash játékot: „jussunk eszünkbe”

Most kitalálhat egy eredeti nevet a flash-agyszüleménye számára, és összeállíthat egy rövid kommentárt. Használja a képernyővédő készítőjét, hogy látványos splash képernyőt hozzon létre a játékhoz. Mentse el az összes változtatást.

Nézze át saját flash játékát az elejétől a végéig, annak érdekében, hogy hibákat és meghibásodásokat találjon (vagy ne találjon), és általában nem árt kritikus pillantást vetni saját kezű munkájára. Nagyon fontos, hogy a játéknak legyenek logikus és világosan meghatározott részei, például egy jó könyv vagy film: a kezdet, az események menete, a vége.

Küldje el játékának tiszta verzióját barátainak - hagyja, hogy a becsületes kritikusok értékeljék az elért eredményeket. Nos, ezek után már fel is töltheti a flash játékot a hálózatra.

Hogyan készítsünk flash játékot, ha van vágyunk, de nincs tudásunk?

Annak a sok felhasználónak, akiket annyira aggaszt ez a kérdés, mindenképpen választ akarunk adni. Ne feledje, hogy bármilyen tudás nem származhat a semmiből. Minden új vállalkozást valahol el kell kezdeni. Idővel kezdi megérteni, hogy pontosan milyen tudás hiányzik a játékok létrehozásához. Elkezdesz tanácsot kérni, ajánlásokat keresni, releváns szakirodalmat olvasni, aminek köszönhetően egyre tovább fogsz lépni készségeidben. Ne félj az újtól, különben sosem éred el, amit akarsz. Sok szerencsét!

* Használt programok: Flash CS3, Photoshop CS3
* Bonyolultság: közepes
* Becsült átfutási idő: 3 óra

A portfólió nagy jelentőséggel bír minden kortárs művész, fotós, tervező és még zenész számára is. Komoly hozzáállást mutat az üzlethez és a professzionalizmushoz. Ma megmutatjuk, hogyan hozhat létre eredeti és stílusos fotó portfóliót a modern Moto CMS Flash tartalomkezelő rendszer alapján.

A Moto CMS önálló verzióját fogjuk használni, amely különféle segédprogramokat, összetevőket, beépített példákat és tiszta, különböző struktúrájú webhelysablonokat tartalmaz. És a legegyszerűbb sablont fogjuk használni, azaz a semmiből létrehozunk egy fényképportfólió oldalt.

Ebben az útmutatóban a következő témákkal foglalkozunk:

* Konténerek készítése.
* Résidők létrehozása ("Bezárás" gomb, egyszerű gomb).
* Modulok létrehozása (zenelejátszó és képgaléria).
* A webhely előtöltőjének szerkesztése
* Weboldal -oldalak létrehozása és tartalommal való feltöltése.

A Moto CMS Vezérlőpult lehetőségeiről és funkcióiról is beszámolunk.

Szükségünk van:
* Adobe Photoshop;
* Adobe Flash CS3;
* A Moto CMS önálló verziója (ingyenes próbaverzió);
* Weboldal tervezés. PSD formátum.

Végső eredmény előnézete

1. lépés: Töltse le a Moto CMS fájlokat

A fényképportfólió webhely létrehozásának megkezdéséhez le kell töltenie a Moto Flash CMS önálló verzióját. Annak érdekében, hogy megismételje az útmutató összes lépését, és megértse a Moto CMS képességeit, elegendő a próbaverzió.

2. lépés: A Moto CMS-fájlok gyors bemutatása

Íme egy gyors áttekintés a Moto CMS fájlokról és mappákról:

* Alkatrészek... Ez a mappa az Adobe Extension Manager által kezelt mxp összetevőket tartalmazza.
* Kezelőpanel... A Vezérlőpult összes fájlját tartalmazza.
* Dokumentumok... Ez a mappa API dokumentációt tartalmaz.
* Példák... 4 példát tartalmaz kész flash oldalakra, a legegyszerűbbtől a legbonyolultabbig, galéria modullal, hírmodullal, zene- és videólejátszóval, kapcsolatfelvételi űrlappal stb.
* Sablonok... 5 sablon, amivel Moto CMS alapú weboldalt lehet készíteni. Minden sablon rendelkezik a szükséges fájlkészlettel, és szerkezete eltér. Ma ezen sablonok egyikét, különösen az 1. sablont fogjuk használni fényképportfóliónk alapjául.
* Readme fájl további információért, hogyan kezdjen hozzá egy webhely létrehozásához a Moto CMS segítségével.

3. lépés: Indítsa el a helyi tárhelyet

Következő lépésünk a webhelysablon elindítása lesz, amelyet portfóliówebhelyünk alapjául fogunk használni. Ehhez szükségünk van egy helyi webszerverre. WampServert használunk. Lehetővé teszi webes alkalmazások létrehozását Apache, PHP és MySQL adatbázisokkal.

Az 1. webhelysablon futtatásához egyszerűen töltse fel a mappa tartalmát a helyi szerverre template_01 a / templates / könyvtárból, valamint a mappa tartalmából kezelőpanel.

Ezt követően a Moto CMS Vezérlőpultra lépünk, megadva az URL -t a böngésző címsorában, a végén pedig a / admin

Jegyzet: Az oldalt most nem fogja tudni megtekinteni, mivel még nem tartalmaz oldalakat. Megjelenik egy 404 -es hibaoldal.

4. lépés: A config.xml szerkesztése

Csak annyit kell tennünk, hogy módosítsuk az oldal szélességét és magasságát, és állítsuk be a háttérszínt.

Projektünk mérete 980 × 800 pixel. Ahhoz, hogy a méret átméreteződjön egy nagy képernyőn, a webhely szélességének és magasságának 100%-át kell beállítani. És ahhoz, hogy helyesen jelenjen meg egy kis felbontású képernyőn, meg kell adnunk a webhely minimális szélességét és magasságát (görgetősávok jelennek meg). A háttérszín fekete (# 000000).

5. lépés: A style.css módosítása

Most meg kell nyitnunk a style.css fájlt, és meg kell adnunk a háttérszínt (fekete). Minden más szerkeszthető a Moto CMS vezérlőpultjával.

6. lépés: hozza létre az előtöltőt

A moto.xfl és a website.xfl forrásfájlok a flamoto és a flawebsite mappákban találhatók.
A webhely előtöltőjét a moto.xfl fájlban kell létrehozni. Az előtöltő lehet egy egyszerű, 100 képkocka klip.

A klip Műveletek paneljén ezt írjuk: „Stop ();” az első képkockához. Ezután tetszés szerint animáljuk a többi keretet.

Azt is írjuk, hogy „Stop ();” az idővonal első képkockájának akcióiban fla.

Ne felejtse el megadni a webhely méreteit (minimális szélesség és magasság) a moto.fla fájl tulajdonságaiban.

A következő lépésünk egy szép animáció elkészítése az előtöltő eltűnéséről. Az utolsó keretben el kell indítanunk az oldalt a „showWebsite ()” funkció aktiválásával.

Nyissa meg a website.xfl fájlt, és frissítse az előtöltőt.

7. lépés: A webhely háttere

Nyissa meg a Moto CMS Media Library-t (Beállítások> Médiatár), és a többi szükséges képpel együtt (a főoldalhoz, főoldalakhoz vagy galériához) töltse fel a háttérképet a „Média hozzáadása” gombbal.

Ezt követően térjen vissza a Vezérlőpultra, hozzon létre egy új oldalt, és helyezzen be egy háttérképet a „Fotó” gombbal. Húzza el a képet, és középre helyezze.

A Betűkezelő lehetővé teszi a felhasználók számára a webhely betűtípusainak kezelését, amelyeket SWF fájlként tárolnak és letölthetnek.

A betűtípus betöltése előtt először át kell alakítanunk SWF formátumba. Erre fogjuk használni Online Font Creator A MotoCMS csapata által kifejlesztett praktikus online alkalmazás, amely lehetővé teszi a TTF és OTF fájlok egyszerű konvertálását SWF formátumba. Mindössze annyit kell tennünk, hogy kiválasztjuk a kívánt betűkészletfájlt .TTF vagy .OTF kiterjesztéssel, hozzáadjuk az Online betűtípus -készítőhöz, kattintsunk a „Betűtípus létrehozása” gombra, és töltsük le a kész SWF fájlt, majd használhatjuk azt a portfólió oldal...

Hozzon létre egy webhely nevét és szlogent

Az új betűtípus betöltése után létrehozhatja a webhely nevét és szlogenjét a Szöveg eszközzel és a kívánt betűtípus alkalmazásával. A szlogen létrehozásához a Tahoma betűtípust használjuk, méret: 10, szín: # 727272. Ezt követően javítsa ki a webhely nevét és szlogenjét a .PSD formátumban leírtaknak megfelelően.

9. lépés: Adja hozzá a képet a kezdőlaphoz

Helyezzük a galéria képét az oldal főoldalára. Ehhez válasszon ki egy képet a Médiatárból a bal oldali eszköztár "Fotó" elemére kattintva. Ha szükséges, állítsa be a helyét a főoldal kialakításának megfelelően.

10. lépés: hozza létre az alsó menüt

Az Alakzat eszközzel szürke, keskeny téglalapot hozhat létre, a Típus eszközzel pedig gombokat. Állítson be mindent a webhely kialakítása szerint.
Mentse el az összes módosítást, és nézze meg az eredményt az "Előnézet" gombra kattintva.
A beépített menümodul segítségével menüt is létrehozhat.

11. lépés: Hozzon létre tartalom tárolókat

Jegyzet: A tárolók olyan klipek a website.fla oldalon, ahol dinamikusan lehet tartalmat hozzáadni. Ezek 4 típusúak lehetnek: 1) egy konténer a webhelyen látható tárgyakkal, 2) konténer elrendezési objektumokkal; 3) egy tároló oldalobjektumokkal; 4) konténer felugró objektumokkal.

Az általunk választott 1. számú webhelysablon alapértelmezés szerint két tárolót tartalmaz: egy tárolót, amelyen az objektumok láthatók az egész webhelyen, és egy tárolót az oldalobjektumokkal. Ha megnyitjuk a website.fla fájlt, látni fogjuk őket:

Ezeket a tárolókat a structure.xml fájl írja le. Győződjön meg arról, hogy a szélessége 980, a magassága pedig 800 képpont.

Tároló olyan objektumokkal, amelyek az egész webhelyen láthatók:

Tároló oldalobjektumokkal:

Ahhoz, hogy a webhely elemeit, például a hátteret, a webhelynevet, a szlogent és az alsó menüt szürke téglalappal lássuk el, minden oldalon látható, azokat egy tárolóba kell helyeznünk a teljes webhely objektumaival. Ezt egyszerűen megtehetjük a Moto CMS vezérlőpultjával. Csak kattintson a kívánt elemre, és válassza ki a helyét - Webhely. (A teljes honlapon).

12. lépés: Hozza létre a Névjegy oldalt

Hozzon létre egy üres oldalt

A bal felső sarokban kattintson a "Létrehozás" gombra, amellyel új oldalt hozhatunk létre.

Az új oldalhoz kapcsoljuk a szükséges menügombokat

Ehhez térjen vissza a főoldalra, és csatlakoztassa a menü gombot az új oldalhoz. Csak válassza ki a menügomb szövegét, és kattintson a link ikonra a jobb oldalon a linkszerkesztő megnyitásához. Esetünkben a "Portfólió" menü gomb a webhely főoldalára, a "Rólunk" gomb pedig a "Rólunk" oldalra utal.

Adjon hozzá háttérképet a Rólunk oldalhoz

Úgy döntöttünk, hogy fekete hátteret adunk az oldalhoz. Ehhez lépjen a Médiatárba a bal oldali panelen található "Fénykép" gombra kattintva, válassza ki az előre betöltött képet (egy normál fekete téglalapot), és állítsa be annak helyzetét az oldalon a tervnek megfelelően.

Szöveg hozzáadása a Rólunk oldalhoz

Adjon hozzá szöveges információkat az oldalhoz a Szöveg eszközzel. A beépített WYSIWYG szerkesztő mindent megmutat, amit csinál, így a szöveg formázása egyszerű. A kapcsolattartó címét is nagyon könnyű hozzáadni, csak meg kell nyitnia a Linkszerkesztőt, és be kell írnia az e -mail címet.

Ha végzett, ne felejtse el elhelyezni a Rólunk oldal elemeit az oldalobjektum-tárolóban. Válassza ki egyenként az egyes elemeket, és válassza ki az elhelyezést: Oldal (oldal tartalma).

13. lépés: módosítsa az előtöltő képét

Lehet, hogy észrevette a fehér kör alakú előtöltőket, amikor az oldalak között navigál. Ezek konfigurálásához nyissa meg a website.fla fájlt, és lépjen a könyvtárba. Kattintson a jobb gombbal az előtöltőre, és válassza a Tulajdonságok menüpontot.

A szimbólum tulajdonságai ablakban kiválaszthatja az "Alaposztály szerkesztése" elemet, majd tetszés szerint animálhatja az előtöltőt. Üresen hagyjuk az előtöltőt, és töröljük a grafikus képet.

14. lépés: animálja a webhelyet

Végül elérkeztünk oktatóanyagunk legérdekesebb részéhez: a webhely -animációkhoz. Jelenleg, ahogy észrevetted, a webhely statikus, mivel egyetlen konténer sem animált. Ezért a következő lépésünk a konténerek animálása és más animációk hozzáadása, amelyek életre keltik webhelyünket.

Alapértelmezett tárolók animálása

A tartalomtároló könnyen animálható az idővonal mentén. Nyissa meg a website.fla fájlt, és hozzon létre egy halványítási animációt minden tárolóhoz.

Először a fő konténert animáljuk a webhelyen látható tárgyakkal. Ez a website_holder_1 réteg. Egy egyszerű animációt készítünk átlátszósággal, de valamivel díszítjük a megjelenését. Hozzon létre egy második kulcskockát a rétegen, állítsa az Alfát 0%-ra az első kulcskockához (tegye átlátszóvá), hozzon létre egy közbenső keretet az elsőtől a másodikig, majd adjon hozzá lágyítást.

Hozza létre ugyanazt az animációt az oldalobjektumokkal rendelkező tárolóhoz (page_1_holder_2 réteg), de némileg később jelenítse meg.

Ezzel további két kulcskockát ad hozzá a réteghez, átlátszóvá teszi a tárolót az első és a második képkockában, és egy lágyított köztes keretet hoz létre a második kulcskockából a harmadikba.

Amikor összeállítjuk és betöltjük az oldalt, látni fogjuk, hogy minden elem már animációval együtt megjelenik. De amikor egyik oldalról a másikra lép, nincs animáció, csak szokatlan villanások. Az idővonal második része felelős ezért.

Így animáljuk a konténer megjelenését és eltűnését.

Mivel a szöveg betűtípusa a rendszer betűtípusaiból származik, a keverési módot normál rétegről szintre kell változtatnunk minden filmklip példánynál a tárolórétegeken.

További konténereket hozunk létre és animálunk.

Egy jó flash webhelyhez ez az animáció nem elegendő, ezért animáljuk a webhely más részeit, például a felső részt (sárgával kiemelve az alábbi képen), az alsó részt (zölddel kiemelve) és magát a tartalmat (a képen a piros keretben).

Mivel a felső és az alsó rész a teljes oldal szintjén van, ehhez a két részhez két tárolót adunk. A konténerek hozzáadása előtt meg kell határoznunk azok méretét és helyét. Ez könnyen elvégezhető a Photoshop Slice eszközzel.

A felső rész a következő méretekkel rendelkezik: x = 0, y = 0, szélesség = 980, magasság = 120.

Alsó zóna: x = 0, y = 765, szélesség = 980, magasság = 35.

A felső tároló tartalmazza a webhely nevét, az alsó tároló tartalmazza a menüket, és ezek eltérően jelennek meg. Ezenkívül teljes képernyős módba kapcsolva a képernyő tetejéhez és aljához tapadnak.

A konténerek méretének meghatározása után megnyitjuk a structure.xml fájlt, és új konténereket adunk hozzá (telephely szinten), megadva azok koordinátáit, szélességét, magasságát és mélységét.


Miután hozzáadtuk a tárolókat a .xml fájlhoz, létre kell hoznunk azokat a website.fla fájlban. Nyissa meg a website.fla fájlt, és hozzon létre új rétegeket tárolóinkhoz. A rétegek sorrendjének meg kell egyeznie az xml fájlban megadott mélységi értékekkel.

Másolhatjuk az üres mozgóképet a website_holder_1 rétegről, és beilleszthetjük a website_holder_3 és website_holder_4 fájlokba.

Állítsa be a klipben ugyanazokat a koordinátákat, mint a szerkezet.xml fájlban.

A 3. konténer esetében: x = 0, y = 0;

A negyedik tárolóhoz: x = 0, y = 765.

Mióta lemásoltuk a klipet, a régi nevek maradnak. Azonosítójuk szerint változtatjuk őket, hogy könnyen megtalálhassuk őket.

Ugyanezt kell eljárni a 4-es tartálynál is.

Az idővonalon állítsa be az első kulcskockát a 3. és 4. tárolóhoz, hogy azok később jelenjenek meg, mint a teljes webhely objektumait tartalmazó tároló. Ezután elkészítjük a második kulcskeretet és az animációt. Az első kulcskeretek tartalmazzák a tárolók kiindulási helyzetét, a második pedig a tárolók végső pozícióját a helyszínen. A fő konténer megjelenik a képernyő tetején, ezért áthelyezzük az első kulcsképbe; az alsó tartály az alsó oldalon található, így azt is áthelyezzük az első kulcsképbe. Könnyítéseket is adunk a köztes keretek animálásához.

Íme, amit kaptunk:

Ezt követően hozzá kell adnunk a következő kódot a műveleti réteghez a tárolóink ​​animációjának első kulcskockájának szintjén.

Ezután összeállítjuk a webhelyet, és frissítjük a Vezérlőpultot.

Helyezzen tárgyakat edényekbe

Ha bármelyik objektumot kiválasztja, látni fogja, hogy két új tároló jelent meg a legördülő menü lehetséges elhelyezéseinek listájában: a felső és az alsó.

A szlogennel ellátott webhelynevet a felső tárolóba kell helyezni, az alsó menüben pedig szürke téglalapot.

Az alsó tartály tartalmának megváltoztatása

Kívánatos, hogy az alsó tartály nagy képernyőn tapadjon a képernyő aljához. Ehhez át kell helyeznünk a konténer animációját egy másik klipre, mert mint tudjuk, nem tudjuk programozottan mozgatni az animált klipet (az animáció nem fog működni). Nevezzük ezt a klipet website_holder_4_c-nek.

Ezután lépjen a fő jelenetre, kattintson a 3. és 4. tároló első kulcskockáira, és szerkessze a kódot.


A webhely összeállítása után láthatja, hogy az alsó tartály a képernyő aljához tapad, függetlenül attól, hogy hogyan méretezzük át a képernyőt. Ha a képernyő felbontása túl kicsi, akkor az alsó tartály nem fog átfedni a webhely tartalmával, és a helyén marad.

15. lépés: A webhely tartalomtárolójának animálása

A webhely tartalmának animálásához ugyanúgy animálnunk kell a tárolót a teljes webhely objektumaival, mint a felső és alsó tárolók esetében.

16. lépés: Hozza létre a Kapcsolat oldalt

Új oldal létrehozása előtt frissítsük az oldalsablont. Tegyük a "Rólunk" oldalt minden új oldal sablonjává. Kattintson jobb gombbal a Rólunk oldalra, és válassza az Oldalsablon frissítése lehetőséget.

Miután frissítettük az oldalsablont, kattintson a „Létrehozás” gombra, írja be az oldal nevét, címét, rendeljen hozzá egy URL -t, és válassza ki a helyét a webhely szerkezetében, amint az az alábbi képernyőképen látható.

A "Kapcsolatok" oldal készen áll. Marad a tartalom szerkesztése egy kényelmes WYSIWYG szerkesztővel, és a linkszerkesztő segítségével csatlakoztathatja azt a megfelelő menügombhoz.

17. lépés: hozzon létre egy egyszerű slotot

A Moto Flash CMS -ben a rések animált objektumként működnek. A nyílás nagyszámú animált funkciót tartalmazhat, amelyek közvetlenül a Vezérlőpultról vezérelhetők.

Először megpróbálunk létrehozni egy egyszerű slotot, majd javítani.

Kezdjük a Bezárás gombbal, adjuk hozzá a webhelyhez képként, alkalmazzunk rá néhány effektust, és rendeljük hozzá az Ugrás az oldalhoz -> Kezdőlap műveletet.

Animáljuk a Bezárás gombot, ez egyáltalán nem nehéz, mert egy slot segítségével fogjuk megcsinálni. Hozzunk létre egy rést a website.fla fájlban. Ehhez importálja a "Bezárás" gomb képét a könyvtárba. A Slots részben létre kell hoznunk egy új movieclip -et, és el kell neveznünk CloseButtonSlot -nak.

Állítsuk be az osztályt CloseButtonSlot -nak. Nem kell új osztályt létrehozni, elég az AbstractMotoSlot osztályt örökölni. Csak másolja ki: com.moto.template.shell.view.components.AbstractMotoSlot és illessze be az Alaposztály mezőbe.

Ezután hozzáadjuk a Close gomb képét a színpadhoz (a CloseButtonSlot MovieClipnek nyitva kell lennie), és átalakítjuk a CloseButtonIcon nevű klippé. Mivel a nyerőgépünket az AbstractMotoSlot osztálytól örököltük, ez adja meg az alapvető animációt. Most szép kiterjesztési / összecsukási hatást fogunk létrehozni.

A következő lépés egy új réteg létrehozása, és kulcskockák létrehozása, amelyekben a „Stop ();” elhelyezhető. Helyezzük a fő címkéket „fölé” (az első és a második stop keret közé) és „out” (a második és a harmadik stop kulcskép közé) - lásd a képernyőképet:

A klipünkkel ugyanazokat a kulcskockákat és köztes képkockákat hozzuk létre a rétegen.

Például a "Bezárás" gomb az óramutató járásával megegyező irányban forog, ha fölé viszi, és az óramutató járásával ellentétes irányba, ha eltávolítja.

Tegyünk hozzá némi fényerőt a forgatáshoz, és némi lágyítást a tweenhez.

Az animáció elkészítése után összeállítjuk a website.fla fájlt az új bővítőhelyünkkel (Ctrl + Enter).

Ahhoz, hogy a nyílással dolgozhassunk a Moto CMS használatával, meg kell adnunk a paramétereit a fájlban: structure.xml:

librarySymbolLinkage = ”” - movieclip slot exportálása (Osztály neve).
animated = "true" - egy attribútum, amely jelzi, hogy a hely animált -e vagy sem.
resizable = "false" - van-e logika a slot átméretezéséhez vagy sem.
locked = "false" - meg kell-e jeleníteni a nyílást a Vezérlőpulton vagy sem.
- a nyílás neve a Vezérlőpulton
- bővítőhely tulajdonságok, amelyek kiterjesztik a funkcionalitást. Ebben a példában nem használjuk.