Kako ustvariti novo datoteko (dokument) v Flash CS6. Ustvarjanje flash iger Kako ustvariti flash animacijo

Izdelava flash strani ndash; zadeva je precej zapletena. Za to je potrebno znanje na številnih področjih: programiranje, računalniška grafika, osnove optimizacije in promocije spletnih mest, dobro morate poznati sam flash, na koncu tako na ravni poznavanja razvojnega okolja kot tudi akcijskega skripta programskega jezika 2.0. ali akcijski skript 3.0, ki je trenutno višja prioriteta.
Flash aplikacije so razvite v programu Adobe Flash Professional ndash; je večpredstavnostni program, ki se uporablja za ustvarjanje vsebin, kot so spletne aplikacije, filmi, igre, aplikacije za mobilne in druge vgrajene naprave.
Flash ndash; edinstven pojav. Prej se je ta izdelek imenoval "Macromedia Flash", po prevzemu s strani Adobe je ta program od leta 2005 postal znan kot "Adobe Flash". Flash animacija se uporablja za pretakanje spletnih strani. Včasih flush ndash; to je del html strani in zgodi se, da je celotna stran v celoti izdelana v Flashu ali pa je bila celotna stran ustvarjena z njo. Nastale datoteke Flash so posebne datoteke swf (»ShockWave Flash«), ki za ogled vsebine zahtevajo posebne brezplačne vtičnike brskalnika, ki jih je mogoče enostavno in hitro prenesti in namestiti z uradnega spletnega mesta Adobe. Prednost flash filmov je bilo zelo hitro nalaganje in delo z vektorsko animacijo z interaktivnostjo. Bliskavico je mogoče naložiti, preden se na zaslonu prikaže celoten video, torej opcijo lahko implementirate, ko začnete gledati animacijo, preostali "toki" na zaslonu pa se naložijo v ozadju.
Uporabljena flash grafika v vektorju in programska koda omogočata izdelavo popolne aplikacije, ki lahko nadomesti nekatere rastre, video fragmente, programske kode, vendar je veliko bolj optimalna, manj pasovne širine se uporablja za tokove, manj moči procesorja se porabi. Poleg vektorskega upodabljanja Flash Player (predvajalnik, potreben za gledanje filmov Flash) vključuje navidezni stroj (ActionScript Virtual (AVM)), ki podpira skripte interakcije med izvajanjem, podpira pa tudi video, mp3.
Razmislimo o obstoječih vrstah grafike in izpostavimo prednosti vektorske grafike, s katero Flash neposredno deluje.
Vse grafike lahko razdelimo na tri vrste: rastrske, vektorske, 3D. V rastrski grafiki, tako kot na TV monitorju, je vsaka slika sestavljena iz niza majhnih elementov ndash; piksli ndash; je okrajšava za element slike.
Načelo pik grafike je zelo preprosto: kot otrok v šoli riše celice, so le tukaj te celice veliko manjše. Ta vrsta grafike je enostavna tako pri izvedbi kot obdelavi in ​​predstavitvi, tehnično je priročna za implementacijo, avtomatizacijo vnosa ali digitalizacije slikovnih informacij.
Toda rastrska grafika ima slabosti: je obsežna, teža datoteke posledično postane velika, in ko se slika zmanjša ali poveča, se kakovost slike izgubi.
Kodiranje grafičnih informacij v vektorski grafiki je drugačno: vse slike so določene kot ndash konture; matematični predmeti. Te konture so neodvisen predmet, ki ga je mogoče premakniti, spremeniti velikost, povečati in poljubno število krat. Črte so postavljene z izhodišči, formulami, ki označujejo same črte. Zahvaljujoč temu se pri spreminjanju vzorca razmerja vedno natančno ohranijo. Vektorska grafika je tudi objektno usmerjena grafika, saj risbo sestavljajo posamezni predmeti – ravne in ukrivljene črte, elipse, pravokotniki, zaprte in odprte oblike ipd., ki imajo svoje značilnosti debeline obrisa, barve, sloga črte ipd. d.
Vektorska grafika je varčna z vidika virov, informacije o njej so shranjene v obliki formul in ne informacije za vsako točko, barvni opisi ne povečajo bistveno velikosti datoteke. Vektorsko grafiko je enostavno spreminjati brez izgube kakovosti slike. Obstajajo področja grafike, kjer je ohranjanje jasnih kontur temeljnega pomena, na primer pri ustvarjanju logotipov, pisav itd.
Vektor v celoti izkoristi ločljivost vseh izhodnih naprav, kot je tiskalnik. Slika je vedno videti kakovostna, jasna, vse bo odvisno samo od samega tiskalnika.
Prednost vektorske grafike lahko imenujemo tudi dejstvo, da se zlahka preoblikuje v rastrsko grafiko, ne pa obratno! In lahko vključuje rastrske grafične objekte, čeprav ga ni mogoče obdelati na enak način.
Resna prednost vektorske grafike se šteje za sredstvo za integracijo besedila in slik, enega pristopa do njih, oziroma zmožnost ustvarjanja končnega izdelka. Najbolj priljubljeni urejevalniki vektorske grafike so CorelDRAW, Adobe Illustrator in seveda Adobe Flash.
Vektor je omejen pri ustvarjanju realističnih slik: jasen in risan ndash; da, toda tukaj je, kako oblikovati bor ali oblak. Težava je tudi pri vnašanju grafičnih informacij: optični bralnik na primer oddaja informacije o slikovni piki pikslov za pikselom: lokacijo in barvo vsake točke glede na reakcijo svetlobnega snopa. Ne more zajemati predmeta za predmetom in vseh slik, kot sem napisal zgoraj, ni mogoče formalizirati.

Flash je postal splošno priljubljen ndash; pasice risank se pojavljajo na skoraj vsaki spletni strani. So interaktivni, predvajajo animacijo in zavzamejo malo prostora na disku, kar je pomembno pri delu v omrežju.
Animacija se ustvari tako, da se vsak okvir bliskavice prikaže za določen čas. Ko je okvirjev veliko, se ustvari iluzija gibanja. Prejšnje tehnologije flash so se pojavile GIF-animacije, vendar so možnosti Flasha veliko širše. Tako lahko z njegovo pomočjo ustvarite navigacijske elemente, zvočne risanke, animirane logotipe, kalkulatorje, celotna spletna mesta z naborom različnih interaktivnih elementov in kakšne čudeže animacije lahko ustvarite na flashu: izgledajo zelo impresivno in druge tehnologije za splet ne morejo pohvaliti s takšnimi zmogljivostmi.
Flash animacije se imenujejo filmi. Možnosti animacije niso omejene na animacijo, animirani so različni predmeti: meniji, slike, povezave, besedila.
Ob zagonu programa se odpre okno z delovnim prostorom in orodno vrstico ter dodatnimi okni, ki jih je mogoče med delom povezati. Prikazani so tudi zavihki za delo s časovnico, nastavitve preverjanja napak itd. V programu filmi nastanejo z risanjem ali uvozom že pripravljenih risb, postavljeni so v posebno območje delovnega okna ndash; prizor (Stage), okvirji pa so ustvarjeni s časovno osjo (časovnica).
V filmu je lahko več prizorov; ko zaženete film, se predvajajo v vrstnem redu, v katerem so bili ustvarjeni, razen če je bil ta vrstni red spremenjen namenoma. To vam omogoča priročno in hitro spreminjanje posameznih epizod, spreminjanje njihovega vrstnega reda.
Sama animacija se izvede s spreminjanjem okvirjev, ki sledijo drug za drugim, spreminjanjem njihove vsebine, to pomeni, da se v okvir dodajajo predmeti s potrebnimi parametri. Predmete na odru je mogoče zasukati, nastaviti položaj, barvo, preglednost, obliko, velikost, enako je mogoče storiti s katerim koli drugim predmetom.
Animacijo lahko ustvarite na naslednje načine:
Animacija po sličici ndash; risba v vsakem okvirju je narejena ročno in okvirji gredo v vrsto;
izračunano (Tweened Animation) ndash; izdelajo se le začetni in končni okvirji (imenovani ključni okvirji), med njimi pa program sam gradi okvirje; dve vrsti takšne animacije: gibanje (Motion Tweening, ko se spremenijo parametri gibanja, obrat, velikost, položaj), oblike (Shape Tweening);
programsko ndash; ko so parametri za spreminjanje objekta nastavljeni z ukazi programskega jezika Action Script.
V procesu dela na filmu se izvirni podatki shranijo v posebno datoteko s pripono .fla. To vključuje prizor z vsemi predmeti, pa tudi dodatne parametre o objektih, ki niso bili vključeni v film, a so bili v njem ustvarjeni, pa tudi možnosti zvoka, komentarje, kode scenarija, nastavitve programa itd. Ko ustvarite tak vir, ga morate prevesti v obliko, primerno za internet ndash; in sicer SWF, zato film objavimo ali prevedemo kodo. S tem boste iz datoteke odstranili informacije, ki niso potrebne za predvajanje v želeni obliki filma. Tako postane velikost datoteke minimalna in jo uporabnik hitro naloži. Tako datoteko lahko ločeno odprete z ndash; predvajalnik ga bo predvajal, vendar ga lahko povežete s katero koli stranjo html kot predmet.

