Блог: статьи
Как нарисовать хорошую иконку для Google
Не так давно мы ругали новую иконку сайта Google с буквой g и называли её плохой. Но ругать чужое — не сложно! А какая иконка была бы хорошей? Мы решили ответить на этот вопрос: взяли четырех дизайнеров и заставили их нарисовать хорошую favicon для Google. Такой подход у нас называется — работа по схеме «долбаный креативный бутик». В итоге получились увлекательные истории, которые описывают четыре разных решения этой задачи.
История от Дениса Кортунова
Вообще, я искренне считаю, что Google нужен какой-то символ. Чтобы он был простой и классный. Понятное дело, что напрямую связанных метафор нет, поэтому символ, скорее всего, будет надуманный. Сначала он никому не понравится, но потом все привыкнут и успокоятся.
Но я проявил слабость — отказался от своей идеи с символом и решил положить в основу иконки нынешний фирменный стиль Google. Что у нас есть? Шесть букв, написанных шрифтом Catull. Буквы G и О встречаются по два раза. Из двух букв O, как вы сами понимаете, ничего хорошего получиться не может. Будем работать с заглавной G — она проста и красива.
Плюс, у нас есть четыре цвета, в которые раскрашены буквы логотипа. Синий и красный встречаются по два раза.
Что мы возьмем для нашей будущей favicon? Основой будет заглавная буква G, также хорошо бы использовать фирменные цвета: минимум два, но лучше все четыре. Шрифт использовать не будем — мне он не очень нравится, да и в мелком иконочном размере его будет сложно различить.
За основу иконки я хотел взять что-нибудь простое. Например, круг. Или несколько цветных кругов. Вот что у меня сначала получилось:
Вроде бы все клево: три фирменных цвета, круги открытые, с помощью буйной фантазии можно увидеть литеру G, ну и есть ассоциация с мишенью. Но в размере 16х16 начались проблемы — иконка получилась некрасивая. Я продолжил поиски.
Теперь есть все четыре цвета и литеру G видно более явно. Наведем немного блеска:
А вот новая favicon в деле:
История от Егора Гилёва
Поскольку тема букв была блестяще (в прямом и переносном смысле) раскрыта Денисом, я решил предложить еще более абстрактный символ. Например, шарик. Что может быть проще шарика? К тому же, разнообразные шары давно используются в логотипах разных продуктов Google:
Шарик можно понимать как земной шар, или как мячик. Он как бы говорит нам: «поиграй со мной», что вполне подходит к образу Google как компании молодой, веселой и часто избегающей общепринятых корпоративных правил.
Глядя на логотип Google, нарисуем мячик, раскрашенный в 4 цвета:
Придадим мячику объем (не увлекаясь сложностью — ведь нам нужна иконка размером 16×16):
Добавим еще немножко бликов и теней, и — вуаля — вот такая получилась иконка:
История от Валерия Намазова
Ни для кого не секрет, что Google давно перестал быть только поисковой системой. Это настоящий микс различных технологий и сервисов. Вывод: смешаем фирменные цвета компании в ТурбоБлендере!
Далее мы открываем Википедию и узнаем, что название компании происходит от слова гугол — число, в десятичной системе исчисления изображаемое единицей со 100 нулями. Понятно, что у нас нет другого пути, кроме как сделать фавиконку круглой и с дыркой.
Уменьшаем до размера 16×16:
А вот так она выглядит в браузере:
История от Дмитрия Жукова
Как ни крути, лучше гугла не найти! А все почему? Потому, что у гугла отличный поиск, и только потом прицепом все остальные сервисы.
Та-а-а-ак, а что есть поиск? Поиск — это прежде все результаты. Вот я уже почти все и выболтал, теперь вы точно сможете украсть мою великолепную идею. Ну если кто еще не понял, прилагаю иллюстрацию.
Вот их и возьмем в оборот. Остается только взглянуть, что получилось.
Иконка отдаленно напоминает символ бесконечности, что в случае с Гуглом тоже совершенно не лишнее.
Категории
- Adobe Illustrator (15)
- Adobe Photoshop (4)
- Basecamp (3)
- iPhone (2)
- Будущее (4)
- Визуальный стиль (4)
- Десктоп (2)
- Дизайн иконок (25)
- Инструментарий (14)
- Книги (3)
- Критика (6)
- Маркетинг (2)
- Мастер-класс (22)
- Обзоры (13)
- Организация работы (4)
- Основы (9)
- Проекты (11)
- Скринкасты (7)
- Турбомилк (3)
- Юзабилити (7)
- Юмор (1)
Комментарии
понравился вариант Валерия)
Ответить polly, 17 июня 2008
тоже за вариант Валерия проголосую, хотя больше к месту будет вариант Дениса, имхо:)
Ответить larinman, 17 июня 2008
Денис прав. Гугл начинается с «G» а не с «oo». Другими словами: сначала в точку джи, а потом О! :)
Мячик не в тему. Поиск для многих – это спасение. Бывает, что непросто найти нужные материалы. Гугл – это инструмент: пассатижи, молоток, что угодно, но не мяч. Респект вам.
Ответить Виктор, 17 июня 2008
Вариант Дениса самый подходящий, но остальные тоже неплохо получились. Вы здорово поработали.
Ответить Илья, 17 июня 2008
Мне тоже понравилась иконка Дениса. А что если её ещё и «сплюснуть» немного по ширине? А то она немного смахивает на букву «O».
Ответить MaxD, 17 июня 2008
Вариант Дениса напоминает мне боевую раскраску логотипа MS Office. Думаю, Гуглу бы это не понравилось :)
Ответить Алексей, 17 июня 2008
у Дмитрия Жукова лучше всего получилось – тк первое отдаёт тем что из старого логотипа виндоус/офис вырезали G, кольцо это пикаса, шар вообще гон тк гуглпланета должна быть другой, последнее уже было ;)
Ответить бога посредник, 17 июня 2008
Варианты Дениса и Валерия — клёвые!
Только «…мы ругали новую иконку сайта Google с прописной литерой g» — поправьте, речь же идёт о строчной.
Ответить Никита, 17 июня 2008
Первая иконка самая удачная, ИМХО.
Вторая, думаю, не станет ассоциироваться с Google
Третья отдалённо напомнила иконку Goggle Desktop
А связь последней с Google слабо уловима без контекста.
Ответить Антон, 17 июня 2008
Вариант Дениса самый неудачный. И вот почему:
http://www.macforensicslab.com/ProductsAndServices/images/icon_RecentWindowsMedia.jpg
Ответить доброжелатель, 17 июня 2008
Иконка Жукова — какие-то яйца. Не понравилось.
Иконка Намазова похожа на лого медиапроигрывателя, вызывает другие ассоциации.
Иконка Гилева слишком непонятная когда мелкая, не цепляет.
Иконку Картунова чуть бы как-то жирнее, и тогда супер. Эта понравилась.
Ответить Unsafe Mobile, 17 июня 2008
Вариант Дениса очень хорош, если бы не одно но… очень похожий логотип имеет фирма G-Unit Clothing ( http://www.brandsoftheworld.com/brands/0013/4778/brand.gif ), а так из всех четырёх у Дениса, пожалуй, самый удачный, он простой, легко узнаваемый и читабельный.
Ответить Евгений, 17 июня 2008
Мне понравился последний вариант, от Дмитрия Жукова.
А вообще я считаю, что лучший favicon для Гугла могут сделать только они сами. Но вы все равно молодцы!
Ответить Артур Пайкин, 17 июня 2008
Для поиска лучше смотрятся «яйца», а для остальных сервисов более уместна(имхо) первая иконка Дениса. Например в аналитике.
А почему схема называется «долбаный креативный бутик»?
:)
Ответить Серега, 17 июня 2008
А ещё цветная буква G является логотипом одного из подразделений чешского энергетического концерна ČEZ – Duhová energie (http://www.csvts.cz/cns/news/duha.jpg). Ядерщики, в общем.
Ответить Дмитрий Ловерманн, 17 июня 2008
А мне ничего не понравилось. Отправьте свои творения сами знаете кому и вам всё скажут.
Последний вариант, однако, самым близким к раскрытию темы, но это не гугл, это – master card. Если бы я увидел только иконку, я бы подумал, что это master card.
Текущая гугловская иконка лучше.
Ответить Андрей, 17 июня 2008
Прошу прощения, у ČEZ-а буква E, но на G в круге очень похожа.
Ответить Дмитрий Ловерманн, 17 июня 2008
Имхо, ни одна из иконок не тянет на то, чтобы быть фавикон Гугла
Ответить sunnyfetis, 17 июня 2008
Согласен с мнением многих тут откомментировавших — все здешние иконки идут лесом. Не понимаю чем людям первая нравится. Совершенно убогая и никаким образом не вяжется со стилем Google. Вот, посмотрите как нужно было — http://www.google.ru/intl/en/options/ . Вторая… Ну шар. Ну цветной. Тема сисек, короче, не раскрыта. Логотипчик, похожий на третью иконку я уже где-то видел. Да и вообще не красиво. Четвёртая иконка самая удачная, но заслуги Дмитрия Жукова в этом нет ни капли. Две буквы «О» были нарисованы другими людьми и, надо сказать, у них хорошо получилось.
Ребят, вы на цвета посмотрите. У Гугла нет таких ярких цветов. Нигде нет. Поэтому они и кажутся ещё более чужеродными. Ещё замечание: философия Google — простота. А смесь четырёх цветов в квадратике 16х16 — это что угондо, но не простота. И уберите эти дурацкие блики. Я понимаю, что это модно и всё такое, но это, опять же, не стиль Гугла.
ИМХО, новая иконка не супер, но явно лучше тут предложеных.
Ответить skammer, 17 июня 2008
Поддерживаю – получившиеся иконки не более чем шлак.
ТоварисЧи! Буква G выглядит нормально? В 16х16 она превращается в яркую убогую загогулину.
Шарик? Ув. Егора Гилёв, вы только что напрочь испортили репутацию собственной конторы. Если нашей компании потребуются иконки от турбомилка, главным требованием будет отсутствие вас в дизайнерской команде.
Иконка Валерия отвратительна в большом размере, в маленьком же становится просто бессмысленным набором цветов.
Единственная иконка, которая выглядит нормально в строке браузера – ОО. Но увы – смысл её уводит нас далеко от гугла.
З.Ы. Я прекрасно понимаю, что работа эта не долгая и некоммерческая – но хоть постыдились бы выкладывать ЭТО, особенно в смете заявлений об отвратительности новой иконки гугла.
Ответить Рассол, 30 октября 2008
варианты дениса и егора очень понравились)),
как бы заменить в панеле закладок эту иконку на вашу :-\
Ответить dmpr0, 17 июня 2008
Первые варинаты слишком похожи на новый логотип/ последний самый интересный, как мне кажется
Ответить Гриша, 17 июня 2008
Выбрал бы вариант Валерия
Ответить elsinor, 17 июня 2008
А я голосую за символ бесконечности Дмитрия Жукова!
Ответить livrtrace, 17 июня 2008
Понравились варианты Дмитрия (символ бесконечности смотрится весьма к месту) и Дениса (выглядит как оригинально переработанная старая иконка)
Спасибо :)
Ответить ShaggyOwl, 18 июня 2008
Шарик можно было нарисовать в виде глобуса, с разноцветными мередианами (поиск во всем мире).
Ответить kott7, 18 июня 2008
Все варианты показались малоинтересными. Только один из дизайнеров отметил, что Гугл происходит от «гугол» и попытался обыграть нули и знак «бесконечности» (явно считываемый, кстати, в теперешнем favicon’е), а «колечко» очевидно намекает на Висту, а не Гугл. Может, новый знак и не лучший, но смысла в нем больше, чем во всех предложенных вариантах вместе взятых.
Ответить nicethought, 18 июня 2008
1. Ближе всего к оригиналу, изменений – минимум
2. Больше смахивает на цветной лого от Google Earth
3. Похож на лого Google Picasa и Google Desktop
4. Лого Google Toolbar без зрачков?
Итог. У Google получилось лучше… :-)
Ответить Appolo, 18 июня 2008
если честно ни один из вариантов… сорри
тот что был раньше тот вариант самый удачный…
Ответить Антон Вокруг, 18 июня 2008
Понравился вариант егора. Он лучше всего смотрится внутри адресной строки, на мой взгляд.
Ответить Ярослав Бирзул, 18 июня 2008
Первывй второй и третий логотипы слищком похожи на смесь курсора (режим hourglass) в Windows Mobile 5 http://img339.imageshack.us/img339/3809/pccapture1ou3.jpg и Windows Vista. http://img170.imageshack.us/img170/6282/aerobusylargebv7.gif
Ответить Alex716, 18 июня 2008
очень приколько ..
действительно разное виденье.
Мне больше нравится вариант от «Дениса Кортунова»..
Ответить Anna Kolesnik, 18 июня 2008
— Вариант Дмитрия больше понравился;
— Текущая иконка Гугла, совсем потерялась в Опере 9.50;
— Денис, попробуйте „G“ сделать антиквенной.
Ответить Рузик, 19 июня 2008
вышлите свою идею для гугла сюда
http://www.google.com/faviconideas/
они посмотрят вдруг им что понравится
Ответить Arahnoid, 19 июня 2008
ИМХО больше 2х цветов – мазня получается.
http://cepxuo.info/wp-content/uploads/2007/02/google.png
подчистить и в самый раз
Ответить ratio, 20 июня 2008
Первый вариант слишком яркий для гугля, но красивый.
Круглые не понравились — после висты ассоциируются с «подождите, что-то ещё загружается, система занята».
Буквы «oo» тоже считаю, что не очень удачный вариант — favicon не ассоциируется с серединой названия/надписи.
Стилизация буквы G — хороший вариант. По-моему, лучше с первым поработать.
Ответить NaFigator, 20 июня 2008
И кстати редко попадаются фав-иконки с более чем 2мя цветами.
Напр. Вконтакте, Студия Лебедева, Википедия, ННМ, одноклассники….
Прошу прощения, но turbomilk не очень смотрится (моё субъективное ощущение)
Ответить Ratio, 22 июня 2008
Больше усего понравился вариант Дмитрия Жукова. Хотя, пожалуй, самым большим его недостатком есть отсутствие связи с буквой «G».
То есть надо ещё нащупать точку G… ;)
Ответить /lekcyc lllumukcyc, 22 июня 2008
Мне тоже нравится фавка Валеры Намазова! (чистенько)
Но нравилавь их оригинальная версия с большой буквой G, которая была до настоящей версии.
Ответить Володя Gorz, 23 июня 2008
Вот список продуктов google http://www.google.com/intl/ru/options/.
1-я иконка уже аля http://www.gmail.com
2-я похожа на Google desktop и Google Earth
3-я очень похожа на google Picasa
4-я практически один в один google «Панель инструментов»
Прежде чем сочинить для конторы что-то новое надо изучить какие идеи ей УЖЕ используются, в этом главный косяк! Я не говорю придумать что-то супер оригинальное, всё уже что-то на что-то похоже. Но эти картинки уже вовсю используются google, а их новая хоть и не супер красота, но не пересекается с уже имеющимися.
Ответить mshumilov, 23 июня 2008
Отличная статейка. Отменные примеры. Спасибо. Сам парился недавно, но все же пришлось заказать. Теперь попробую нарисовать сам.
Ответить Алекс, 24 июня 2008
понравились все кроме последней.. две «о» как то не катит
Ответить Alex, 5 июля 2008
Да, статья понравилась, жалко без подробных описаний действий, для чайников в фотошопе
Ответить Alexander, 15 июля 2008
Гугл вообще такой беззаботный и радужный, что аш не верица в его могущество!))
Ответить Blaybox, 15 июля 2008
А по-моему, фавикон с ОО символизирует очко. Чего тут в ладоши хлопать
Ответить OlegZee, 29 июля 2008
OlegZee, боюсь предположить о чём вы думаете, когда смотрите на выдачу Gooooooogle, да и вообще на буквы с дырочками.
Ответить NaFigator, 29 июля 2008
Да лаадно, это моё мнение, относитесь спокойнее к критике;) Не нужно врываться в дебри психологии)) Ни кто не отрицает, что парни молодцы, но ОО по-моему смотрится жутковато)
Ответить OlegZee, 29 июля 2008
отстойные иконки, согласен с комментами выше, Вы бы еще в виде О_о сделали типа:
GO_ogle – озрененный поиск))))))))
Ответить proto, 20 сентября 2008
Напишите комментарий
Вы можете использовать ваш twitter или facebook. Для этого вам нужно будет авторизоваться на одном из этих сайтов, после чего вы сможете оставлять комментарии.
Если у вас есть OpenID (например, myopenid.com), воспользуйтесь им для авторизации.
Авторизуйтесь при помощи аккаунта Турбомилк. Вы также можете зарегистрироваться на нашем сайте.