Блог: статьи

Правильный экспорт макетов дизайна из AI в PSD: часть 2 — полезные советы

Алексей Голованов, 31 мая 2011 Комментарии (4)

Adobe Illustrator Мастер-класс

Правильный экспорт макетов дизайна из AI в PSD: часть 2

Совсем недавно Егор Гилев опубликовал свою статью «Правильный экспорт макетов дизайна из AI в PSD», в которой рассказал о трех шагах, следуя которым перевод AI-файла в PSD несет меньше всего проблем, и на выходе получается картинка, в точности совпадающая с ее векторным исходником.

Мне бы хотелось немного углубиться в данную тему и рассказать о некоторых полезных приемах в работе с Иллюстратором при экспорте, позволяющих существенно сэкономить время (которого как всегда не хватает), нервы (которые, к сожалению, не восстанавливаются) и превратить этот процесс практически в удовольствие. Итак:

Читать далее →

Как мы рисовали персонажа для компании «Синдбад»

Евгения Родина, 23 мая 2011 Комментарии (11)

Мастер-класс Проекты

Персонаж для компании Синдбад

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

Читать далее →

Правильный экспорт макетов дизайна из AI в PSD

Егор Гилёв, 5 мая 2011 Комментарии (25)

Adobe Illustrator Мастер-класс

Экспорт макетов дизайна из AI в PSD

В наше время всё чаще можно встретить дизайнеров интерфейсов, которые отказались от использования старого доброго Adobe Photoshop в пользу векторных инструментов. Иными словами, в пользу Adobe Illustrator. Преимущества очевидны: работая с векторным исходником, мы можем лучше контролировать весь процесс, чем работая с растровой картинкой (пусть даже она разделена на слои). В векторном редакторе нарисованный круг остается нарисованным кругом, а в фотошопе — это просто множество закрашенных пикселей. Наконец, в векторном редакторе намного проще делать варианты для экранов с разной плотностью точек (привет, Retina Display!).

Читать далее →

Как мы придумывали и рисовали талисман Фестиваля 404

Евгения Родина, 26 августа 2010 Комментарии (15)

Adobe Illustrator Adobe Photoshop Мастер-класс

Талисман для фестиваля 404 в Самаре

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

Читать далее →

История одной иллюстрации: ошибка 404 для Iconfinder

Денис Кортунов, 13 июля 2010 Комментарии (3)

Мастер-класс

На каждом сайте есть страница ошибки 404. Она нужна, чтобы намекнуть посетителю, что он попал куда-то не туда. Пугать и расстраивать посетителя излишне тревожной страницей не стоит, но мессадж должен быть ясен всем. Некоторое время назад мы придумали персонажа для иконочного поисковика Iconfinder, настало время сделать иллюстрацию для страницы 404.

Читать далее →

Как нарисовать объемного персонажа из плоского логотипа

Евгения Родина, 7 декабря 2009 Комментарии (21)

Adobe Photoshop Мастер-класс

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

Читать далее →

7 приемчиков для твиттера вашей компании

Дмитрий Жуков, 26 ноября 2009 Комментарии (12)

Маркетинг Мастер-класс


Твиттер @turbomilk один из самых популярных корпоративных твиттеров России (почти полторы тысячи фоловеров). Пароли от нашего твиттера есть у каждого работника. Правда, пишут всего несколько человек, но так получилось, что большую часть записываю именно я. Более чем за год наблюдений и опытов на людях у меня набралось некоторое количество немудреных приёмчиков, как сделать твиттер интереснее и популярнее.

Читать далее →

Честные и благородные способы сделать так, чтобы в интернете вас любили и уважали (не seo)

Денис Кортунов, 12 ноября 2009 Комментарии (3)

Маркетинг Мастер-класс Турбомилк

Муха, слон

Не так давно в Самаре прошла конференция веб-разработчиков 404 на которой я делал доклад о секретах продвижения Турбомилка в интернете. Скромность — это модно, но не практично. Мало сделать что-то крутое, про это нужно интересно рассказать, причем, нужным людям.

Читать далее →

Как рисовать перекрашиваемые иконки

Денис Кортунов, 18 июня 2009 Комментарии (4)

Adobe Illustrator Дизайн иконок Мастер-класс

Как рисовать перекрашиваемые иконки Что такое перекрашиваемая иконка? Это такая картинка, которой легко поменять цвет, то есть её перекрасить. Есть несколько способов этого добиться. Я расскажу о простой технологии, которую мы использовали когда делали проект Иконза. По сути, это веб-приложение, которое позволяет пользователю менять цвет иконок, а потом генерирует необходимые графические файлы.

Читать далее →

Зачем нужны иконки

Егор Гилёв, 6 ноября 2008 Комментарии (10)

Дизайн иконок Мастер-класс Основы Юзабилити

Зачем нужны иконки Вы не поверите, но в 85-м году компания Apple в своем руководстве для разработчиков прямо призывала всегда, когда это возможно, стараться заменять надписи пиктограммами. Якобы пиктограммы понятнее начинающему пользователю, чем слова. Конечно, это полная чепуха. Словами намного проще высказать почти любую идею.

Читать далее →

Как нарисовать иконку. Минимизация

Олеся Козлова, 25 июня 2008 Комментарии (4)

Adobe Illustrator Дизайн иконок Мастер-класс

Итак, приготовьте лупы, мы продолжаем! После долгих и жарких споров (не волнуйтесь, до применения бластеров не дошло) у нас есть 3 утвержденные иконки размером 64×64.

Читать далее →

Как нарисовать иконку. Создание и уничтожение Земли

Евгений Арцебасов, 26 июля 2007 Комментарии (23)

Adobe Illustrator Дизайн иконок Мастер-класс

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

