Алексей Бородкин

Оцениваем юзабилити сайта фонда Vestor.in


Кто сказал, что только стартапы должны заботиться о юзабилити? Rusbase совместно с USABILITYLAB продолжает серию материалов, в которых будет проводиться оценка юзабилити сайтов венчурных фондов.

Алексей Бородкин — ведущий аналитик USABILITYLAB — разобрал плюсы и минусы сайта в плане юзабилити.

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

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

Сегодня мы повторим наш опыт и дадим подробную оценку юзабилити сайта венчурного фонда Vestor.in. Поехали!

О чем спросить венчурный фонд

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

  1. Составить общее впечатление о венчурном фонде и о его деятельности (получить ответ на вопрос «Что и для кого они делают?»);

  2. Получить подробную информацию об инвестиционных программах (получить ответ на вопрос «Что это мне даст?»);

  3. Увидеть портфолио и преимущества (получить ответ на вопрос «Каковы их преимущества?»);

  4. Связаться с представителями фонда (или получить контактные данные).

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

Общая структура сайта

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

Можно выделить одно мелкое замечание — страница никак не намекает на то, что ее можно прокручивать.

Навигация

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

    Этот тип навигации по странице также является традиционным для одностраничников.

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

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

Главная страница

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

  1. Первый экран, открывающийся взору пользователя, посвящен, как и в случае сайта Prostor Capital, чисто имиджевым вещам:

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

  2. Далее следует плашка с общей информацией о фонде:

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

  3. Следующая на очереди — плашка с ключевыми тезисами о деятельности компании:

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

  4. Следующая плашка показывает ключевые показатели деятельности фонда:

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

  5. Следующая плашка носит чисто имиджевый характер. Замечаний по ней нет — свою роль она выполняет прекрасно:

    З

  6. Практически нет замечаний и по плашке с командой:

    Попенять можно только за «псевдокликабельные» красные выделения в тексте, но мы это уже сделали.

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

  7. Следующая плашка с критериями для соискателей по структуре почти не отличаетя от плашки с ключевыми тезисами о деятельности компании — и ей свойственны все те же плюсы (красиво) и минусы (непонятные кликабельные плашки):

  8. Далее следуют короткие мудрые цитаты (они так и называются) от владельцев компании:

    На наш взгляд, они сложно смотрятся на «ребристом» фоновом рисунке, трудно считываются и потому теряются.

  9. Плашка с портфолио хорошо структурирована и содержит мелкие приятные фишки:

    Например, смена фильтра проектов сопровождается приятной анимацией.

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

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

  10. Следующая плашка посвящена «Твиттеру»:

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

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

  11. Продолжает страницу плашка с контактными данными — тот самый призыв к действию, которого так не хватало на страницах Prostor Capital:Любопытно, что владельцы сайта искусственно ограничивают форму обратной связи ироничным текстом о том, что владельцы стартапов никогда не пишут о своих стартапах через формы обратной связи, тем самым давая понять, что ожидают с формы предложений другого рода. Возникает вопрос — как тогда контактировать англоговорящим пользователям с администрацией сайта, если других контактных данных нет? Впрочем, возможно, сюда замешана какая-то специфика работы фонда со своими партнерами, которую мы не знаем.

  12. И, наконец, завершается страница подвалом с логотипом фонда:

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

Второстепенные страницы

Коснемся второстепенных страниц — в их роли у нас выступают, в первую очередь, страницы блога:

Структура ее традиционная, и основная проблема страницы — в контенте: он откровенно мусорный. Новости никак не прописаны, заголовки приводятся на русском языке, в тегах и датах творится хаос:

В общем, этот раздел явно не предназначен для работы.

Еще одна второстепенная страница, требующая отдельного рассмотрения — страница ошибки 404.  Здесь, напротив, все в порядке:

 

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

Русская версия сайта

Отдельного разговора заслуживает русская версия сайта:

Она в целом соответствует своему англоязычному аналогу со всеми его плюсами и минусами, но есть и своя специфика:

  1. Как ни странно для фонда с наполовину русской командой, перевод выполнен не слишком удачно — очень много фраз, переведенных с английского дословно, например:

    Есть и просторечные обороты, выбивающиеся из общей стилистики. Это, конечно же, вопрос контента, но он критичен с точки зрения восприятия сайта пользователями.

  2. Часть интерфейсных элементов так и не переведена:

  3. Часть переведенных фраз расходится с английскими по смыслу:

    В английской версии, напомним, речь шла о том, что форму обратной связи нежелательно заполнять тем, кто представляет стартап — и намекалось, что все остальные эту форму могут заполнить. Здесь же от этого намека не осталось и следа (непонятно, к тому же, что такое «13 папка»).

  4. Добавилась плашка с телефоном — прямо перед подвалом:

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

  5. Раздел «Блог» пуст:

Резюме

При разборе сайта Vestor.in возникло только одно крупное замечание, которое касается блога — сейчас этот раздел представляет собой неработающую, мертвую структуру что на англоязычном, что на русскоязычном варианте сайта. Это целесообразно поправить в первую очередь, попутно выровняв логику навигационных меню — и самым верным решением было бы удалить «Блог» совсем.

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


comments powered by Disqus

Подпишитесь на рассылку RUSBASE

Мы будем вам писать только тогда, когда это действительно очень важно

Нажмите "Нравится",
чтобы читать Rusbase в Facebook