Film je ustvarjen iz montažnih ndash elementov; standardi (Simboli) ali simboli. Referenca je slika, gumb, animacija, filmski posnetek, ki se večkrat uporablja v videu. Lahko jih ustvarite ali uvozite. Ko so ustvarjeni, so simboli shranjeni v posebni trgovini ndash; knjižnica. V procesu sestavljanja filma se na tistih mestih, kjer je potrebno, vstavijo primerki (Instanca) standardov (ki so shranjeni v knjižnici) in ne vsakič v celoti. In vstavite jih lahko poljubno število krat in kjer koli. V tem primeru lahko spreminjate parametre primerka, kot želite: lokacijo, velikost, merilo, vrtenje, upogib, prosojnost, ton itd., medtem ko se sami referenčni simboli ne spreminjajo. To je zelo priročno ndash; elementa vam ni treba vsakič na novo ustvariti ali ga kopirati, element je en in njegovih modifikacij je toliko, kot želite. In med postopkom objave je datoteka končnega videa, ki je ustvarjena v formatu swf, sestavljena tako, da bo na enem mestu neposredno referenčni objekt, v vseh ostalih pa ndash; samo kaže na to. Predstavljajte si, koliko se na ta način zmanjša teža videa v primerjavi s kopiranjem skoraj enakih elementov.
Standardi so:
bik; Movie Clip (moviklip) ndash; vključuje zvok, grafiko, animacijo, programsko se lahko skriptira;
bik; Graphic (Graphic) ndash; statične risbe, animacije, zvok, vendar niso programsko nadzorovane;
bik; Gumb (gumb) - vključuje slike, zvok; v primerjavi z drugimi vrstami sklicevanj na simbole vključuje le štiri okvirje, ki prikazujejo spremembe v stanju gumba, ko se pojavijo različni dogodki miške.
Preden neposredno ustvarite referenčni simbol, morate nastaviti njegov tip, kasneje ga je mogoče spremeniti.
Poleg referenčnih simbolov in njihovih primerov lahko film vsebuje slike iz zunanjih datotek, pisave.
Celoten video v Adobe Flash ndash; to je zaporedje okvirjev (Frames), prikazani so po vrsti z določeno hitrostjo. Delujejo s pomočjo časovnice. Na levi na lestvici so plasti, katerih imena je treba nastaviti, na desni ndash; niz praznih okvirjev, ki se zapolnijo, ko nastanejo objekti in postavljeni na oder. Takoj, ko je okvir napolnjen s predmeti, spremeni barvo v sivo. Ključni okvirji so označeni s črno piko. Na časovni premici je trenutni okvir označen z rdečo oznako ndash; igralna glava, skozi katero poteka navpično tanka rdeča črta, ki prečka vse plasti in laquo; vidi traquo; trenutni okvir v vsakem od njih. Prav ti okvirji, torej njihova vsebina v obliki filmskih izrezkov, so prikazani na zaslonu.

Za implementacijo interaktivnosti in zmožnosti ustvarjanja polnopravnih spletnih mest Adobe Flash uporablja programski jezik Action Script.
Za interaktivnost filma Flash uporablja skriptne programe (script-script), ki vsebujejo niz navodil (akcij) v ActionScript in se izvedejo, ko se zgodijo določeni dogodki: uporabnik pritisne gumb, doseže določen okvir filma, reakcije na premikanje miške, njeno kolo, pozicioniranje kazalca na določeno območje in številne druge. Ukazi skripta določajo, kako se Flash odzove, ko pride do dogodka.

Skriptni ukazi, ki se izvedejo ob implementaciji dogodka, so določeni za posnetek, okvir, gumb, in to se naredi na posebnem zavihku na dnu zaslona Dejanja (Ukazi) (Okvir dejanj, Filmski posnetek dejanj), Gumb Dejanja.
Možni dogodki:
Pritisnite tipko ndash; ko uporabnik pritisne tipke na tipkovnici, je funkcijski parameter ime tipke.
Hover (Roll Over) ndash; ko je kazalec miške nad predmetom, vendar miška ni pritisnjena;
Sprostite ndash; če se gumb miške sprosti, ko je kazalec nad programiranim gumbom, torej če uporabnik klikne na manipulator laquo;mouseraquo;;
Pritisnite ndash; če pritisnete tipko miške (levo), medtem ko je kazalec nad programiranim gumbom. V tem primeru se upošteva območje aktiviranja in ne njegova vidna slika, ki je določena v okviru Hit;
Odstrani (razveljavi) ndash; nad gumbom je bil kazalec miške, ni bil pritisnjen in miška je odvzeta od programabilnega gumba;
Shift (Drag Out) - gumb miške se postavi nad predmet, pritisne in odstrani;
Release Outside ndash; če je bil gumb miške pritisnjen na objekt, nato pa ga je uporabnik spustil zunaj objekta;
Povlecite čez ndash; na predmet se nastavi kazalec, pritisnemo levi gumb miške in ga ne spustimo, ampak se kazalec popelje za predmetom, nato pa se spet vrne.

Jezik ActionScript 3.0 je v primerjavi z ActionScript 2.0 sodobnejši, saj temelji na osnovah objektno usmerjenega programiranja. Kjer so glavni koncepti razred, predmet, njegovi atributi ali lastnosti, pa tudi metode, ki so neločljive v tem objektu.
ActionScript se izvaja z navideznim strojem (Virtual Machine ActionScript), je del Flash Playerja.
Osnova katere koli programske kode je spremenljivka, ki je v ActionScript nastavljena takole: var ndash; poseben ukaz Flash, kar pomeni, da je v tem razdelku označena spremenljivka in določen njen tip; ime ndash; ime spremenljivke, podano v besedilno-številski obliki, vendar se ne začne s številko; tip ndash; navedba tipa spremenljivke (številka - Število, logični ndash; Boolean, besedilo - Niz itd.). to pomeni, da boste določili: Var x: String;
Ne pozabite vključiti dvopičja za imenom spremenljivke in podpičja na koncu vrstice. Med izvajanjem kode se lahko spremeni vrednost in s tem tip spremenljivke.
Spremenljivka, ki vsebuje veliko količino podatkov, se imenuje matrika. V AC 3.0. je določen z vrsto Array: Var Mas: Array.
Vsi elementi matrike so oštevilčeni od 0, zato morate za dostop na primer do prvega elementa določiti Mas. To pomeni, da v oglatih oklepajih navedete položaj želenega elementa v matriki.
Sama koda bo sestavljena iz funkcij, ki opisujejo zaporedje ukazov, ki se pojavijo ob določenem dogodku ndash; klik miške, pritisk tipke, doseganje določene vrednosti itd.
Funkcija je določena s funkcijo rezervirane besede, nato določite njeno ime - ime - poljubno besedilno-številčno ime, vendar se ne začne s številko, nato v oklepajih () lahko določite parametre funkcije ndash; kar se ji poda kot vhod, so lahko odsotni, nato dvopičje in tip podatkov, ki ga funkcija vrne, ali void ndash; ko funkcija ne vrne ničesar. Nato celotno kodo funkcije zaprite v zavitih oklepajih ( ). In dostopate do funkcije in po potrebi določite njeno ime in parametre: ime (). "Pogoji v AC 3.0. se nastavijo prek operaterja if: if(x==y), torej v okroglih oklepajih, morate podati sam pogoj primerjave. Zanke so definirane s pomočjo for(), kjer so njeni parametri nastavljeni v oklepajih: spremenljivka števca, korak njene spremembe.
Vsak objekt je označen s svojimi parametri ali lastnostmi; poslušalce dogodkov lahko pripnete objektom v flashu s funkcijo addEventListener. Ta poslušalec bo obravnaval dogodke, ki se zgodijo z objektom, in če so reakcije nanje opisane v funkciji s strani programerja, se bo program ustrezno odzval.

To je le majhen del tega, kar morate vedeti, ko začnete ustvarjati flash spletno mesto. Ni vam treba ustvariti spletnega mesta iz nič. Obstajajo posebne predloge, ki jih lahko kupite in prilagodite svojim potrebam (na primer spletno mesto templatemonsters). Tam je zasnova že v celoti razvita, vsebino je treba spremeniti in v programski implementaciji se lahko reprogramira vse, kar bo potrebno. Nato morate kupiti domeno in gostovanje, postaviti datoteko html, v katero je povezan swf.
Berite knjige (na primer knjigo laquo; 100% vadnica M.Flash MXraquo; pomagal mi je pri delu in člankih), učite se od kolegov na forumih (demiart, flasher.ru) in tudi, kaj naj bo vaš prvi pomočnik pomoč na uradni spletni strani Adobe. Opsian jezik ActionScript je zelo podroben in podroben, prikazani so primeri, gradivo pa je predstavljeno tudi v ruščini.
Ko ustvarite video, ga morate objaviti. Možnosti objavljanja programa lahko nastavite v točki menija Datoteka Možnosti objavljanja. Označuje, v katerih formatih je treba naložiti videoposnetek, kakšne so nastavitve kakovosti za grafiko in zvok ter številne druge. Ko imate datoteko swf, jo lahko uporabite kot popolno dokončano aplikacijo. Če želite spremeniti, posodobiti ustvarjeni videoposnetek, morate urediti vir ndash; fla in ponovno objavite.

Na srečo lahko večina aktivnih uporabnikov interneta ustvari flash igro. Začetnikom pri tem zelo pomagajo tudi začetne veščine programiranja (mimogrede, pridobiti jih ni tako težko - obstajala bi želja). Res je, da boste potrebovali nekaj časa, da obvladate enega od številnih posebnih oblikovalcev flash iger (na primer Macromedia Flash).

Številna spletna mesta s programsko opremo vsebujejo med drugim prav takšne konstruktorje. Njihova namestitev na računalnik uporabniku praviloma ne povzroča posebnih težav. Ne pozabite, da je treba izbrani program registrirati in namestiti z vsemi potrebnimi spremembami - potem vam bo služil zvesto, torej neprekinjeno. Večina oblikovalcev iger je narejenih v angleščini, vendar lahko poiščete crack ali različico v ruščini. Pogosto je v samih nastavitvah okno, kjer lahko nastavite svoj materni jezik.

Kako ustvariti flash igro: predhodne priprave

Še preden se usedete in obvladate oblikovalca, bi morali že imeti približen scenarij za igro, zgodbo. O animaciji in oblikovanju je dobro razmisliti vnaprej - to vam bo znatno prihranilo čas. Preden ustvarite svojo flash igro, se odločite za njeno želeno vrsto. Za navdih obiščite spletna mesta, ki vsebujejo knjižnice flash iger.

Strokovnjaki priporočajo, da začetniki začnejo z ustvarjanjem preprostih aplikacij, kot so arkadne igre. In šele potem bo mogoče preiti na bolj zapletene vrste iger in celo ustvariti svoje strategije. V istem konstruktorju lahko izberete vrsto bodoče igrače, kjer so priročno razvrščeni vsi žanri. Aktivirajte na primer arkado (dvojni klik).

