Дизайн Мания » Инструменты

Отрисовка изображения в фотошопе с нуля с помощью Pen Tool

Tod — Tue, 27 Jul 2010 10:15:30 +0000

Сегодня в Дизайн Мании гостевой и очень практичный пост от веб-дизайнера Сергей Мишалов, который ведет дизайн блог о своей дизайнерской работе, делится опытом, советами и не только.

Урок на самом деле не сложный и ориентирован на новичков. Пентул (Pen Tool) — подручное средство каждого дизайнера, поэтому рано или поздно вам все равно придется осваивать инструмент. Лучше рано, чем поздно, от малого к большему.

Отрисовка у вас займет примерно 2 часа драгоценного времени, но практика никогда и никому еще не вредила. Целью урока является демонстрация произвольной работы с инструментом “Pen Tool” и дальнейшая обработка созданных форм. Я остановился лишь на “эскизном” варианте, учтите, что всегда можно доводить иллюстрацию до технического предела, не жалейте времени, качество того стоит, главное не переборщить.

Итак, первый этап включает в себя создание примитивных форм, используем исключительно Pen Tool. Буду надеяться, что техника вам уже знакома. Тут не надо торопиться и как можно меньше редактировать точки, чтобы форма в итоге получилась менее “угольной”.

Инструмент той же группы “Convert Point Tool” помогает править форму, зажимаете “Alt” и тяните точки как вам угодно.

1. Создаем общую форму. Наш пример похож на руку или туфлю, если приглядеться. После того как замкнули круг формы, нажимаем правый клик и выбираем “Make selection“

Заливаем поле цветом и двигаемся далее.

2. Снова берем пентул и рисуем крышу машинки или корабля, считайте как хотите. Заливаем светлым цветом и прикрепляем только что сделанную форму к нашей основе, чтобы ничего не торчало.

Далее как видите все слои связанные с формой будем крепить к нашей основе.

3. Далее рисуем вдавленную узкую часть, которая залита темным цветом, а сверху боковину, красим в цвет посветлее.

4.5.6. По тому же принципу делаем форму правой части реактора, нижнюю часть крыла, создавая при этом объем и разделяющую крышу от боковины форму.

Вторым этапом является работа с свето тенью. Свет и тени я рисую мягкой кистью белого и черного цвета соответственно.

7. Рисуем засвет кончика крыла, оперируясь на лево-верхний источник света.

8.9.10. По тому же принципу побелил еще несколько частей.

11. Слегка затенил цвет реакторов, подтер мягкой кистью разделительную форму.

12.13.14. Переходим к теням. Затемняем все той же кистью, только черного цвета заднюю часть и еще нескольких мест, смотрите рисунок.

Следующим этапом являются цвет и детали.

15. Рисуем прозрачной кистью 15-20% прозрачности свечение от реактора, рассеянный свет, а где он необходим, аккуратно подтираем непрозрачным ластиком.

16. Рисуем голубой блик. Я применил инструмент “Polygonal Lasso Tool”

И далее размыл края фильтром “Blur > Gaussian blur”.

17. Рисуем такой же блик, только уже, ярче и четче.

18.-24. По тому же принципу и порядку делаем правый реактор.

25. Рисуем рефлекс, падающий от левого реактора на кончик крыла.

26. Дорисовываем фары со всех сторон, можете их акцентировать цветом.

27. Рисуем индикатор батареи.

28. И значек производителя.

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

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

От лица всех читателей Дизайн Мании также спешку поблагодарить Сергея Мишалова, автора персонального дизайн блог и, как мы видим, хорошего дизайнера по совместительству. Кто бы мог подумать, что из формы больше похоже на обувь получится такой вот летательный аппарат будущего. Как по мне, получилось очень красиво!

P.S. Постовой. Интернет компания Интелсиб предлагает качественное продвижение сайтов в Яндексе по Москве и других регионах.
Новости Обнинска и жизнь города на сайте АЙК Обнинск – социально-информационный портал.
Позаботься о своей красоте ! Лучший spa отель в Ялте. Жемчужина Крыма – гостиница «Ореанда».

Теги: photoshop, дизайнеру, инструменты фотошопа, обучение, полезное, рисование, уроки

Интересные статьи по теме

Где лучше всего искать royalty free изображения и картинки

Tod — Wed, 21 Jul 2010 10:18:00 +0000

Что не говорите, а красивые, яркие и качественные изображения для сайтов – штука незаменимая. Если вы просто ведете персональный или тематический блог, то добавление картинок в статьи весьма положительно сказывается на внешнем виде проекта. То же самое можно сказать и про другие сайты в интернете – наличие иллюстрации всегда приятно влияет на их визуальное восприятие. Также, качественные изображения и картинки могут пригодится в создании дизайна сайта или блога. Но где же их искать? – тут есть несколько вариантов:

Обычный поиск изображения в Google Image Search – картинок реально много, можно найти практически что угодно. В поиске картинок гугла есть некоторые опции, позволяющие отбирать изображения по цвету, размеру, качеству.
Еще одна моя статья бесплатные иллюстрации для блога расскажет где также можно найти картинки кроме поисковиков.
Ну, и последний вариант – купить изображения.

Понятно, что покупка не сильно дешевый выход, зачастую качественные изображения могут стоить достаточно дорого, тем не менее, выход есть, и называется он – royalty free photos. Это такой вид лицензирования изображений, при котором фотография может продаваться неограниченное количество раз. Хотя при этом все права на фото остаются у его автора, что получает за использование фиксированный (неизменяемый в дальнейшем) гонорар. После оплаты вы сможете использовать картинки как и где захотите.

Не смотря на то, что понятие royalty free все же не означает бесплатные изображения, как я думал, в нем есть ряд существенных преимуществ.

Небольшая стоимость картинок, как правило $1-$5.
Простота покупки в фотобанках.
А также возможность использовать фото несколько раз, о чем я уже сказал выше.
Огромнейший выбор во всех крупных фотобанках мира – думаю, миллиона royalty free изображений вам хватит вполне.

К недостаткам royalty free изображений можно отнести не всегда (относительно) высокое качество снимков (для иллюстрации блога фотки с мыльницы будет достаточно), использование изображения другими пользователями (не эксклюзивные фотки). Хотя, думаю, в большинстве случаев достоинства royalty free картинок все же перевешивают.

На одном англоязычном сайте нашел статью про то где можно найти много качественный royalty free фоток. Вам будет интересно знать даже, если вы особо не настроены тратить деньги на картинки (но об этом чуть позже).

Getty Images

Приведу пример как можно обхитрить систему на примере нескольких сайтов. Чаще всего для блога используются небольшие по размерам иллюстрации, компактные изображения около 250 пикселей в ширину и чуть меньше по вертикали.

Итак, вбиваем в поиске gettyimages нужное нам ключевое слово, например, «computers». При наведении на картинки или при клике на них вы увидите защитный «водяной знак», который появляется в верхнем левом углу.

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

Кроме того:

В некоторых сайтах водяной знак на изображении может быть отображен снизу, а картинка при этом быть доступной в разных фотостоках – совместив обе части в фотошопе вы получите полноценное небольшое изображение:)
Иногда при наведении в превью фото не имеет никакой защиты.
Бывает, что при клике на изображении для подробного описания показывают миниатюры до 400-500 пикселей без каких либо водяных знаков (продаже подлежат картинки в полноценном размере).

В общем, все зависит от конкретного фотостока, который сейчас достаточно много. Но, возвращаясь к теме royalty free фоток, предлагаю посетить еще такие сайты.

Jupiter Images

Morgue File

MorgueFile.com

Free Digital Photos

Corbis Images

SXC

Every Stock Photo

Flickr

Stock Vault

Search Creative Commons

Последний сервис позволяет искать нужные вам изображения на нескольких сайта – это и Google, и Flickr и некоторые другие проекты. Причем, насколько я понял, используется механизм поиска выбранных интернет проектов, а также старается находить картинки, что распространяются по свободной лицензии Creative Commons. Хотя разработчики призывают этот факт проверять. В следующий раз расскажу как искать бесплатные фотки без лицензии для своих сайтов.

P.S. Постовой. Если хотите разнообразить свой микроблог, закажите разработку twitter backgrounds у профессионалов.
В блоге SEOшника и финансиста вы узнаете как зарабатывать в сети начинающим без опыта.
Хостинговая компания GigaHost предлагает надежные хостинг в украине – качественно и недорого.

Теги: бесплатные картинки, лицензия, обзор сервисов, поиск изображений, полезное, скачать картинки, фотобанки

Интересные статьи по теме

Подбираем шрифт для сайта с помощью онлайн сервисов

Tod — Mon, 21 Jun 2010 16:50:58 +0000

Это пост будет интересен тем кто в данный момент думает над типографикой сайта. Если разрабатываете какой-то новый проект с нуля или затеяли редизайн, вам могут пригодится два интересных сервиса с которыми я хочу вас познакомить. Первый сервис поможет вам заполнить макет подстановочным текстом (он же «рыба»), второй — определиться с его стилем.

Когда «колдуешь» над новым макетом обычно содержимого еще нет, в то время как оно уже требуется. Требуется потому что без него сложно оценить то что у тебя получается и как будет выглядеть впоследствии. К тому же бывает делаешь не для себя, а для кого-то и этому кому-то хочется посмотреть промежуточные стадии.

У каждого веб-мастера есть на этот случай собственное решение. Кто-то берет куски текста с любого подвернувшегося источника — текстовые файлы, сайты попадающиеся под руку и так далее. Это способ имеет изъян — если вы делаете макет для кого-то, не хорошо когда в качестве подстановочного текста используется ваш «квартальный отчет» или что-то в этом роде.

