Behind the Screen

Маркетинг по другую сторону экрана

}

Эффективный сайт

Эффективный сайт должен приносить прибыль.
Мы проводим аудит сайта и помогаем повысить эффективность сайта.
Наша специализация: 1) аудит сайта, 2) веб-аналитика, 3) юзабилити,
4) создание и оптимизация контента и 5) PR в интернете.

Тенденции в дизайне логотипов 2009. Шоу-бизнес.

Логотипы экономического упадка, какие они? С кризисом пришла мода на экономию и сдержанность, наверное и графические знаки порастеряли былые роскошества, которые я описал в предыдущем обзоре Тенденций в дизайне логотипов 2008?

Как говорил Георгий Милляр в фильме “Марья-Искусница”: “Квак бы не квак!” Логотипы создаются на годы и десятилетия, и ни одна компания не пожелает обречь себя на вечную постную мину. Посему в 2009 году мы наблюдаем продолжение все того же Марлезонского балета бурной (а где-то буйной) фантазии.

В самом начале российской стадии мирового кризиса дизайн-бюро Лебедева выдало вот такой цветик-семицветик.
Multibroker

А в самом разгаре появился еще более оптимистичный знак, словно созданный специально для участников межгалактической экспедиции 2209 года.
Oversan

Студия Лебедева не единственный источник изощренных фантазий. Предлагаю вашему внимаю 15 самых распространенных стилей логотипостроения за последний год.
Читать дальше



Веб-дизайн 2009: одностраничные сайты

Продолжаю обзор основных тенденций веб-дизайна.

Впредь, постараюсь не публиковать слишком длинные посты. Чувствую, что перебор: в блоге лучше придерживаться не слишком крупного формата. По этой причине…

… сегодня обзор одного очень вкусного тренда: одностраничных сайтов.

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

kobe

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

Если ваш выбор — одностраничный сайт (построенный с использованием технологий JavaScript), можно дать такой совет: сделайте альтернативную, обычную версию. Во-первых, некоторые (очень немногие) отключают поддержку JavaScript в броузерах, во-вторых, не всем будет понятна и удобна навигация.

fish

layouts-42

viget


Веб-дизайн: тенденции на 2009 год

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

Почему я часто перевожу материалы Smashingmagazine?
Не только по моему мнению (оцените количество подписчиков журнала) — это один из лучших ресурсов для изучения интересных дизайнерских идей. Редакция занимается тем, что собирает по всему мировому интернету, в том числе российскому, образцы веб-дизайна.
Если вы любите большие дизайнерские сборники зарубежных издательств, но не можете позволить их покупку на регулярной основе (уж очень они дорогие), то лучший выбор — Smashingmagazine.
Правда, это англоязычный ресурс, и не всем удобно его читать. Вот я и беру на себя дерзость переводить самые полезные для интернет-маркетинга статьи.

Итак, поехали!
_________

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

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

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

1. Высокая печать
Один из наименее ожидаемых приемов веб-дизайна — имитация высокой печати (letterpress) в типографском деле. В результате мы наблюдаем эффект аккуратных, «впресованных в бумагу» букв. Возможно, этот прием стал трендом по той простой причине, что до сих пор дизайнеры редко его использовали. А теперь, как говорится, открыли для себя заново…
Прием высокой печати используется на самых разных сайтах, самой разнообразной тематики. Чаще всего он встречается на ресурсах онлайн-сервисов.

letterpress-1

letterpress-2

letterpress-3

letterpress-4

letterpress-5

letterpress-6

letterpress-7

letterpress-8

letterpress-91