Kako ustvariti flash igro: delo v oblikovalcu iger

Odprite predlogo in nanjo povlecite želene predmete iz razdelkov Animirani predmeti in Statični predmeti. Ustvarite ozadje tako, da izberete teksturo in barvo. Za predmete izberite barve z barvno paleto. S predvajalnikom animacij preverite, katere druge funkcije niso omogočene. V nastavitvah nastavite ravni gibanja igralnih likov (v arkadah) ali predmetov (v logičnih igračah).

Ko naredite vse, kar potrebujete, zaženite razhroščevalnik. V tem načinu lahko greste skozi svojo igro, začenši s katero koli stopnjo - to je pomembno, da jo preizkusite na učinkovitost. Odpravite zaznane napake in znova preverite flash igro. Če je vse v redu, shranite spremembe.

Kako ustvariti flash igro: prinesite igro "na misel"

Zdaj si lahko omislite izvirno ime za svojo zamisel, napišite kratek komentar. Uporabite oblikovalec pozdravnega zaslona, ​​da ustvarite spektakularen pozdravni zaslon za svojo igro. Shranite tudi vse spremembe, ki jih naredite.

Pojdite skozi lastno flash igro od začetka do konca, da bi našli (ali ne našli) napake in okvare v njej, in na splošno ne škodi, da kritično pogledate svoje ročno delo. Zelo pomembno je, da ima igra logične in natančno opredeljene dele, kot je dobra knjiga ali film: začetek, razvoj dogodkov, konec.

Pošljite čisto različico svoje igre svojim prijateljem - naj pošteni kritiki ocenijo, kakšne rezultate ste dosegli. No, po tem lahko že naložite flash igro na splet.

Kako ustvariti flash igro, če imate željo, a nimate znanja?

Tistim številnim uporabnikom, ki jih to vprašanje tako skrbi, vsekakor želimo dati odgovor. Ne pozabite, da nobeno znanje ne more priti od nikoder. Vsak nov posel se mora nekje začeti. Sčasoma boste začeli razumeti, kakšno znanje vam manjka za ustvarjanje iger. Začeli boste spraševati za nasvet, iskati priporočila, brati ustrezno literaturo, zahvaljujoč kateri boste začeli vse bolj napredovati v svoji spretnosti. Ne bojte se novega, sicer nikoli ne boste dosegli tega, kar želite. Vso srečo!

Program za ustvarjanje flash iger brez znanja programskih jezikov. Omogoča ustvarjanje iger iz logičnih blokov in vnaprej pripravljenih slik.

Nekoč, verjetno že pred nekaj leti, se je na naši spletni strani pojavil program Game Maker, ki vam je omogočil ustvarjanje iger brez znanja nobenega programskega jezika!

Do zdaj je bila ta stran ena izmed najbolj razpravljanih pri nas, pogosto pa se v komentarjih pojavljajo pritožbe, da je ni mogoče uporabiti za ustvarjanje iger, ki bi jih lahko igrali na spletu. Danes se bomo spet vrnili k temi razvoja iger in razmislili o podobnem programu, ki lahko še vedno izdeluje flash igre - Stencyl!

Funkcije programa

S pomočjo Stencyla lahko ustvarite 2D igre katere koli zvrsti, predvsem pa je programski motor "nabrušen" za različne rpg strelce. Strukturno je program cel nabor orodij, v katerem lahko po želji ustvarite igro iz nič, ne da bi uporabljali aplikacije tretjih oseb.

Pojavno okno z informacijami o novi različici programa zapremo z gumbom »Zapri« ali »Ne prikaži več« (če tega okna ne želimo videti ob vsakem zagonu programa) in namesto tega dobimo naslednje okno:

Tukaj se nam ponuja, da ustvarimo svoj račun v skupnosti razvijalcev Stencyl. Načeloma vam ni treba ustvariti računa (za to kliknite spodnji gumb »Opomni me pozneje«), vendar registracija daje možnost, da prenesete dodatne predloge in dejanja iz spletnega shramba, imenovanega StencylForge, tako da ne bo boli :). Če želite ustvariti račun, kliknite gumb "Ustvari račun" in pojdite na obrazec za registracijo:

Tukaj izpolnimo standardna polja z vašim uporabniškim imenom, geslom (dvakrat) in e-poštnim naslovom, nato pa kliknemo gumb "Prijava". Če bo šlo vse v redu, se bo pred vami končno odprl vmesnik začetnega okna programa.

Zaženi okenski vmesnik

Navzven je delovni prostor začetnega okna Stencyl razdeljen na več območij:

Na vrhu je tradicionalno menijska vrstica in orodna vrstica. Tukaj so zbrane vse glavne nastavitve in kontrolni gumbi. Pod orodno vrstico imamo majhno ozko sivo črto. Vsebuje zavihke (da - vmesnik Stencyl je multi-tab, kar je zelo priročno) in gumbe za hitro preklapljanje med njimi (na desni).

Glavni delovni prostor je razdeljen na dva dela: na levi je navigacijska vrstica za dele programa, na desni pa glavna vsebina (na glavnem zaslonu - seznam iger), ki se spreminja glede na trenutno aktivne način delovanja. Na dnu je še nekaj dodatnih gumbov, ki vam omogočajo:

  1. Odprite mapo, v kateri Stencyl shranjuje vse vire ustvarjenih iger in samih iger (gumb »Ogled mape iger« v spodnjem levem kotu).
  2. Zaženite tečaj usposabljanja za delo s programom (»Start Crash Course« na zeleni plošči v spodnjem desnem kotu). Mimogrede, poleg njega je tudi gumb za skrivanje ponudbe za usposabljanje (»Ne prikazuj tega več«).
  3. Odprite trenutno izbrano igro s seznama, kar je podobno dvojnemu kliku na ikono igre (»Odpri igro« v spodnjem desnem kotu).

Če želite sami raziskati možnosti Stencyla, se lahko udeležite tečaja usposabljanja (in bi ga bilo zaželeno opraviti), pa tudi odprete eno od že pripravljenih iger, ki najbolj ustreza vaši zamisli, in si oglejte, kako tam vse deluje. Predlagam, da preučimo delo programa na primeru ustvarjanja igre o dogodivščinah simbola našega spletnega mesta in njegovega virtualnega prebivalca - Fride Best!

Kako začeti ustvarjati igro v Stencylu

Če ste si pred ustvarjanjem svoje igre ogledali standardne primere iger na Stencylu, ste morda opazili, da so v bistvu vse precej preproste, na enem zaslonu in imajo stranski pogled. Naredili bomo dinamično streljanje od zgoraj navzdol z miško! Vse je kot v "velikih" igrah :).

Za svoj projekt lahko spremenite logiko ene od že pripravljenih predlog, vendar ne iščemo preprostih načinov in zato - samo "iz nič", samo "hardcore" :). Če želite to narediti, kliknite na orodni vrstici delovnega prostora (ali v meniju »Datoteka« - »Ustvari novo«) gumb »Ustvari novo igro« in pojdite v naslednje okno:

Tukaj lahko izberemo predlogo igre po žanru z vnaprej izbranim naborom funkcij in dejanj za vaš projekt. Vendar pa bomo igro ustvarili iz nič, zato izberite element "Prazna igra" in kliknite gumb "Naprej".

V naslednjem koraku moramo narediti nekaj osnovnih nastavitev:

V polju »Ime« moramo določiti ime naše igre, v razdelku »Velikost zaslona« pa nastaviti dimenzije igralnega polja z določitvijo njegove širine (Width) in višine (Height) v slikovnih pikah. Po tem kliknite gumb "Ustvari" in pojdite neposredno na vmesnik urejevalnika iger:

Privzeto se pred nami odpre zavihek »Nadzorna plošča«, na katerem je na levi strani zbrano celotno drevo virov igre, na desni pa sam delovni prostor. Tukaj mislim, da bi bilo primerno narediti nekaj pojasnil glede strukture "drevesa".

Sestavljen je iz štirih vej, od katerih prvi dve vsebujeta standardne nabore virov (RESOURCES) in logiko (LOGIC), zadnji dve pa lahko po želji shranjujeta ročno naložene pakete virov (RESOURCE PACKS) in razširitve (EXTENSIONS).

Glavna veja tukaj je veja VIRI. Vsebuje naslednje razdelke:

  1. Vrste igralcev - tukaj so spriti vseh igralnih likov in konfigurirana so dejanja njihove animacije in medsebojne interakcije.
  2. Ozadja - v tem razdelku lahko shranimo vsa potrebna ozadja za igro. Poleg tega je ozadje lahko tako za ozadje (ozadje) kot za ospredje (ospredje), kar vam omogoča, da ozadja prekrijete eno na drugo in s tem dosežete na primer učinek paralakse.
  3. Pisave - razdelek, kamor lahko naložimo različne lepe pisave za ustvarjanje izvirnih napisov. Vendar je vredno razmisliti, da lahko Stencyl deluje samo z angleškim naborom znakov, zato moramo za dodajanje ruskih črk v datoteko pisave z njimi zamenjati nekaj latiničnih znakov.
  4. Scene so prostor za ustvarjanje in urejanje ravni igre. Tukaj lahko nastavimo videz katerega koli odra in postavimo vse like, bonuse in druge elemente igre.
  5. Zvoki - oziroma skladišče vseh zvokov, uporabljenih v igri.
  6. Tilesets - posebna veja, ki shranjuje ploščice - posebne sprite, ki jih lahko uporabimo za gradnjo ravni igre.

Ustvarjanje in konfiguriranje ploščic

O zaporedju izvajanja te ali one igre ni nedvoumnega mnenja. Na tej točki je priročno za vsakogar, vendar bi priporočal naslednji algoritem:

Ustvarite prvo sceno - ustvarite lik - ustvarite sovražnike - ustvarite power-up - ustvarite preostale stopnje

Če želite ustvariti prizor v Stencylu, morate narisati njegov videz v veji Scenes. Za risanje pa moramo najprej imeti bloke, s katerimi lahko »rišemo«. Ti bloki v programu se imenujejo ploščice (tiles) in so shranjeni v razdelku Tileset:

Tileset je preprosta matrica slik, ki jih naložite vanj. Naložite lahko že pripravljeno matriko (sliko, sestavljeno iz več enakih slik v eni ali več vrsticah) ali dopolnite obstoječe sklope z ločenimi slikami.

Najprej moramo ustvariti nov nabor ploščic (gumb »Ustvari novo« v razdelku Tilesets), po katerem bomo videli okno, kot je na zgornjem posnetku zaslona. Za nalaganje slike moramo klikniti gumb »Izberi sliko« in v oknu Raziskovalca, ki se odpre, izbrati vnaprej pripravljeno datoteko z želeno(-imi) sliko(-ami).

Ko se slika naloži, bomo postavili njene parametre postavitve in dimenzije v širino in višino, nakar (če je vse pravilno prikazano) lahko sliko dodate v nabor s pritiskom na gumb "Dodaj".

Za vsako sliko (ploščico) v matriki lahko konfigurirate parametre interakcije z igralnimi liki in predmeti. Če želite to narediti, izberite želeno ploščico in odprite naslednje okno:

Razdelek »Meje trkov« se bo odprl na vrhu desnega podokna. Tukaj lahko izberemo poljubno obliko, ki označuje meje interakcije našega predmeta z igralnimi liki. Privzeto imajo vse ploščice parameter "Kvadrat" (kvadrat), zaradi česar je ploščica popolnoma neprehodna in trdna. Če morate ploščico narediti "prozorno" za znake (na primer tla), je dovolj, da nastavite parameter "Brez trkov".

Poleg obrob lahko za vsako ploščico nastavite animacijo z dodajanjem okvirjev z gumbom »Vstavi okvirje« na spodnji plošči. Privzeto je hitrost animacije 100 milisekund, vendar je to število mogoče poljubno spremeniti za vsak okvir.

Če želite to narediti, samo dvakrat kliknite na želeni okvir z levim gumbom miške in v oknu, ki se odpre, spremenite indikatorje zakasnitve, kot jih potrebujemo. Izbrani okvir je možno popraviti tudi z vgrajenim grafičnim urejevalnikom, ki se odpre z gumbom »Uredi okvir«.

Upodabljanje scene v Stencylu

Ko je nabor ploščic oblikovan, je logično, da nadaljujemo na naslednji korak - oblikovanje končnega igralnega prostora iz dodanih slik. To lahko storite s klikom na gumb "Ustvari novo" v razdelku Scenes. Po pritisku na gumb pridemo do okna z nastavitvami scene:

Tukaj moramo vsekakor nastaviti edinstveno ime za naš prizor v polju "Ime", določiti dimenzije (širina in višina v ploščicah (privzeto) ali slikovnih pikah) in po želji (to je na lastno željo) nastaviti ozadje barva za novo sceno. Kliknite "V redu" in pojdite v urejevalnik ravni:

Izgleda kot grafični urejevalnik. V središču je delovni prostor, kjer narišemo naš nivo. Levo in zgoraj so majhne orodne vrstice. Na desni strani so paletne plošče, izbor nizov ploščic in upravljanje slojev. Zdaj kako vse deluje...

Najprej narišemo ozadje našega delovnega prostora. Če želite to narediti, na desni plošči aktivirajte zavihek »Paleta« in na njem zavihek »Ploščice« ter s prikazanega seznama izberite želeno ploščico. Nato na levi plošči izberite orodje Svinčnik in z izbrano ploščico narišite želena področja.

Zaradi podpore slojev se lahko ploščice med seboj prekrivajo, zato je najbolj logično organizirati nivo ob upoštevanju dejstva, da bomo na primer na sloju "Layer 0" imeli substrat za ozadje, zgoraj, plast z ovirami in znaki, še višje pa - plast z različnimi števci in indikatorji igre.

Sloje je mogoče nadzorovati s pomočjo gumbov pod ploščo "Sloji". Obstajajo gumbi za ustvarjanje, brisanje, premikanje in preimenovanje plasti. Poleg tega lahko kateri koli sloj skrijete ali prikažete s klikom na gumb v obliki očesa desno od imena plasti.

Ustvarjanje znakov

Ko ustvarimo našo prvo sceno, je čas, da jo napolnimo z različnimi igralnimi liki. V Stencylu se imenujejo "igralci" in so shranjeni v razdelku "Vrste igralcev". Igralci so ustvarjeni po istem principu, zato bomo ta postopek obravnavali na primeru ustvarjanja glavne junakinje naše igre - Fride.

Če želite dodati novega igralca, pojdite na prej omenjeni razdelek Vrste igralcev in tam kliknite gumb »Ustvari novega«. Že v navadi nas znova sprašujejo, kako želimo poimenovati nov predmet igre, po katerem se pred nami prikaže okno za urejanje animacije likov:

Tukaj je na levi strani prikazan seznam dodanih animacij igralca (privzeto je prazen okvir "Animacija 0"), na desni strani pa so orodja za dodajanje in konfiguracijo teh istih animacij.

Izberite prazno animacijo (ali dodajte novo s klikom na gumb s plusom na dnu) in kliknite na polje »Kliknite tukaj, da dodate okvir« na desni strani. Po tem se odpre okno za dodajanje slik, ki je podobno podobnemu oknu za dodajanje novih ploščic v nabor. Kliknite gumb "Izberi sliko", izberite želeno sliko in prilagodite njeno postavitev in dimenzije (če je potrebno).

Ko je vse nastavljeno, kliknite gumb "Dodaj" v spodnjem desnem delu okna za dodajanje - animacija naj bo prikazana kot predogled v levem razdelku:

Zdaj moramo le še prilagoditi hitrost sličic (dvoklik na katerega koli od okvirjev) in nekaj dodatnih parametrov, kot so ime (Ime) animacije (zelo uporabno za kompleksne projekte), zanko (Looping) predvajanje (aktivno privzeto ), sinhronizacijo in osnovno točko (Origin Point) izvor sprite (privzeto - središče).

V spodnji orodni vrstici v desnem delu najdemo vrsto gumbov. Omogočajo:

  • animaciji dodajte nove okvirje (Uvozi okvirje);
  • uredite izbrani okvir v zunanjem urejevalniku (Edit Frame (External));
  • ustvarite okvir v zunanjem urejevalniku (Ustvari okvir (External));
  • uredite okvir v vgrajenem urejevalniku (Uredi okvir);
  • odstranite okvir (Remove Frame);
  • okvir za kopiranje (Copy Frame);
  • vstavite okvir (Prilepi okvir);
  • premaknite en okvir nazaj (Move Back) ali naprej (Move Forward).

Nastavitev parametrov in obnašanja likov

Zgoraj smo naredili animacijo Fridinega teka, pri čemer smo za to uporabili le dva okvirja, ki sta pravzaprav ista figura, ki se odraža horizontalno. Zdaj moramo poskrbeti, da lahko z miško in tipkovnico nadzorujemo gibanje naše junakinje in tudi, da se ustrezno odzove na trke z ovirami, ki smo jih narisali na odru.

Najprej nastavimo kolizije. Če želite to narediti, poglejte vrstico pod seznamom odprtih zavihkov in tam poiščite gumb »Trčenje«.

Privzeto je območje trka kvadrat, ki je opisan okoli celotnega animacijskega spriteja. To pomeni, da se bo dogodek trka zgodil na celotnem območju predmeta. Vendar v praksi naša slika največkrat vsebuje dodatne elemente (pri Fridi na primer blaster), ki po zamisli ne bi smeli biti v interakciji z ničemer. S pomočjo tega razdelka lahko nastavimo vsa kolizijska območja.

Za začetek bomo zmanjšali območje okoli Fride na velikost samo njenega telesa. Pri tem moramo upoštevati, da območja ne moremo premikati z miško, za nastavitve pa se uporabljajo štirje številčni parametri v razdelku »Trenutna oblika«. Najprej nastavimo odmik območja vodoravno (od levega roba) in navpično (od vrha), nato pa določimo novo širino in višino območja trka.

Spodaj je še nekaj parametrov, združenih v razdelku »Fizične lastnosti«. Tukaj se soočamo s potrditvenim poljem "Ali je senzor?" in koncept skupin.

Če aktivirate zastavico »senzor«, izbrano območje ne bo več fizični objekt: lik ali njegov del bo postal tako rekoč »prozoren« za različne ovire, hkrati pa bo obdržal sposobnost izvajanja kakršnih koli dejanj pod določenimi pogoji.

Primer iz resničnega življenja je lahko sodobna signalizacija z laserji: samega laserja ne vidimo, če pa se ga dotaknemo, se začne postopek obveščanja, da smo splezali na napačno mesto :).

Zdaj, za kaj so skupine ... Recimo, da naš lik v rokah nima blasterja, ampak meč, s katerim (natančneje, ona :)) seka sovražnike v zelje (mimogrede, Frida ima laser rezilo v izvorni kodi;)).

Naloga je, da ko se sovražnika dotaknete z mečem, sovražnik umre, če pa smo zgrešili in je nasprotnik zadel Frido, ji je bilo odvzeto nekaj energije. In glavna težava je, da je udarna animacija, ki jo imamo, pravzaprav slika, v kateri sta hkrati Frida in meč ...

Če dejanje meča povežemo s sliko, potem bo tisti, ki se dotakne naše junakinje med predvajanjem animacije, umrl od udarca. In samo zato, da bi sliko razdelili na več predmetov z različnimi zmogljivostmi in parametri, je bil izumljen skupinski mehanizem.

Privzeto imamo samo eno območje, ki ustreza samemu liku ("Enako kot vrsta igralca"). Lahko pa z orodji za risanje nad glavnim delovnim področjem ustvarimo nove virtualne objekte in jim nastavimo skupino z gumbom »Uredi skupine«.

S trki je morda to vse, zdaj pa predlagam, da se ukvarjamo z najosnovnejšim - nastavitvijo igralčevega vedenja na odru. Če želite to narediti, moramo iti v razdelek »Vedenje«:

Privzeto tukaj na začetku ni dejanj, lahko pa jih dodamo s klikom na gumb »Dodaj vedenje« v spodnjem levem kotu. Videli boste seznam funkcij, ki so pripravljene za uporabo za nadzor lika ali interakcijo z drugimi igralci na odru.

Na primer, izbral sem vedenje »8 Way Movement«, ki vključuje gibanje igralca v krogu v katero koli smer. Sedaj izberemo dodano dejanje na seznamu na levi in ​​na desni strani lahko konfiguriramo njegove parametre.

Dodajanje igralcev na oder in testiranje ravni

Če ste sledili navodilom, bi morali že imeti potrebna minimalna sredstva za igro. Še vedno se je treba naučiti, kako dodati igralce na oder in preizkusiti zmogljivost igralnega prostora.

Vrnemo se v urejevalnik predhodno ustvarjenega prizora in ponovno aktiviramo paleto (Paleta), zdaj pa namesto ploščic vklopite zavihek »Aktorji« (Aktorji). Videli bomo seznam predhodno ustvarjenih likov, ki jih lahko dodamo prizoru z orodjem Svinčnik:

Imamo eno glavno junakinjo, zato je že en klik s svinčnikom dovolj, da jo dodamo na oder. In zdaj je prišel trenutek resnice - prvi preizkus! Če želite začeti predhodno sestavljanje projekta, kliknite gumb "Test Scene" v zgornjem desnem kotu zavihka z našo sceno. Čez nekaj časa (prva kompilacija vedno traja dlje) lahko občudujemo svoje delo v predvajalniku flash:

Poleg samega igralca z igro ob strani imamo okno, ki prikazuje dnevnike igre. Z njihovo pomočjo lahko hitro najdemo težave pri delu in jih poskušamo odpraviti.

Kot vidite, lahko Frido že premikamo v različne smeri, sam oder pa ostaja negiben in takoj, ko naša junakinja preseže rob vidnega dela odra, izgine ... Motnja :). Težavo lahko rešite tako, da Fridi dodate vedenje »Camera Follow« ali tako, da nastavite želene parametre z uporabo dogodkov.

Prav tako bi bilo koristno zamenjati standardni kazalec z nečim primernejšim, na primer križcem. To lahko izvedemo tako, da dodamo novega igralca kot križec, odstranimo njegovo območje trka in ga pritrdimo na sceno s standardnim vedenjem »Custom Mouse Cursor«:

Sistem dogodkov v Stencylu

Preproste igre v Stencylu je mogoče ustvariti samo z uporabo standardnih vedenj (Behaviors), če pa potrebujemo nekaj nestandardnega, potem moramo že razmišljati o uporabi dogodkov, ki so konfigurirani za igralce in prizore v razdelku »Dogodki«:

Pravzaprav so tudi vedenja (Behaviors) zgrajena na podlagi dogodkov, vendar imajo tudi vizualni vmesnik, ki olajša urejanje. Tukaj imamo opravka neposredno s funkcionalnimi bloki, ki izvajajo določena dejanja.

Okno dogodka je razdeljeno na tri dele:

  1. Levi del vsebuje seznam dogodkov in gumbe za njihovo upravljanje (ustvarjanje/brisanje/premikanje). Če želite dodati dogodek, moramo klikniti gumb "Dodaj dogodek", nato na spustnem seznamu izbrati želeno skupino in določiti specifično funkcijo, ki jo potrebujemo. Desno od ustvarjenega dogodka je potrditveno polje, ki nam omogoča, da ga po potrebi deaktiviramo.
  2. V desnem razdelku imamo seznam vseh razpoložljivih dejanj, razvrščenih v 10 razdelkov, od katerih se vsak aktivira z ustreznim gumbom. Za večjo udobje so dejanja v vsakem razdelku razvrščena v tematske zavihke in imajo svojo edinstveno barvo. Na dnu so še trije zavihki. Privzeto je aktiven zavihek "Paleta" (paleta), na katerem se nahajajo seznami dejanj. Drugi zavihek - "Atributi" - služi za prikaz lokalnih spremenljivk (več o njih spodaj), tretji - "Priljubljene" - za prikaz vaših najljubših dejanj.
  3. Osrednji del je delovno območje. Tu oblikujemo končne primere vedenja likov z različnimi kombinacijami akcijskih blokov in dogodkov, po katerih se ta dejanja zgodijo. Združevanje poteka tako, da preprosto povlečete bloke na delovni prostor in nato uredite parametre, ki so v njih podani. Upoštevati je treba, da je funkcija sestavljena samo iz tistih blokov, ki so med seboj kombinirani in vključeni v glavni blok dogodkov. Da bi torej začasno odstranili nekatere trenutno nepotrebne (a uporabne) kombinacije, jih moramo le premakniti iz splošne strukture v prosti prostor. Če se dejanja sčasoma izkažejo za popolnoma nepotrebna, jih lahko popolnoma izbrišete tako, da jih premaknete v koš za smeti, ki se nahaja v zgornjem desnem delu delovnega prostora.

Pravzaprav smo algoritem za ustvarjanje dogodkov že opisali, vendar, žal, ne morem dati nikakršnih univerzalnih priporočil - za vsako igro bodo dogodki različni in lahko jih je precej ... Kot primer lahko poglej si izvorne kode igre o Fridi, ki jih najdeš v arhivu s programom, a to je le vodilo, saj je delo na dogodkih tvoja osebna ustvarjalnost :).

Nastavitev fizike in lastnosti

Z vami sva že obravnavala marsikaj, vendar se nisva dotaknila nekaterih dodatnih tem, ki so lahko zelo pomembne pri ustvarjanju iger - govorim o nastavitvi vseh vrst lastnosti naših igralcev in scen. Ti parametri so shranjeni v zadnjih dveh zavihkih. In prva je "Fizika":

Za prizore in igralce je zavihek z nastavitvami fizike videti drugače. Na zavihku z nastavitvami fizike scene sta samo dva parametra - horizontalne in vertikalne nastavitve gravitacije. Videz razdelka z nastavitvami fizičnih parametrov igralcev je prikazan na zgornjem posnetku zaslona in je sestavljen iz petih zavihkov z različnimi možnostmi:

  1. Zavihek Splošno. Tukaj imamo tri parametre: tip igralca (nepremičen, ploščad (lahko se premika po danih pravilih, drugi akterji pa ga ne morejo premikati) in premičen), rotacijo igralca (lahko se vrti ali ne) in vpliv gravitacije.
  2. Zavihek "Teža" ("Teža"). Na tem zavihku lahko nastavite maso navideznega predmeta in njegovo vztrajnost.
  3. Zavihek "Material" vam omogoča, da nastavite lastnosti za igralca, ki bodo simulirali obnašanje resničnega predmeta iz določenega materiala. Imamo možnost izbrati eno od prednastavitev na spustnem seznamu "Preset Materials" ali ročno nastaviti lastnosti trenja in elastičnosti našega igralca.
  4. Zavihek Dušenje nam daje možnost natančnega prilagajanja parametrov interakcije igralca z okoljem z uvedbo vrednosti, kot sta linearni (na primer zrak) in kotni (med vrtenjem) upor.
  5. Zavihek »Napredno« nam omogoča dostop do različnih dodatnih nastavitev, ki niso vključene v prejšnjih razdelkih. Tukaj lahko aktivirate poenostavljen fizikalni model (za optimizacijo igre), samodejno zaznavanje območij trkov, dogodke ponovnega trka in možnost uporabe pavze za igralca.

Ugotovili smo fiziko, zdaj pa si oglejmo lastnosti, ki jih kličemo s pritiskom na gumb "Lastnosti":

Tako kot v prejšnjem primeru bodo lastnosti za prizore in igralce drugačne. V lastnostih scene lahko določimo njeno ime (»Ime«), dimenzije (razdelek »Velikost«) in barvo ozadja (»Barva ozadja«).

V lastnostih igralca lahko poleg imena določite opis (polje »Opis«) predmeta, skupino, ki ji igralec pripada (razdelek »Izberi skupino«) in plast animacije za mobilne naprave. naprave (tukaj ne morete ničesar spremeniti, saj brezplačna različica programa ne omogoča izvoza iger v formate za mobilne telefone.

A to niso vse nastavitve, ki so nam na voljo v Stencylu. Splošne nastavitve igre so nam na voljo s pritiskom na gumb "Nastavitve" v glavni orodni vrstici:

V oknu z nastavitvami je na levi strani seznam skupin parametrov, na desni pa je glavno območje (včasih razdeljeno na več zavihkov), ki vsebuje vse vrste možnosti. Tukaj nas zanimajo naslednji razdelki:

  1. "Nastavitve" ("Nastavitve"). Prva skupina nastavitev, ki nam omogoča, da svojo igro nekoliko prilagodimo. Ta skupina vsebuje tri zavihke. Na prvem od njih ("Glavni") lahko igri damo novo ime, kratek opis, pa tudi sliko za predogled in ikono. Na zavihku »Zaslon« je konfigurirana končna velikost igralnega prostora, na zadnjem (»Advanced«) pa je mogoče omogočiti poenostavljeno fiziko in nastaviti parametre proti-aliasinga.
  2. "Loader" ("Loader"). V tej skupini lahko delno (ob upoštevanju nekaterih omejitev brezplačne različice) prilagodimo videz prednalagalnika (loaderja), ki bo prikazan, preden se igra v celoti naloži. Obstajajo že štirje zavihki. Na prvem ("Splošno" - splošno) lahko določite povezavo do svojega spletnega mesta, omogočite zaščito pred kopiranjem igre na drugih virih (seznam dovoljenih spletnih mest navedemo v drugi vrstici, ločeni z vejico) in enega od nalagalcev kože. Na zavihku Videz lahko nastavimo barvo zaslona zagonskega nalagalnika in sliko ozadja. Z zavihkom »Slog palice« lahko določite velikost nakladalnega traku, »Bar Barva« pa vam omogoča, da nastavite njegove barve.
  3. "Atributi" ("Atributi"). Ta skupina nastavitev je ena najosnovnejših! Tukaj lahko nadzorujete globalne spremenljivke, ki se uporabljajo v igri (več o spremenljivkah v naslednjem razdelku spodaj).
  4. "Nadzor" ("Upravljanje"). Kot pove že ime, lahko v tej skupini prekonfiguriramo in dodamo gumbe tipkovnice, s katerimi se bodo izvajala določena dejanja v igri.
  5. "Skupine" ("Skupine"). Nekoliko višje smo že obravnavali mehanizem skupin. Tukaj imamo možnost videti vse ustvarjene skupine in jih urediti.

Pravzaprav so to vse nastavitve, ki jih bomo potrebovali za ustvarjanje flash iger v brezplačni različici Stencyla. Ker pa je ta razdelek o nastavitvah, bi bil greh, če ne bi omenili parametrov samega programa. Do njih lahko dostopate tako, da aktivirate postavko »Nastavitve« v meniju »Datoteka«:

Program ponuja podporo za večjezični vmesnik, vendar je trenutno le angleška lokalizacija, zato smo šli naravnost na drugi zavihek - "Delovni prostor". Dejstvo je, da se je v tretji različici Stencyla pojavila funkcija za samodejno ustvarjanje prilagodljivih slik iz naloženih spritov.

In privzeto se sprite podvoji, kar vodi do poslabšanja kakovosti grafike. Da se to ne bi zgodilo, vam svetujem, da onemogočite spreminjanje velikosti slike tako, da v polju Scale izberete Standard (1x).

Svetujem vam tudi, da si ogledate tretji zavihek - "Uredniki". Tukaj lahko povežete dejanja za obdelavo grafike, zvoka in besedila z zunanjimi naprednejšimi (namesto tistimi, vgrajenimi v Stencyl) urejevalniki.

Malo o spremenljivkah

Upoštevali smo skoraj vse nianse dela v Stencylu, vendar se nismo dotaknili ene najmočnejših funkcij – dela s spremenljivkami.

Spremenljivke v katerem koli programskem jeziku vam omogočajo, da operirate z različnimi dogodki in jih izrazite z določenimi številkami (številčne spremenljivke), pogoji (boolean spremenljivke), besedili (niz spremenljivke) itd. Glavna značilnost spremenljivk je zmožnost zamenjave katere koli vrednosti v vnaprej določenih mejah. Preprost primer spremenljivke: spremljevalec v razredu. Danes bo morda Ivanov, jutri Petrov, pojutrišnjem pa Sidorov :).