Гораздо опрятнее будет использовать стандартную «рыбу» вроде «Lorem ipsum», которая не содержит смысла и не отвлекает. В этом и есть ее прелесть и предназначение. Поэтому многие дизайнеры используют для разработки софт, где есть функция заполнения «болваночным» текстом. Или имеет заготовленный вордовский файл-болвану.

Более изящным вариантом может быть использование сервиса Blind Text Generator, который делает тоже самое, но более интересно и разнообразно:

Наверное, кто-то назовет Blind Text Generator сервисом бесполезным, потому что единственная его задача – давать образцы галиматьи и бессмысленности. С другой стороны, как иногда полезно иметь таки образцы под рукой! К тому же он предлагает не только всем надоевший стандартный «Lorem ipsum», но и ряд других вариантов!

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

Гораздо проще выставить в трех колонках те варианты которые вам нравятся (кстати, в качества текста можете использовать «рыбу» с Blind Text Generator) и сравнить их между собой. Причем увидите текст вы сразу во всевозможных написаниях — обычном, полужирном, жирном и так далее:

После того как вы сравните разные шрифты между собой и выберите тот что нужен, я бы на этом не останавливался, а посмотрел как приглянувшийся шрифт будет выглядеть в различных размерах (люди часто увеличивают/уменьшаю шрифт в браузере). После того как вы окончательно определитесь со шрифтом, последней логичной стадией может быть получение CSS кода:

Дальше я думаю вы и без меня знаете что с ним делать. Удачных вам экспериментов!

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

А как вы подбираете шрифты для будущего сайта? Сразу при создании макета в фотошопе?

P.S. Постовой. LTD-Studio – качественная разработка сайта в Киеве.
Советую глянуть курс по заработку на AdSense – и заработать на контекстной рекламы.
Подробная информация про Черновцы и достопримечательности этого города.

Теги: online-сервисы, дизайнеру, создание сайта, типографика, шрифты

Интересные статьи по теме

Подбираем правильное цветовое сочетание для сайта

Tod — Mon, 14 Jun 2010 10:45:33 +0000

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

Благо сейчас (в прогрессивное время) некоторые задачи можно поручить компьютерам, а точнее различным интернет сервисам. В одном из блогов я уже затрагивал эту тему, когда писал обзор Color Scheme Designer онлайн сервиса создания цветовой палитры сайта. Сегодня – что-то вроде продолжения – предлагаю ознакомиться с еще двумя интересными веб разработками, которые помогут профессиональным дизайнерам выбрать грамотную цветовую схему для создаваемых сайтов.

Kuler

Начать сразу стоит с того что является на мой взгляд лучшим, сервис от корпорации Adobe под интересным и весьма необычным названием Kuler.

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

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

Как видите данные по каждому цвету представлен не только в RGB, но и в CMYK, LAB, HSV, что говорит о том что Kuler это не только сервис для вебмастера, он подойдет любому дизайнеру.

Интересные возможности есть и у тех кто хочет создать свою цветовую схему с нуля. Во-первых, вы может «взять» цвета с любой картинки. В веб-дизайне это может быть не та фича которая нужна каждый день, но в традиционной рекламе это штука сверх полезная. Ибо, взятые с картинки цвета и есть идеальное для нее обрамление.

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

В работе с сервисом можно довериться только своему вкусу, можно взять в ассистенты Kuler, который способен буквально все сам сделать за тебя. Вывод напрашивается весьма простой: Kuler – отличный инструмент, рекомендую всем, кто работает в сфере веб-дизайна.

СolorBlender

Будет неправильно не дать вам ссылку хотя бы на одну альтернативу. Вдруг, Kuler чем-то не угодил (хотя недостатки у него найти сложно). В этом случае, профессионал имеет право глядеть в сторону сервиса СolorBlender.

Инструмент более аскетичный, но результата с его помощью можно добиться тоже. Подойдет больше для тех, кто не сильно-то и хочется разбираться во множестве функциональных особенностей разных интернет сервисов. Разобраться с сервисом очень просто, вам достаточно одну минуту покрутить ползунки чтобы все понять. Приятных вам экспериментов!

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

P.S. Постовой. Трудоустройство, вакансии и работа в Казахстане – поиск работы в Казахстане.
В условиях спада экономики внимание привлекают бесплатные игры, многие из которых по красочности не уступают платным.
Популярная доска объявлений Dorus – бесплатные объявления по множеству различных тематик.

Теги: online-сервисы, дизайнеру, обзоры, полезные сайты, создание сайта, цветовая гамма

Интересные статьи по теме

Raven – онлайн редактор векторной графики

Tod — Sun, 25 Apr 2010 16:40:02 +0000