2. Обогащенные пользовательские интерфейсы (Rich User Interfaces)
К счастью, пользовательские интерфейсы на современных веб-сайтах и веб-приложениях становятся все более красивыми и удобными. Вслед за углублением нашего опыта работы с веб-приложениями развиваются интерфейсы, которые становятся более богатыми на функции, вплотную приближаясь к обычным компьютерным программам.
Потребители настроены на динамическое взаимодействие с сайтом, которое разработчики обеспечивают с помощью технологий Flash и AJAX.
Также мы заметили, что многие сайты предлагают подсказки по работе с элементами интерфейса, помогают определить статус текущего взаимодействия с программой. Например, при клике на кнопку, она меняет свой внешний вид из обычного в «нажатое» состояние (см. пример на сайте www.quicksnapper.com).
Помимо этого, все больше сервисов могут быть изменены под вкусы и потребности пользователя (персонализированы). Это признак грядущего распространения адаптивных пользовательских интерфейсов.

richuser-1

richuser-2

richuser-3

richuser-4

richuser-5

richuser-6

richuser-7

richuser-8

richuser-9


3. Прозрачность в формате PNG
Этот прием не поддерживается все еще популярным броузером Internet Explorer 6. Однако он начал получать распространение уже на протяжении прошлого года. Заметно, что в своих решениях дизайнеры ориентируются на верстку печатных СМИ.
В большинстве случаев прозрачные изображения и плашки выделяются на фоне остальных элементов сайта. Их используют для оформления «шапки» сайта или объявлений. Впрочем, некоторые дизайнеры идут дальше.

png-1

png-2

png-3

png-5

png-4


4. ОГРОМНЫЙ шрифт
В прошлом году это был один из популярных приемов, его торжественное шествие продолжится и в 2009-м. Интернет-магазины, дизайн-студии, сайты-портфолио, онлайн-сервисы будут использовать огромные шрифты для выделения наиболее важных сообщений.
Размер букв часто превышает 36 пикселей, а владельцы сайтов нередко покупают дорогие шрифты (в России, обычно, шрифты не принято покупать — прим. пер.)
Помимо выбора шрифта, дизайнеры особое внимание уделяют интерлиньяжу (межстрочному интервалу) и высоте строки. В результате сайты выглядят симпатичнее, странички соблюдают единообразие стиля, в целом ресурс кажется более солидным и заслуживающем доверия.

huge-1

huge-2

huge-3

huge-4

huge-5


5. Замена шрифта
Поскольку дизайнеры в целом все больше внимания уделяют типографике, они также более внимательно относятся к выбору шрифтов для проектирования веб-сайтов. Классические веб-шрифты, такие как Arial, Helvetica, Georgia и Verdana, по-прежнему будут доминировать. Однако уже сейчас можно наблюдать небольшое движение в сторону замены шрифтов (например, с помощью технологии sIFR).
Что интересно, профессиональные дизайнеры не используют оригинальные шрифты бездумно, невпопад, для того лишь, чтобы прослыть новаторами. В этом их отличие от любителей, которые способны повесить на своем сайте 15 трудночитаемых и плохо совместимых кракозябр. В каждом случае учитывается не только красота и согласованность дизайна, но также влияние шрифта на юзабилити и восприятие пользователей.

fonts-1

fonts-2

fonts-3


6. Диалоговые окна
Диалоговые окна — второе поколение поп-апов (всплывающих окон). Они служат дружественной к пользователю альтернативой классическим окнам JavaScript и помогают сконцентрировать внимание на самых важных элементах сайта.
Такие окна возникают по запросу пользователя (клик, наведение курсора и т. п.) и открываются поверх остального содержимого, подобно обычной компьютерной программе. Диалоговые окна обычно очень ненавязчивые: они полупрозрачные и всегда содержат кнопку «Закрыть».

modal-1

modal-2

modal-3


7. Медиа-блоки
С распространением высокоскоростного интернета многие сайты начали устанавливать на своих страничках специальные блоки для просмотра видео, фотографий, прослушивания музыки. Такие блоки позволяют прямо на сайте быстро и в удобном формате ознакомиться с нетекстовым контентом. Их часто используют новостные сайты, блоги, онлайн-версии ТВ-программ, интернет-магазины, видеохостинги.
Пожалуйста, не забывайте, что не все пользователи обладают скоростным соединением, и не у всех установлены Flash и JacaScript. Видео — лишь дополнительная опция, еще одна форма ознакомления с контентом сайта.

