Метка: аватарка

Как сделать баннер

Как отредактировать анимированную картинку (аватарку, баннер, смайлик)

3

Чаще всего непрофессиональные дизайнеры сталкиваются с проблемой редактирования анимации в формате gif. Это самый старый, довольно простой и очень популярный формат для создания движущихся картинок. Есть, конечно, и другие виды анимации: flash, silverlight, анимация с помощью css или javascript т.п., но эти темы мы оставим пока на будущее.

Анимированные аватарки, смайлики – это почти всегда формат gif. Чтобы отличить анимацию gif от flash, нужно кликнуть правой кнопкой мыши по этой анимации. Если в последней строчке написано что-то про Adobe Flash Player, значит, это флэш-анимация:

Как отличить flash от gif

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

(далее…)

Уроки Photoshop

Делаем закругленные углы картинок в Фотошопе

34

На некоторых сайтах, в дизайне которых нет острых углов, иллюстрации в статьях и новостях также имеют закругленные края. Очень часто веб-дизайнеры не задумываются над тем, что делать такие иллюстрации с закругленными углами владельцу сайта будет сложно, у него не обязательно есть нужные знания Photoshop. Впрочем, заказчик сайта сам виноват. Требуя, чтобы все было красиво, он часто не задумывается над тем, как он потом будет добавлять изображения с заокругленными краями в статьи и новости на своем сайте.

В этом уроке Photoshop мы увидим как просто закруглить углы рисунка на примере аватарки, не ограничиваясь добавлением простой рамки толщиной в 1px:

 

Обычная фэнтезийная аватарка Аватарка с закругленными углами

 

Когда мне впервые было нужно закруглить углы в иллюстрации для сайта, ответ для меня был неочевиден. Я погуглил и наткнулся на пару переводных инструкций, которые были слишком заумными для новичка – мучиться с каналами, путями, размытием, направляющими и прочими инструментами для продвинутых пользователей Photoshop даже профессионалу лень, а для новичка такой процесс может показаться непонятным и нудным. Немного подумав, я нашел свой способ как быстро и просто закруглить края нужного мне рисунка.

(далее…)

Аватарки

27 рисованных аватарок 120х120 на тему: гороскоп, знаки зодиака, астрология

3

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

Аватарки знаков зодиака 120 на 120 пикселей Аватарки знаков зодиака Овен Аватарки знаков зодиака Овен Аватарки знаков зодиака Телец
Аватарки знаков зодиака Телец Аватарки знаков зодиака Телец Аватарки знаков зодиака Близнецы Аватарки знаков зодиака Близнецы
Аватарки знаков зодиака Рак Аватарки знаков зодиака Лев Аватарки знаков зодиака Лев
Аватарки знаков зодиака Скорпион Аватарки знаков зодиака Скорпион Аватарки знаков зодиака Стрелец Аватарки знаков зодиака Стрелец
Аватарки знаков зодиака Стрелец Аватарки знаков зодиака Козерог Аватарки знаков зодиака Козерог

(далее…)

Уроки Photoshop

Как сделать мигающую аватарку или баннер в Фотошопе

4

В этом уроке для новичков будет подробно и в картинках рассказано, как сделать вот такую вот мигающую женскую аватарку с помощью программы Photoshop:

Пример женской мигающей аватарки 120x120

Сделать мигающую аватарку несложно. Для этого нам достаточно будет программы Adobe Photoshop CS3 (Adobe Photoshop CS2 и Adobe Photoshop CS4 тоже подойдут). Кроме возможности редактировать отдельные кадры нашей анимированной аватарки Фотошоп дает возможность создания самой анимации, т.е. нам достаточно будет одной этой программы.

Если вам не очень удобно делать анимацию в Photoshop, можно воспользоваться им для подготовки кадров аватарки или баннера, а саму анимацию сделать в другой программе. Наиболее популярная программа, которая позволяет делать анимированные картинки — Ulead GIF Animator 5. Я подробно описывал работу с ней в статье Как сделать анимированный GIF баннер. Лично я gif-анимацию всегда делаю в Ulead GIF Animator 5, а Photoshop использую только для подготовки кадров баннера или аватарки – привычка :).

(далее…)

Подробные инструкции / Уроки Photoshop

Как вырезать часть картинки с помощью Photoshop

13

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

В Фотошопе, помимо обычного уменьшения размеров изображения, можно уменьшать картинку, оставив за пределами видимости ненужный фон. Такое уменьшение называется уменьшение холста (Canvas Size), т.е. уменьшается холст, а картинка при этом остается прежнего размера. Естественно, можно уменьшить сначала холст, а затем и саму картинку, чем мы сейчас и займемся.

Как вырезать кусок картинки в Фотошопе. Подробная инструкция с иллюстрациями

1. Допустим, у нас есть большая картинка 500х460 пикселей, из которой нам нужен только кусочек 120х100 пикселей:

Исходное изображение, из которого будем вырезать фрагмент в этом уроке

Нажимаем на клавиатуре Ctrl+A, чтобы выделить весь рисунок, затем жмем Ctrl+C, чтобы его скопировать, Ctrl+N, чтобы открыть пустое пока окно дня обрабатываемого рисунка и вставим в него наш рисунок, нажав Ctrl+V. Все эти процедуры нужны, чтобы разблокировать единственный слой картинки для перетаскивания и одновременно оставить неиспорченную копию рисунка.

(далее…)