Вы знаете как нарисовать векторный Apple iPad онлайн? Нет? Скорее всего вы даже не догадываетесь что существуют столь мощные онлайн-редакторы векторной графики от Aviary’s – Raven! Онлайн приложения постоянно развиваются, уже сегодня благодаря им можно добиться хорошего результата. Перед тем как перейти непосредственно к обзору этого приложения, хотелось бы заметить, что разработчики Aviary моугт похвастаться не только этим продуктом. На сайте вы можете найти целый набор полезных онлайн сервисов для дизайнеров и графики, о котором я уже как-то писал в одном из своих блогов. Кроме онлайн редактора векторной графики может найти обычный графический редактор, инструменты для создания эффектов, работы с палитрами и скриншотами.

Но вернемся к нашем Raven и Apple iPad – чтобы не быть голословным, приведу пример планшета, нарисованного с помощью Raven:

В принципе, даже сейчас такая иллюстрация – не простая задача для неподготовленного человека, даже если у него под рукой есть CorelDraw или Adobe Illustrator, что уж говорить про веб-приложение? Но, как видите, на данный момент это задача вполне выполнимая. Более того, на сайте Aviary, с помощью простого туториала, вас даже научат как. Но, давайте, все же подробнее остановимся на самом редакторе!

Интерфейc Raven не столь сложен, как у упомянутых выше CorelDraw или Adobe Illustrator, поэтому приложение можно рассматривать даже как полигон для изучения векторной графики:

Конечно, по функционалу до полноценных редакторов векторной графики этому приложению далеко. Но, не стоит забывать что перед нами онлайн-сервис, который, к слову поддерживает даже такие вещи слои и режимы наложения (Blend mode).

Полноценный движок “кривых”. Работа с кривыми, заливками, обводками, объектами и градиентами реализована на достаточно продвинутом уровне (конечно, ни как в CorelDraw или Illustrator, но все же);

Поддержка слоев. Приложение поддерживает слои, группы слоев, маски слоев;

“Импорт” из популярных социальных сервисов. Импорт из Flickr, Picasa и Facebook;

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

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

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

P.S. Постовой. Для всех разработчиков полезным будет список проверки интерфейса веб-сайта.
Интересный сайт для те, кто работает на рынке forex – читаем про форекс от Ikon FX.
Сегодня многих интересует как заработать на файлообменниках. По этому поводу советую почитать интересную статью.

Теги: online-сервисы, векторная графика, графический редактор, дизайнеру, полезное

Интересные статьи по теме

Где скачать favicons? Сервисы с архивами фавикон

Tod — Thu, 15 Apr 2010 20:32:01 +0000

Продолжаем тематику иконок для ваших сайтов и блогов. В прошлой статье я рассказывал как можно сделать favicon с помощью специальных сервисов или графических редакторов. Там же было упомянуто 2 варианта получения таких иконок – либо самостоятельно создание, либо нахождение материалов из всемирной паутины. Ведь не всегда и не везде требуется что-то уникальное. Вполне можно представить себе ситуацию, когда можно не мудрить, а взять где-нибудь уже готовую иконку. Все что в этом случае нужно знать – где же можно скачать favicons?

Одна из наиболее симпатичных мне “библиотек” бесплатных фавиконов называется iconj:

На этом замечательном сайте собрана отличная коллекция. Удобно так же что вы может как скачать фавикон, а так же сразу получить код (если вам не хочется размещать картинку у себя на сервере), который можно ставить к себе на сайт и готово. Кстати, это особенность может очень пригодится тем у кого сайт или блог располагается на одном из бесплатных сервисов, где нет доступа по ftp, но есть возможность редактировать HTML-код. В противном случае, если у вас полноценный хостинг, лучше скачать фавикон и разместить на своем хостинге. Кроме коллекции где можно скачать favicon, сайт обладает набором инструментов для их генерации, конвертации и т.п. Вообще очень полезный и хороший проект создали разработчики.

Не менее внушительная коллекция (на данный момент более 50000 фавиконов), представлена на известном сервисе Favicon.cc, который в первую очередь является отличным инструментом для создания собственных иконок, но, как оказалось, и хорошим местом для поиска готовых решений, где можно скачать favicon для своего сайта или блога:

Так же как и на iconj, на favicon.cc можно как скачать фавикон на компьютер, так и получить готовый код. Да-а, наверное, раз пятый рассказываю о favicon.cc – то в этом блоге, то в Вебдванольных заметках, еще где-то, создатели, видимо, очень старались, когда создавали его:)

Если вы все таки не нашли среди всего этого многообразия вариантов свой (в что вериться с трудом), могу напоследок предложить вашему вниманию сайт Favicon.co.uk, где галерея так же имеет место быть, хотя и не такая представительная, удобная и функциональная как на favicon.cc или iconj:

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

P.S. Постовой. Сегодня вопрос: как заработать в интернете, интересует многих. Один из блогов, где автор пишет интересные статьи про заработок – “Мистерия онлайна”. Советую заглянуть.
Также читаем про сайт сателлит – что это и как на нем заработать.
Закажите услугу кейтеринг от Киев Премьер – приготовление и доставка блюд.

