Мой блог

О чем книга

Суть — в названии. Кришна рассказывает о том, как не плодить экранно-ориентированные интерфейсы там где они не нужны и предлагает другой подход к взаимодействию. Много неизвестных ранее примеров.

Книга напомнила «Дизайн для реального мира». Ее так же с некоторой условностью можно разделить на две части: проблема и решение. А некоторые места напоминают Рому Воронежского:

Щелкните здесь, чтобы убрать жир на животе с помощью этого подозрительного острого предмета. Вы не поверите, что будет дальше…

Автор и редактор поступили умно: для того чтобы увлечь читателя первая часть сделана легкой и с большим количеством картинок, вторая — тяжелее и с большим коичеством текста (хотя и разбавленная графическими приемами).

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

Во второй описаны принципы другого подхода с реализованными примерами.

Три принципа

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

Фокусируйтесь на типичных процессах, а не на экранах

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

Примеры: умный замок, который открывается когда вы со смартфоном подходите к двери (уже в продаже) и противопоставление «мобильное приложение для открывания автомобиля — датчики открытия багажника на Ford Escape».

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

Используйте компьютеры, а не служите им

О человечности и принципе «пусть потеет машина» (© Бюро) при создании интерфейсов.

Пример: подшлемник Reebok Checklight и IFTTT.

Адаптируйтесь к индивидуальности

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

Пример прообраза: My Life Bits, разработанный Микрософтом. Работающий пример: термостаты Nest собирают данные о предпочтительной влажности и температуре, а автоматически подстраивают ее под пользователя.

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

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

Захожу такой в приложении Додо посмотреть где расположены пиццерии:

Отвлекаюсь, нажимаю что-то, бац, и я уже в ЯндексКартах:

Хотя подождите… заголовок то почему-то все еще «Все пиццерии».

Можно заказать такси или войти в свой аккаунт Яндекса:

Полный функционал одного приложения в другом.

Вот три квадрата одинакового размера с двухпиксельным скруглением каждого угла (на некрасивое механическое скругление не обращайте внимания):

Секрет в том, как расположена обводка относительно контура:

Формально иллюстратор прав, потому что считает радиус скругления во всех случаях по контуру, а оптически — нет. Стоит помнить об этом при рисовании иконок и прочей графики.

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

Техника: попробовал адаптивную верстку и автоматизацию с Gulp. Разметку делал бэмоподобную, стили писал на Less (хотя это скорее чистый css с вкраплениями возможностей препроцессора). Немного залез в js, но знаний пока что не хватает. По верстке еще предстоит многому научиться.

Если верстки еще нет — проще всего набрать панграмму для 9—21 размера и выборочно для заголовков и посмотреть что происходит:

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

Сглаживание

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

Конечно в разных браузерах все будет выглядеть немного по-разному, при монохромном и субпиксельном сглаживании — тоже, об этом надо помнить. А еще есть мак и виндоус. Ах да, и ретина :—)

Искажение пропорций

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

Но бывает что пропорции выглядят чуть уже или шире. Любимый пример Charmer с PT Serif:

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