Поэтому мы решили нарисовать иконку порабощения Земли в первую очередь, пока Захватчики не попереломали свои летающие тарелки.

Читать далее →

Как нарисовать иконку. Наброски и метафоры

Дмитрий Жуков, 5 июля 2007 Комментарии (18)

Дизайн иконок Мастер-класс Основы

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

Читать далее →

Конструирование языка пиктограмм пользовательского интерфейса

Егор Гилёв, 21 июня 2007 Комментарии (12)

Дизайн иконок Мастер-класс Основы Юзабилити

Прошлой осенью мне довелось выступать с небольшим докладом на конференции, организованной RusCHI и 1С в рамках празднования Всемирного дня юзабилити. Я говорил о конструировании языка пиктограмм пользовательского интерфейса. Руководствуясь принципом «лучше поздно, чем никогда», я предлагаю вашему вниманию тот же самый рассказ в виде текста с иллюстрациями.

Читать далее →

Конический градиент в Adobe Illustrator. Часть III. Хэпи Енд

Дмитрий Жуков, 28 марта 2007 Комментарии (12)

Adobe Illustrator Мастер-класс

Cone Gradient in Adobe IllustratorВ нашем любимом Illustrator’е все-таки можно сделать нормальный конический градиент. Методика это была найдена в виде файла konischer-verlauf.zip с описанием на немецком языке. Уверен, многие из вас уже скачали и досконально изучили его. Настоящая заметка целиком посвящена содержанию этого файла, но на русском языке, а также с уточнением ряда моментов.

Читать далее →

«Обрезание» — праздник детства

Дмитрий Жуков, 15 марта 2007 Комментарии (6)

Adobe Photoshop Дизайн иконок Мастер-класс

Вспомним операционные системы прошлого века — куча Windows до 2000, Mac OS до 9-ой версии. Все они поддерживали только однобитную прозрачность для иконок. К счастью, прогресс не стоит на месте — современные операционные системы используют уже восьмибитную прозрачность. Однако ради обратной совместимости Microsoft рекомендовала включать в состав иконкок для Windows XP варианты картинок и с однобитной прозрачностью. Со временем возня со сведением современной восьмибитной прозрачности к однобитной обрела в среде дизайнеров-иконочников романтическое название — обрезание краев. Именно об этой возне пойдет сегодня речь…

Читать далее →

Конический градиент в Adobe Illustrator. Часть II. Истина где-то рядом

Дмитрий Жуков, 26 апреля 2006 Комментарии (14)

Adobe Illustrator Мастер-класс

На прошлой неделе я обещал вам рассказать, как правильно нарисовать конический градиент в Adobe Illustrator. За свои слова принято отвечать. Так что делать нечего, придется открыть и этот секрет на примере всё того же компакт-диска.

Для начала устроим зарядку для мозгов. Я дам пару маленьких подсказок, а вы попытаетесь сделать конический градиент своими силами. Если получится, заметку можете не читать — сэкономите время. Итак, подсказки:

  1. Линейный градиент
  2. Effects → Warp → …

Ну как, что-нибудь получается? Не очень?

Читать далее →

Конический градиент в Adobe Illustrator. Часть I. Ложный след

Дмитрий Жуков, 18 апреля 2006 Комментарии (18)

Adobe Illustrator Мастер-класс

Angel (cone) gradient in Adobe PhotoshopОднажды беседовали мы о разных возможностях, а также плюсах и минусах векторных редакторов, и Егорчик так с грустью взял и сказал: «а хорошо было бы иметь под рукой конический градиент, как в Corel Draw». На что я интеллигентно так спросил: «ах, зачем он тебе нужен, этот конический градиент?». Долгие годы меня вообще мучил вопрос, зачем вообще может кому-то понадобится эдакая пошлость, как конический градиент. На что Егор так мечтательно ответил: «компакт-диски рисовать очень удобно!».

В силу профессиональной специфики, нам приходится рисовать широкий спектр предметов из повседневной жизни, в том числе и cd. Действительно, создание иконки компакт диска — каждый раз весьма мучительный процесс. Как бы было здорово, взять две окружности вырезать одну из самого центра другой и залить полученный объект коническим градиентом. Звучит заманчиво.

Но все знают, что в Adobe Illustrator возможности рисовать эти конические градиенты нет. Так как же нам нарисовать компакт-диск в Adobe Illustrator? Ну что же, мой любимый внимательный читатель, я надеюсь, ты готов! В качестве подготовки сперва рекомендую прочитать мою заметку «Кристально чистый вектор». Кстати, не забудьте включить Scale Strokes & Effects. Больше напоминать я не буду.

Читать далее →

Бутылка — не бутылка

Дмитрий Жуков, 31 марта 2006 Комментарии (15)

Мастер-класс

19-ти литровая бутылкаУ нас коллектив небольшой. Часто случается, что рано утром или поздно вечером оказываешься в офисе один. Работать невозможно, грусть и тоска сбивают все рабочее настроение. Сейчас мы раз и навсегда избавимся от этой проблемы. Смастерим себе нового коллегу, не знающего голода и усталости.

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

Читать далее →

Кристально чистый вектор

Дмитрий Жуков, 6 марта 2006 Комментарии (33)

Adobe Illustrator Мастер-класс

Наверняка многие из вас активно используют растровые эффекты Blur и Feather, чтобы делать красивые блики и тени. Всё бы хорошо, но, чтобы растрировать такую картинку в большом разрешении, надо или сразу задавать большое разрешение растровых эффектов, или увеличивать саму картинку в Illustrator’e. Описанные ниже нехитрые приемы помогут вам избежать всей этой возни и создавать современные, красивые и легко масштабируемые иконки, да и не только иконки, не используя растровые эффекты.

Читать далее →

1 2 Предыдущие »

Последние комментарии