mediablock-1

mediablock-2


8. Журнальный вид
Интересная тенденция в дизайне блогов — адаптация приемов, которые традиционно используются в печатных изданиях. Расположение статей на страничке, типографика, иллюстрации и даже выравнивание текста — все напоминает обычные журналы и газеты.
Также растет популярность дизайнов, основанных на сетке. Ее используют крупные блоги, сайты-портфолио и сайты о продукции. Кстати, дизайн моего сайта об интернет-маркетинге также основан на сетке.
Корпоративные сайты и интернет-магазины почти никогда не используют сетку.

magazine-1

magazine-2

magazine-3

magazine-4


9. Карусель (демонстрация слайдов)
В карусели слайды идут друг за другом в горизонтальном или вертикальном направлении. Для прокрутки пользователь обычно кликает или просто нажимает на стрелки.
Карусель удобна тем, что пользователю необязательно бродить по разным разделам сайта в поисках контента. Достаточно начать прокрутку слайд-шоу. Результат: пользователь экономит время и концентрирует внимание на самом контенте, а не на особенностях навигации по сайту.
Карусель обычно используется на крупных развлекательных сайтах, больших блогах, сайтах-портфолио. Кстати, карусель применяется не только на сайтах, но и, например, в телефонах и плеерах Apple, а также на сервисе iTunes.

slidshow-1

slidshow-2

slidshow-3


10. Блоки-вступления
Верхняя левая часть странички — самая важная на сайте, т.к. привлекает к себе наибольшее внимание. Следовательно, разумным будет расположить здесь наиболее значимое сообщение, которое посетитель прочитает, как только попадет на сайт.
Так и поступают почти все дизайнеры: название сайта, слоган, описание ресурса — все располагается здесь и выделяется заметным и привлекательным шрифтом для создания первого приятного впечатления.
Эти блоки-вступления иногда называют «шапкой», но их отличие в том, что они несут важную, содержательную информацию, в то время как «шапка» часто бывает красивой бессмысленной картинкой с логотипом. В моем блоге как раз не «шапка», а вступление. Обычно оно занимает всю ширину сайта при высоте 250-400 пикселей.
Обратите внимание, что вступительные блоки почти никогда не встречаются в интернет-магазинах и блогах (получается, мой исключение).

introduction-1

introduction-2

introduction-3

introduction-4

introduction-5


Веб-дизайн: тенденции на 2009 год. Вместо предисловия.

Постоянные читатели блога, наверняка, заметили, что я часто пишу про веб-дизайн и его тенденции. Статьи со скриншотами у меня появляются, вроде бы, каждый месяц.
И кто-то (по)думает: «Опять дизайн! Ну сколько можно? Интернет-маркетинг — это раскрутка и оптимизация, всякие SEO и SMO. Писал бы лучше об этом. Побольше статей о том, как продвинуть сайт и заработать в интернете.»
Не спорю. Только что, господа, продвигать будем? Мешок картошки? Пучок сельдерея? Кому сейчас, этот ваш виртуальный сельдерей, нужен без приятной виртуальной упаковки?

Одно из правил маркетинга, в том числе интернет, гласит: «Media is a communication». По-русски: как (или посредством чего) вы преподносите информацию, тоже говорит о содержании и качестве этой информации. И не просто говорит, а добавляет в это содержание что-то от себя. Сравните три способа поздравить с Новым годом: по смс, красивой открыткой или лично с бутылкой шампанского в руках. Текст может быть один и тот же, но воспринят он будет по разному.

