Добро пожаловать на Форум SoftWeb.ru.
 
Зима

Нам нужна Ваша поддержка. Сбор средств на оплату дата-центра.

Форум SoftWeb.ru » Образование и работа » Дизайн и графика » Все о Photoshop » Как сделать анимации в Photoshop CS

Все о Photoshop Photoshop с нуля, работа с программой, обсуждение, вопросы и ответы..

ОТВЕТИТЬ
Опции темы Опции просмотра Опции просмотра
Как сделать анимации в Photoshop CS
Старый 22.04.2009, 14:25   #31
 
Аватар для Faraon
 
Статус: Мистер SoftWeb.2009
Регистрация: 24.10.2007
Адрес: Matrix..........
Сообщений: 1,002
СПАСИБО: 543
сказали Спасибо 761 раз(а) в 389 сообщении
Получено наград:
По умолчанию Re: Как сделать анимации в Photoshop CS

gift,
Выкладывайте, заодно выложите исходник в *.PSD если не трудно.
С планетой может помогу, но обещать не буду.

Цитата:
Сообщение от gift Посмотреть сообщение
А планету объемную я сделала

Это скорее объемный эффект, иначе нужно видеть этот объем, видно его будет при анимации. А так 2D всегда будет 2D/
Кстати как создать планету описано[Ссылки могут видеть только зарегистрированные пользователи. ]


Бойтесь разума.

Последний раз редактировалось Faraon; 23.04.2009 в 21:39.
Faraon вне форума   ЦИТИРОВАТЬ
Объявление
Нам нужна Ваша поддержка. Сбор средств на оплату дата-центра.
Старый 26.05.2009, 09:32   #32
 
Статус: Гость
Сообщений: n/a
По умолчанию Re: Как сделать анимации в Photoshop CS

Подскажите пожалуйста как сделать уклы фотографий закругленными???

Заранее спаибо.
  ЦИТИРОВАТЬ
Старый 28.05.2009, 11:01   #33
 
Статус: Гость
Сообщений: n/a
По умолчанию Re: Как сделать анимации в Photoshop CS

Цитата:
Сообщение от turist Посмотреть сообщение
Подскажите пожалуйста как сделать уклы фотографий закругленными???

Заранее спаибо.

сделать углы очень просто:
я лично делаю 2а слоя нижний с фоткой где углы сделать хочу вверху слой где собсна и буду делать углы... выбираешь фигуру с округлённым концами и поверх изображение делаешь выделение, потом выбираешь выделение слоя и получается что у тя контур выделения будет округлённый) вырезаешь фотку уже с круглыми углами и допустим вставляешь в новый файл) и всё=)

ЗЫ надеюсь что описал этот процесс достаточно понятно)
  ЦИТИРОВАТЬ
Старый 20.09.2009, 16:24   #34
 
Статус: Гость
Сообщений: n/a
По умолчанию Re: Как сделать анимации в Photoshop CS

