Поведенческие факторы — совокупность действий посетителей на сайте. И вот для чего на них стоит остановить пристальное внимание:

1. Поисковые машины Яндекс и Google демонстрируют стойкую тенденцию в ранжировании сайтов ориентируясь именно на поведенческие факторы. Удобные и грамотно структурированные сайты всегда выигрывают конкуренцию. Важно хотя бы раз в неделю снимать анализ о поведении посетителей на сайте: вход и возвращение на сайт, просмотр страниц, время пребывания, “клики” на предлагаемые ссылки и т.п.

2. Поведенческие факторы помогают выстроить более точные маркетинговые гипотезы для АБ тестирования посадочных страниц Landing Page . Что в свою очередь приводит к кратному увеличению % конверсии. Как следствие снижение стоимости заявки, увеличение количества лидов на тот же рекламный бюджет. Как часто вы смотрите что делают посетители у вас на сайте?

Интересно как увеличить конверсию через анализ и докрутку поведенческих факторов? Оставляйте заявку в форме ниже и мы увеличим продажи вашей компании.

Как и при формировании простого сайта у Landing Page есть своя стратегия по структурированию информации.

8  обязательных экранов для эффективного Landing Page

1 экран — зацепка внимания посетителя для знакомства с компанией

На первом экране размещается дескриптор: отражение ясности, вызов интереса и призыв к действию.

Ясность – соответствие поискового запроса деятельности компании и ее региональном месторасположении. Поисковой запрос «свадебные платья в Иваново», на сайте «Продажа свадебных платьев в Иваново».

Интерес выражен в убойном торговом предложении. В нем отражена суть болей целевой аудитории. «Создание сказочного образа благодаря итальянским свадебным платьям для любой фигуры от 9 500 рублей».

Призыв к действию представлен в виде целевой царь-кнопки. Она контрастна, выделяется на сайте и содержит призыв. «Получите бесплатный каталог нарядов Lussano, оставив заявку» кнопка «Хочу каталог».

Видеоконтент – современное веяние для восприятия информации

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

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

2 экран – реклама основного продукта

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

3 и 4 экраны – блоки с выгодами покупки

Двигаясь вниз по Landing Page, пользователь знакомится с выгодами цены и качества. Факты обосновывают стоимость, показывают, как складывается цена и демонстрируют ее выгоду. Наравне с ценой не отстает и качество. Оно также подкрепляется фактами. Это видеоконтент и фотоконтент производства.

5 экран – отличие от конкурентов

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

6 экран – важно то, что говорят люди, ставшие клиентами

Социальные доказательства – слайдер-блок с отзывами. Что может быть убедительнее, чем реальные отзывы клиентов? Описание процесса взаимодействия, результатов работы выражаются в размещении отзывов. Заголовок каждого отзыва должен отражать проблему и быть подробно описан.

7 экран – немного о компании

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

8 экран – шаг к получению контактов клиента

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

WEB Armada – сделаем бизнес в 2 раза прибыльнее за счет создания конверсионного Landing Page

Подготовленная на основе 8 экранов структура создает рабочий Landing Page, готовый к приему гостей. В зависимости от вида деятельности и поставленных задач количество экранов дополняется, меняется местами, тестируется, анализируется  и совершенствуется.

Для того чтобы понять какие виды экранов необходимы для Landing Page обращайтесь по номеру +7 499 404 13 02.

Бесплатно проконсультируем, проведем аудит бизнеса, определим приоритеты и создадим предварительный макет будущего продающего одностраничного сайта.

Почему-то, никто не сомневается в том, что проектирование здания — это важный и неотъемлемый этап, без которого ни одно строительство не обходится. Никто даже и не усомнится в его необходимости. Или вы можете представить, чтобы строительство самолета проходило бы без чертежей, на глаз главного конструктора? Однако, с созданием прототипа сайта появляется множество вопросов и сомнений в надобности данного этапа.

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

Как правило прототип создается для:

• Расположения нужных блоков и элементов дизайна;
• Разработки концепта сайта;
• Разработки навигации сайта;
• Проработки пользовательского поведения на сайте.

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

Прототип — это некое графическое отображение технического задания. Позволяет сэкономить время на разработку всего проекта. Чем он детальнее будет продуман и проработан, тем меньше будет доработок, вызванных несоответствием функциональных ожиданий заказчика. Готовый прототип- 50% всего проекта. Клиент знает, чего ждать от разработчика, а разработчик четко понимает, что необходимо сделать.

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

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

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