«Вот и пусть вопросами дизайна озадачиваются профессионалы-дизайнеры», скажет мой оппонент. «Нам, маркетологам и менеджерам, не досуг забивать себе голову.»
Тогда почему в России так мало хорошего дизайна? Почему почти нет яркой и оригинальной рекламы? Потому что многие маркетологи и рекламисты не забивают себе голову всякими «посторонними» глупостями. Они не развивают свой креативный потенциал, не взращивают эстетическое чутье, не знакомятся с новинками дизайна.
Потом такой менеджер с «незамутненной глупостями» головой приходит в агентство или студию веб-дизайна и требует: «Сделайте-ка мне сайт и рекламу заодно, как у моего конкурента.» А у конкурента такая же «незамутненная голова» и страх перед неизвестным. В итоге мы получаем все тот же халат, только с «перламутровыми пуговицами».
Специалист интернет-маркетинга сам должен понимать, как визуальная среда влияет на успех бизнеса. Веб-дизайнеру на этот успех наплевать с колокольни. Максимум, на что он способен без направляющей руки грамотного заказчика — это сделать красиво и «круто».

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

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



Новейшие тенденции в дизайне логотипов

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

Другое дело, если ваш проект живет только в интернете и еще не имеет своего опознавательного знака. Где взять идею для логотипа? Как он должен выглядеть?

Для многих дизайнеров и маркетологов ответ кажется «простым и очевидным»: нужно наваять нечто в модном стиле web 2.0. Так мы получаем бесчетное количество симпатичных, но однообразных «полированных» названий, поставленных на «мокрый пол».
Другие признаки логотипа web 2.0: яркие и веселые цвета, закругленные углы, сочетание контрастных цветов, мягкие переходы от темного оттенка к светлому. Вот несколько веб-два-нольных логотипа:

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

Каждый год авторитетный проект LogoLounge отслеживает тенденции в дизайне логотипов и публикует самые интересные образцы в одноименной книге. Ниже краткое описание главных дизайнерских идей текущего года по версии LogoLounge.

1. Сверхновая

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

2. Тонкая линия

Правилом хорошего дизайна всегда считалась правильная толщина линии, которая не должны быть ни слишком тонкой (иначе это мешает восприятию), ни слишком толстой, грубой. В этих логотипах все сделано наоборот. Дизайнеры взяли за основу тончайшую линию и создали с ее помощью сложные логотипы, которые отличает несколько уровней восприятия.
Обратите внимание на лого с русалкой. То, что сначала кажется «чешуей», на самом деле название: «The Mermaid Inn» (Гостиница «Русалка»).
Еще более сложный для восприятия логотип справа. Здесь поочередно считываются три уровня: сначала оранжевый фон, потом стилизованная буква «S», и только потом мы замечаем верхний слой с рисунком и названием марки.

3. Складывание

Представьте, что вас попросили сложить логотип из одного листа бумаги. При помощи такого квази-оригами создается эффект «материального», 3х-мерного логотипа. «Материалом» для складывания могут служить бумага, пленка, пластик и даже металл. Обратите внимание, как на некоторых логотипах меняется цвет слоя, когда на него накладывается другой. Все, как в жизни.

4. Глобальная экспансия

Особо амбициозные компании демонстрируют свои международные притязания. Одно время были очень популярны логотипы с изображением Земного шара. До сих пор они попадаются то тут, то там, превратившись в банальность.
Новая тенденция по новому раскрывает планы мирового господства. Рисунок и цвета этих логотипов компании говорят нам: мы еще не покорили весь мир, мы не превратились в транснациональных монстров, зато мы активны, динамичны и распространяем инновационные идеи по всему миру. Вам не кажется, что логотипы «Глобальная экспансия» очень похожи по духу на логотипы «Сверхновая»?

5. Петли

