Press "Enter" to skip to content

Hogyan készítsünk Gif banneret a Photoshop-ban

Hogyan készítsünk egy animált GIF banneret

Ma nem nagyon egyszerűnek tartjuk, de egy nagyon érdekes lecke egy animált gif banner létrehozására.

Ahhoz, hogy világosabb legyen, amit beszélünk, és hogy a végén kiderül, megnézzük további munkánk végső eredményét..

A mai napig, a legnépszerűbb bannerek, amelyeket gyakorlatilag minden weboldalon és minden banner hálózaton készítettek, a GIF vagy a Flash Standard Size Animáció alapján készült banner: X60, X, X60, 88X

Figyelembe vesszük az animált banner létrehozásának példáját az X60 méretű méretével, amely a fent említett példa.

Szóval, az első dolog, hogy eldöntsük, hogyan szeretné, ha a bannered végső soron megnézed. Jöjjön létre egy szövegrész és a szavak, képek és mások fogalma. Megpróbálunk létrehozni egy animációt anélkül, hogy a végéig elkezdené gondolkodnod – felszabadítva.

Amint azt a példában is látható, a banner egyáltalán nem bonyolult, és három információszakat tartalmaz.

1. Első szövegblokk létrehozása webhelye azt jelenti, hogy megkérdőjelezhető.

2. A második szövegblokk mindegyike lehet válaszolni.

3. Banner tájékoztató lényege. Vagyis egy egyértelműen megfogalmazott válasz, hol tanulni ezt))

Azt hiszem, az elmélet elég. Úr gyakorlata!

Hozzon létre egy új dokumentumot X60 pixel méretekkel.

Most tegye a banner információ minden részét egy külön rétegre. (Az alábbi képen áthúztam az egyértelmű fájlokat, meg kell tennie egy dokumentumban, egyszerűen a rétegeket a másik fölé helyezve)

Szintén szükségünk lesz néhány háttérképre, a mi esetünkben a textúra kékes válásokkal rendelkezik. Szintén külön rétegeket kell különítenie.

Most megyünk az ablak legördülő menüjébe, és bekapcsoljuk az animációs panel.

Itt ugyanazok a rétegek, csak az egyes telepítés lehetőségével.

A telepített állapotban minden rétegnek több paramétere van.

POZÍCIÓ – felelős a rétegen található mozgó képekért.

Átlátszatlanság – felelős az átláthatóságért

Stílus – Felelős a stílusréteg képének, t.E. Árnyékok, megvilágítás, extrudálás és egyéb.

Szöveges csomagolás(Ha ezt a szövegréteget) a görbületi szövegre tervezték.

Mindegyik paraméternek saját ideiglenes pálya van, amelyen a markerek elhelyezhetők, mintha a jelenlegi állapotot rögzítenénk.

Az animáció kiépítésének módja az őrület számára egyszerű. Például szükségünk van a képre, hogy jobbra mozogjon jobbra. Ehhez kattintson a felirat pozíció melletti órára, amely után a csúszkát jobbra mozgatjuk az idővonal kívánt pontjára, és egyszerűen a képet az oldalra. Maga a program hozzáadja az összes szükséges keretet. Csak az időtartam módosítására szolgál, az idővonalon lévő jelölők segítségével. Ugyanúgy működik az átláthatóság, a stílusok és a szöveg görbülete.

Az alábbiakban egy példa az átlátszó tulajdonság (opacitás).

Tegye ezt a lépést az első réteg szöveges eszközének animációjával. Ha óvatosan nézed a lecke tetején lévő bannerre, akkor vegye figyelembe, hogy a szöveg eltűnése mellett megvilágítás is van. A megvilágítás animációja hasonló az átlátszóság cselekvéseihez, de ha a külső izzó megvilágítás engedélyezve van a réteg tulajdonságaiban. A kezdeti keret a paraméterrel való megvilágítás, és a végső:

Továbbá van egy belső fényhatás a rétegen, felelős a szöveg belső fényéért. Az elvégzett tevékenységek azonosak. Start keret – kis érték, végső – nagy.

A következő réteg ugyanúgy működhet, de az idővonal elmozdulásának állapotával, mivel a második réteg elkezdődik, miután az első teljesen átlátszóvá vált.

És még egy, az utolsó réteg a 3. számon, az idővonalon kezdődik, amikor a második teljesen átlátszóvá vált.

Az első alkalommal, amikor szép, valószínű, hogy sikeres lesz, ezért gyere ki, de minden van tapasztalat.

Miután minden egyes rész egyértelműen megfelel az idő területének, feltételezheti, hogy minden készen áll. Most kattintson Ctrl + Shift + Alt + S (Save for Web) és mentse a bannerünket GIF formátumban, ahogy már tudja, támogatja az animáció megőrzését.

Navigáció:

Előző lecke: A súly fontos! Mentés az interneten!

Van egy kérdés? Szerezd meg a választ a támogatási fórumra

Comments are closed, but trackbacks and pingbacks are open.