Когда я выпустил в сентябре обновлённую схему метро с Окружной линией — вам она известна под дебильным названием МЦК — я поленился сделать ПДФ-версию и не обновил плакат. С тех пор открылись новые станции Люблинской и Солнцевской (на днях) линии.
Я добавил станции и сделал новый плакат:
Плакат 60 × 75 см (по ширине как экран 27-дюймового Аймака) на «Принтдиректе» за 890 ₽: Пойти купить
Ну и на странице о схеме в портфолио добавилось ПДФ для скачивания — если вдруг хотите сами себе напечатать. За подготовку ПДФ большое спасибо Илье Харитонову.
Назрела необходимость переворота в мобильном интерфейсе.
На первых айфонах было легко нажать кнопку «Назад» большим пальцем правой руки, когда держишь Айфон в этой самой правой руке. На пятом айфоне это стало сложнее. Начиная с шестых — почти невозможно.
Эплы внедрили два костыля. Один более-менее нормальный: если потащить из-за левого края экрана, перейдёшь на предыдущий экран. Это чтобы не нужно было тянуться к кнопке «Назад». Второй — совсем кривующий: если дважды прикоснуться к главной кнопке, весь экран съезжает вниз, чтобы можно было дотянуться до верхних кнопок.
Спрашивается: нафига ставить кнопки наверх, а потом придумывать костыли, если можно сразу их поставить снизу?
На Виндоус-фонах адресная строка браузера снизу:
Правда, там непонятно: на половине скриншотов всё-таки сверху. Эпл, когда сделаешь так же?
Интересно, что переворот уже коснулся приложения «Карты». Было-стало:
Поле поиска и результаты переехали вниз. Почему это изменение коснулось только одного приложения?
В Сейви (умный диктофон) мы тоже заморочились, чтобы важное прибивалось к низу. Пара промежуточных макетов:
Сначала управление записью жило наверху (слева). Потом плей переехал вниз (справа).
Но в итоге вообще весь интерфейс стал стремиться к низу:
В первый момент после переворота результат вам может не понравиться эстетически. Но наши представления о красоте в значительной степени формирует технический прогресс. Вся эволюция представлений о прекрасном имеет объективные причины. Мой любимый пример — рассказ Игоря Штанга о появлении швейцарского стиля в типографике из его курса.
Правило: в мобильных интерфейсах важные элементы управления ставьте вниз.
Бывает, вставишь откуда-нибудь текст, набранный заглавными буквами, и надо его сделать нормальным. Сюрприз: это стандартная фича любого текстового поля на Маке, как буфер обмена или анду.
Edit → Transformations → Make Lower Case:
Люди удивительно нелюбопытные. Поэтому постоянно появляются — и имеют успех — статьи типа «10 фич вашего айфона, о которых вы не знали». Я каждый раз охреневаю: как не знали, если вот же они, в меню, словами подписаны? Они даже не спрятаны никуда, в терминал идти не надо. Но факт остаётся фактом: для людей выбор пунктов из открытого всем меню — это «лайфхак».
Веб-приложения состоят из фронтенда (того, что работает у пользователя в браузере) и бэкенда (того, что происходит на сервере). Эти части разрабатывают с разной скоростью. Если при создании браузерной части сервер недоступен, разработчик обычно сильно ограничен.
Я сделал интерфейс для второй версии Мимика — инструмента веб-разработчика для имитации ответов сервера. Можно работать, как будто сервер доступен. Настроить поддельный ответ («мок») очень легко. Например, вы хотите сделать вид, что сервер ответил строчкой джейсона:
Можно настроить навороченные моки, с хитрыми ХТТП-заголовками, задержкой и чем угодно ещё:
Кайф Мимика в том, что не нужно даже поднимать локальный сервер или менять урлы в своём приложении. Он работает прямо с тем, что есть, прямо в браузере. Но даже расширения браузера не нужно, он подключается просто как скрипт к приложению.
В апреле мы с Мишей Нозиком ездили в Киев, где я прочёл лекцию о понимании задачи, а Миша — об управлении вниманием с помощью вёрстки. В разделе «Мир» рассказа о той поездке ещё нет, и в привычном виде не будет — у него постепенно изменится формат. А тут буду показывать фотки пачками по темам.
Это какие-то дворы. Кайф их в том, что они очень рельефные: какие-то части сильно ниже или выше. Из-за такой «неприступности» там очень мало машин.
1
2
3
4
5
6
7
8
9
10
11
Во всех заметках с тегом «мир» снизу автоматически подгружается форма поиска авиабилетов.
Вот что это за батарейка в ПВУ? Что за поле поиска такое невозможное? В нём всё не настоящее: размеры, углы, тень, расположение иконки и текста.
Или мишень в центре. Откуда она такая? Зачем?
Ещё и от самого телефона тень куда-то вбок падает.
Другой вариант:
Весь статусбар поддельный: не тот размер, не такие кружки, не тот шрифт, не та батарейка. Между статусбаром и тулбаром линейка, которой на настоящем Айфоне нет. В поле поиска тоже всё не настоящее, особенно стирающий крестик справа.
Тут сам телефон поддельный:
Откуда с правой стороны три фигулины торчат? Неужели трудно найти фотографию Айфона и вспомнить, с какой стороны у него что? Что творится с бликами по всему периметру?
Андроид:
В Андроиде я меньше понимаю, но шрифт точно поддельный, да ещё и порендерен чуть ли не на Виндоусе с «Клиртайпом». И поиск на Андроидах выглядит не так.
Такие косяки для дизайнера непростительны. Тут речь даже не о неспособности нарисовать что-то аккуратно — это, допустим, не сразу приходит. Тут речь о стандартных элементах интерфейса. Эти вещи элементарно берутся в интернете. Есть сто тыщ готовых бесплатных исходников для Фотошопа и Скетча, где все элементы отрисованы прямыми руками. В работах я за такой пофигизм снижаю оценки нещадно.
Я обрабатываю фотографии в Лайтруме и слабо ориентируюсь в этой части Фотошопа. В Лайтруме чинить баланс белого просто: тыкаешь в серую, на твой вкус, область картинки, и он правит цвета всей фотки. Меня всегда удивляло отсутствие аджастмента White Balance в Фотошопе.
В общем, оказалось, что это умеют делать обычные кривые. Есть у вас, допустим, слишком жёлтая фотка будапештской кофейни «Мадал»:
Кладём над слоем кривые:
Берём там вот эту пипетку:
Тыкаем ею точку, которая должна быть серой, например, на чёрно-белой фотографии мужика, висящей на стене слева, и Фотошоп сам гнёт кривые так, чтобы всё стало нормально:
Было-стало:
Поскольку аджастмент — это слой, можно менять его опасность, чтобы ослабить эффект, а можно, наоборот, сделать копию, чтобы усилить.
Каждый раз, когда я открываю для себя что-нибудь новое, я пишу заметку с тегом Фотошоп.
После того, как «Аэрофлот» нанёс ответный удар по пути в Копенгаген, «Эйр-Балтик» решил добить и отменил мой рейс из Копенгагена в Москву. Ближайший прямой рейс прилетал в Москву слишком поздно, я бы не выспался перед курсом. Пришлось срочно поменять планы и лететь через Дюссельдорф. Так я познакомился с аэропортом Дюссельдорфа, где очень приятная навигация.
Я прилетел в сектор A, а мне надо было в C. Удачно прошёл через всё. Схема сектора A:
Иконка гейта в клёвом кружочке:
Для навигации на транспорте достаточно двух цветов: один для всего, что связано с самой транспортировкой, а другой — для инфраструктуры. Аэропортная классика — жёлтый и чёрный. Здесь всё про вылеты синее, а остальное — красное:
Реклама в навигации. Последний дьютифри перед вылетом — такое важно продублировать на русском:
Иду в сторону сектора C через B:
Лаконичная схема аэропорта на знаке. Расстояния между секторами указаны минутах:
Фотка получилась по-киношному синяя:
Можно не писать слово «гейт», когда есть диапазон:
Куча знаков в секторе B:
Схема сектора B:
Цвет линейки, отделяющей стрелку от остального, в отличие от цвета текста, дружит с фоном:
Человек на распутье:
Туалет на знаке в центре скромно встал в угол:
Пиктограмма паспортного контролёра:
Немецкий пограничник упрекнул меня в отсутствии подписи в паспорте, а сам забыл поставить печать о пересечении границы. Никакого орднунга!
Другие гражданства — почему-то на белом фоне:
Вот я и в секторе C:
На схему налеплена реклама временного магазина «Молескина»:
Путь к гейту лежит через очередной дьютифри (да, тот был не последним):
Мусульманская молельная комната с полумесяцем:
Круто, что кружочки гейтов стоят на месте, обычном для стрелок на других знаках:
На компактный красный знак не влез текст, но всё понятно и без него:
Георгиева, Коновалова и Варенцова — люди, у которых есть имена. К сожалению, их никто никогда не узнает, потому что кто-то решил сэкономить и оставить только инициалы.