Рубрика «юзабилити» - 22

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

7. Карта ума.

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

Для создания карты ума (её чаще называют английским термином «Mind map»), мы можем использовать специальное ПО, я рекомендую Xmind.

Для начала нужно взять несколько наших документов с идеями, которые мы сделали на прошлых этапах, их мы будем систематизировать. Все идеи необходимо разбить на глобальные блоки (разделы). Например, представим, что мы проектируем портал недвижимости, глобальными блоками которого могут быть: каталог недвижимости; сообщество; статьи-новости; база знаний и т.д. Все идеи мы должны распределить по этим глобальным блокам. Взаимоисключающие идеи объединяем или выбираем одну из них. По принципам мозгового штурма отбрасываем малополезные идеи, вернее оставляем до лучших времен. Общее количество блоков должно соответствовать будущим разделам сайта, у каждого из разделов могут быть подразделы. В идеале количество разделов не должно превышать 7-8 для большого портала, если мы проектируем, например, СМИ, там может быть много разделов, которые по сути отличаются только тематикой контента, но имеют одинаковое назначение, такие варианты тоже допустимы, но с ними нужно быть очень осторожным, важно, чтобы пользователь не запутался.

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

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

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

Вступление

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

Прежде всего, давайте разберемся, кто именно должен заниматься проектированием сайтов. Существует особая специальность для этого вида работ, а соответствующий человек называется проектировщик. Я сознательно не употребляю модных понятий типа UI (UX), потому что в статье речь будет идти не только об интерфейсах. Данный специалист должен обладать хорошей логикой, аналитическим складом ума, иметь очень богатый пользовательский опыт, мыслить предпринимательскими (экономическими) масштабами, быть внимательным к деталям. Кроме этого, он должен хорошо разбираться в интерфейсах и юзабилити, технологиях веб-разработки, маркетинге и многих других сферах. В процессе работы проектировщик, конечно, может советоваться с разными экспертами: дизайнерами, верстальщиками, программистами и т.д., дабы спроектировать продукт наивысшего качества. Получился довольно широкий образ идеального проектировщика, однако «из песни слов не выкинуть».

Процесс проектирования

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

Возникла задача проведения сплит-тестирования нашего интернет-магазина. Погуглил на эту тему. Нашел пару сервисов, но по тем или иным причинам они нам не подошли.
Читать полностью »

Twitter Bootstrap становится всё популярнее и популярнее, многие используют его в своих проектах, думаю еще больше людей используют для прототипирования интерфейсов. Я не исключение. И вот сегодня утром наткнулся на интересный сервис — LayoutIt. По сути LayoutIt — это онлайн редактор для создания интерфейсов с использованием Boostrap. Редактор представляет собой Drag & Drop интерфейс.
Онлайн редактор для Boostrap — LayoutIt
Читать полностью »

Уже три года я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-декабрь 2012.

Обзор свежих материалов, январь-март 2013Читать полностью »

От переводчика: эта статья общего характера, не имеет прямого отношения к веб-дизайну или UI, в частности. Тем не менее, думаю, что эти вещи нужно помнить всегда.
Большое спасибо в переводе Оле @OlgaTeslenko

Когда мы думаем о дизайне, мы обычно представляем себе вещи, которые избраны, потому что они спроектированы или нарисованы. Вазы, комиксы или архитектура…
Но оказывается, что большинство из того, что мы делаем или дизайним направлено ​​на аудиторию, которой необходимо кое-что другое. Дизайн важен, но сам по себе дизайн — не главное. Можно назвать это «общественный дизайн»…
Общественный дизайн создаётся для людей, которые должны заполнить нашу налоговую форму, работать с нашим сайтом или регистрироваться в нашем отеле вне зависимости от того, как он создан, а не благодаря этому.
В попытках улучшений в процессе работы, внешнего вида и мощности, иногда мы как раз ухудшаем продукт, потому что мы забываем об «общественной» части общественного дизайна. Если пользователь не нацелен или не заинтересован в инновационности нашего дизайна, мы обязаны отойти в сторону.
Читать полностью »

Метрика #3 — Подкаст о технологиях и проектировании интерфейсов и сервисовВсем привет! С вами «Метрика» – шоу для тех, кто создает и анализирует продукты и сервисы на различных платформах. Первого апреля мы ударно потрудились и записали аж два выпуска, предлагаем вашему вниманию продолжение нашей беседы:

Сегодня в выпуске

Платон Днепровский (hryusha), Артем Геллер (heller), Александр Бурт и Дмитрий Кабанов (dmitrykabanov) обсуждают новости из сферы электронного правительства, в частности последние инициативы и предложения по улучшению юзабилити гос. сайтов.Читать полностью »

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

С планшетами и специализированными устройствами (Nook, Kindle) все понятно: на мой взгляд, они более или менее справляются с задачей удобного отображения контента. Но вот с мобильными приложениями (ридерами) не все так гладко. Имея опыт разработки мобильных приложений для чтения различного контента, хочу рассказать об основных ошибках и особенностях мобильных читалок и контентных приложений.Читать полностью »

Дорогие хабрачитатели, я хочу представить вам видеозаписи всех докладов с 3-й профессиональной конференции веб-разработчиков WebCamp 2012, которая проходила в прошлом году в Одессе, а также пригласить вас на 4-ю конференцию WebCamp 2013, которая состоится с 12 по 13 июня.

В прошлом году мы расширили конференцию до 4 секций: веб-технологии и управление проектами; юзабилити и дизайн; интернет-маркетинг; стартапы. Провели несколько мастер-классов, Startup Crash Test и организовали аллею стартапов.

В этом году мы планируем пойти ещё дальше. Мы переместили конференцию на более тёплое время и увеличить время её проведения до 2-х дней. Первый день – доклады в потоках, второй день – мастер-классы. 4 основные секции мы расширим специализированными подсекциями, которые смогут подготовить и провести различные коммьюнити. Для того, чтобы подсекция была добавлена в программу, она должна иметь минимум 5 докладов. Наша команда побывала на киевском Startup Weekend и мы решили «привезти» его в Одессу. Поэтому приглашаем всех желающих после разогрева на WebCamp закрепить полученные знания путём создания собственного стартапа за 54 часа на Odessa Startup Weekend, который пройдет с 14 по 16 июня.

Регистрация на конференцию уже открыта. Для читателей Хабры мы даем 10% скидку, для её получения при регистрации необходимо указать промо-код Habrahabr.

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

Информацию о том, как проекту принять участие в аллее стартапов или в Startup Crash Test, можно найти здесь. Участие для стартапов бесплатное.

Под катом можно ознакомиться с видеозаписями докладов конференции WebCamp 2012.
Читать полностью »

В первой части статьи я рассказал о некоторых концептуальных провалах Facebook в области юзабилити. Сейчас я вооружился карандашом и бумагой и поставил перед собой такую вот задачу: если бы я был проектировщиком Facebook и мог бы сделать “все хорошо”, то с чего бы я начал?
image
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js