Теги: архивы иконок, иконки для сайта, мини иконки, полезные сайты, скачать иконки

Интересные статьи по теме

Графические редакторы растровой графики онлайн (Часть 2)

Tod — Wed, 07 Apr 2010 18:16:33 +0000

Как вы, наверное, помните, первая часть серии про онлайн редакторы растровой графики, была практически полностью посвящена сервису Photoshop.com. Сервис, в целом не плохой, но, далеко не единственный. У него есть очень достойные соперники, которые в чем-то (а иногда и во многом) его превосходят:

FotoFlexer

Сервис FotoFlexer понравился. Пожалуй, это один из самый функциональный онлайн-редактор которые мне доводилось видеть. В отличие от того же, Photoshop.com, FotoFlexer позволяет и рисовать, и искажать, даже создавать анимацию и работать со слоями!

Для того чтобы получить представление о том что умеет FotoFlexer, предлагаю пробежаться по “закладкам”:

Закладка Basic: Кадрирование, удаление “красных глаз”, копирование выделенной области, трасформация (поворот, отражение по горизонтали вертикали), насторойка цветов/контраста;
Effects: Несколько десятков фильтров, некоторые из них довольно сложные и выглядят достойно даже на фоне стационарного Фотошопа;
Decorate: Содержит инструменты для работы с текстом, инструменты рисования (”карандаш”, “стерку”, “заливку”, “пипетку”), рамки, шаблоны, “стикеры”, инструменты для создания постеров;
Animation: Позволяет добавлять анимированные элементы – звезды, сердечки и пр;
Beautify: Управление резкостью/размытием;
Distort Инструменты искажения;
Layers Позволяет работать со слоями;
Geek Дополнительные инструменты/фильтры.

Выглядит все это приблизительно вот так:

FotoFlexer (как и Photoshop.com) поддерживает работу с социальными сервисами (вроде, Flickr или Picasa), и для полноценной работы требует регистрации. Из недостатков можно отметить лишь, недостаточную стабильность, которая проявляется в некоторых глюках. Приятной особенностью для русскоязычных пользователей также может быть соответствующая локализация интерфейса – дабы все было понятно. В целом инструмент подойдет для каких-то простых действий в виде обработки фотографии, добавления специальных эффектов, так и для более сложных, продвинутых манипуляций, например, работу со слоями, ретуширование и т.п.

SumoPaint

Онлайн-редактор SumoPaint отличает интерфейс схожий с десктопными приложениями:

Как вы заметили, это очень похоже не настоящий Photoshop, и лично меня, впечатляет еще больше чем FotoFlexer. Что ни говори, FotoFlexer (в меньшей степени) и Photoshop.com (в большей) похожи больше на любительские инструменты, со всеми соответствующими атрибутами – рамочки, фенечки, анимированные сердечки и прочей дребеденью. Здесь, впечатление абсолютно иное. Ощущение что ты открыл самый что ни на есть настоящий фотошоп, разве что некоторые пункты меню отсутствуют. По этой причине глупо даже начинать перечислять основные функции, как я это сделал в случае с FotoFlexer – никакого обзора не хватит!

SumoPaint однозначно можно рекомендовать, тем кто ищет онлайн замену Фотошопу. Видит в последнем эталон и к этому эталону стремится. Ложкой дегтя являются лишь отзывы некоторый пользователей, который жалуются на то что иногда возникаю проблемы с загрузкой изображений. Видимо, слабоват сервер. Зато можно насладится всеми прелестями онлайнового софта, когда нет привязки к локальному компьютеру и вашему место нахождению.

Pixlr

Pixlr – это сервис примерно того же калибра и философии, что и SumoPaint. Тот же интерфейс под “true photosop”, вряд-ли заметно уступающий по богатству функционал. Как и SumoPaint не предлагает собственного фото-хостинга, не ориентирован “социально” (в том смысле что не пытается интегрироваться с разными социальными сервисами), зато близок к понятию “настоящее приложение”.

Итоги. Вряд-ли можно было всерьез рассчитывать найти адекватную замену Фотошопу среди онлайн-сервисов. Даже конкурирующим десктопным приложениям это пока не под силу, что уж говорить о веб-технологиях, которые тем более пока не шагнули так далеко. Но, удалось выяснить самое главное – для “домашнего” использования, онлайн-редакторы растровой графики вполне пригодны и способны полностью удовлетворить внушительную армию обычных пользователей из числа непрофессионалов. Кроме того, внутри “вида” обнаружились 2 подвида редакторов:

Более веб2нольные – простые в использовании, имеющие собственный фотохостинг, интегрированные с другими социальными службами, имеющие некоторые “попсовые” функции (например, рамки или клипарты);
Имитирующие настоящее приложение – лишены собственного хостинга, имеют интерфейс “под Фотошоп”, функционально очень насыщенны, но без мишуры.

Лично мене больше по-душе редакторы второго семейства, хотя и первые меня тоже не разочаровали.