Проанализировав разные источники, мы собрали несколько важных аспектов грамотного прототипа, а именно:

• Отмечать интерактивные элементы, для быстрого распознавания;
• Использование реальных текстов, которые будут на сайте, если такие имеются;
• Никаких цветов и изощрённых шрифтов. Простота и лаконичность.
• Главная цель прототипа – функциональность. Дизайн не имеет смысла.
• Структурированность и логичность всей системы элементов.

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

1. Axure RP

2. Mockplus

3. Justinmind

4. Adobe Experience Design

5. Principle

6. Omnigraffle

7. Mockingbird

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

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

 1. Полу-плоский дизайн

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

 2. Синемаграммы

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

 3.Больше 3D

3D определенно возглавит наш путь, и мы увидим его влияние во всех областях дизайна. Поскольку революция VR / AR стремительно развивается, эта область развивается довольно быстро.

4.Анимация

Анимации все больше присутствуют в веб-дизайне, и они могут быть gif, SVG, WebGL CSS или видео. Анимации определенно были одной из самых больших вещей в тенденциях веб-дизайна в прошлом году, поэтому не стесняйтесь их использовать.

 5. Лендинг

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

 6. Геометрические фигуры, рисунки, линии и круги

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

 7. Смелые цвета

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

 8. Innovative Scrolling and Parallax

Эта визуальная идея прекрасно добавляет уникальный элемент на любой веб-сайт. Из многослойного параллакса в видеопараллакс возможно все.

Является плагином WordPress, который позволяет создавать красивые параллакс-секции с более чем одним слоем. Будьте изобретательны и объедините слои в любом стиле, который вы хотите. Мы создаем 12 различных примеров, чтобы направить ваши первые шаги в красивый многослойный мир. Играйте со слоями.

9. Цветовые переходы

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

10. Мобильный просмотр (адаптивный дизайн)

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

  11.Пользовательская графика и иллюстрации

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

  12. Творческое использование нейтрального пространства и сетки

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

13. Storytelling

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

14. Lazy Loading

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

15. Разделить содержимое

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

16. Полноэкранные формы

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

17. Видеоролики

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

18. SEO важен

Оптимизация в поисковых системах очень важна на веб-сайте, поэтому красивый сайт без хорошей SEO, вероятно, останется за бортом.

19. Скрытая навигация

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

20.Маленькие детали

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

21.Тенденции дизайна логотипов

21.1. Минималистичный

Посколmку все крупные бренды переключаются на более простой, минималистичный дизайн, эта тенденция сохраняется.

21.2. Нарисованный от руки

Эта тенденция уже несколько лет находится в центре внимания, и она идеально подходит для бизнеса «хипстеров». Этот стиль используется для кафе-ресторанной индустрии, парикмахерских или искусства и ремесел.

21.3. Отрицательное поле

Это старая тенденция, но в последние несколько лет мы видели ее вновь, и она будет толькорасти, так что определенно стоит обратить внимание.

21.4. Кадрирование

Эта тенденция столь же минимальна, как и получается, показывая достаточно, чтобы знать, что такое логотип, и ничего больше.

21.5. Геометрический

<Эта тенденция, безусловно, старая школа, но это один из тех стилей, которые никогда не умрут.

21.6. Линейное искусство

Эта тенденция популярна среди нового и современного бизнеса.

21.7. Patterns

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

21.8. Анимированные логотипы

Дизайн движения — это огромная тенденция в этом году, и мы можем найти ее во всех областях дизайна.

21.9. Винтаж

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

21.10. Цветовые переходы

В этом году цветовые переходы везде — даже в логотипах.

21.11. Иллюстрации в логотипах

Иллюстрации — это отличный способ придать уникальный и индивидуальный штрих логотипу компании. Они становятся все более популярными в этом году .

21.12. Фотография в логотипах

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

22.Тенденции типографии

22.1. Большая и красивая типографика

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

22.2. Цветовые переходы в типографии

Цветовой переход – это сейчас определенный тренд и вы найдете его и в типографике.

22.3. Визуальная иерархия

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

22.4. Tiny Typography

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

