Ctrl + ↑ Позднее

Карта голосов на выборах

Поправил отображение данных о выборах 2016 года на карте США.

Исходная карта выглядит так:
https://xkcd.com/1939/
https://t.co/ahI3BCJvjn

Человечки были забавные, но так тяжело что-то разобрать по цветам. Приглушить границы на карте, добавить вариацию формы точек, сравнить три распределения. Зеленые «другие» теперь видны получше. Распределение синих и красных выглядит понятнее.

Типографика прежняя. Поменял только карту.

Как дороги захватывают город

Наглядно о том, как дороги захватывают территорию города. На примере участка карты Детройта.
https://twitter.com/arkadiygershman/status/945265035496083456

https://en.wikipedia.org/wiki/Michigan_Building

https://yandex.ru/images/search?text=парковка%20в%20театре%20детройт&lr=213

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

Театр на той же схеме города:

Запись из телеграм-канала.
25 декабря 2017, https://t.me/sergeykashin

20 апреля   Гугл   данные   карты   Эпл

Реальные данные — неидеальные

Запись из телеграм-канала.
18 декабря 2017, https://t.me/sergeykashin

Компания Блумлайф (Bloomlife) делает портативные датчики схваток для беременных. Опубликовали статью о том, как важно понимать качество данных. Данные от неидеальных источников. Заслуживает внимания:

Real Life is Messy. We Should Design For It.
On sensor data and the need for more transparency on signal quality.
https://medium.com/40-weeks/real-life-is-messy-we-should-design-for-it-d1d5f14270d3

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

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

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

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

О визуализации забега

Запись из телеграм-канала.
12 декабря 2017, https://t.me/sergeykashin

Красивая, любопытная, но не очень понятная, на мой взгляд, визуализация: https://smallmultiples.com.au/articles/visualising-sydneys-city2surf-2017/

Heartbreak Hill — буквально, холм. Но на диаграмме при взгляде на слово Hill легко перепутать по вертикали количество бегунов и высоту над уровнем моря.

Показали отдельный разрез с высотами, но без динамической визуализации бегунов:

20 апреля   визуализация   дизайн

О книге

https://evannex.com/blogs/news/new-book-excerpt-how-tesla-brought-a-systems-approach-to-the-automobile

Интересное:
Сложно превзойти Тойоту в штамповке металла, сборки, покраски и т. д. Но Тесла думает об эффективной и тесной интеграции систем, электроники и интерфейсов в автомобиле.

О системной архитектуре в Тесле и разрозненных устройствах в других автомобилях.

Интеграция софта и электроники. Меньше проводов. Цельное пользовательское взаимодействие. Тесла обновляет софт, и обновляет быстро.

Остальные автопроизводители обновляют развлекательные штуки.

Запись из телеграм-канала.
6 декабря 2017, https://t.me/sergeykashin

20 апреля   Интересное   книга   Тесла

Как менялась продолжительность жизни

Запись из телеграм-канала.
28 ноября 2017, https://t.me/sergeykashin

В «Гардиане» (The Guardian) изучили и показали, как менялась продолжительность жизни в Великобритании в течение 100 лет.

https://www.theguardian.com/lifeandstyle/ng-interactive/2017/sep/18/how-death-has-changed-over-100-years-in-britain

На графике: желтый — 1915 год, синий — 2015. Обратите внимание на большой график: изменение во времени показано на одном графике с помощью изменения цвета. Видно, как график продолжительности жизни переползает слева направо — люди стали жить дольше.

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

Очень интересно изучить распределение по возрастам и по причинам смерти:

В 1915 большинство детских смертей — от кори. Почти все взрослые возрасты равномерно покосило туберкулезом. Пожилые — от бронхита. И дальше интересные данные по 2015.

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

Неочевидная подсказка в клеточной графике ниже: одна клетка — 5 лет.

Безопасность — в мышлении

Сохраняю запись из телеграм-канала.
23 ноября 2017, https://t.me/sergeykashin

Еще пример из авиации про взаимодействие человека со сложными системами:
https://disciplesofflight.com/aviation-safety-mindset-attitude-skill/
Пилот проспал посадку и 158 человек погибли.
Статья о том, что безопасность — в голове. Это не только правильные процедуры. Это мышление.
Пока самолетами управляют люди, этот пример актуален.

Стюардесса сажает самолет Эйрбас А320

Сохраняю запись из телеграм-канала.
21 ноября 2017, https://t.me/sergeykashin

Интересный видеоролик: стюардесса на симуляторе самолета Эйрбас А320 управляет посадкой с помощью голосовых подсказок опытного пилота:

Стюардесса молодец. А подсказки опытного пилота вызывают вопросы. С точки зрения погружения новичка в незнакомый интерфейс.

На 57 секунде пилот говорит:
— Кнопочка Элтитюд» (Altitude).
На самом деле это не кнопочка, а вращающаяся ручка. Несколько секунд потеряны. Хотя пилот знает, что это ручка, и дальше называет ее ручкой.

