Избранное

Позднее Ctrl + ↑

На интерфейсном курсе: незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование

Фрагмент № 9 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе в июне 2020 года. Покажите дизайнерам.

0:00 Упрощаем элементы «Доп. телефон», «Комментарий к заказу». Поля, увеличивающиеся при фокусировке
2:13 Незаконно убираем все признаки поля у поля «Комментарий к заказу»
4:04 Упаковываем несколько полей в одно
7:48 Как сочетать визуальную чистоту и понятность. Тестирование

Почитать о курсе

Программа, отзывы, запись

На интерфейсном курсе: сверхплотная упаковка шапки таблицы и вёрстка карманного словаря

Фрагмент № 8 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе в июне 2020 года. Покажите дизайнерам.

0:00 Фокус в таблице: залезаю заголовком одной колонки на территорию другой, чтобы всё компактнее уместилось
2:08 Пример вёрстки с переносом наверх их карманного словаря

Почитать о курсе

Программа, отзывы, запись

Бристольские часы

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

Часы на бристольской бирже. Фото Стивена Колбурна. Фликр

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

В Бристоле, например, было на десять минут меньше, чем в Лондоне. Это стало вызывать неудобства только с распространением железных дорог и появлением точных расписаний в середине 19 века — тогда придумали «железнодорожное время» — в мире британских железных дорог стали использовать время по Гринвичу. Это никак не мешало всю остальную жизнь вести по «настоящему» времени, принятому в каждом городе.

На здании бристольской биржи до сих пор висят часы, показывающие бристольское время (чёрной минутной стрелкой) и время по Гринвичу (красной минутной стрелкой).

Лондонский транспортный музей. Часть 3

Продолжаю рассказывать про Лондонский транспортный музей.

Автобусы:

1
2

Полазил, где можно было:

3

Элемент управления:

4

Всякие таблички, надписи и наклейки:

5
6
7
8

Прикольный экспонат. Жмёшь кнопку — платформа постепенно наклоняется, а автобус всё не падает:

9

В какой-то момент всё-таки падает, но интуитивно ожидаешь этого гораздо раньше. Типа когда-то каждый реальный автобус перед началом использования проверяли на такой платформе, наклоняя до 28°.

Над потолком висят ленты с названиями конечных, которые крутятся спереди. Красота:

10

Ещё таблички:

11
12

Какие-то агрегаты. Мало ли, придётся скеоморфический дэшборд рисовать:

13
14
15
16
17

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

См. также всё про Лондон.

На интерфейсном курсе: избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки

Фрагмент № 5 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе в июне 2020 года. Покажите дизайнерам:

00:00 Заполнения формы данными из профиля в Яндексе. Избавляемся от рамок и собираем компактнее
03:55 Наводим компактность и порядок в других местах
07:46 Упрощаем группу полей про адрес и время доставки
14:56 Холивар: звёдочки и обязательные поля
20:13 Настраиваем пропорции кнопки «Заказать» в конце

Программа курса и запись

Лондонский транспортный музей. Часть 2

В первой части я обещал, что покажу вам схемки, которые висят в поездах. Показываю:

Похоже, что там просто какие попало схемы висят, которые удалось найти:

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

А в другом — такая:

Прямые линии:

Ромбики как на первой схеме Бека:

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

Неподалёку ящики, где навалено всё подряд:

Открываешь и смотришь:

Примерно так же у меня дома выглядят ящики со всякими бумажками из поездок:

Поезд, в который можно было зайти

Тут уже полноценный вагон, а не купе. Схемы над окнами:

Зацените пересадки тоже:

Ещё вагон:

Ещё схема над дверью:

Костюм кондуктора, видимо:

Билетики:

Ещё какой-то старый вагон:

Объявление:

Другое:

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

Кстати о музейных экспонатах: Дедушкина схема лондонского метро

См. также всё про Лондон.

Лондонский транспортный музей. Часть 1

Не знаю, как это получилось, но до транспортного музея я добрался только на седьмой заезд в Лондон. Там оказалось довольно клёво, хотя, конечно, сам транспорт Лондона интереснее любого музея себя.

На стене всякой исторической фигни висит крутая старая табличка:

Сравнение числа вокзалов в Лондоне и Милане:

Я сначала подумал, что могли бы уж для чистоты сравнения один год поставить и там и там. А потом решил, что это можно считать приёмом, такой двойной удар по Милану: сначала видишь, что там одна станция на отшибе, а потом замечаешь, что это ещё только через шесть лет после Лондона. Возьму на вооружение.

Лондон спустя 25 лет:

Рядом стоит конный трамвай:

Куда:

Подписи-таблички:

Чужеродная табличка самого музея:

Непонятно, как с таким поступать. С одной стороны, такая штука сильно портит экспонат. С другой, если попытаться её оформить скромно, её не будут замечать.

Кондуктор с крутым жетоном:

Через какие остановки едет (правда, это вроде не на нём, а на соседнем было):

Макет стройки метро:

См. лучше Гранд-макет в Санкт-Петербурге.

Название линии метро на локомотиве:

Табличка:

Плакатик:

Вагон поезда в Рикмансуорт, разделённый на отдельные купе:

Женское купе:

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

На боку у вагона — название железнодорожной компании (давшее название этому виду транспорта и одной из линии метро в Лондоне):

Сверху разные таблички висят тоже:

А вот какой страшный, но красивый вагон поезда до Моргейт:

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

См. также всё про Лондон.

Джейсон Фрид показывает почтовик Хей

В этом видео Джейсон Фрид показывает Хей, новый почтовик создателей Бейскемпа. Это очень важное видео для дизайнеров продуктов и интерфейсов:

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

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

И, конечно, смотрите как классно он про всё рассказывает! Привычная почта объявлена врагом, и все её недостатки высмеиваются. А «у нас» всё не так, а наоборот. «Бум! — и вот моя ПДФка», — ну прям Стив Джобс. На этом противопоставлении строится дизайн интерфейса, на нём строится идея продукта, на нём строится линия повествования. И классное ещё, что это не какое-то аккуратно смонтированное-заанимированное видео под музычку, где всё бесшовно, а нормальный человеческий рассказ. Я не смог оторваться и посмотрел целиком.

Учитесь делать и презентовать продукты!

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

Обновилась наша схема метро Санкт-Петербурга:

Дизайнер схемы Егор Попов добавил новые станции и внёс тысячу других изменений: улучшил цвета, геометрию островов, расположение аэропорта и некоторых станций, добавил несколько парков. Ещё обозначение парков новое, опять красивое. Белая версия тоже обновилась.

А ещё вы просили плакат, и теперь можно купить плакат. Редбабл показывает, как красиво будет, если повесить большую версию над столом:

И ПДФ теперь тоже можно скачать на странице проекта.

Покажите всем.

Ранее Ctrl + ↓