А какие еще сервисы из графических онлайн редакторов вы знаете? Как вообще опыт использования подобных приложений?

P.S. Постовой. Интересно почитать о том как создать сайт на WordPress.
Проект Pro Handmade: ручная работа – сделано своими руками.
Хочешь ребенка? Все про беременность и роды в статьях на женском сайте. Статья о признаках беременности.

Теги: online-сервисы, графический редактор, дизайнеру, полезное, полезные программы

Интересные статьи по теме

Онлайн редакторы растровой графики (Часть 1)

Tod — Fri, 02 Apr 2010 19:59:34 +0000

Сегодня настоящим трендом становятся онлайн приложения. Это и набирающая популярность концепция “облачных” вычислений, где “вычисления” (по-крайней мере их часть) выполняются не на собственном компьютере, а на чужом сервере (серверах). Это и просто все увеличивающийся спектр доступных онлайн-сервисов всех мастей на любую нужду и потребность.

Такой подход имеет массу преимуществ. Самые очевидные из них: а) Ваши данные не привязаны к какой-то определенной “машине”, поэтому к ним можно получать доступ откуда угодно. Для этого нужен только компьютер и интернет, что, согласитесь, очень удобно; б) Большинство сервисов бесплатны, поэтому, в некоторых случаях могут являться альтернативой дорогим и напичканным ненужными функциями десктопным приложениям; в) пользователь может получать ряд уникальных возможностей. Например, возможность коллективно работать над документом или доступ к какой-то централизованной базе данных.

Сейчас существуют онлайн-версии практически всех классов и типов приложений, существуют даже онлайн операционные системы! Существуют и редакторы растровой графики, о которых я и предлагаю сегодня поговорить.

Идеалом и промышленным стандартом в сфере растровой графики уже долгие годы является Adobe Photoshop. Это настоящий монстр, которому подвластно практически все. Но, разве всем и каждому нужна подобная мощь? Могу, как человек 10 лет работающий с программой сказать, что даже профессионалы и эксперты повседневно используют, в лучшем случае, лишь 10-20% предлагаемых программой возможностей. Остальной “багаж” просто не относится к вещам “на каждый день”.

Что уж говорить об обычном пользователе? Ему обычно нужны самые элементарные вещи, такие как “пережать” картинку, кадрировать, чуть поправить цвета и т.д. Но, способны ли онлайн-редакторы растровой графики решить хотя бы эти простенькие задачи? Давайте попробуем найти ответ!

Первый сервис с которым мне сразу захотелось познакомиться – Photoshop.com. Мой интерес понятен и легко объясним – этот онлайн-редактор создан компанией Adobe, т.е. от сервиса можно ожидать что он окажется близким по функционалу (на сколько это возможно) к тому самому стационарному эталонному “Фотошопу”, и реализовано это будет, скорее всего, качественно.

И, надо сказать, ощущение качественной вещи создается сразу. И это не иллюзия. Возможно, дело в том что в Adobe знают толк во Flash (все таки, как-никак, родной формат), на котором написан сервис, поэтому сделано все основательно. Чтобы быстро ознакомиться с возможностями Photoshop.com, доступен “Test Drive” (чтобы начать полноценно работать с сервисом необходимо зарегистрироваться, в противном случае, вы имеете возможность только побаловаться с “Test Drive” без возможности сохранения результатов работы и пр):

Первое что бросается в глаза как самое принципиальное отличие от десктопного Photoshop – отсутствие рисования. Зато, сервис хорошо справляется с таким вещами как кадрирование, изменение размеров картинки, автоматическое корректирование цветов и удаление “красных глаз”, настройка резкости или наоборот, размытие, настойка баланса белого, экспозиции, манипуляции с базовыми фильтрами и т.д.

В общем, есть практически все что нужно для рутины, кроме рисования, зачатки которого правда уже начинают определятся. Смотрите меню Decorate (которая пока с ярлыком “бета-версия”), где можно добавить текст, рамку или какие-то предустановленные значки/символы – первый шаг к творческой свободе -):

Кстати, Photoshop.com является еще и сервисом социальным. Т.е. сочетает в себе фотохостинг с социальными фичами (можно просматривать чужие фото, голосовать, комментировать и пр.), возможностью подключения Facebook, Picasa, Flickr, Photobucket.

Подводя итог, отмечу что Photoshop.com вполне пригоден для применения. Он добротно сделан и имеет хорошую родословную. Хотелось бы видеть более богатый функционал, но этого хочется всегда. Те возможности что есть, позволяет решать большинство повседневных задач, а бренд – рассчитывать на то что Photoshop.com будет развиваться и обрастать новыми функциями. Кстати, около 2-х лет назад, в марте 2008 я уже публиковал обзор этого проекта, тогда он назывался Photoshop Express Online – кому интересно, советую также почитать. За это время изменилось не только название, проект в целом заметно похорошел, расширились возможности работы. В следующей статье расскажу про некоторых интересных конкурентов, так что следите за обновлениями.