Дальше пилот подсказывает:
— Прочитайте на основном пилотажном дисплее»,
но стюардесса еще не знает, где он.

На 1:54 пилот говорит:
— Нажмите любую кнопку на Эф Эм Эс» (FMS).
Но стюардесса не знает, что такое FMS.

Уточняет,
— на Эф Эм Эс, который находится на центральном пульте.
Но что такое центральный пульт?

Дальше уточняет:
— Это флайт менеджмент систем, это компьютер самолетный.

Понятнее не стало.

Стюардесса переспрашивает:
— Это который внизу находится?
— это слева и справа на центральном пульте.

Стюардесса находит, и тут пилот дает следующую команду:
— Теперь вторую или третью кнопку нажмите слева.

Смотрите, какая ситуация: в кабине человек, который не знаком с пилотированием самолетов. Пилот, дающий подсказки, принимает решения. Человеку в кабине нужно только выполнять команды. Но тут пилот перекладывает решение на стюардессу: «вторую или третью кнопку». С точки зрения пилота, видимо, все равно: в данной ситуации подойдет любая кнопка. И пилот понимает, почему все равно. А стюардесса в кабине не понимает. Как человек в кабине должен выбрать, вторую или третью? Если все равно какую, лучше чтобы решение принимал знающий пилот, потому что это тоже решение.

На 3:26 пилот командует нажать кнопку DIR, но не подсказывает, что она, в отличие от предыдущей, находится не на экране, а внизу на кнопочной панели. Стюардесса задерживается на выполнении этой команды.

Далее там же, пилот дает команду:
— Напечатайте, юнифом майк.
— Просто печатаю?
— Просто печатайте, юнифом майк. И в левый верхний угол его.

Вот вы бы как это поняли? ?

Стюардесса, логично, начинает набирать на клавиатуре: uniform…
и переспрашивает:
— Это всё в одно слово печатается?
— Юнифом майк, две буквы всего лишь.
— Как две буквы?.. Я пишу слово юниформ…
— Нет! Ю, Эм.

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

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

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

Если нужны действия на центральном пульте, нужно сначала объяснить человеку, как найти центральный пульт. С чего, собственно, начинать. И обязательно убедиться, что человек правильно понял, а то мало ли что он там принял за центральный пульт. Нужна обратная связь. Если пилот разговаривает со стюардессой по радио, то в виде устного ответа на открытый вопрос. Типа, «Скажите, что вы видите на центральном пульте». В ответ пилот должен услышать, что стюардесса видит на пульте, и это что-то должно отличать именно этот пульт. Если стюардесса отвечает что-то общее типа «вижу экран и кнопки» — этого недостаточно, нужно уточнять.

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

И тут интересно с терминологией. Ее тоже нужно вводить постепенно. Пилот говорит «праймари флайт дисплей», а  дисплеев-то много, попробуй не ошибись.

Виртуальные арт-сессии

Сохраняю запись из телеграм-канала.

Художники рисуют в виаре (VR) трехмерные, хм, «картины» не скажешь, — произведения. Сходу кажется, что примитивно, но это круто: это не видео, а трехмерные объекты, распределенные во времени. Время можно ускорять и прокручивать, чтобы смотреть разные стадии.

https://virtualart.chromeexperiments.com/artists/andrea-blasich/sessions/bull/

О технологиях:
https://virtualart.chromeexperiments.com/#/tech

Круто, что трехмерными точками отображается отсканированная фигура автора, точное расположение очков на голове и инструментов в руках.

А в углу мини-камера показывает, как сцену видит автор. Между двумя точками обзора можно переключаться.

20 апреля   3d   art   Tilt brush

Сомнительная история со скриншотами

Технология Скриншильд (ScreenShield) блокирует создание скриншотов. Функция автоматически запускается перед моментом создания скриншота и делает так, чтобы скриншот получился пустым. Технологию разрабатывает команда мессенджера Конфайд (Confide).

https://daringfireball.net/2018/01/screenshield

https://blog.getconfide.com/introducing-screenshield-ios-screenshot-prevention-for-confide-and-beyond-692bbae2c31d

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

Мне кажется, что это сомнительная история. Почему? Расскажу на более простом примере. Представьте, что вы идете в гости и у вас есть текстовое сообщение: «Код домофона 2951, 8 этаж. Заходите, друзья!». Хочется сохранить код и этаж. Выделяете кусок текста, копируете, сохраняете в текстовой заметке, типа, «Вася, Код домофона 2951, 8 этаж». Чтобы в следующий раз не переспрашивать.

Представим, что мессенджер программно блокирует функцию копирования. Нельзя скопировать адрес и сохранить. Но вы уже получили информацию: Код домофона 2951, 8 этаж. Она уже в вашей голове, с точностью до буквы. Мессенджер блокирует копирование, но нельзя заблокировать (пока) память человека. Поэтому переключаемся в текстовые заметки и пишем вручную: Код домофона 2951, 8 этаж. То же самое. Но неудобно!

Это может вызвать негативные эмоции: информация перед вами, а вы не можете ее сохранить стандартным способом. Нелепо.

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