Эти логотипы одновременно напоминают и знак бесконечности, и ленту Мебиуса. Т.е. символизируют вечное движение. Однако обратите внимание на нарочитую асимметрию, неправильность петель. Дизайнеры логотипов решили отойти от уже банальной ленты Мебиуса и сделали основной акцент не на вечности, а на гибкости, способности адаптироваться к изменяющемуся миру.
Некоторые логотипы-петли создают ощущение постоянного движения. Словно мы рассматриваем всего лишь фотографию объекта в момент его преобразования.

6. Зубодробилки

Обозреватели LogoLounge назвали этот стиль «Зубодробилки». Зубодробилками (jawbreakers) в США называют твердые конфеты в виде разноцветных шариков с начинкой из надувающейся жевательной резинки. Эти конфеты нужно было как следует разгрызть, чтобы добраться до вкусного сюрприза.
Эти логотипы словно возвращают в детство, с его яркими, вкусными красками, сюрпризами и ничем не ограниченной фантазией. Другой источник вдохновения — художественное направление оп-арт.

7. Стробоскоп

Не забыли еще петли? Эти логотипы также передают идею жизни и постоянного движения. Если петли делали это при помощи «гибких материалов», то здесь на сцену выходят разноцветные пучки света. Или, если угодно, можно назвать это окрашенными звуковыми волнами.

8. Сияние

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

9. Стежок

Эти женственные логотипы в качестве источника вдохновения выбрали различные техники вышивки и вязания. Обратите внимание, что здесь нет попытки имитации конкретного материала.
Здесь главную роль играют стежки и (снова) петли.

10. Тест на дальтонизм

Наверняка, на медкомиссиях все проходили тест на правильное распознавание цвета. Вот примеры тестов, которые превратились в трендовые логотипы. Чтобы принять такой логотип, компания должна обладать большой степенью смелости и даже безрассудства. По статистике 7% мужчин и 0,4% женщин не смогут понять, что здесь изображено.
Возможно, в этом есть смысл, когда фирма предлагает товары или услуги «не для всех». Причудливый и мистический логотип «для тех, кто понимает» — словно ключ к загадочной двери. Если сумеешь понять его, значит ты свой человек. Добро пожаловать!

11. Амеба

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

12. Грани

Многогранность считается ценным качеством. Что может быть драгоценнее бриллианта с десятками граней? И чей глаз не останавливается при взгляде на дорогой камень, обработанный искусным ювелиром?

13. Каракули

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

14. Цветение

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

15. Волокна

Помимо привычных уже идей движения и гибкости, эти логотипы говорят о силе в единстве разнообразных элементов. Помните выражение: «Город — единство непохожих?» Здесь та же идея выражена в графической форме. Полоски разной толщины и цвета сходятся и расходятся, изливаются из единого центра для создания одной картины и одного эффекта.

Не так давно главной тенденцией в дизайне логотипов была простота. Рисунок логотипа одинаково правильно должен выглядеть в различных средах: в печати, на экране ТВ и в интернете. Логотипы, собранные LogoLounge, нельзя назвать простыми. Например, многие из них станут источниками головной боли для печатников или для производителей вывесок.
Однако, если вы занимаетесь бизнесом в интернете или ходите создать логотип для интернет-проекта, у вас нет серьезных причин ограничивать свою фантазию. Попробуйте, наконец, позабыть о полированных названиях в стиле web 2.0 и создайте нечто более осмысленное. Пусть ваш логотип станет выразителем какой-нибудь идеи. Например, глобальной экспансии. Почему бы нет…

Если вы считаете, что логотип вашего проекта или компании тоже интересен с точки зрения идеи и дизайна, пришлите мне ссылку или .jpg на почту (см. контактные данные).
Я соберу несколько интересных вариантов и обязательно опубликую их в своем блоге. Разумеется, с ссылкой на ваш проект. Только не забудьте пояснить, какую идею транслирует ваш логотип.

_________________________________

Если вам понравилась статья, подпишитесь на обновления RSS или получайте новые статьи по электронной почте.