Перепроектирование Мира человека
05-11-2009, Андрей Федяев
Компания Мэйл.ру попросила деликатно улучшить страницу Мира человека в сети Мой Мир http://my.mail.ru/. Требовалось проработать компоновку блоков и дизайн нескольких элементов.
Вот как выглядела тогда эта страница:
Сбор данных
Для того, что бы выяснить что чаще всего используется людьми в социальных сетях, было проведено два интервью-наблюдения за действиями пользователей и произведён интернет-опрос 38 человек.
Основным вопросом при проведении опроса был следующий: «Какими ты соцсетями (одноклассники, в контаке, мой мир на мэйле.ру,…) пользуешься. Что в них используешь, что из используемого нравится, а что — нет». Если респондент не полностью отвечал на вопрос, то задавались уточняющие вопросы.
В ходе обработки данных выяснилось, что респонденты составили примерно три равные группы. В таблице ниже группы обведены овалами:
В первую группу вошли пользователи, которые пользуются одновременно тремя сетями: Моим кругом, Одноклассниками и В контакте. Вторую группу составили исключительно пользователи одноклассников. Третья – это пользователи одновременно и Одноклассников и В контакте.
Обработка данных
Поскольку целью исследования было погружение в среду пользователей социальных сетей и определение основных вещей, которыми они в них пользуются, то полученные результаты не зависят от того, в какую группу входили респонденты.
Самыми популярными в социальных сетях вещами оказались:
— Чаты 31 чел.
— Фото 28 чел.
— Поиск людей 16 чел.
— Видео 14 чел.
— Аудио 8 чел.
— Файлы 3 чел.
Плюсы и минусы, высказанные пользователями, были сведены в следующую таблицу:
Общая компоновка
Изучение системы проектов Mail.ru выявило ряд недостатков в навигации, для устранения которых в рамках проекта «Мой мир» было разработана общее компоновочное решение:
Трёхколоночная вёрстка, используемая в настоящее время, позволяет разделить блоки, ориентированные на разную информацию. Первая колонка, залитая оранжевым цветом предназначена для рекламы других проектов Mail.ru. При переходе с этих блоков пользователь попадает в разделы проектов, которые не содержат его собственный контент. Вторая колонка покарашена в зелёный цвет. При клике по элементам этой полосы пользователь остаётся в текущем проекте (Мой мир). Третья, синяя полоса предназначена для доступа к пользовательской информации в других проектах, таких как «Фото», «Видео» и т.д. Такое компоновочное решение позволит упорядочить систему навигации и устранит путаницу в переходах.
Подробная компоновка
Для производства подробной компоновки были использованы результаты обработки информации. Они были сведены в таблицу для определения приоритетов блоков:
Приоритет каждого блока складывался из частоты его использования, а также из количества упоминаний о нём в таблице Плюсов и минусов, высказанных пользователями.
Конечно же компоновочное решение не сразу приняло стройный вид, сначала, как всегда, в ход шли карандаш, бумага и ластик:
Вот подробная компоновка личной страницы:
А это подробная компоновка чужой страницы:
Детальное проектирование
Часть элементов страницы была проработана до уровня передачи дизайнеру сначала карандашом (много времени ушло на меню):
… а потом и в редакторе:
Услуги:
* Аудит юзабилити – комплексная экспертиза
* Модернизация интерфейса – постепенные улучшения
* Экстремальное юзабилити – быстрый старт
* Проектирование интерфейса – тщательная проработка
Резюме, проекты, отзывы: http://fedyaev-andrey1.moikrug.ru
Другие интересные публикации:
Рубрика: Всячина.