{ "version": "https:\/\/jsonfeed.org\/version\/1.1", "title": "Московский: Дизайн & Тимлид: заметки с тегом UX", "_rss_description": "Продуктовый дизайнер ведет блог про работу", "_rss_language": "ru", "_itunes_email": "", "_itunes_categories_xml": "", "_itunes_image": "", "_itunes_explicit": "", "home_page_url": "https:\/\/blogdm.ru\/tags\/ux\/", "feed_url": "https:\/\/blogdm.ru\/tags\/ux\/json\/", "icon": "https:\/\/blogdm.ru\/pictures\/userpic\/userpic@2x.jpg?1760290258", "authors": [ { "name": "Дмитрий Московский", "url": "https:\/\/blogdm.ru\/", "avatar": "https:\/\/blogdm.ru\/pictures\/userpic\/userpic@2x.jpg?1760290258" } ], "items": [ { "id": "66", "url": "https:\/\/blogdm.ru\/all\/nuzhny-li-poloski-vnutri-tablicy\/", "title": "Нужны ли полоски внутри таблицы", "content_html": "

Решил разобраться как лучше сделать с полосками или нет.<\/p>\n

\n\"\"\n<\/div>\n

Сперва смотрю на сайте бюро: нашел статью про черезполосицу,<\/a> они предлагают её убирать. А вот мнение Ильи Бирмана насчет линий.<\/a> И у него же отличный пример таблицы без полосок:<\/p>\n

\n\"\"\n
http:\/\/biathlontime.com\/2018-2019\/cup\/women\/nations\/<\/a><\/div>\n<\/div>\n

Нужно взглянуть на примеры других сервисов:<\/p>\n

\n
\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n<\/div>\n<\/div>\n

В моем случае решил выбрать 1 вариант:<\/p>\n

\n\"\"\n
Пример с работы: между строчек есть или нет разделительной линии (шапку замазал, чтобы ни кто не догадался)<\/div>\n<\/div>\n

Для себя нашел такие зависимости:<\/h3>\n
    \n
  1. Если в таблице 2-3 значения цифр то можно обойтись и без полосок: смотрится вполне хорошо.<\/li>\n
  2. Когда много цифр и они находятся на непредсказуемом расстоянии друг от друга, по всей длине экрана — то полоски лучше использовать.<\/li>\n
  3. Черезполосицу просто так использовать не стоит, но в анализе финансовых показателей этот приём может обозначать рост и падение акций.<\/li>\n
  4. Если делать полоски, то делать их незаметными, серенькими.<\/li>\n<\/ol>\n", "date_published": "2019-11-20T14:54:12+01:00", "date_modified": "2019-12-26T20:20:12+01:00", "tags": [ "UX", "дизайн", "таблиц" ], "image": "https:\/\/blogdm.ru\/pictures\/--2019-12-26--22.13.59.png", "_date_published_rfc2822": "Wed, 20 Nov 2019 14:54:12 +0100", "_rss_guid_is_permalink": "false", "_rss_guid": "66", "_e2_data": { "is_favourite": false, "links_required": [ "jquery\/jquery.js", "fotorama\/fotorama.css", "fotorama\/fotorama.js" ], "og_images": [ "https:\/\/blogdm.ru\/pictures\/--2019-12-26--22.13.59.png", "https:\/\/blogdm.ru\/pictures\/2019-12-26@2x.png", "https:\/\/blogdm.ru\/pictures\/website-pre-4.jpg", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.13.14.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.21.34.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.22.17.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.20.25.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.13.37.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.12.35.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.13.00.png", "https:\/\/blogdm.ru\/pictures\/Screenshot-2019-11-20-at-13.33.14.png", "https:\/\/blogdm.ru\/pictures\/Frame-51.png" ] } }, { "id": "62", "url": "https:\/\/blogdm.ru\/all\/kak-ocenivat-ux-dizayn-bez-issledovaniy\/", "title": "Как оценивать UX дизайн бесплатно и без исследований", "content_html": "

    Предположим у нас есть 2 варианта пути пользователя. Как определить, что один из них лучше другого? В моем примере ниже — это очевидно: чем меньше экранов, тем лучше.<\/p>\n

    \n\"\"\n
    Два варианта сценария покупки<\/div>\n<\/div>\n

    Но, что делать если количество экранов равно? Когда я столкнулся с такой задачей, то начал считать количество действий пользователя. Например, тут нужно: навести на кнопку «купить», нажать на кнопку, на другом экране прочитать заголовок, навести на кнопку добавить в корзину и т. д. Когда все действия расписаны, легко заметить, где нужно совершить меньше движений.<\/p>\n

    Метод GOMS<\/h3>\n

    Более продвинутую методику я услышал от одного из спикеров на Media & Design Conference.<\/a> Они так же считают количество действий пользователя, но еще переводят действия в секунды и оценивают финально сколько пользователь тратит времени на каждый экран. Самое интересное — расчеты времени пользователя.<\/p>\n

    \n
    \n

    K = 0,28 c <\/b>— нажатие клавиши клавиатуры;
    \nB = 0,2 с<\/b> — клик мышью;
    \nP = 1,1 с<\/b> — среднее время нахождения любого объекта на сайте;
    \nH = 0,4 с<\/b> — перемещения руки с клавиатуры на мышь (или обратно);
    \nM = 1,35 с<\/b> — ментальная пауза (время на обдумывание следующего шага).<\/p>\n<\/blockquote>\n<\/blockquote>\n

    Почему то запись этого доклада пропала, но я для себя наскриншотил самое важное:<\/p>\n

    \n
    \n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n<\/div>\n<\/div>\n

    С помощью этого способа можно доказать удобство одного из вариантов, но этот метод имеет свои исключения: например огромную форму для заполнения лучше разбить на несколько экранов.<\/p>\n", "date_published": "2019-11-03T22:00:33+01:00", "date_modified": "2019-11-04T10:21:44+01:00", "tags": [ "UX", "дизайн" ], "image": "https:\/\/blogdm.ru\/pictures\/maket.jpg", "_date_published_rfc2822": "Sun, 03 Nov 2019 22:00:33 +0100", "_rss_guid_is_permalink": "false", "_rss_guid": "62", "_e2_data": { "is_favourite": true, "links_required": [ "jquery\/jquery.js", "fotorama\/fotorama.css", "fotorama\/fotorama.js" ], "og_images": [ "https:\/\/blogdm.ru\/pictures\/maket.jpg", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.16.20.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.33.30.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.35.32.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.35.04.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.27.23.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.26.43.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.26.33.png", "https:\/\/blogdm.ru\/pictures\/--2019-10-29--13.36.01.png" ] } }, { "id": "60", "url": "https:\/\/blogdm.ru\/all\/kak-provodit-ux-issledovaniya\/", "title": "Как проводить UX исследования", "content_html": "

    Недавно я был на интенсиве в Британке. Необходимость проведения исследований над продуктом подчеркивал каждый лектор. И это правильно: наша модель мира, модель мира нашей команды может сильно отличаться от реальных пользователей. Материал интенсива и знания из опыта я попробую описать в этой статье.<\/p>\n

    \n\"\"\n
    Твой мир может сильно отличаться от мировоззрения других<\/div>\n<\/div>\n

    Необходимо замерять показатели эффективности.<\/h2>\n

    Когда я открыл магазин матрасов, было мало конкурентов. Покупатели находили пару сайтов, выбирали и шли ко мне. Покупатели были, прибыль была → магазин рос. Но все изменилось через пару лет. Когда конкурентов стало много → клиенты стали реже приходить. Как понять где причина, что стало меньше покупателей? Я стал измерять показатели: сколько людей заходят на сайт, сколько времени они тратят, сколько из них звонят, приходят в магазин и создают заказ.<\/p>\n

    \n\"\"\n
    Воронка продаж в моем представлении<\/div>\n<\/div>\n

    Горькая правда: Даже 1 шаг, который людям придется сделать, чтобы воспользоваться вашим продуктом, может стоить вам бизнеса.<\/i><\/p>\n

    \n

    Пример про такси: таксисты 90% времени простаивали. В то время как клиенты искали их на остановках, звонили по телефону диспетчеру. Диспетчер искала водителей по рации. Водители соревновались у кого лучше рация и реакция. Когда появилось приложение для водителей, водители видели где клиент, а клиентам не нужно звонить диспетчерам. Все в выигрыше!<\/p>\n<\/blockquote>\n

    Так должен себя вести идеальный продукт: Чтобы воспользоваться вашим продуктом, люди вообще ничего не должны «делать». Это ваш бизнес должен незаметно интегрироваться в человеческую жизнь.<\/i><\/p>\n

    Чтобы найти то, что может незаметно встроиться в нашу жизнь нужно найти потребность пользователей. Для этого проводят исследования. А для проведения достоверных исследований нужен целый арсенал умений:
    \n— Слушать
    \n— Слышать
    \n— Понимать реальную задачу
    \n— Анализировать предпосылки, мотивы
    \n— Правильно выстраивать беседу
    \n— Читать эмоции человека<\/p>\n

    С полученными результатами тоже нужно уметь работать. Например, нужно уметь абстрагироваться от своего мнения и искать главное, отсекая слабые решения. Это звучит просто, но на практике применять этот принцип начинающему дизайнеру очень сложно. Со мной была такая когнитивная ошибка: нарисовал интерфейс, который, по-моему мнению, идеально выполнял задачу. Чтобы его проверить, я подходил к людям и предлагал им выполнить задание. Положительные ответы от пользователей я приумножал, а когда пользователь не справлялся — про себя я отмечал, что он «просто не целевая аудитория».<\/p>\n

    \n\"\"\n
    Я часто искал подтверждение своего решения<\/div>\n<\/div>\n

    Исследования помогают:<\/h3>\n

    — найти проблемы интерфейса;
    \n— выявить и описать потребности пользователей;
    \n— правильно сформулировать бизнес-требования;
    \n— проверить эргономику решения.<\/p>\n

    Качественное или количественное исследование<\/h2>\n

    Количественные<\/b> — проверка решения на большом количестве респондентов. Например, сравнить два варианта дизайна и выбрать лучший. В этом помогает Яндекс Толока<\/a>. Там много пользователей за копеечку сравнивают картинки. Для заказчиков — это возможность сравнить дизайн, опросить пользователей. Когда из 100 опрошенных, 70 выбирают вариант, который тебе казался хуже, это удивляет.<\/p>\n

    Качественные<\/b> — это часто наблюдение и опрос пользователя о том, что он делает. Пользователи могут привирать, придумывать, советовать улучшения в интерфейсе. В этом исследовании много тонкостей, поэтому особо важно фильтровать информацию и правильно его проводить. Далее про качественные исследования:<\/p>\n

    Виды качественных исследований:
    \n— Интервью: узнаем боли и потребности
    \n— Юзабилити-тестирование: замеряем удобство
    \n— Карточная сортировка: говорим о структуре
    \n— Наблюдение: изучаем контекст
    \n— Опрос: узнаем мнение.
    \n— Соц сети\/звонки\/поддержка: читаем обратную связь.<\/p>\n

    При проведении интервью следим, чтобы:<\/h3>\n

    — у нас были открытые вопросы,
    \n— мы молчим и слушаем, больше говорит респондент,
    \n— не задаем вопросы с вариантами ответа,
    \n— не поддакиваем пользователю, не говорим: «да нажимайте сюда...»
    \n— не используем профессиональный лексикон,
    \n— придерживаемся плана интервью, тратим не более 45 мин,
    \n— исследовать опыт пользователя, без вопросов (а если бы... вы купили?),<\/p>\n

    Пользователи врут<\/h2>\n

    И мы тоже. Дето в том, что наш мозг изменяет прошлое, мы помним информацию искаженно, забываем и редактируем эмоциональные события; добавляем пробелы информации из стереотипов, упрощаем события и числа, отбрасываем частности. И еще множество искажений на картинке:<\/p>\n

    \n\"\"\n
    Большая картинка<\/a><\/div>\n<\/div>\n

    Большая часть материалов составлена на основе лекции Алины Ермаковой. А вот её курс<\/a>.<\/p>\n

    Мой телеграмм канал<\/a>
    \nP.S: волшебные фразы при тестировании: «мы тестируем интерфейс, а не вас. Тут нет неправильных ответов или правильных», «А как вам кажется, что это?»,<\/p>\n", "date_published": "2019-08-26T10:22:13+01:00", "date_modified": "2019-09-15T13:32:09+01:00", "tags": [ "UX", "дизайн", "Интенси", "исследования", "конспект" ], "image": "https:\/\/blogdm.ru\/pictures\/1-com.jpg", "_date_published_rfc2822": "Mon, 26 Aug 2019 10:22:13 +0100", "_rss_guid_is_permalink": "false", "_rss_guid": "60", "_e2_data": { "is_favourite": false, "links_required": [], "og_images": [ "https:\/\/blogdm.ru\/pictures\/1-com.jpg", "https:\/\/blogdm.ru\/pictures\/2-com.jpg", "https:\/\/blogdm.ru\/pictures\/3-com.jpg", "https:\/\/blogdm.ru\/pictures\/SPC.png.jpg" ] } } ], "_e2_version": 4134, "_e2_ua_string": "Aegea 11.3 (v4134)" }