22.5. Анимированная типография

Анимации есть везде, даже в типографии. Если вы используете мягкое движение, вы не ошибетесь в этом году.

22.6. Типография соответствует фотографии

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

22.7. Геометрические формы и типография

Геометрические фигуры также могут быть объединены с типографией  для достижения современного результата.

22.8. Сопряжение шрифтов

Использование двух или более шрифтов вместе все еще находится в тренде в этом году. Ознакомьтесь с примерами, приведенными ниже, для некоторых интересных пар, которые помогут вам в ваших проектах.

В современном мире маркетинг в обыденном его понимании становится не актуален. На его место приходит более мощный инструмент.

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

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

Как вы думаете, что объединяет все эти лендинги?

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

85% лендингов в интернете заканчиваются контактной информацией и адресами своих офисов. Это Неправильно!

Посетитель теряется в догадках: «Что же мне делать дальше?»

Мы знаем очень много вариантов решения этой проблемы, вот самые действенные из них:

Способ #1.

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

Ретаргетинг — это рекламные механизм, посредством которого онлайн-реклама направляется тем пользователям, которые уже посмотрели рекламируемый продукт, посетив сайт рекламодателя.

Способ #2.

Задайте вопрос с тремя вариантами ответа.

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

Третья кнопка – форма захвата, поданная в соответствующем соусе.

Способ #3.

Акция по принципу перевернутого треугольника. Этим способом активно пользовался даже Steve Jobs во время презентации IPOD.

В начале страницы мы говорим, что товар стоит 50000 рублей. В середине страницы даём скидку 20%. В конце страницы предлагаем ещё более лояльный вариант.

Таким способом клиент охотнее согласится на предложения с лучшими условиями. Исправив сайт по этому принципу, вы гарантированно увеличите конверсию на 20% от первоначальной.

Теперь наши работы не вошедшие в основное портфолио на сайте Вы сможете посмотреть на нашей странице на Behance.

Так же как и в основном портфолио мы подробно рассказываем процесс разработки и результаты.

1. Работу начали с глубокого анализа сферы деятельности компании.
2. Проанализировали и структурировали большой массив информации.
3. На этой основе проработали предложение, в корне отличающее Русстерм от конкурентов.
4. Разработали прототип сайта, на котором отразили всю структуру основных смысловых блоков сайта
5. После определения структуры и поведения основных элементов сайта разработали дизайн главной и внутренних страниц
6. Подвели всю информацию под удобную систему управления
7. Разработали адаптивную верстку — сайт стал адекватно отображаться на планшетах и мобильных устройствах

Посмотреть кейс в наших работах

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

Начиная с тенденций плоского дизайна (Flat Design) и двигаясь к материальному дизайну (Material) было интересно, какие тренды появились и хотелось понять, что они из себя представляют и куда они нас ведут? Почему именно они стали наиболее удобными для пользователей?

1. Упрощение: дизайн стал намного проще

Что это? Вместо включения широкого спектра градиентов и теней здесь наблюдается смещение к Flat Design, что создает более легкую эстетику в приложении. Это означает, что использование отрицательного пространства вместо градиентов, теней и т.д. создает простой интерфейс, ориентированный на наличие только основной информации и удаление элементов дизайна, которые ни сами по себе не являются продуктивными, ни для притока пользователей. Для чего? Flat Design не отвлекает, а помогает глазу пользователя следить за смысловым содержанием на экране, что позволяет упростить навигацию и в то же время обеспечивая гладкую, современную эстетику самой марки.

2. Один шрифт для всех элементов

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

3. Блоки и пространства: линий больше нет

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

4. Центр внимания – данным

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

5. Микро-взаимодействия

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

6. Сокращаем цветовую палитру до минимума

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

7. Многоуровневый интерфейс

Совсем не так давно интерфейсы были сосредоточены вокруг принципа скевоморфизм – дизайн, который заимствует внешний вид и функциональность у исходных натуральных объектов (например, цифровой календарь, напоминающий настольный бумажный календарь, 3D глубина напоминает иконки приложений, щелчок затвора – звук мобильного телефона, и т.п.). В свою очередь Flat Design отошел от этого принципа при помощи использования многоуровневой системы, которая помогает создать более реалистичное ощущение размеров и глубины. Уровни дают возможность показать как один объект располагается над другим, показывая преимущество одного из элементов. Увеличение глубины и расслоение помогает пользователю быстрее определить взаимосвязь между различными элементами, правильно распределяя между ними внимание.

