Анимирано движение на букви

21
Добави коментар
qnibrv
qnibrv

15 Април 2011, 20:38 | 16058 преглеждания | 51 коментарa

Категория: Дизайн » Photoshop

Оценка:

(7 гласували)

56 добавяния към любими

Този урок не е за начинаещи потребители, които не знаят основните неща за анимирането в Image Ready.

1. Отворете си нов документ във Фотошоп.

2. Напишете някакъв текст, като всяка буква е на отделен слой от долу нагоре в панела. Запълнете буквите с цвят по ваше желание.

3. Трябва да имате нещо подобно:

4. Панела със слоевете ви трябва да изглежда по този начин:

5. Преминете в Image Ready.

6. Натиснете бутончето за нов фрейм. Трябва да имате само 2 фрейма.

7. Маркирайте втория фрейм. Трябва да имате по 1 символ на отделен слой. С инструмента за местене придвижете първата буква наляво. Втората буква преместете нагоре, а третата буква от примера – надясно. Нека буквите да излязат извън рамката.

8. Извлачете първия фрейм надясно, за да размените местата на двата фрейма.

9. Маркирайте първия фрейм. В панела за анимация цъкнете върху малкия триъгълник в горния десен ъгъл, който е ограден с червеното кръгче на долната картинка:

Изберете Tween. Ще се отвори диалогов прозорец. Напишете с цифра броя на фреймовете, които искате да се добавят и натиснете ОК.

10. Панела за анимация сега трябва да изглежда по този начин

11. Задайте времето за забавяне на фреймовете. Можете да смените забавянето на няколко фрейма едновременно, като ги маркирате с натиснат Ctrl + кликване върху тях – при смяна на времето на 1 фрейм, промяната се възприема от всички селектирани фреймове.

12. Сейфайте си файла от File -> Save Optimized As… в .gif формат.

Ето резултата от урока:

А ето и моя опит:

Преведено от: Ledenata
Източник на урока: www.insidegraphics.com

Ако урокът ви допада, споделете го в Twitter и Facebook или го запазете в Delicious.

Урокът е добавен от: bubsss

Каде е тос ФРЕИМ е някои даде скрееншот плссссс

За кой фрейм питаш точно? Фреймовете са кадрите на анимацията ти – там задаваш кои слоеве да са видими в даден кадър и кои слоеве да са невидими. Също така там задаваш времето, през което ще се задържа този кадър – може да му зададеш да е без забавяне, т.е. време 0 секунди. Нов фрейм /кадър/ се създава, като цъкнеш на бутончето с прегънатото листче, което се намира до кошчето в панела за анимация. Можеш и да дублираш /копираш/ даден фрейм /кадър/, като хванеш желания и го извлачиш с мишката до бутончето с подгънатото листче, където вече пускаш мишката с влачения фрейм. Изтриваш фрейм, като го маркираш /цъкнеш върху него/ и после натиснеш бутончето с кошчето или като го хванеш с мишката и го извлачиш до бутончето с кошчето /в панела за анимация/, където пускаш кадъра, който влачиш.
Ако нещо не ти е ясно, кажи ми. Урокът наистина не е обяснен подробно и ако си начинаещ няма да се справиш без допълнителни пояснения. Написала съм в началото на урока, че не е за начинаещи потребители 🙂

lordgg Този урок не е за начинаещи потребители, които не знаят основните неща за анимирането в Image Ready

a btw тфа е много лесно и яко 🙂

