среда, 29 марта 2017 г.

Как входить и выходить в дверь правильно

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

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

Второй бытовой интерфейс любопытнее. На внутренней стороне входной двери, на самом видном месте, я нашел несколько желтых листочков — «Хлеб», «Яйца», «Сыр», «Динамит». В ответ на мой вопрос «Зачем?» друг ответил, что как только что-то из продуктов заканчивается или он вспоминает о необходимости что-то купить, он пишет это что-то на листочке, выходя из дома эти листочки собирает себе в карман, а в магазине их из кармана достает. Знаю, у этого решения куча недостатков, но оно простое, работающее и расширяемое. Например, если я что-то из написанного на листочках не купил, придя домой, я могу снова наклеить его на дверь.

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

Хотя в определении юзабилити и есть слова про контекст («…продукт может быть использован определенными пользователями при определенном контексте использования для достижения определенных целей/мотивов…»), не стоит забывать, что и контексты, и цели/мотивы в разных задачах и областях часто бывают настолько похожи, что смело можно использовать один и тот же интерфейс. Нужно только замечать это сходство.


вторник, 28 марта 2017 г.

Что делать c растеризацией текста?

Что делать c растеризацией текста?

    Наша самая заметная техническая проблема с прототипированием интерфейсов — растеризация текста. Алгоритмы растеризации текста заметно отличаются в «Windows» (и, соответственно, в стационарном ПО, в частности – во всех браузерах, кроме «Safari») и в программах авторинга.



воскресенье, 26 марта 2017 г.

Серый?

Цвет фона Windows 3.1 и (по наследству) Windows 95, похоже, вычислялся почти сугубо арифметически. Видно, что цвет R192G192B192 выбран очень просто: от чисто чёрного отложено 20 единиц, после чего оставшийся диапазон разделен ровно на три части.

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

В Windows XP наконец-то спохватились, найдя, что выбирать основной цвет интерфейса алгоритмом, не учитывая восприятия, как-то очень по-ботанически. И сделали его гораздо светлее, а равно как гораздо приятнее (на мой взгляд).

Зачем в Vista ещё раз осветлили серый я могу только гадать (у меня есть несколько теорий, но все они начисто разбиваются тем соображением, что ЖК-мониторы обладают недостатком, обратным тому, что был у CRT – они плохо передают цвета в очень светлых областях; я видел мониторы, на которых Vista-серый выцветал в белый, а XP-серый ещё нет).

Но вот зачем в него добавили красного я, кажется, понимаю вполне достоверно. На очень многих мониторах нейтрально серый отображается как холодный серый (эти мониторы уводят цвета в синий). Холодные же цвета в интерфейсе – верный способ придать этому интерфейсу мессидж «со мной сложно работать» (доказать это не могу, потому что строгого эксперимента не проводил, но во многих нестрогих экспериментах участвовал). Добавление красного в серый было надежным способом гарантировать, что почти в любой ситуации интерфейсный серый будет иметь теплый оттенок. Вот интерфейс и порозовел.


суббота, 25 марта 2017 г.

Хюбрис и интерфейс: кто кого поборет?

Хюбрис и интерфейс: кто кого поборет?

    Рекомендую очень смешную — и поучительную — заметку [en] о том, что получилось в «Wolfram|alpha» из-за гордыни разработчиков. Вводится новый и, на мой взгляд, очень полезный термин — «хюбристический интерфейс» (хюбрис, он же гибрис, так же известный как ὕβρις — в древнегреческой культуре особый сорт дерзости, выражающийся в желании превзойти богов).

 

 

    Автор ругает псевдо-естественный (попробуйте найти «sise of egg») язык запросов «Wolfram|alpha», мотивируя свою ругань тем, что этот интерфейс отнимает у пользователей контроль над результатом («If the product is used as a tool, its interface should be as unintelligent as possible. Stupid is predictable; predictable is learnable; learnable is usable»). Аргументация, по-моему, очень весомая.



пятница, 24 марта 2017 г.

Интерфейс может быть каким угодно…

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




четверг, 23 марта 2017 г.

On-hover убивает Flash. И не только

Рисунок «Объект является кликабельным»

Очень интересная статья аж от 2010 года профессионального Flash-разработчика о том, почему у Flash проблемы на мобильных устройствах (уж на что Adobe и Apple взаимно любят друг друга, а все равно Flash отсутствует на iPhone и конца этому не видно). Кратко: большинство Flash-изделий используют on-hover как самостоятельный и незаменимый метод взаимодействия; on-hover, в свою очередь, невозможен на современных устройствах с тактильным вводом (его эмуляция хоть и возможна, но убога до безобразия).

Я, откровенно говоря, испытываю в данном случае лишь злорадство. Мне нравится Flash (и ещё больше нравится Air, которая суть Java от людей, не испорченных enterprise-программированием), но всё же — флашеры сами виноваты в том, что получилось. Использовать интерфейсные методы только потому что (а) так можно и (б) другие так не делают — статистически верный способ получить нечто убогое.

Вот вполне реальный сценарий. Есть сайт, на сайте есть анимированное меню. В начале работы в голове дизайнера что-то щёлкает и дизайнер решает — повешу анимацию не на on-click (боже, как это скучно и старо!), а на on-hover. С мышью всё работает; с пальцем не работает ничего.