V našem primeru lahko spremenljivka "dežurni" zavzame eno od treh vrednosti, ki se samodejno nadomestijo glede na določen pogoj (na primer vrstni red priimkov na seznamu).

V Stencylu so spremenljivke lahko lokalne ali globalne. Lokalne spremenljivke lahko deklariramo v okviru nekega dogodka ali vedenja in bodo delovale samo za določena dejanja. Lokalno spremenljivko lahko ustvarite v urejevalniku dogodkov tako, da pokličete razdelek »Atributi«:

Tukaj imamo več zavihkov:

  1. Zavihek »Getters« vam omogoča, da nastavite spremenljivke, ki bodo prejele vrednost iz kakršnih koli izračunov ali neposrednih navodil.
  2. Zavihek "Setters" omogoča nastavitev poljubnih vrednosti za predhodno ustvarjene spremenljivke.
  3. Zavihek »Atributi iger« shranjuje bloke globalnih spremenljivk in po želji omogoča dodajanje novih (čeprav bomo spodaj razmislili, kako to narediti bolje).
  4. Zavihek Seznami nam daje možnost ustvarjanja nizov podatkov.
  5. Zavihek Funkcije se uporablja za organiziranje ustvarjenih funkcij.

Algoritem za ustvarjanje lokalne spremenljivke je preprost: najprej ustvarite nov blok v zavihku "Getters", nato pa poiščite novo ustvarjeno spremenljivko na zavihku "Setters" in dodajte blok z njo v delovni prostor ter ga izenačite z nekaj parameter igre. To je vse - spremenljivka je deklarirana in je prejela niz veljavnih vrednosti.

Globalne spremenljivke (atributi igre) v Stencylu so nastavljene takoj za celotno igro in jih je mogoče poklicati v katerem koli dogodku ali vedenju. Kot je navedeno zgoraj, jih lahko ustvarite v razdelku »Atributi« na zavihku »Atributi igre«:

Vendar pa je veliko bolj priročno, da si ogledate in upravljate vse ustvarjene spremenljivke z uporabo razdelka »Atributi« v nastavitvah (gumb »Nastavitve« v orodni vrstici ali »Pokaži atribute igre« na zavihku »Atributi igre« v urejevalniku dogodkov ):

Tukaj imamo celoten seznam globalnih spremenljivk in s pritiskom na gumb "Ustvari novo" lahko ustvarite nove. Za novo spremenljivko lahko takoj nastavimo vrsto (številsko, besedilno, logično ali matriko) in začetno vrednost, ne da bi zapustili okno, kar je po mojem mnenju zelo priročno.

Z uporabo globalnih spremenljivk je zelo priročno implementirati različne števce, saj se podatki v njih shranijo, ko se igralec premakne na nove ravni, in so shranjeni v pomnilniku, dokler je sama igra vklopljena. Prav tako priporočam uporabo globalnih spremenljivk za spremljanje predvajane animacije.

Ko igralcu damo določeno sprite v dogodkih, lahko temu spriteju dodelimo določeno vrednost v spodnji spremenljivki (na primer serijska številka ali ime animacije). Tako lahko z vezavo dejanja na spremenljivko jo kadar koli pokličemo tako, da to spremenljivko nastavimo na želeno vrednost.

Objavljanje, uvažanje in izvoz iger

Na koncu smo se, čeprav na kratko, seznanili z osnovnimi principi dela s Stencylom. Recimo, da smo ustvarili igro, jo preizkusili in se je izkazalo, da vse deluje. Zdaj je na vas, da igro iz projekta spremenite v pravo datoteko SWF, ki jo lahko objavite na internetu. Če želite to narediti, moramo samo odpreti meni »Objava« in klikniti element »Flash« na seznamu »Splet«.

Začelo se bo sestavljanje datoteke igre, po kateri se bo pojavila zahteva, kam in pod kakšnim imenom shraniti nastalo flash datoteko. Shranimo in to je to - igra je pripravljena :).

Obratni postopek je uvoz igre. Zahvaljujoč funkciji uvoza lahko odprete projekte iger drugih uporabnikov, na primer, da vidite, kako izvajajo to ali ono funkcijo;). Igro lahko uvozite tudi iz menija Datoteka. Po uspešnem uvozu se bo igra pojavila na glavnem zaslonu na seznamu projektov. Vendar je tukaj vredno narediti majhno rezervacijo.

Težava je v tem, da je novi Stencyl 3.0 le delno združljiv s projekti, ustvarjenimi v prejšnjih različicah, tako da funkcionalnost projekta igre, ki ste ga uvozili, morda ni popolna ali pa se v najslabšem primeru igra sploh ne bo zagnala, kar daje napako . Imeli boste malo možnosti - ali poiščite in popravite napake ali pa se sprijaznite s tem in pustite vse tako, kot je :).

Prednosti in slabosti programa

  • enostavnost ustvarjanja iger z malo ali brez znanja programiranja;
  • sposobnost ustvarjanja iger skoraj vseh žanrov;
  • velika zbirka že pripravljenih vedenj in virov za igre;
  • sposobnost izmenjave projektov iger;
  • pri ustvarjanju flash iger ni omejitev.
  • precej visoka intenzivnost virov tako samega programa kot ustvarjenih iger;
  • omejeno število predmetov na odru - več kot je, počasneje igra teče (do neuspeha pri zagonu);
  • ni podpore za cirilice (urediti morate vektorske slike latinične abecede in jih nadomestiti s potrebnimi črkami);
  • nepopolna združljivost nove različice programa s projekti iger, ustvarjenimi v prejšnjih različicah.

ugotovitve

Od vseh programov za ustvarjanje flash iger, ki obstajajo danes, je Stencyl najbolj razumen kompromis med enostavnostjo upravljanja in širino možnosti. Dobra novica je, da je funkcionalnost oblikovalca v brezplačni izdaji praktično neomejena, kar vam omogoča skoraj popolno izvedbo katere koli ideje.

Vendar ne pozabite na "skoraj" ... Dejstvo je, da sam Stencyl deluje na podlagi stroja JAVA, ki je, kot veste, precej zahteven glede virov. Če k tej obremenitvi dodamo še obremenitev, ki jo ustvarja igra, se izkaže, da za normalno delovanje potrebujemo sodoben zmogljiv računalnik.

To je prvi "skoraj". In drugo je implicitna omejitev števila objektov na odru, kar sem že mimogrede omenil. Tudi če so ti predmeti le ploščice, vendar jih je veliko, lahko igra med testiranjem prikaže napako in se ne začne, dokler ne zmanjšate njihovega števila.

Če povzamemo, lahko rečemo, da bo Stencyl idealen motor za ustvarjanje vseh vrst priložnostnih flash iger in strelcev s stranskim pomikanjem. Poleg tega lahko po vadbi ustvarjanja flash iger kupite eno od vrst licenc in z malo spremembo v mehaniki svojo igro prenesete v formate, ki jih podpirata Android in iOS. In to je pravi način za zaslužek z umestitvijo igre na Play Market ali App Store!

Na koncu ostane le zaželeti srečo vsem tistim, ki se odločijo resno ukvarjati z razvojem iger. Naj vaši algoritmi delujejo prvič, prevajalnik pa sedi in molči v krpi, ko začnete svoje igre :).

P.S. Ta članek je dovoljeno prosto kopirati in citirati pod pogojem, da je navedena odprta aktivna povezava do vira in je ohranjeno avtorstvo Ruslana Tertyshnyja.

* Rabljeni programi: Flash CS3, Photoshop CS3
* Kompleksnost: srednje
* Predviden čas izvedbe: 3 ure

Stran s portfeljem je zelo pomembna za vsakega sodobnega umetnika, fotografa, oblikovalca in celo glasbenika. Kaže resen pristop k poslu in strokovnost. Danes bomo pokazali, kako lahko ustvarite izviren in eleganten portfelj fotografij, ki temelji na sodobnem sistemu za upravljanje vsebin Flash Moto CMS.

