Огромная и очень богатая компания, собравшая под своим крылом множество профессионалов, лучших спецов по юзабилити. Компания, занимающаяся сбором статистик, собирающая фокус-группы, проводящая маркетинговые исследования. Всякий раз возникает один и тот же наболевший вопрос: где результат, который устроит пользователя? Сейчас Фейсбук — воплощенный в реальность бардак.
Первый раз я пытался стать его пользователем году так в 2009, когда он вдруг стал «модным» и многие мои друзья перебрались туда из ВК. Но многие там не прижились. Меня, например, пугало абсолютно все: от сине-сиреневого цвета шапки до непонимания того, что произойдет при нажатии вон-на-ту-кнопку. В течение следующих нескольких лет мы молча наблюдали за усложнением интерфейса, когда весь мир стремился к простоте.
Но моя статья не о том. Я хочу представить вашему вниманию свой труд, на который меня изначально натолкнул пользователь Klimentij, написавший статью «Юзабилити Facebook». Долгое время хотел им заняться и вот, наконец, появилось свободное время.
Мой выбор пал на создание концепта приложения для айпада, поскольку современный мир все больше становится мобильным, люди все чаще выходят в социальные сети со смартфонов и планшетов. К тому же мобильный Фейсбук обделен пока что рекламой и собрал лишь основные и самые нужные функции своего старшего брата.
Зачем это надо? Я хочу показать свой Фейсбук с простым и понятным интерфейсом, который будет дружелюбным по отношению к пользователю, повысить юзабилити и сделать его более трендовым. Хочу заметить, что это лишь мое видение проблемы, многие элементы могут нуждаться в переосмыслении, так что не судите строго.
Весь УИ представлен на английском. Во-первых, ближе к оригиналу; во-вторых, в текущей версии его русификация некорректна.
Экран входа
Текущее мобильное решение встречает нас уже весьма неплохим логин-скрином. Там нет ничего лишнего. На мой взгляд, правильная политика — по-умолчанию ставить акцент на то, с чем пользователь взаимодействует чаще, то есть, в данном случае, это вход в приложение, а не регистрация, как в браузерной версии.
Почему? Во-первых, новый пользователь, видя перед собой незнакомый экран, в любом случае постарается изучить его и найти кнопку регистрации. Во-вторых, регистрация нужна ему только один раз, и нет смысла постоянно показывать ее. Поэтому изменим лишь дизайн.
Картинка крупнее (1200х1500 px., 132 Кб.)
Таймлайн, она же Главная
После входа в приложение мы попадаем именно сюда. Первым делом я исправил фейсбучные приблизительные «about an hour ago» на точное время. Не знаю как вам, а мне так гораздо удобнее ориентироваться в потоке новостей. Сверху мы видим шапку-гибрид, которая подстраивается под конкретную страницу (примеры ниже). Сейчас на ней поиск, блок нотификаций, ссылка на свой профиль и кнопка чек-ина. Под шапкой календарь, позволяющий указать конкретную дату хроники. Очень не хватало этого функционала, так как часто бывали случаи, когда нужно найти какую-либо новость двухдневной давности. Справа — фильтры хроники и пользовательских групп. Последний позволяет показывать хронику только тех друзей, которые занесены в конкретную группу.
Так же фильтром являются иконки событий. При нажатии, допустим, на фотографии — в ленте останутся лишь записи с прикрепленными фото.
Далее все стандартно — комментарии разворачиваются при клике на них. Если мы прокомментируем запись, то значок станет активным, так же и с лайками.
Картинка крупнее (1200х1500 px., 336 Кб.)
Чужой профиль
Пожалуй, зайдем в профиль к блондинке Челси. Мы сразу видим, как поменялась шапка. Теперь слева красуется логотип ФБ, он же ссылка на Хронику. Рядом с ним появилась ссылка назад, на предыдущую посещенную страницу.
Так как Челси у нас в друзьях, мы не видим подробную информацию о пользователе, она доступна по свайпу влево. У пользователей не из френд-листа по-умолчанию информация расположена на основном экране.
Меню разделов будет теперь уезжать наверх, к шапке, в случае прокрутки Таймлайна и других разделов. Но об этом чуть позже.
Картинка крупнее (1200х1500 px., 519 Кб.)
Свой профиль. Вкладка «Друзья»
Справа в шапке, вместо ссылки на свой профиль появилась настройка его, этого самого профиля. Так же эта иконка отвечает за общие настройки приложения. Основная информация о себе любимом скрыта, как и в случае с Челси, дабы не захламлять обложку. Под меню разделов мы видим выберайку вида представления информации, поиск по друзьям, кнопку «Найти новых друзей» и фильтры. Слева фильтруются пользовательские группы. Справа — последние посещенные друзья, представление списка по алфавиту и те, кто рядом (да-да, ведь существуют же чекины!). Под именами друзей мы видим кнопку быстрой отправки сообщения. Зеленые колечки — онлайн-индикатор. Ничего лишнего.
Картинка крупнее (1200х1500 px., 554 Кб.)
На этом рисунке мы видим, что произойдет, если проскроллить список друзей. Меню поднялось, освобождая нам больше пространства. Так же я хочу показать возможность быстрого создания группы пользователей. Все просто: захватили и тащим на любого другого друга.
Картинка крупнее (1200х1500 px., 427 Кб.)
Картинка крупнее (1200х1500 px., 344 Кб.)
Заключение
Как-то этой весной Badoo, тоже, надо сказать, достаточно крупная компания, имеющая очень серьезные проблемы с юзабилити своего сервиса, решила существенно поменять политику и перестать мучить своих пользователей. Лондонцы организовали конкурс среди дизайнеров России и Украины на разработку концепта нового интерфейса для айпада. Сперва у них было все то же стандартное, а-ля ФБ и ВК, приложение. Баду не стали идти протоптанной дорожкой и решили сделать ставку именно на мобильную версию и, насколько я знаю, дела у них сейчас идут хорошо. Я был одним из участников и, позже, одним из финалистов этого конкурса. Та работа, что они выбрали, напрямую отражает новую стратегию яркой и динамично-развивающейся компании. А вот ФБ, неповоротливый монстр, все продолжает компрометировать себя и насиловать нас с вами своим лишенным логики интерфейсом, в котором, в прошлом году, как известно, не смогла разобраться сама сестра Цукерберга.
Спасибо, что дочитали до этого места. Буду рад объективной и разумной критике в комментариях.
ссылка на оригинал статьи http://habrahabr.ru/post/185410/
Добавить комментарий