В этом контексте особо цинично выглядит текст на сайте продукта:

But we have always wanted to do better — to make iOS completely screenshot-proof across all media formats — text, images, videos, documents, stickers, and more.

Better?! Screenshot-proof?! WTF…

Компания пишет, что сделали эту функцию уже на платформах Андроид, Мак и Пи-Си. Про писюки и андроиды с безопасностью понятно — там разброд и шатание, но Эпл? Надеюсь, со временем Эпл выпилит эту возможность или как-то грамотно её отрегулирует.

О важности знания языка

Гарик Мартиросян говорит о важности знания русского языка в интервью Юрию Дудю.
Смотрите с 9:50 до 12:30.

«В России главный инструмент юмориста — это русский язык».
«Если ты не умеешь обращаться с русским языком — ты ноль в этой стране».

Вместо «юмориста» можно подставить и другие профессии.

Интерфейс, тактильность, авиация.

Традиционный интерфейс кабины самолета: множество кнопок, рычагов, переключателей. Большой штурвал, педали, ручки управления двигателями. Приборы, которые можно трогать, управлять руками. Форма интерфейса зависит от функции и может подсказывать назначение.

Осторожно!
Уберите громкость до минимума!
На видео громко шумят двигатели.

Место пилота грузового Ан-12:

Сравнение кабин Боинг-737 и Эйрбас-A320:

(топят за Эйрбас, но сейчас не про это)

Немного панели Су-25:

В последние годы в авионике появляются экраны с тач-интерфейсом. Компания Талес (Thales) создает и продвигает авиационные панели управления на тач-скринах.

Вот менеджер по маркетингу говорит о том, что они предлагают ставить в кабины пилотов большие тач-скрины:

Отдельно вызывает вопросы факт, что о такой штуке рассказывает менеджер по маркетингу, а не пилот.

Но вот про какую интересную деталь хочу сказать:
по-французски он говорит 100 % tactile.
Tactile — тактильный, осязаемый (фр).

Получается удивительный языковой парадокс.

В интерфейсах по-русски слово «тактильный» больше подходит элементам, которые имеют осязаемую форму. Физически выпуклые кнопки, ручки, ползунки, переключатели. Такие, какие устанавливали в старые и существующие самолеты.

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

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

Настоящая тактильность:
руки человека чувствуют форму, текстуру, мягкость, остроту, размер объекта. Чувствуют усилие и сопротивление при взаимодействии с объектами. Человек чувствует и понимает пределы взаимодействия: диапазон перемещения рукоятки, глубину нажатия кнопки. Форма подсказывает, как обращаться с объектом.

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

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

Продолжение следует.

Новые карты Страва (Strava)

Сервис для тренировок «Страва» (Strava) выкатили новую карту треков спортивных занятий. Люди занимаются спортом, устройства отправляют координаты на сервер Стравы, Страва рисует карту.

https://medium.com/strava-engineering/the-global-heatmap-now-6x-hotter-23fc01d301de?_branch_match_id=451858002544826932

Рассказали о том, какие данные используются для построения карты. На чем построен код. Как формируется изображение карты.

Интересная деталь: они фильтруют координатные данные с учетом погрешности спутниковых сигналов.

И еще описаны куча приемов, фишек и секретов.

Карту интересно смотреть и в больших, и в малых масштабах.

Вот кусок России:
https://labs.strava.com/heatmap/#4.40/54.69098/61.21642/hot/all

А вот бегают и катаются на велике даже в Хатанге!
https://labs.strava.com/heatmap/#8.41/102.67839/71.98594/hot/all

Две Кореи:

Редактор → Сбертех

Приглашаем редактора в команду дизайн-центра Сбертеха. Работать над новыми продуктами и услугами. Следить за корректностью интерфейсных текстов. Писать для миллионов клиентов Сбербанка и для сотрудников. У нас для вас горы интересной работы. Если большинство текстов вокруг кажутся вам плохими — приходите.

Присылайте информацию о себе и вопросы: cashin@yandex.ru. Отвечу, задам встречные вопросы и пришлю тестовое задание.

Передайте знакомым редакторам, и дизайнерам, которые внимательно относятся к текстам.

Колонизация Марса

Обалдеть! Новые корабли, марсианская база, и полет из Нью-Йорка в Лондон за полчаса.

http://www.spacex.com/mars

Интересно сравнивать презентации Эпл и Спейсекс (и вообще презентации Маска). У меня вот какое складывается ощущение: Эпл на фоне Спейсекс начинает выглядеть слишком чистым и где-то ненатуральным. Шутки начинают казаться натянутыми.

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

На Марс!

В эту пятницу в Австралии Илон Маск представит обновленный план колонизации Марса. А компания Локхид Мартин — проект марсианской орбитальной станции.

https://www.space.com/38299-elon-musk-spacex-lockheed-marti

Спейсекс (SpaceX) — самая интересная компания нашего времени. К черту айфоны, летим в космос!

Ctrl + ↓ Ранее