Uporabili bomo samostojno različico Moto CMS, ki vsebuje različne pripomočke, komponente, vgrajene primere in čiste predloge spletnih mest z različnimi strukturami. In uporabljamo najpreprostejšo predlogo, to pomeni, da bomo spletno mesto s foto portfeljem ustvarili iz nič.

V tem priročniku bomo obravnavali naslednje teme:

* Izdelava kontejnerjev.
* Ustvarite reže (gumb za zapiranje, preprost gumb).
* Ustvarite module (predvajalnik glasbe in galerija slik).
* Uredite prednalagalnik spletnega mesta
* Izdelava strani spletnega mesta in njihovo polnjenje z vsebino.

Govorili bomo tudi o lastnostih in funkcionalnosti nadzorne plošče Moto CMS.

Potrebovali bomo:
* Adobe Photoshop;
* Adobe Flash CS3;
* Različica Moto CMS brez povezave (brezplačna preizkusna različica);
* Oblikovanje spletne strani c. format PSD.

Predogled končnega rezultata

1. korak: Prenesite datoteke Moto CMS

Če želite začeti graditi naše spletno mesto s fotografskim portfeljem, morate prenesti samostojno različico Moto Flash CMS. Da bi ponovili vse korake iz tega priročnika in razumeli zmogljivosti Moto CMS, bo dovolj poskusna različica.

2. korak: Kratek pregled datotek Moto CMS

Tukaj je kratek pregled datotek in map Moto CMS:

* Komponente. Ta mapa vsebuje komponente mxp, ki jih upravlja Adobe Extension Manager.
* Nadzorna plošča. Vsebuje vse datoteke nadzorne plošče.
* dokumenti. Ta mapa vsebuje dokumentacijo API.
* Primeri. Vsebuje 4 primere že pripravljenih flash strani, od najpreprostejših do najbolj zapletenih, z modulom galerije, modulom novic, predvajalnikom glasbe in videa, kontaktnim obrazcem itd.
* Predloge. 5 predlog, ki jih lahko uporabite za ustvarjanje spletnega mesta, ki temelji na Moto CMS. Vsaka predloga ima potreben nabor datotek in se razlikuje po svoji strukturi. Danes bomo uporabili eno od teh predlog, natančneje predlogo #1, kot osnovo našega portfelja fotografij.
* datoteko readme, ki opisuje, kako začeti ustvarjati spletno mesto z Moto CMS.

3. korak: Zaženite na Localhost

Naš naslednji korak je zagon predloge spletnega mesta, iz katere bomo zgradili spletno mesto našega portfelja. Za to potrebujemo lokalni spletni strežnik. Uporabljamo WampServer. Omogoča vam izdelavo spletnih aplikacij z bazami podatkov Apache, PHP in MySQL.

Če želite zagnati predlogo mesta št. 1, preprosto naložite vsebino mape na lokalni strežnik predloga_01 iz imenika /templates/, pa tudi vsebino mape Nadzorna plošča.

Po tem gremo na nadzorno ploščo Moto CMS tako, da v naslovno vrstico brskalnika vnesemo naš URL in na koncu dodamo /admin

Opomba: Spletnega mesta si trenutno ne boste mogli ogledati, ker še ne vsebuje nobene strani. Prikaže se stran z napako 404.

4. korak: Urejanje config.xml

Vse, kar moramo storiti, je spremeniti širino in višino spletnega mesta ter nastaviti barvo ozadja.

Velikost našega projekta je 980×800 slikovnih pik. Da bi se velikost spremenila na velikem zaslonu, moramo nastaviti "100%" za širino in višino strani. In da bi bilo pravilno prikazano na zaslonu z majhno ločljivostjo, moramo določiti najmanjšo širino in višino mesta (prikazali se bodo drsni trakovi). Barva ozadja je črna (#000000).

5. korak: Spremenite style.css

Zdaj moramo odpreti datoteko style.css in nastaviti barvo ozadja (črna). Vse ostalo je mogoče urejati z Moto CMS Control Panel.

6. korak: Ustvarite prednalagalnik

Izvorni datoteki moto.xfl in website.xfl sta v mapah flamoto oziroma flawebsite.
Prednalagalnik spletnega mesta mora biti ustvarjen v moto.xfl. Prednalagalnik je lahko preprost posnetek s 100 sličicami.

Na plošči Dejanja tega posnetka zapišemo: "Ustavi ();" za prvi okvir. Nato ostale okvirje animiramo po želji.

Zapišemo tudi "Ustavi ();" v dejanjih prvega okvirja časovnice v fla.

Ne pozabite v lastnostih datoteke moto.fla določiti dimenzije strani (najmanjšo širino in višino).

Naš naslednji korak je ustvariti lepo animacijo izginotja prednalagalnika. Na zadnjem okvirju moramo spletno stran zagnati z aktiviranjem funkcije “showWebsite()”.

Odprite datoteko website.xfl in posodobite prednalagalnik.

7. korak: Ozadje spletnega mesta

Odprite Moto CMS Media Library (Nastavitve > Media Library) in skupaj z drugimi potrebnimi slikami (za glavno stran, glavne strani ali galerijo) naložite sliko ozadja z gumbom »Dodaj predstavnost«.

Po tem se vrnite na nadzorno ploščo, ustvarite novo stran in z gumbom »Fotografija« vstavite sliko ozadja. Povlecite sliko in jo sredite.

Upravitelj pisav uporabnikom omogoča upravljanje pisav spletnega mesta, ki so shranjene kot datoteke SWF in jih je mogoče prenesti.

Preden naložimo katero koli pisavo, jo moramo najprej pretvoriti v format SWF. Za to bomo uporabili Spletni ustvarjalec pisav je priročna spletna aplikacija, ki jo je razvila ekipa MotoCMS in vam omogoča preprosto pretvarjanje datotek TTF in OTF v SWF. Vse kar moramo storiti je, da izberemo želeno datoteko pisave s končnico .TTF ali .OTF, jo dodamo v spletni ustvarjalec pisave, kliknemo gumb »Ustvari pisavo« in prenesemo končano datoteko SWF, po kateri jo lahko uporabimo v našem portfelju spletna stran .

Ustvarite ime in slogan spletnega mesta

Ko je nova pisava naložena, lahko z orodjem Besedilo ustvarite naslov in slogan spletnega mesta in uporabite želeno pisavo. Za izdelavo slogana uporabljamo pisavo Tahoma, velikost: 10, barva: # 727272. Nato prilagodite ime in slogan strani v skladu z zasnovo v .PSD.

9. korak: Dodajanje slike na domačo stran

Sliko galerije bomo postavili na glavno stran strani. Če želite to narediti, izberite sliko iz medijske knjižnice s klikom na "Fotografija" v levi orodni vrstici. Po potrebi prilagodite njegovo lokacijo v skladu z zasnovo glavne strani.

10. korak: Ustvarite spodnji meni

Z orodjem Shape ustvarite siv ozek pravokotnik in z orodjem Besedilo ustvarite gumbe na njem. Vse prilagodite zasnovi vašega spletnega mesta.
Shranite vse spremembe in si oglejte rezultat s klikom na "Predogled".
Za ustvarjanje menija lahko uporabite tudi vgrajeni menijski modul.

11. korak: Ustvarite vsebnike vsebine

Opomba: Vsebniki so posnetki v website.fla, kjer je mogoče dinamično dodajati vsebino. Lahko so 4 vrste: 1) vsebnik s predmeti, ki so vidni na celotnem mestu, 2) vsebnik s postavitvenimi objekti; 3) vsebnik s predmeti strani; 4) vsebnik s pojavnimi predmeti.

Predloga spletnega mesta #1, ki smo jo izbrali, ima privzeto dva vsebnika: vsebnik s predmeti, ki so vidni po celotnem spletnem mestu, in vsebnik s predmeti strani. Če odpremo datoteko website.fla, jih bomo videli:

Ti vsebniki so zapisani v datoteki structure.xml. Prepričajte se, da je širina 980 in višina 800 slikovnih pik.

Vsebnik s predmeti, ki so vidni na celotnem mestu:

Vsebnik s predmeti strani:

Da bi bili elementi spletnega mesta, kot so ozadje, ime mesta, slogan in spodnji meni s sivim poljem vidni na vseh straneh, jih moramo postaviti v vsebnik predmetov na celotnem spletnem mestu. To lahko enostavno naredimo z Moto CMS Control Panel. Preprosto kliknite na želeni element in izberite njegovo lokacijo - Spletno mesto. (Na celotnem spletnem mestu).

12. korak: Ustvarite stran O nas

Ustvarite prazno stran

V zgornjem levem kotu kliknite gumb »Ustvari«, ki nam bo omogočil ustvarjanje nove strani.

Povezovanje potrebnih gumbov menija na novo stran

Če želite to narediti, se vrnemo na glavno stran in povežemo gumb menija z novo stranjo. Preprosto označite besedilo gumba menija in kliknite ikono povezave na desni, da odprete urejevalnik povezav. V našem primeru se gumb menija Portfelj povezuje na glavno stran spletnega mesta, gumb O nas pa na stran O nas.

Dodajanje slike ozadja na stran z informacijami

Odločili smo se, da strani dodamo črno ozadje. Če želite to narediti, pojdite v medijsko knjižnico s klikom na gumb »Fotografija« na levi plošči, tam izberite vnaprej naloženo sliko (navaden črn pravokotnik) in prilagodite njeno lokacijo na strani v skladu z zasnovo.

Dodajanje besedila na stran O nas

Dodajanje besedilnih informacij na stran z orodjem za besedilo. Vgrajeni urejevalnik WYSIWYG prikazuje vse, kar počnete, zato je oblikovanje besedila preprosto. Dodajanje kontaktnega naslova je tudi dovolj enostavno, le odpreti morate urejevalnik povezav in vnesti e-poštni naslov.

Ko končate, ne pozabite elementov strani O nas postaviti v vsebnik s predmeti strani. Izberite vsak element enega za drugim in izberite umestitev: Stran (vsebina strani).