P.S. Постовой. Обсуждаем разные методы как поднять ТИЦ сайта на популярном форуме.
Kirik отвечает на вопросы относительно поисковой оптимизации – интересное чтиво.
А еще загляните в Блог Тихого Ботанчика.

Теги: photoshop, графический редактор, дизайнеру, обзоры, полезные сайты, фотохостинг

Интересные статьи по теме

Оригинальные и уникальные RSS иконки от RSSicons.pl

Tod — Sun, 14 Mar 2010 17:25:37 +0000

Как иногда приятно иметь более-менее популярные проекты и тем самым представлять интерес для интернет аудитории. С одной стороны, это вызывает некоторые проблемы и необходимость тратить на общение, пояснение, обучение, помощь множество свободного времени, но с другой определенная популярность может сослужить вам добрую службу. Многие блоггеры, особенно начинающие, часто задают себе вопрос о чем же написать в блог, какие темы осветить – возникает так называемая проблема творческого кризиса. У меня такое случалось за 2,5 года в блоггинге не часто, но все ведь может быть.

В последнее время на почту по одному или несколько раз в месяц приходят различные предложения о сотрудничестве по моим блогам. Наиболее активно читатели пишут в «Вебдванольные заметки» – блог про стартапы, куда, как вы уже наверное догадались, присылают запросы по написанию обзора того или иного сайта, либо предоставляют информацию из пресс-релизов и т.п. Короче говоря, дарят дополнительную тему для статьи или даже определенные наброски – с таким подходом никакой кризис не будет страшен:) Сегодня я напишу об одном интересном проекте, который я узнал именно благодаря такой методике.

Итак, встречайте сайт с весьма простым, но очень понятным названием – RSSicons.pl. Команда студии Virtual-ART решила внести разнообразие в стандартные и одинаковые наборы RSS иконок, что являются незаменимым атрибутом любого блога. Я, в принципе, тоже стараюсь по возможности использовать специфические иконки для каждого отдельного проекта, очень хорошо, когда они еще и по тематике как-то совпадают, сразу понимаешь, что автор уделяет внимание каждой мелочи и, как следствие, небезразличен к своему сайту. На сайте RSSicons.pl вы найдете совершенно уникальные RSS иконки, каждая из которых выполняется в 3D.

На данный момент в архиве насчитывается 66 иконок для десятков различных тематик.

На одной странице отображается лишь часть из них, можно пролистать дальше с помощью специальных кнопок, выполненных в стиле того же RSS. Вообще, на сайте есть отдельные «персонажи» или «герои», которые сделаны в виде рсс иконок и перемещаются туда-сюда:) Для некоторых изображений есть реализации с белым и прозрачным фоном. При клике на ту или иную иконку вы сможете посмотреть ее в полноценном размере.

Как видите, все проработано до мельчайших деталей. Там же найдете теги для иконки и похожие по тематике и реализации работы. Теги, кстати, доступны и на отдельной странице, но пока что там, увы, все на польском языке:) Локализация на русский и английский началась недавно, поэтому не на всех страницах есть переводы.

Кстати, сейчас на сайте RSSicons.pl проходит акция. Если вы напишете обзор о проекте в своем блоге, то вам могут нарисовать такую же оригинальную и красивую иконку. Кстати, о рисовании у меня в блоге есть полезная статья по теме – как создать RSS иконку для блога – там с помощью фотошопа можно достичь весьма симпатичных результатов. Это, конечно, если на найдете достойный вариантов в интернете, на сайте RSSicons.pl или других архивах иконок. Вообще ребята делают хорошее дело. Не так много проектов в сети направлены на созидание или чтобы что-то дарить, пусть даже лично разработанную иконку. Если у вас есть желание помочь развитию сервиса и дизайнерские таланы, можете смело связываться с разработчиками – думаю, вы найдете общий язык.

P.S. Постовой. Полезный материал о фрилансе в блоге дизайнера Абакумова Виталия.
Beautiful and charming russian brides for marriage with nice men.
Собираем трафик с социальных сетей для вебмастеров, + список.

Теги: rss, rss иконки, бесплатное, для блога, иконки для блога, полезные сайты, скачать

Интересные статьи по теме

Лучшие бесплатные фотобанки и фотостоки

Tod — Fri, 23 Oct 2009 12:50:37 +0000

Сегодня сложно представить себе работу дизайнера без использования фотобанков и фотостоков. Можно, конечно, ограничится поиском по изображениям от ведущих поисковых систем, например Google Image Search, но выбирать среди большого многообразия различных картинок достаточно сложно. В последнее время, кстати, разработчики немного усовершенствовали движок, добавив фильтр по цвету и типу изображения, но все равно лучше использовать профессиональные проекты, которые созданы специально для дизайнеров, хранящие в своих недрах миллионы материалов для веб-сайтов, графической рекламы, полиграфии и т.п. Раньше стоковые фотографии использовались достаточно часто в газетной индустрии, сейчас же фотобанки и фотостоки стали активно использоваться дизайнерами.

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

