Я в интернете

РСС    Джейсон-фид

Есть автоматические трансляции в Тумблер и Же-же. Если не работает, напишите мне: ilyabirman@ilyabirman.ru.

Позднее Ctrl + ↑

Четвёртая версия схемы московского метро

 4 мин

Сначала немного истории.

Первая версия

Первую свою схему московского метро я выпустил в 2007 году

Первую свою схему московского метро я выпустил в 2007 году. Тогда кроме меня вообще никого из дизайнеров не волновало, что в метро вместо схемы висит говно. Та моя схема вдохновила многих на то, чтобы тоже попробовать что-то сделать. Я знаю несколько дизайнеров, которые брались, но бросали, не пройдя и половины пути, охренев от объёма и сложности работы. Всё же постепенно задача «нарисовать схему московского метро» стала одним из дизайнерских стандартов.

Вторая версия: перезагрузка

В 2012-м я сделал концепт «Перезагрузка».

Несколько лет назад я сделал концепт «Перезагрузка», где показал, какой могла бы быть схема метро, если бы не московская шизофрения с разными названиями одной и той же станции в зависимости от линий. А ещё я там переименовал станции со сбивающими с толку названиями. В газете «Метро» вышла статья под жёлтым названием «Из метро исчез „Аэропорт“». Так в среде неравнодушных людей началось обсуждение проблемы безмозглого наименования станций.

Третья версия: конкурс

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

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

Четвёртая версия

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

В общем, в начале года я сел всё переделывать.

Сегодня — важнейший для меня релиз этого года, четвёртая версия схемы метро. Она такая:

Четвёртая версия схемы московского метро

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

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

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

Смотрите страницу схемы у меня в портфолио. Там же есть ПДФ, чтобы всё рассмотреть. Жмите там лайки всякие.

Что почитать на выходных — 122

Вот:

  1. Электронная музыка как объект исследования: в Берлинском университете начали изучать техно. «А вот изучение техно с точки зрения музыки — довольно сложная задача. Поскольку, если применять методы, которым нас научили в музыкальной институтах, мы придем к выводу, что техно — ужасно скучная музыка, в ней ничего не происходит: нет ни развития гармонии, ни сложного контрапункта, ни мелодической трансформации. Но разумеется, виной будут неправильные методы. В техно интересно другое — к примеру, саундшейпинг или микроритмические структуры.»
  2. Why «Mom» and «Dad» Sound So Similar in So Many Languages.
  3. Mobile Web App Checklist. Если вы делаете мобильное приложение, а оно получается слишком кривожопым, потому что на самом деле оно веб-сайт, пройдитесь по этому списку.

Жуэль 2.0

Жуэль 2.0

Три года назад я сделал нормальный аудиоплеер для веба — Жуэль.

Женя Лазарев сделал версию 2.0. Плеер избавился от скеоморфизма и стал ещё приятнее на вид. И перекрасить его на свой вкус стало проще. Ещё у плеера теперь динамическая инициализация, и он стал правильным джейквери-плагином с АПИ (это всё типа значит хорошо). Я прикрутил его к сайту, в том числе к разделу «Музыка». Потанцевать на радостях:

Ссылки по теме:

Кто производит качественные навигационные элементы в России?

Вот крутой тотем из навигации по Бату:

Этот со внутренней подсветкой в Джоне Льюисе:

А вот ещё какая-то штука где-то:

А кто в России такие элементы делает, монтирует? Чтобы прям промдизайн понимали, материалы, как это всё производить, как крепить, как от вандализма защищать. Интересуют не только тотемы, но и всякие подвесные конструкции, но надо, чтобы это что-то суперкачественное было и на века, а не просто плёнка на пластик наклеенная. Расскажите в комментариях или по почте (в подвале любой страницы).

Курс о навигации в общественных местах 14—18 ноября 2015 года

Наш курс о навигации в общественных местах пройдёт 14, 15, 16 и 18 ноября в Коворкафе.

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

Все участники курса получают толстую пачку раздаточных материалов, которая помогает по ходу лекций и остаётся с ними потом.

Есть много чисто практических аспектов: как избежать столпотворения в узком месте в метро и наоборот, как сделать, чтобы люди не забывали заглядывать в магазин, расположенный в тупике торгового центра. Какие способы кодирования предпочтительнее в каких случаях и почему, на какой высоте и как размещать указатали, чем руководствоваться при выборе пиктограмм, написании текста, создании голосовых объявлений. Показываем на примерах, как плохой информационный дизайн способен сбить человека с толку, рассказываем о приёмах улучшения дизайна. Говорим о разном физическом воплощении навигации, от бумажек А4 с подписью «Администрация» до электронных навигационных устройств.

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

Отдельное место в моём сердце занимает тема про транспортные схемы.