13. korak: Spremenite sliko prednalagalnika

Morda ste med krmarjenjem po straneh opazili bele krožne prednalagalnike. Če jih želite nastaviti, odprite datoteko website.fla in pojdite v knjižnico. Z desno miškino tipko kliknite prednalagalnik in izberite Lastnosti.

V oknu lastnosti simbola lahko izberete element »Uredi osnovni razred« in nato animirate prednalagalnik, kot želite. Prednalagalnik bomo pustili prazen in izbrisali grafično sliko.

14. korak: Animacija spletnega mesta

Končno smo prišli do najbolj zanimivega dela našega vodiča: animacije spletnega mesta. Trenutno je, kot ste morda opazili, stran statična, saj niti en vsebnik ni animiran. Naš naslednji korak je torej animiranje vsebnikov in dodajanje drugih animacij, da oživimo naše spletno mesto.

Animiranje privzetih vsebnikov

Vsebnik vsebine je enostavno animirati vzdolž časovne premice. Odprite datoteko website.fla in ustvarite animacijo bledenja za vsak vsebnik.

Najprej animiramo glavni vsebnik s predmeti, vidnimi po celotnem spletnem mestu. To je sloj website_holder_1. Delamo preprosto animacijo s preglednostjo, vendar jo bomo z nečim okrasili. Ustvarite drugi ključni okvir na sloju, nastavite Alpha 0% za prvi ključni okvir (naj bo pregleden), ustvarite vmesni okvir od prvega do drugega in nato dodajte popuščanje.

Na enak način ustvarimo animacijo za vsebnik s predmeti strani (plast page_1_holder_2), vendar naj se prikaže nekoliko pozneje.

Tako bomo sloju dodali še dva ključna okvirja, naredili vsebnik pregleden pri prvem in drugem okvirju ter ustvarili popuščanje vmes od drugega do tretjega ključnega okvirja.

Ko prevedemo in naložimo spletno mesto, bomo videli, da je vsak element že animiran. Toda pri premikanju z ene strani na drugo ni animacije, le nenavadno utripa. Za to je odgovoren drugi del časovnice.

Tako naredimo animacijo pojava in izginotja posode.

Ker je pisava besedila iz sistemskih pisav, moramo spremeniti način mešanja iz običajnega sloja v nivo za vse primerke filmskih posnetkov na plasti vsebnika.

Ustvarimo dodatne zabojnike in jih animiramo.

Za dobro flash spletno stran ta animacija ni dovolj, zato bomo animirali tudi druge dele strani, kot so vrh (na spodnji sliki označen z rumeno), dno (označeno zeleno) in samo vsebino ( na sliki v rdečem polju).

Ker zgornji in spodnji del ležita na ravni celotnega mesta, bomo za ta dva dela dodali dve posodi. Pred dodajanjem posod moramo določiti njihovo velikost in lokacijo. To je enostavno narediti z orodjem Slice v Photoshopu.

Zgornji del ima naslednje dimenzije: x=0, y=0, širina=980, višina=120.

Spodnja cona: x=0, y=765, širina=980, višina=35.

Zgornji vsebnik bo vseboval ime spletnega mesta, spodnji vsebnik bo vseboval meni in bodo prikazani drugače. Prav tako se bodo prilepili na zgornji in spodnji del zaslona, ​​ko se preklopijo na celozaslonski način.

Po določitvi dimenzij vsebnikov odpremo datoteko structure.xml in dodamo nove vsebnike (na nivoju mesta), pri čemer navedemo njihove koordinate, širino, višino in globino.


Ko dodamo vsebnike v datoteko .xml, jih moramo ustvariti v datoteki website.fla. Odprite datoteko website.fla in ustvarite nove plasti za naše vsebnike. Vrstni red slojev se mora ujemati z vrednostmi globine, ki smo jih nastavili v datoteki xml.

Prazen filmski posnetek lahko kopiramo iz sloja website_holder_1 in ga prilepimo v website_holder_3 in website_holder_4.

V posnetku nastavimo enake koordinate, kot so določene v datoteki structure.xml.

Za 3. vsebnik: x = 0, y = 0;

Za 4. vsebnik: x = 0, y = 765.

Ker smo posnetek kopirali, so ostala stara imena. Spremenimo jih glede na ID, tako da jih je enostavno najti.

Enako je treba storiti za posodo 4.

Na časovni premici nastavimo prvi ključni okvir za vsebnika 3 in 4, tako da se začneta pojavljati pozneje kot vsebnik s predmeti celotnega mesta. Nato ustvarimo druge ključne kadre in animiramo vmesne okvirje. Prvi ključni okvirji vsebujejo začetni položaj vsebnikov, drugi ključni okvirji pa končni položaj vsebnikov na mestu. Glavni vsebnik se prikaže z vrha zaslona, ​​zato ga premaknemo na prvi ključni okvir; spodnji vsebnik je na spodnji strani, zato ga premaknemo tudi na prvi ključni okvir. Dodamo tudi pomiritve, da animiramo vmes.

Evo, kaj imamo:

Po tem moramo dodati naslednjo kodo na plast dejanj na ravni prvega ključnega okvirja animacije naših vsebnikov.

Nato prevedemo spletno mesto in posodobimo nadzorno ploščo.

Postavite predmete v posode

Ko izberete kateri koli predmet, boste videli, da se na seznamu možnih umestitev v spustnem meniju prikažeta dva nova vsebnika: zgornji in spodnji.

Ime strani s sloganom mora biti v zgornjem vsebniku, meni mesta s sivim pravokotnikom pa v spodnjem.

Spremenite vsebino spodnje posode

Zdaj je zaželeno, da se na velikem zaslonu spodnja posoda drži dna zaslona. Če želite to narediti, moramo animacijo vsebnika premakniti v drug posnetek, saj, kot veste, animiranega posnetka ne moremo premakniti programsko (animacija ne bo delovala). Poimenujmo ta posnetek website_holder_4_c.

Po tem pojdimo na glavno sceno, kliknite na prve ključne kadre vsebnikov 3 in 4 in uredite kodo.


Po prevajanju spletnega mesta lahko vidite, da se spodnji vsebnik drži dna zaslona, ​​ne glede na to, kako spremenimo velikost zaslona. Če je ločljivost zaslona premajhna, se spodnji vsebnik ne bo prekrival z vsebino spletnega mesta in bo ostal na mestu.

15. korak: Animirajte vsebnik vsebine

Za animiranje vsebine spletnega mesta bomo morali animirati vsebnik s predmeti celotnega mesta na enak način kot za zgornji in spodnji vsebnik.

16. korak: Ustvarite stran za stik

Preden ustvarite novo stran, posodobimo predlogo strani. Naredimo predlogo za vse nove strani, stran »O nas«. Z desno tipko miške kliknite stran O nas in izberite Posodobi predlogo strani.

Ko posodobimo predlogo strani, kliknite gumb »Ustvari«, vnesite ime strani, naslov, dodelite URL in izberite njeno lokacijo v strukturi vašega spletnega mesta, kot je prikazano spodaj, na posnetku zaslona.

Stran »Stiki« je pripravljena. Zdaj je ostalo še urediti njegovo vsebino s priročnim urejevalnikom WYSIWYG in ga z urejevalnikom povezav povezati z ustreznim gumbom menija.

17. korak: Ustvarite preprosto režo

V Moto Flash CMS imajo reže vlogo animiranih predmetov. Reža lahko vsebuje veliko število animiranih funkcij, ki jih je mogoče nadzorovati neposredno z nadzorne plošče.

Najprej bomo poskušali ustvariti preprosto režo in jo nato izboljšati.

Začnimo z gumbom »Zapri«, ga dodamo na spletno mesto kot sliko, nanj uporabimo nekaj učinkov in dodelimo dejanje »Pojdi na stran« -> »Domov«.

Animiranje gumba za zapiranje sploh ni težko, ker bomo to naredili z režo. Ustvarimo režo v datoteki website.fla. V ta namen uvozimo sliko gumba "Zapri" v knjižnico. V razdelku Slots moramo ustvariti nov filmski posnetek in ga poimenovati CloseButtonSlot.

Nastavimo razred kot CloseButtonSlot. Ni potrebe po ustvarjanju novega razreda, dovolj je, da podedujete razred AbstractMotoSlot. Samo kopirajte: com.moto.template.shell.view.components.AbstractMotoSlot in ga prilepite v polje Base Class.

Nato v oder dodamo sliko CloseButtonIcon (CloseButtonSlot MovieClip mora biti odprt) in jo pretvorimo v posnetek, imenovan CloseButtonIcon. Ker smo svojo režo podedovali iz razreda AbstractMotoSlot, nam to daje glavno animacijo. Zdaj bomo naredili lep učinek razširitve / strnitve.

Naslednji korak je, da ustvarite nov sloj in ustvarite ključne okvire, kjer morate vstaviti "Stop ();". Postavite glavne oznake "čez" (med prvim in drugim ustavnim okvirjem) in "ven" (med drugim in tretjim ključnim okvirjem postanka) - glejte posnetek zaslona:

Na našem sloju posnetka ustvarimo enak ključ in vmesne okvirje.

Na primer, naš gumb »Zapri« se bo vrtel v smeri urinega kazalca, ko se miška premakne nad njim, in v nasprotni smeri urinega kazalca, ko ga odstranite.

Za animacijo gibanja dodajmo svetlost vrtenja in olajšanje.

Ko je animacija končana, sestavimo datoteko website.fla z našo novo režo (Ctrl + Enter).

Za delo z režo z Moto CMS moramo v datoteki navesti njene parametre: struktura.xml:

librarySymbolLinkage=” ” – izvozna reža za filmski posnetek (ime razreda).
animated=”true” – atribut, ki določa, ali je reža animirana ali ne.
resizable="false" - ali obstaja logika za spreminjanje velikosti reže ali ne.
locked=”false” – ali naj bo reža prikazana na nadzorni plošči ali ne.
– ime reže na nadzorni plošči
– lastnosti reže, ki razširijo funkcionalnost. V tem primeru ga ne bomo uporabili.