Free Range Stock

Для того чтобы скачать бесплатные качественные фотографии с высоким разрешением и различные текстуры вам понадобится зарегистрироваться в этом фотостоке. Это не так сложно, тем более, что взамен получите изображения размером как минимум 2400 x 1600 пикселей, которые могут быть использовании как для личных, так и коммерческих проектов. Для обоев тоже подойдет.

Stock.XCHNG

Stock.XCHNG - один из самых популярных бесплатных фотостоков в сети, содержащий около 400 тыс. изображений хорошего качества. Фотки доступны в 5-ти различных размерах для печати или интернета. Можно отслеживать популярность изображений с помощью статистики просмотров. Кстати, для своих блогов я беру картинки именно здесь.

Every Stock Photo

Every Stock Photo – поисковый движок для изображений из других фотобанков. После регистрации вы получите возможность комментировать, оценивать и присваивать теги различным картинкам. Про него я уже писал в статье где найти бесплатные картинки для блога, очень толковый сервис.

MorgueFile

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

Mayang’s Free Textures

Mayang’s Free Textures – это библиотека различных текстур, которых для бесплатного скачивания на сайте собрано около 3,800 штук. Все в хорошем качестве. Здесь можно найти практически все мыслимые категории текстур – кирпичные стены, листья, воду, рисованные эффекты, ворота, крышу, дорожные знаки и многие другие.

Vintage Pixels

В этом фотобанке вы найдете большое число исторических (винтажных) высококачественных, бесплатных изображений, которыми другие люди не против поделиться с общественностью. Подобный проект лично я вижу впервые, очень хорошая идея – сколько фотостоков различных видел, 90% из них используют одну и ту же модель работы, а тут представлен весьма оригинальный подход. Можно искать изображения по году их создания, например, найти фотки 50-х готов. Пользователи могут использовать изображения для печати, в дизайнах веб-сайтов, точно также как и загружать в базу свои фотографии для ее пополнения.

Photogen

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

Free Stock Photos

Очень простой, но весьма оригинальный фотобанк с категориями Афины, Египет, Израиль, Рим, небо, погода и т.п. Фотки можно использовать для личных или профессиональных коммерческих целей.

ImageBase

Фотобанк ImageBase предлагает для скачивания красивые фото, а также шаблоны PowerPoint в качестве бонуса. Как видите на картинке выше, категорий хоть и не много, но картинок в них хватает, качество высокое.

Kave Wall

Kave Wall – фотосток с бесплатными картинками и текстурами, есть весьма оригинальные категории как, например, дым, электричество, огонь. Такой небольшой персональный проектик, где кое-что можно найти.

Turbo Photo

Пользователи смогут просмотреть и скачать около 2 тыс. бесплатных стоковых изображений.

Free Stock Photography

Бесплатный фотобанк Free Stock Photography предлагает картинки высокого качества, отсортированные в более чем 100 различных категориях – от животных до игрушек.

Freepixels

Бесплатный фото сток Freepixel предлагает изображения для любого использования. Для поиска нужных материалов можете воспользоваться специальной формой или облаком тегов. Более 3 тыс. фотографий, некоторые из которых можно найти на платных сайтах.

Stock Vault

Очень качественный на вид проект, все сделано по высшему разряду. В данном фотобанке вы найдете около 13 тыс. фотографий от более чем 3600 авторов.

FreeFoto

FreeFoto содержит большое число беспланых фотографий – около 100 тысяч в более чем ста категориях. Хватит всем:)

BigFoto

В BigFoto вы найдете достаточно широкий выбор фоток из различных городов и стран всего мира – для этого используйте горизонтальное меню. Здесь вы запросто сможете скачать изображения Сан Франциско, Египта, Германии, есть также Прага, Израиль.

Geek Philosopher

Geek Philosopher предлагает бесплатные стоковые фотографии. Можно искать их по категориям – цветы, еда, природа, животные и другие. Правда взамен автор просит ставить ссылку на его проект, что, конечно, подойдет не всем.

В принципе, этого должно хватить с головой. Спасибо за подборку ребятам из smashingmagazine, в этой статье на их сайте вы также можете посмотреть платные фотобанки и фотостоки, если есть такое желание. Относительно стоимости картинок – вопрос, конечно, спорный. Для тех, кто занимается дизайном регулярно изо дня в день, думаю, можно поискать и в платных сервисах, к тому же, если оплачивать это будет веб-студия, в которой вы работаете. С другой стороны бесплатных фотобанков сейчас ну очень много и при наличии свободного времени можно поискать нужные изображения в разных проектах. Кстати на фотостоках есть шанс и заработать, если вы профессиональный фотограф.

Теги: дизайнеру, материалы, полезные сайты, текстуры, фотобанки