Проектирование навигации — это работа, которую нельзя доверить сделать «заодно» компании, которая строит здание или размещает рекламу. Мы делимся опытом ведения навигационных проектов, рассказываем, как они строятся, что нужно делать в каком порядке.

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

Навигация — моя любимая область. Записывайтесь и приходите! Запись открыта до воскресенья, 8 ноября.

Лайкли теперь на Гитхабе

Лайкли (единственные нормальные социокнопки) теперь выложены на Гитхаб. Проект поддерживает Евгений Стеблинский, который чуть раньше избавил его от зависимости от Джейквери.

Что-то там не работало в ИЕ, а Андрей Гусев пришёл и починил.

Ещё там добавилась поддержка npm и bower. Я не знаю, что это, но знающие люди говорят, что это что-то полезное. Евгений просил передать такие заклинания:

$ npm install ilyabirman-likely
или
$ bower install ilyabirman-likely

Ура.

Эмёрдж 1.2.1

Эмёрдж: система управляемой загрузки страниц

В новой версии исправлена ошибка, из-за которой data-expose мог не работать на страницах с доктайпом ХТМЛ 5.

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

Автобаны в Германии

 10 мин

Когда въезжаешь из одной европейской страны в другую, на границе стоит знак, разъясняющий местные ограничения скорости. Например, вот такой знак на границе Германии и Швейцарии:

Знак на границе Германии и Швейцарии

А в Германии на аналогичном знаке напротив автобана стоит не максимальная, а рекомендуемая скорость (стрит-вью на границе с Чехией):

Рекомендуемая скорость на автобане

Видите, там слева сразу знак «Конец всех ограничений»? Германия — единственная страна в Европе, где этот знак не врёт. На автобане в общем случае нет ограничения скорости.

Автобаны в Германии

Едешь, бывает, тихонько в левом ряду:

Автобаны в Германии

А тебе мигают дальним, мол, чё ползёшь, уступи дорогу.

Разумеется, такой режим далеко не везде, это лишь состояние по умолчанию. Если надо, могут влепить и знак 100 где-то:

Когда на автобане пробка, врубается знак «штау»:

Штау

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

Есть умные автобаны, которые динамически распределяют по себе трафик

Чем ближе к загруженной части, тем суровее ограничение:

Сраная погода

Надпись на комбинезоне: «Сраная погода».

Откуда автобан знает о загрузке разных своих частей? Дело в том, что в каждой такой конструкции с экранами-знаками встроены датчики, которые фиксируют, как в этом месте едут машины.

Ограничение 60

Если автобан обнаруживает, что где-то едет слишком много фур, то он может врубить знак «Грузовикам обгон запрещён», чтобы они не заткнули всю дорогу, обгоняя друг друга:

Грузовикам обгон запрещён

Так автобан распределяет нагрузку по себе и автоматически пытается побороть пробки.

Гиперлапс:

Первые три экранных конструкции ещё с ограничением, а на четвёртой ограничение отменили, и я поехал быстрее.

Ой, кто-то разбился в лепёшку:

Не считая ремонтов дорог, основная причина пробок — аварии

По немецким правилам, если автобан встал в глухую пробку, автомобили в левом ряду должны прижаться максимально к левому отбойнику, а во втором слева — насколько возможно вправо. В этом случае между левым и вторым слева рядом останется достаточно места для проезда спасательных служб. Любопытно наблюдать, что чем ближе скорость движения автомобилей к нулю, тем более явно прорисовывается эта выделенная полоса. Понятное дело, ни одному мудаку не придёт в голову поехать по ней вместо скорой.

Ещё в Германии очень клёвые дорожные знаки.

Дорожные знаки в Германии

Автобаны обозначаются номерами в ютюбоподобных окошках:

Автобаны обозначаются номерами в ютюбоподобных окошках

Здесь разметка посередине вдвое толще, чем между другими рядами. Это значит, что по ней проходит граница дорог. Правые два ряда — это уже как бы третий автобан или четвёртый в противоположном направлении.

Обозначение съезда:

Съезд с автобана

Обозначение развязки:

Развязка на автобане

Если знак временно неактуален, его зачёркивают специальной зачёркивалкой:

Зачёркнутый знак

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

Движение по полосам

Если впереди будет ремонт и дорогу придётся временно сузить, то на этот знак обязательно повесят зачёркивалку.

Во многих местах «обочина» — это целый полноценный ряд справа, отделённый сплошной линией:

Обочина

Движение по обочине запрещено, ясное дело, потому что если ты едешь со скоростью 200, а там кто-то остановился колесо поменять, то выйдет неприятность. Но, как видно на фото, статус обочины у этой правой полосы может быть динамически снят. Если пробка, полоса может стать проезжей (справа белая штука превратится в знак «движение по полосам» и покажет, что тут четыре полосы).

Видос про то, как организован ремонт дороги:

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

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

Пятый автобан ночью

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

См. также:

Ранее Ctrl + ↓