8. “Кнопки-призраки”

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

9. Жесты

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

10. Движение – как управление вниманием

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

11. Сокращение пользовательских сценариев

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

12. Проектирование как норма

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

13. Использование прототипов как лучшая практика

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

Посмотрите, как мы используем эти принципы в своей практике – как мы разрабатываем проекты.

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

К нам часто обращаются с вопросом создания и продвижения сайта. Многие наши заказчики всерьез задумываются — делать ли корпоративный сайт или выбрать популярный с недавних пор Landing Page (одностраничный сайт, страница захвата).

Действительно, что же выбрать? Ведь как создание “обычного” сайта, так и хорошего одностраничного landing page – задача, которая в совокупности занимает не только не один десяток часов, но и не одну сотню тысяч рублей.

Часть 1: Landing Page

Рассмотрим модный сейчас, в основном благодаря инфобизнесу и всеми любимой Бизнес Молодости, вид одностраничных сайтов – Landing Page (Лендинг Пейдж). В чем соль? Страница создается для генерации входящих заявок/звонков (лидов) из интернета, в основном, с помощью систем контекстной рекламы. Чаще используется Яндекс Директ, некоторые еще запускают Google Adwords (хотя мало кто сейчас на рынке умеет настраивать его хотя бы на “четверочку”), более продвинутые используют еще и социальные сети (вконтакте, facebook, одноклассники) и системы таргетированной рекламы от mail.ru и Бегуна.

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

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

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

Но как это бывает в 90% случаях? Берется заказчик и работают с ним независимо от отрасли и сферы по стандартной схеме:

1. Заголовок “Продажа тапочек, окон, дверей (подставьте свой продукт)”
2. Зачеркиваем старую цену, ставим якобы со скидкой – цена по акции почему-то почти всегда средняя по рынку
3. Обязательно счетчик “Торопитесь, через 15 минут наступит конец света!”
4. 10 лет на рынке, 500 клиентов, гарантия 1 год
5. Схема работы: звонок – замер – довольный клиент
6. Липовые, не проверяемые отзывы

И так — как на конвейере. Но есть и те компании, у которых действительно здорово получается делать одностраничники, они это делают круто и со знанием дела, но вот только они не рекламируются в директе по запросам “landing page бм дешево”, они никогда не сидят без работы, заказчики бережно передают их из рук в руки своим друзьям.

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

Часть 2: Корпоративные сайты

Гораздо интереснее дела обстоят с отраслью разработки корпоративных сайтов.

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

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

Допустим,  мы хотим получить n-ое количество заявок или звонков с корпоративного сайта, но не хотим делать landing page. Расскажите и объясните доходчиво клиентам почему они должны купить у Вас — покажите вашу компанию, докажите фактами почему вы лучшие в своем сегменте, покажите как устроено производство, как вы работаете с клиентами, покажите продукцию, объясните что и как работает и для чего лучше выбрать шпунтик А, а не винтик Б. Покажите, что ваша компания жива, какую пользу она приносит, какие боли клиентов и как она закрывает.

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

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

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

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

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

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

И что мы получаем с таким подходом? Большое полотно, смахивающее на Landing Page, а все потому, что и тут и там сделана всесторонняя презентация компании.

И что в итоге, что выбрать?

Добротный корпоративный сайт – это следующая ступень проработанного, с точки зрения маркетинга, полотно смыслов (landing page). Ведь когда мы хорошо упаковали предложение одного товара или услуги, затем второго, третьего, и остальных — самое время задуматься об их логичном объединении в большой корпоративный сайт, в котором будет много продуктовых продающих страниц, сильно походящих на landing pages. Таким образом, мы получаем один добротный ресурс, в котором хорошо и полно описаны все направления компании, и который вызывает намного больше доверия у потенциальных клиентов, чем простой одностраничник.

Здесь рассмотрены основные тренды которые начались в 2014 году. В 2015 году эти тренды будут, несомненно, продолжаться и усиливаться. Мы где-то нашли данный перечень (автор отзовись!), но считаем что это подмечено очень точно, поэтому выкладываем здесь для Вас!

(P.S. файл большой, нужно подождать)