Схема метро Санкт-Петербурга

Вместе с Егором Поповым и Сергеем Чикиным сделали схему метро Санкт-Петербурга в двух вариантах — повседневном и нарядном:

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

Сверху просто какие-то кляксы, а справа тупой водопад.

А у нас — красота! Ну и, конечно, не обошлось без изобретения нового обозначения пересадки.

Читайте о работе и смотрите картинки. А также присылате ошибки, какие найдёте.

Фотки с апрельского интерфейсного курса

На мой недавний интерфейсный курс зашёл Вова Колпаков и наделал кучу фоток. Надо будет добавить на страницу курса, но пока руки не дошли. Вот некоторые из них.

Я рассказываю о том, где живут амурские тигры:

Все слушают, а некоторые ещё и записывают:

Перерыв. Летом ребята общаются на улице:

Рассказываю про информационный мусор на примере редизайна одной из схем:

Коворкафе:

Во время того курса случилась наиболее странная история. Вдруг пришёл Максим Ильяхов и принёс торт:

На торте было написано «Илья». На вопросы «чё за торт» Макс отвечать отказывался и всячески изображал загадочность. У меня была только одна гипотеза (хотя и она не очень убедительная): Максу кто-то подарил торт, в очередной раз забыв его имя, и Макс решил занести его в Коворкафе, а тут у меня курс как раз. И он такой: «о, у меня для тебя торт». Торт был успешно применён в качестве органолептического украшения курса.

Задание:

Кто-то делает в Фотошопе:

Кто-то в Фигме:

Смотрю, чё как:

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

Диаграмма экспедиций Амундсена и Скотта — моя опора:

Днём — обеды:

А это разбор домашки в последний день:

Ребята показывают свои проекты:

Ведутся споры и звучат комментарии из зала:

До 28 июля открыта запись на августовский курс, приходите!

Типографика в Тель-Авиве

А вот и снова Тель-Авив. На этот раз всевозможная ивритская типографика, в основном постера и реклама.

На стене пекарни:

На стене другой пекарни:

На музее современного искусства:

На витрине магазина. Тут почти без иврита, просто симпатично:

Совсем без иврита:

Три ценника:

Реклама на остановке:

Постер:

Ещё постер. Текст про 70 лет израилю набран очень классным шрифтом. Кто знает, как называется?

Долбанутые шрифты везде в моде:

Просто приятно смотрится, хотя максимально тупо:

Алеф (א) как X — это кайф. Вообще, все буквы крутецкие:

Ну и рукописная красота. Особенно люблю рукописные айн (ע)

Меню:

Другое меню. Мне такое уже тяжело читать, но выглядит прекрасно:

Вывеска:

Шрифт, но приятный:

Фотографии из зимовки 2017—2018. Во всех заметках про путешествия снизу есть поиск дешёвых авиабилетов. Слетайте в Тель-Авив!

Ещё Тель-Авив:

Ещё иврит:

Как выучить
Как выучить — 2 (более по делу)

Ховер и клик должны совпадать

Это кажется очевидным, но ошибки на эту тему встречаются так часто, что надо бы написать.

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

Вот некоторые ошибки, которые мне встречались:

Меню на сайте состоит из ссылок, завёрнутых в некоторый контейнер. У контейнера в стилях прописана подсветка при наведении. Вокруг текста ссылки остаются некоторые поля до краёв контейнера, где контейнер подсвечивается, но ссылка не работает.
Подчёркивание ссылки реализовано как-то так, что клик в саму линию подчёркивания не вызывает перехода по ссылке, хотя ховер есть. Бывает наоборот: ховера нет, а клик срабатывает.
Модальный попап закрывается кликом за его пределами. Ховеры элементов вокруг попапа продолжают работать, хотя клик по ним не вызовет связанное с ними действие, а только лишь закроет попап.
Функция элемента заблокирована скриптом, а ховер остаётся. Например: главная кнопка на форме отключена из-за ошибки в заполнении, но продолжает подсвечиваться при наведении, как будто работает.
Большой контейнер с картинкой и подписью нажимается целиком и реагирует на наведение каким-то эффектом. В углу контейнера есть маленькая иконка, которая делает что-то другое, например, добавляет объект в «Избранное». При наведении на иконку эффект наведения на контейнер сохраняется, хотя клик в этом месте не вызовет действия, связанного с контейнером целиком.