Цитата:
Сообщение от gift Посмотреть сообщение
Faraon,
честно говоря, что такое спрайты я не знаю, даже не имею понятия...
А планету объемную я сделала (завтра картинку попытаюсь выложить). А теперь хочу попытаться сделать ее крутящейся. Я где-то мельком видела, что можно это сдетать при помощи анимации в фотошопе, смещаяя изображение на определенное количество пикселей. Я попыталась сделать нечто подобное, но не с планетой, а я развернутым изображением планеты (на весь документ, как карта), вроде бы что-то подобное вышло, а именно с круглой - не получается :(

А как вы сдетали объемную картинку?
  ЦИТИРОВАТЬ
Старый 18.10.2009, 14:31   #35
 
Статус: Гость
Сообщений: n/a
По умолчанию Re: Как сделать анимации в Photoshop CS

Цитата:
Сообщение от Vlassic Посмотреть сообщение
А можно сделать чтобы при наведении мышки анимация замедлялась или ускорялась

Насколько я понимаю, это требуется для сайта? Думаю, в этом случае нужно создать два файла с анимацией, один с быстрой, другой с медленной. А уже когда в аштемеэле пишешь страницу делаешь чтоб при наведении мышой быстрая гифка менялась на медленную... Возможно можно и проще, но я не в курсе...

Добавлено через 27 минут
Цитата:
Сообщение от Dock Посмотреть сообщение
Как из анимации в CS3 сделать AVi

Для этого дожен быть установлен Qwuck Time не ниже 7.1. Затем File - > Export -> Render Video. откроется диалог "Просмотреть видео". И там в параметрах файла выбрать Квик тайм и формат: ави или другой...

Последний раз редактировалось Соискатель; 18.10.2009 в 14:31. Причина: Добавлено сообщение
  ЦИТИРОВАТЬ
Старый 31.01.2010, 22:17   #36
 
Аватар для Sheet2006
 
Статус: модератор
Регистрация: 20.08.2007
Адрес: Крым
Сообщений: 1,994
СПАСИБО: 1,702
сказали Спасибо 2,175 раз(а) в 972 сообщении
Post Re: Как сделать анимации в Photoshop CS

создание gif анимации

На этом уроке рассмотрим вопрос создание gif анимации в программе Фотошоп. Как всегда изучать вопрос будем на практическом примере и сделаем изображение удивленной кошки. Вместо кошки можно использовать и фотографию человека как свою так и любого другого человека, например можно пошутить над другом или сделать смешной аватар для форума.



Для создания gif анимации Вам потребуется Photoshop CS3, либо, если Вы пользетесь более ранней версией Фотошопа, чем CS3, то кроме самой программы Фотошоп потребуется ImageReady.

1. Сохраните эту фотографию на своем компьютере или откройте свое изображение (Файл-Открыть File-Open).



2. Выделяем правый глаз кошки любым инструментом выделения, и вставляем на новый слой (Редактирование-Копировать Edit-Copy, Редактирование-Вставить Edit-Paste), и называем его правый.

3. Копируем слой правый 2 раза перетаскивая слой с глазом на значек Создать новый слой (Create a new layer) в нижней части палитры Слои (Laers) и называем их правый 1 и правый 2.



4. Делаем активным слой с кошкой. Выделяем левый глаз кошки, и снова вставляем на новый слой, называем его левый.

5. Копируем слой левый 2 раза и называем их левый 1 и левый 2.

6. Удерживая нажатой клавишу Ctrl кликаем по строке слоя правый, автоматически загрузится выделение правого глаза. Трансформируем изображение (Редактирование-Свободная трансформация Edit-Free Transform, или сочетание клавиш Ctrl+Т), нажимаем на кнопку Cохранить пропорции (Maintain aspect ratio) и меняем масштаб со 100% на 130% в окне масштабирование по горизонтали.



Продолжение в следующем посте

Последний раз редактировалось Sheet2006; 31.01.2010 в 22:22.
Sheet2006 вне форума   ЦИТИРОВАТЬ
Старый 31.01.2010, 22:20   #37
 
Аватар для Sheet2006
 
Статус: модератор
Регистрация: 20.08.2007
Адрес: Крым
Сообщений: 1,994
СПАСИБО: 1,702
сказали Спасибо 2,175 раз(а) в 972 сообщении
Post Re: Как сделать анимации в Photoshop CS

создание gif анимации (продолжение)

7. Удерживая нажатой клавишу Ctrl кликаем по строке слоя правый 1. Трансформируем изображение (Редактирование-Свободная трансформация Edit-Free Transform, или сочетание клавиш Ctrl+Т), нажимаем на кнопку Сохранить пропорции (Maintain aspect ratio) и меняем масштаб со 100% на 160% .

8. Удерживая нажатой клавишу Ctrl кликаем по строке слоя правый 2. Трансформируем изображение (Редактирование-Свободная трансформация Edit-Free Transform, или сочетание клавиш Ctrl+Т), нажимаем на кнопку Сохранить пропорции (Maintain aspect ratio) и меняем масштаб со 100% на 190% .

9. Удерживая нажатой клавишу Ctrl кликаем по строке слоя левый. Трансформируем изображение (Редактирование-Свободная трансформация Edit-Free Transform, или сочетание клавиш Ctrl+Т), нажимаем на кнопку Сохранить пропорции (Maintain aspect ratio) и меняем масштаб со 100% на 130% .

10. Удерживая нажатой клавишу Ctrl кликаем по строке слоя левый 1. Трансформируем изображение (Редактирование-Свободная трансформация Edit-Free Transform, или сочетание клавиш Ctrl+Т), нажимаем на кнопку Сохранить пропорции (Maintain aspect ratio) и меняем масштаб со 100% на 160% .

11. Удерживая нажатой клавишу Ctrl кликаем по строке слоя левый 2. Трансформируем изображение (Редактирование-Свободная трансформация Edit-Free Transform, или сочетание клавиш Ctrl+Т), нажимаем на кнопку Сохранить пропорции (Maintain aspect ratio) и меняем масштаб со 100% на 190% .

12. Откройте панель анимации в Фотошоп CS3 (Окно-Анимация Window-Animation) или перейдите в ImageReady, при помощи кнопки Редактировать в ImageReady (Jump to ImageReady) (в самом низу панели инструментов), если вы работаете в более ранней версии программы.

13. Скопируйте первый кадр 5 раз, нажимая на кнопку Создание копии выделенных кадров (Duplicates current frame) (должно получиться 6 кадров).



14. Вернемся к первому кадру анимации (кликнем по нему мышью), на панели Слои оставляем видимыми - фоновый слой. (у остальных слоев отключаем видимость (значек глаза с левой стороны от строки слоя)).

15. Во втором кадре оставляем видимыми фоновый слой, слой правый и слой левый.

16. Во третьем кадре оставляем видимыми фоновый слой, слой правый 1 и слой левый 1.

17. В четвертом кадре оставляем видимыми фоновый слой, слой правый 2 и слой левый 2.

18. В пятом кадре оставляем видимыми фоновый слой, слой правый 1 и слой левый 1.

19. В шестом кадре оставляем видимыми фоновый слой, слой правый и слой левый.

20. Оставляем время задержки кадра без изменений, только в четвертом кадре выбираем 0,5 секунды.



Для того, чтобы сохранить созданную gif анимацию в Photoshop CS 3 заходим в меню Файл-Сохранить для ВЭБ (File-Save for WEB) и сохраняем изображение в нужную Вам папку, как рисунок и HTML-код (HTML and images) в формате gif. Если сохраняете из Image Ready, то заходим в меню Файл-Сохранить Оптимизированный как (File-Save Optimized As) и сохраняем изображение как рисунок и HTML-код (HTML and images) в формате gif.

Sheet2006 вне форума   ЦИТИРОВАТЬ
Старый 31.01.2010, 22:31   #38
 
Аватар для Sheet2006
 
Статус: модератор
Регистрация: 20.08.2007
Адрес: Крым
Сообщений: 1,994
СПАСИБО: 1,702
сказали Спасибо 2,175 раз(а) в 972 сообщении
Post как сделать анимированную валентинку

как сделать анимированную валентинку

Если Вам интересно как сделать анимированную валентинку в программе Фотошоп, посмотрите этот урок. Такое сердечко можно сделать не только на день Святого Валентина, но в любой подходящий момент послать любимому человеку по электронной почте, а главное, что эмоций сделанное своими руками анимированное сердечко вызовет больше, чем просто скачанное откуда-то, тем более в процессе работы Вы сможет добавить свои эллементы и надписи, что бы конкретизировать кому предназначена эта валентинка.



1. Создаем новый документ (Файл-Новый File-New) размером 250Х250 пикселов с прозрачным фоном. При помощи инструмента Заливка (Paint Bucket Tool) заливаем изображение черным цветом.

2. Создаем новый слой, нажав на кнопку Создать новый слой (Create a new layer) в нижней части палитры Слои (Laers). Активируем инструмент Кисть (Brush Tool), выбираем мягкую кисть размером 200 пикселей и ставим точку в центре изображения. В нашем примере точка красного цвета, Вы можете выбрать любой другой цвет.



3. Снова создаем новый слой, назовем его Cердце1. Теперь активируем инструмент Произвольная фигура (Custom Shape Tool) и выбираем фигуру Сердце (Heart). Растягиваем контур сердца так как показано на рисунке.





продолжение следует
Sheet2006 вне форума   ЦИТИРОВАТЬ
Старый 31.01.2010, 22:34   #39
 
Аватар для Sheet2006
 
Статус: модератор
Регистрация: 20.08.2007
Адрес: Крым
Сообщений: 1,994
СПАСИБО: 1,702
сказали Спасибо 2,175 раз(а) в 972 сообщении
Post Re: как сделать анимированную валентинку

как сделать анимированную валентинку (продолжение)

4. Выбираем инструмент Кисть (Brush Tool), выбираем кисть с жесткими краями, размером 10 пикселей. Настроим форму отпечатка кисти, для этого применяем команду Окно-Кисти (Window-Brushes) или нажимаем клавишу F5. Появляется окно Кисти (Brushes), выбираем вкладку Форма отпечатка кисти (Brush Tip Shape) и там изменяем значение Интервалы (Spacing) до 190%. Устанавливаем основным белый цвет.



5. Переходим на палитру Контуры (Paths) и нажимаем на кнопку Выполнить обводку контура кистью (Stroke Path with Brush). Вот что у нас должно получиться.





6. Переходим на палитру Стили (Styles) и выбираем стиль Металическая крошка (Crumble Metal), кликаем по нему и этот стиль применится к нашим белым точкам.



продолжение следует
Sheet2006 вне форума   ЦИТИРОВАТЬ
Старый 31.01.2010, 22:38   #40
 
Аватар для Sheet2006
 
Статус: модератор
Регистрация: 20.08.2007
Адрес: Крым
Сообщений: 1,994
СПАСИБО: 1,702
сказали Спасибо 2,175 раз(а) в 972 сообщении
Post Re: как сделать анимированную валентинку

как сделать анимированную валентинку (продолжение)

7. Уменьшим контур сердечка, для этого идем Редактирование-Свободное трансформирование контура (Edit-Free Transform Path) или нажимаем сочетание клавиш Ctrl+T. На панели задач нажимаем на кнопку Сохранять пропорции (Maintain aspect ratio) и устанавливаем ширину 80%, автоматически уменьшится высота.



8. Создаем новый слой Слой-Новый-Слой (Laer-New-Laer), назовем его Cердце2. Переходим на палитру Контуры (Paths) и снова нажимаем на кнопку Выполнить обводку контура кистью (Stroke Path with Brush), а затем применяем стиль Металическая крошка (Crumble Metal).

9. Создаем новый слой, назовем его Cердце3. Еще раз уменьшаем контур сердечка до 80%, так же как делали в пункте 7. Снова производим обводку кистью и применяем стиль Металическая крошка (Crumble Metal). Убираем контур нажав на кнопку Esc

10. Откройте панель анимации в Фотошоп CS3 (Окно-Анимация Window-Animation) или перейдите в ImageReady CS, при помощи кнопки Редактировать в ImageReady (Jump to ImageReady) (внизу панели инструментов), если вы работаете в более ранней версии программы.

11. Скопируйте первый кадр 3 раза, нажимая на кнопку Создание копии выделенных кадров (Duplicates current frame) (должно получиться 4 кадра).



12. Переходим на палитру Слои (Laers). Вернемся к первому кадру анимации (кликнем по нему мышью), на панели Слои оставляем видимыми - фоновый слой, слой с точкой и Сердце1 (у остальных слоев отключаем видимость (значек глаза с левой стороны от строки слоя).

13. Во втором кадре оставляем видимыми фоновый слой, Сердце2 и слой с точкой, снижая Непрозрачность слоя с точкой до 70 процентов.

14. В третьем кадре оставляем видимыми фоновый слой, слой Сердце3 и слой с точкой (меняя его Непрозрачность на 40 процентов).

15. В четвертом кадре оставляем видимыми фоновый слой, слой Сердце2 и слой с точкой, меняя Непрозрачность слоя с точкой до 70 процентов.

16. Задайте время задержки каждого кадра 0,2 секунды.



Нажмите кнопку PLAY посмотрите что получилось.



Для того, чтобы сохранить валентинку в Photoshop CS 3 заходим в меню Файл-Сохранить для ВЭБ (File-Save for WEB) и сохраняем изображение в нужную Вам папку, как рисунок и HTML-код (HTML and images) в формате GIF. Если сохраняете из Image Ready, то заходим в меню Файл-Сохранить Оптимизированный как (File-Save Optimized As) и сохраняем изображение как рисунок и HTML-код (HTML and images) в формате GIF.
Sheet2006 вне форума   ЦИТИРОВАТЬ
Объявление
Нам нужна Ваша поддержка. Сбор средств на оплату дата-центра.
ОТВЕТИТЬ


Здесь присутствуют: 1 (пользователей: 0 , гостей: 1)
 
Опции темы
Опции просмотра

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.
Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Уроки Photoshop TVL Мультимедийные курсы 13 28.08.2013 19:55
iClone v4.12 - программа для создания 3 D анимации ncontrol Работа с 2D- и 3D-изображениями 1 04.12.2010 05:09
Crazytalk6 - программа для 3D анимации лица ncontrol Работа с 2D- и 3D-изображениями 1 04.12.2010 05:08
Искусство 3D-анимации и спецэффектов ncontrol Работа с 2D- и 3D-изображениями 0 02.12.2010 21:18
FAQ по графике и анимации для Web Shmon Веб-дизайн 1 02.03.2009 18:22


Часовой пояс GMT +3, время: 09:03.

Нам нужна Ваша поддержка. Сбор средств на оплату дата-центра.
Яндекс цитирования