На сегодняшний день создать качественный и приятный для большинства простых людей вебсайт — даже при минимальном бюджете довольно просто. За последние годы сотнями разработчиков уже наработан громадный опыт и практические приемы, которые воплощены в десятках готовых шаблонов. Можно с первых дней рабочей эксплуатации сайта гарантировать себе неплохую конверсию — просто выбрав самый скачиваемый или богатый положительными отзывами шаблон сайта.
![]("http://emagnat.ru/wp-content/uploads/B2B-site-660x396.jpg")
Таким образом, понравиться всем и сразу сегодня куда легче, чем привлечь внимание в особом сегменте целевой аудитории, являющейся сообществом специалистов в определенной отрасли. На самом деле, проектировать сайты и инфосистемы для сектора 2b2 гораздо сложнее и одновременно интереснее, ведь особые “касты” людей знают и умеют в своей “родной” отрасли в десятки раз больше, чем любой сторонний дизайнер или UX-эксперт. Так, любая деталь, кажущаяся простым людям незначительной — для этих людей может иметь ключевое значение, так как указывает на некие особенности и принципы увиденного на сайте коммерческого предложения. Как же в такой ситуации спроектировать хороший и продающий сайт? Универсальным советом в такой ситуации будет: Создать максимально экспертное впечатление от сайта, продемонстрировать внимание к деталям и более глубокое, чем у самого посетителя сайта, погружение в вопрос. Разберем этот универсальный совет на примере сайта по продаже оборудования для пищевых производств mecuchi.ru:
![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru_-660x439.png")
Сайт сам по себе не так уж и плох — здесь есть и слайдер, и популярные товары, и умеренный, скромный дизайн. Согласитесь, было бы куда ужасней продавать пилы для свиных туш на “хипстерском” сайте с развлекательной анимацией и другими молодежными фишечками? Суровых мясников это бы только оттолкнуло. А что же привлечет суровых мясников? Разумеется, демонстрация товара лицом и очень подробные, со знанием дела, пояснения и характеристики к каждому товару. ![]("http://emagnat.ru/wp-content/uploads/snippetu-tovara-660x352.png")
Вот перед нами сниппеты товаров: тут есть и цена, и кнопка добавления в корзину — но нет любви к своему делу, не чувствуется полной вовлеченности дизайнера. Так, пиктограммы с характеристиками товара очень разноцветные и слишком мелкие. Разобрать здесь что-либо, попробовать сравнить пилы, попытаться принять решение о покупке наиболее подходящей по мощности — просто нереально. Все слилось и смешалось, что выдает недостаточно экспертный уровень создателей сайта, вызывает внутреннее подозрение у потенциального покупателя. Дизайн подобных b2b сайтов — это каждый раз прохождение визуального теста с вопросами от будущего клиента: “А все ли ты знаешь о своем товаре? А не забудешь ли укомплектовать мой заказ семи сменными запчастями? Отличишь ли визуально пилу HBS-330A от HBS-250D, не перепутав при отгрузке?”. И каждый отказ от заказа, каждый уход посетителя с уникальным запросом — с сайта можно расценивать как очередной провал такого вот негласного экзамена. А вопросов по интерфейсу действительно очень и очень много: “Почему на баннере изображены какие-то горы, а не красивый и такой родной цех пищевого производства? Почему с сайта я не могу в один клик скачать полный прайс-лист в pdf — у них что, нет печатных прайсов, каталогов и буклетов? Почему нет готовых наборов “Пищевой цех под ключ ЭКОНОМ”, где их профессионалами сразу будут учтены все необходимые к покупке машины и инструменты, позволяющие малоопытному предпринимателю запуститься в максимально сжатые сроки? Почему эти люди вообще как будто бы стесняются нашей общей профессии?” — примерно такие вопросы обязательно задаст каждый опытный заказчик, исследуя сайт. ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-2.png")
Также не совсем удачно выглядят многие графические решения. Например, под пиктограмму поиска в меню выделили целую отдельную строку, ради чего пришлось даже сдвинуть самые продающиеся товары еще ниже: ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-stroka-poiska-660x58.png")
Как известно, юзабилити работает именно с ожиданиями и потребностями конечного пользователя, даже если этот пользователь имеет десятилетия профессионального опыта, умеет торговаться и меньше всего на свете хочет связывать дело всей жизни с неопытными новичками. Отсутствие же в разделе “ О компании” хоть одной реальной фотографии, наличие довольно общих и обтекаемых фраз — лучшая гарантия для клиента, что перед нами очередная “молодая динамично развивающаяся компания”, которой пока нечего сказать по существу своей успешной деятельности: ![]("http://emagnat.ru/wp-content/uploads/mecuchi-o-nas-660x592.png")
А нужно было бы гордиться каждым своим сотрудником, их совокупным многолетним опытом, не бояться наглядно показывать процесс отгрузки заказов или видео встречи вашего руководителя с очередными партнерами. Уважение у вашей целевой аудитории вызовут лишь прозрачность и сверх-профессионализм, как по отношению к своим сотрудникам, так и к другим покупателям. Также странным решением для настоящих матерых экспертов выглядит ваше желание выделить под каждого из ваших партнеров отдельную страницу. Не просто показать их логотип и годы плодотворного сотрудничества — но совершать посадку на ваш сайт по запросам людей, ищущих сторонние компании: ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-partneru.png")
Возьмём наугад один из разделов каталога с профессиональными кухонными ножами. Ваши покупатели наверняка ожидают здесь увидеть страницу, наполненную искренней любовью к данному изделию. Но вместо этого бросаются в глаза красные “запретные” надписи, мелкий текст, требующий напряжения глаз; и однотипные картинки товаров, не позволяющие профессионально насладиться видом продаваемого товаром: ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-tovar-660x399.png")
В карточке товара, несмотря на то, что цены даны в рублях, покупателям предлагается уточнить текущий курс валют — зачем? Зато нужные характеристики товара спрятаны под вкладкой, требующей совершить лишний клик. ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-tovar-2-660x423.png")
А вот карточка товара сложных пил содержит уже вкладки по Комплектации оборудования — вот это уже выглядит настоящим экспертным подходом: ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-kartocka-tovara-660x478.png")
Для сайтов 2b2 зачастую нелепо выглядит само понятие Корзины, а уж тем более процесс “откладывания” в нее. Покупать станки и заводы, газеты и пароходы невозможно, просто складывая их в тележку в супермаркете — тут ассоциативный ряд уже не работает. Оптимальным вариантом здесь выглядит именно оборот “Добавить в заказ”, а сам заказ уже может состоять из нескольких крупных доставок всего закупленного оборудования. ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-pokupki-660x52.png")
К заполнению информации о покупателе при оформлении заказа — требований куда меньше обычного, ведь ваши клиенты давно привыкли заполнять многостраничные договоры, вписывать реквизиты, визировать акты — и их не напугать сложной формой на экране: ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-pokupki-2.png")
Но вот эти лишние картинки повсюду — очень утомляют. Вы продаете товар профессионалам своего дела, и оформляют ли они покупку на сайте или же уточняют информацию по доставке — всюду сайт встречает их совершенно ненужными лишними украшательствами. Это и не фотографии реального положения дел, и не познавательные видео о том, как быстро заменить пильное полотно в машине — это сделано у вас просто ради идеи “заполнить место”. Не надо делать вид, что ваши клиенты не догадываются об истинных целях размещения подобных картинок — им также очевидно, что у вас просто не хватает контента. А именно экспертный контент — царь и бог сайтов b2b. ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-kontent-660x383.png")
Избавившись от лишней визуальной шелухи — сайт только повысит общее экспертное впечатление о самом себе. ![]("http://emagnat.ru/wp-content/uploads/mecuchi.ru-mobilnaya-versiya.png")
Иногда считается, что солидным сайтам для оптовиков, якобы, не очень то и нужна красивая мобильная версия или адаптивный дизайн, ведь “у наших клиентов в офисах огромные мониторы”. Да, совершить покупку или проверить в личном кабинете сроки поставок товара ваша целевая аудитория любит с офисных ПК, однако впервые бегло составить впечатление по новому сайту, или оценить возможный партнерский потенциал — даже самые занятые и деловые люди могут с телефона или планшета, стоя в пробке и коротая время планами о будущем. Потерять такого клиента на не проработанной версии для смартфонов — это гарантированно лишить себя миллионного заказа с ПК через пару дней. Можно только порадоваться, что создатели сайта это понимают и мобильная версия интернет-магазина выглядит очень даже неплохо. Кажется даже, что с телефона взаимодействовать с таким сайтом немного удобнее. В заключение, еще раз обратим внимание, насколько по-разному могут оценивать удобство одного и того же сайта прожженные бизнесмены и случайные домохозяйки. Для бизнеса потраченное время — это основной и самый ценный ресурс, поэтому переходить по ссылкам, экранам, вкладкам для некоторых из ваших клиентов может показаться “слишком дорого по времени”, а вот возможность сформировать готовый заказ на одном экране, или даже в 1 клик, заполнив в заказе самую обычную и давно знакомую таблицу — может показаться вершиной удобства и юзабилити. ![]("http://emagnat.ru/wp-content/uploads/formirovanie-zakaza-tablica-660x548.png")
В любом случае, даже самая уродливая табличка на сайте просто обязана изобиловать громадным количеством технических характеристик и вашими экспертными примечаниями об особенностях товара — и тогда ваш UX будет на высоте!