Эта мысль относится к теме «Обратная связь».

Видео парижского доклада «Схема как символ»

В феврале выступил на симпозиуме транспортных картографов в Париже с докладом «Схема как символ»:

Не спеши, когда плывёшь

Ого, предыдущая заметка с тегом «бассейн» написана больше десяти лет назад.

Я плаваю так: за 45-минутный сеанс стремлюсь проплыть как можно больше. Кажется, когда-то один раз мне удалось проплыть два километра, но нормальная для меня дистанция — 1700-1800 м:

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

Доплыл, пошёл переодеваться, достал телефон, смотрю — всё так и есть:

Круг, после которого стало 600 метров, занял у меня 2:30 при среднем времени круга 2:31, а последние круги, когда я ускоряюсь «чтобы больше успеть», получаются самыми плохими. Также свой экспериментальный круг я проплыл за 60 гребков, при средних 74. (Самый первый круг вообще можно не считать, потому что я его плыл кролем.)

В общем, вдохновившись этими результатами, я пошёл во вторник поплавать весь сеанс «медленно», но внимательно к технике, чтобы посмотреть, как это работает на всей дистанции. Пришёл, а бассейн закрыли до августа. Облом.

Проверка непустоты текста в ПХП

Только не бомбите, я для себя.

В ПХП оператор == проверяет равенство значений безотносительно типа. Поэтому строка «42» и число 42 с его точки зрения равны.

Это удобно: в большинстве случаев не нужно вообще думать о типах, просто сорок два равно сорока двум. Аналогично равны, например и логическая истина и число 1. Когда важно, чтобы значения были не просто равны, но ещё и совпадали по типу, используется оператор строгого равенства === .

Часто важно убедиться, что переменная не пуста. Можно проверить так:

if (@$text) { ... }

Как бы «если текст есть, то». Любая непустая строка приведётся к логически истине, при этом и пустая строка, и null, и даже неопределённая переменная приведутся ко лжи, и условие не выполнится.

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

У меня рука не поднимется исправить так:

if (@$text or $text === 0) { ... }

Поэтому теперь я проверяю наличие текста так:

if ((string) @$text !== '') { ... }

Не так элегантно, как было, но вроде жить можно. Или нет?

Продолжение

Вывески и таблички Дублина

Я уже показывал дорожные знаки и уличные таблички, но осталось ещё много разных вывесок и табличек.

Чёрный «Спар»:

Номер дома:

Отель:

Как поставить большой круглый логотип, если не влезает:

Скромная табличка банка:

Логотипу лайк:

Буквы как будто со старых московских станций метро:

Видимо, тут была аптека:

Клёво, когда пишут прям на кирпичной стене (это новое):

Пожарная бригада:

Обоешная:

Место под надпись как будто из другого дома взяли:

Дублиния:

Клёвая м-м:

В Европе обязательно нужно предупреждать, если у тебя куки:

Руинный бар бывает не только в Будапеште:

Фотографии из поездки в мае-июне 2018 года. Во всех заметках про путешествия снизу есть поиск дешёвых авиабилетов. Слетайте в Дублин!

Ещё Дублин:

Поднять руку, чтобы спросить

В школе нас учили, что вежливо поднять руку, если хочешь спросить учителя.

Это абсолютная хрень, говорю вам как учитель.

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

Поэтому я на курсе говорю слушателям: не надо поднимать руку, просто спрашивайте.

Знайте: ответственность за то, чтобы вовремя спросить — на слушателе. Когда вы поднимаете руку, вы перекладываете свою ответственность на учителя. Учителю и без этого есть, о чём думать. Дождитесь паузы в рассказе и задайте свой вопрос.