Еми да мааааа :((( нз ко да науча даите ЛИНК

Ае хора ако сам написал някав текст после как да го оцветя начи направил сам текста и после как да го оцветя в някои цвят /
“““““““““““’

LORDGG, маркираш си текста и от лентата с атрибутите на инструмента горе, цъкваш с мишката на черното правоъгълниче. Като ти се отвори прозореца с цветовете, кликни с мишката на нюанса, който си харесаш и като решиш окончателно какво да бъде, натисни ОК. Ще видиш, че цветът на правоъгълничето горе се е сменил с текущия цвят на текста ти.

Получава се. Само дето докато разбера как да хвана буквите докато ги преместя извън екрана.. 🙂

кажите как да хвана буквите и да ги преместя плс

направих го благодаря на ледената за урока 😀

nETaKa, сега влизам и затова не съм ти отговорила на въпроса, но се радвам, че си се справил. Браво на теб 🙂
Покажи резултата, ако не е нещо тайно, разбира се 🙂

ако ми каеш само къде си кача гифчето :D[/img]

http://imageshack.us/
После копираш най-долния линк, който ти излиза – Direct link to image
Под прозорчето, в което си пишеш мнението имаш бутонче Img – цъкваш веднъж на него, пействаш линка и после отново цъкваш веднъж на същото бутонче, за да затвори тага на картинката.

http://img136.imageshack.us/img136/3516/uploadedbynetakasj7.gifнезнаех само къде да кача гифчето иначе др неща ги знам

това ми тряаше за един тракер затова мъчех се с една др прогрома ама нестана затва с photoshopa 😛

Петак я обясни как става тази хватка с букви?Или който знае да обясни моля.

пенчо за да местиш буквите избираш леара с буквата и отиваш на MOVE TOOL тва е езна стреличка и до нея има 4 стрелки в една в различни посоки

Въпрос, как да save файла с CS3. Това Save Optimized as нещо не го виждам. Благодаря предварително.

Само не мога да разбера къде е този инструмент за месетене . Моля кажете !

http://img20.imageshack.us/img20/4536/skr16jz2.jpg

Отваря се прозорец и там трябва да избереш GIF

Инструмента за местене се казва Move Tool (V), намира се в кутията с инструменти най-горе!

http://prikachi.com/files/41825N.gif тва е моя опит 🙂

уха… този урок става и за начинаещи аз съм начинаеш и се справих.. 😀

Супер! Стана ми! Хубав урок! 🙂

Готино уроче, а не е и трудно.Браво 🙂

Тоя урок въобще не е за ПРО. Супер е лесно

Откъде се пуска Imageready , мерси..

И немога да разбера как да разбера как се правят стъпка 6,7,8,9 ?

някои може ли да ми каже как стават не6тата като съм със CS3 защото нямам Image Ready

извинете само да попитам каде е image ready

мн яко ето и мойто опит4е http://img147.imageshack.us/img147/7139/rockaraga4.gif

Направих го много яко само дет като го направих флаш и само последния лейър бацаше т.е. първата буква… :/

Имам доста опит в областта на Photoshop, но до сега частта с image ready ми беше непонятна. Благодаря за урока, беше ми адски полезен!

ебахти тъпото ебеснение ОТВРАТ -6

от много скоро почнах да се занимавам с фотошоп, обаче направих нещо и сега като пиша нещо с texttool не ми излиза текста
ПС: не е защотото цвета на писане и background цвета са еднакви….

tuka i az ne mojah da pro4eta otgovora na vuprosa kude se namira image ready ?

Сатенке, ако си с Photoshop CS3 или Photoshop CS4 (предполагам, че не си с CS5 :), цъкаш горе на WINDOW и от падащото меню избираш ANIMATION. Ако не се показва ANIMATION, виж най-долу в менюто SHOW ALL ITEMS, натисни го и ANIMATION ще излезе в менюто … после натискаш ANIMATION. Ама и аз теглих едно обяснение 😀

eh razbrah prosto e trqbvalo samo da pishat animation, 6tot turseh kude pishe image ready :D:D:D

http://img840.imageshack.us/img840/7839/59067310.mp4
е те тва ми е крайния резултат 😀

http://img801.imageshack.us/i/animationtn.gif/ Ето И моя Опит 🙂 лесно и яко 🙂

Вчера реших да си озвуча клипчетата. 🙂 На този клип една от основните използвани техники е именно тази от урока. Тоя калпазанин на 14-ата сек. съм аз. :

http://www.youtube.com/watch?v=dwh_EyuYnbY

Ей, калпазанина, много срамежливо и за кратко си се показал в клипчето :))) Много е добро. Само с PS ли анимира буквите?

Да, правено е почти изцяло с ФШ. Има доста грешки, но това ми беше един от първите клипове. Специално за теб 🙂 – пълната версия на клипа (в нея е използвана и Flash) :

http://www.youtube.com/watch?v=hmmY5MkjHN0

Ееееееееееее суперско клипчето, браво!!!

Здравейте! От скоро се занимавам с фотошоп 🙂 Наистина урокът не е за начинаещи. Ето моите опити 😉
http://prikachi.com/images/870/2634870X.gif
http://prikachi.com/images/235/2637235n.gif
http://prikachi.com/images/236/2637236K.gif

Откъде се пуска ImageReady? 😐

Трябва да сте регистиран потребител за може да оставяте коментари! Направете своята безплатна регистрация още сега.