Строение
Уроки фотошоп!
Тема в разделе "Веб-Дизайн", создана пользователем Dan, 29 дек 2009.
  1. Dan

    Dan Новичок

    Сообщения:
    459
    Симпатии:
    98
    Баллы:
    0
    Программа фотошоп это основной инструмент web-дизайнера, поэтому решил создать тему в которой делиться своими интересными работами и уроками по их созданию. Только не копирование уроков с других форумов, т.к. их в и-нете достаточно много, а именно своих!
    А так же обсуждать все вопросы по работе этой программы.

    Вот моя работа, инструкция и видео по созданию:



    1. создаем новый файл размером, допустим 640х320
    2. заливаем фоновый слой каким нибудь градиентом
    3. создаем надпись
    4. делаем растеризацию текстового слоя
    5. выделяем надпись и копируем в буфер
    6. создаем 2 копии текстового слоя слоя
    7. теперь открываем 3 файла с блестяшками
    8. берем первый файл и делаем из него паттерн
    9. тоже самое делаем со вторым и третьим
    10. закрываем, они нам больше не нужны
    11. переходим на первый слой и выделяем надпись
    12. выделяем первый паттерн и заполняем им надпись
    13. затем переходим на второй слой, выделяем второй паттерн и заполняем надпись
    14. то же самое делаем с третим слоем
    15. сохраняем файл в PSD-формате

    16. переходим в Image Ready и открываем там созданный файл
    17. создаем на панели анимации 2 дополнительных кадра
    18. в каждом кадре показываем отдельный слой по очереди
    19. сохраняем в GIF-файл с помощью Save Optimized
    20. Анимация готова!!! :)

    Файлы с блестяшками:
    Посмотреть вложение 1592
    Посмотреть вложение 1593
    Посмотреть вложение 1594

    Видеозапись по этому уроку

    P.S. Видео кривоватое, первый раз сделал, так что сильно не пинайте!
     
    Последнее редактирование модератором: 29 дек 2009
    15 пользователям это понравилось.
  2. Finn

    Finn Новичок

    Сообщения:
    983
    Симпатии:
    275
    Баллы:
    0
    аее спасибо :) а можно как то в подобном стиле по баннерам урок?
     
  3. VEK

    VEK Новичок

    Сообщения:
    74
    Симпатии:
    23
    Баллы:
    0
    спасибо за урок, но я например не люблю такиекартинки и заголовки.

    меня они лично отпугивают от интернет ресурсов, хотя и красивые .
     
  4. Dan

    Dan Новичок

    Сообщения:
    459
    Симпатии:
    98
    Баллы:
    0
    Вот побаловался, если интересно, то сделаю инструкцию!

     
    6 пользователям это понравилось.
  5. VEK

    VEK Новичок

    Сообщения:
    74
    Симпатии:
    23
    Баллы:
    0
    а на это и я с удовольствием взгляну :D
     
  6. rez

    rez Administrator

    Сообщения:
    978
    Симпатии:
    647
    Баллы:
    113
    Спасибо выставляем посредством кнопки. Эмоции вместе с флудом в теме прекращаем, иначе буду штрафовать: мало не покажется!
     
  7. Finn

    Finn Новичок

    Сообщения:
    983
    Симпатии:
    275
    Баллы:
    0
    даже очень интересно
     
  8. rez

    rez Administrator

    Сообщения:
    978
    Симпатии:
    647
    Баллы:
    113
    Finn, Я только сообщением выше предупреждала о последствиях флуда. Есть что написать по существу, есть дельные вопросы, пожалуйста. Нет -- проходим мимо!
     
  9. Sherri

    Sherri Новичок

    Сообщения:
    1.061
    Симпатии:
    2.465
    Баллы:
    0
    Dan, если не трудно, выложи, пожалуйста, ссылки на файлы с "Блестяшками". Потому что из твоего видеоурока я не могу их извлечь. Или подскажи адреса сайтов, где, можно их найти.
     
  10. Dan

    Dan Новичок

    Сообщения:
    459
    Симпатии:
    98
    Баллы:
    0
    Они в первом посте! Наводишь на них по очереди мышку, нажимаешь правую кнопочку и выбираешь: "сохранить рисунок как..." :)

    Архив можно скачать ТУТ

    А вообще в и-нете их навалом, называются они глиттеры!
     
    4 пользователям это понравилось.
  11. Sherri

    Sherri Новичок

    Сообщения:
    1.061
    Симпатии:
    2.465
    Баллы:
    0

    Dan , 16 и 17 пункт. После того, как переходишь Image Ready и отрываешь там файл должна появлятся панель с анимацией. У меня она не появляется( Что делать, чтобы она появилась?
     
    Последнее редактирование модератором: 6 янв 2010
  12. sweih

    sweih Новичок

    Сообщения:
    493
    Симпатии:
    272
    Баллы:
    0
    нада его включить.
    Заходишь во вкладку
    window -> animation (окно -> анимация)

    ЗЫ В новых версиях Фотошоп никакого Image Ready нету, все в одном окне.
     
    4 пользователям это понравилось.
  13. TiamatInc

    TiamatInc Moderator

    Сообщения:
    4.707
    Симпатии:
    1.221
    Баллы:
    0
    Если я не ошибаюсь это справедливо только для CS3.
     
  14. Sherri

    Sherri Новичок

    Сообщения:
    1.061
    Симпатии:
    2.465
    Баллы:
    0
    Dan , спасибо за видеоурок! Он очень удачный. Ты всё очень подробно и понятно изложил. Ждём следующего видеоурока!



    У меня в процессе этого урока возник вопрос. Обязательно ли использовать 3 файла с "блёстками"? Почему, например, не 2 или 4, а именно 3? Это принципиально важно, чтобы было именно 3? Влияет ли число используемых файлов с "блёстками" на конечный результат? Может быть от того, чем больше используется этих файлов, тем выразительнее потом будет "Эффект блеска"?
     
  15. Dan

    Dan Новичок

    Сообщения:
    459
    Симпатии:
    98
    Баллы:
    0
    Sherri, Именно так! Чем больше будет кадров, тем выразительнее потом будет "Эффект блеска", но в принципе достаточно и двух-трёх!
    3-4 - это оптимальный вариант.
    А накладывать их можно не только на текст, но и на любую часть изображения! :)
     
  16. Sherri

    Sherri Новичок

    Сообщения:
    1.061
    Симпатии:
    2.465
    Баллы:
    0
    Dan, может быть ты подготовишь в следующий раз видеоурок, как раз о том, как накладывать "блёстки" на изображения? И объяснишь, как можно менять цвет этих "блёсток"? Например, если я хочу, чтобы надпись была не синяя, а красная или чёрная. Есть такая функкция в фотошопе, которая изменяла бы цвет этих "блёсток"?
     
  17. byStep

    byStep Новичок

    Сообщения:
    134
    Симпатии:
    458
    Баллы:
    0
    Sherri, а ты блестки определяй как кисть так с ними проще работать будет какой цвет захочешь тем и рисуй.

    P.S. Про кисти: редактирование / определить кисть
     
    4 пользователям это понравилось.
  18. sweih

    sweih Новичок

    Сообщения:
    493
    Симпатии:
    272
    Баллы:
    0
    Проще всего откорректировать оттенок у блесток (цвет).Нада нажать: Ctrl+U
    или

    В окошке инструмента не забыть поставить галку напротив Colorize !!!, и движками изменить цвет.

    ЗЫ Блестки не такой и шедевр, можно нарисовать самостоятельно. Для быстроты лучше создать кисть, как предложил byStep. Ну и настроить ее соответственно. (что бы одним кликом кучу блесток высыпала)
     
    4 пользователям это понравилось.
  19. Sherri

    Sherri Новичок

    Сообщения:
    1.061
    Симпатии:
    2.465
    Баллы:
    0
    byStep, sweih, большое спасибо за ваши советы.
    byStep, правда, твой совет мне не совсем ясен. Может быть для того, кто хорошо во всём этом разбирается, всё это будет понятно, но для меня твоя фраза "блестки определяй как кисть " мне ни о чём не говорит.
    sweih, а у Вас я хотела бы уточнить, на каком этапе надо осуществлять те действия, что Вы советуете сделать? Или их надо уже делать с готовой картинкой. Я попробовала изменить цвет блёсток, использовав уже готовую картинку, но, во-первых, вместе со цветом блёсток у меня изменился и цвет фона, а , во-вторых, после этих манипуляций исчезла анимация(
    Вот что у меня получилось:
     
  20. sweih

    sweih Новичок

    Сообщения:
    493
    Симпатии:
    272
    Баллы:
    0
    Правильно. Инструменты в фотошоп применяются, либо к определенному слою (целиком), либо к выделению.
    Т.е... у нас 4 слоя - 1 с фоном, и 3 с надписью. На надписях разные блестяшки! Вот на этих слоях с надписью нужно поменять цвет.. до "делания" анимации.
    (В CS3, вроде как можно выделить несколько слоев сразу!, что упрощает задачу.. в CS2, к сожалению нет.)
    На самом деле можно использовать один файл с блестяшками, а при "деланье " анимации слой с ними смещать на разных кадрах. Т.е нужно всего 2 слоя.. 1 с блестяшками, а 2-й - фон, в котором дырка-надпись :)
    Можно любое самой нарисованное изображение вбить, что это будет, твоя персональная кисть! (Правка -> Определить шаблон кисти)
    Потом можно ее настроить что бы изображение рисовалось определенным образом (в стандартном наборе, посмотри кисть - клиновый лист)
     
    Последнее редактирование модератором: 8 янв 2010
    4 пользователям это понравилось.
Показать ещё