Недавно мы открыли часть четвёртого раздела электронного учебника «Пользовательский интерфейс». Четвёртый раздел называется «Экраны», а новые главы — «Окна» и «Формы».
Разработчики нередко злоупотребляют окнами, но управление ими не относится к задаче пользователя. Пользователи вынуждены раздвигать их туда‑сюда, чтобы добраться до нужного или увидеть то, что они ищут. Значительная часть главы «Окна» посвящена тому, как не плодить их.
В работе над интерфейсом читателю поможет подборка типовых шаблонов организации окон и варианты их комбинирования.
Форма — концентрат интерфейса и большое препятствие для пользователя. Задача проектировщика — упростить человеку её заполнение. В главе «Формы» рассматриваем и конструкцию, и поведение: выравнивание, размеры полей, сообщение об ошибках, обязательные и необязательные поля.
У тех, кто оформил предзаказ, время подписки пока не тикает, а первые три и теперь часть четвёртого раздела уже есть. Если это вы, бегите читать!
С кофеваркой надо разговаривать. Интервью Дениса Филиппова, главного по речевым технологиям в Яндексе. «Грубо говоря, наш синтез речи умеет говорить. И надо выяснить, какие числа в нем нужно крутить, чтобы он начал говорить как, не знаю, таджик. Или как грузин. Или армянин. Или русский из какого-нибудь региона с характерным говором».
Во всех редакторах кода, которые я видел, табы используют для файлов. Вот ВС Код, например:
Это полная тупня: список файлов у меня и так слева есть, зачем мне он же ещё раз в табах?
Чего я хочу, так это чтобы табами открывались целые проекты. В одном табе — один список файлов и папок слева, в другом — другой. Сейчас приходится плодить окна.
В ВС Коде можно исхитриться и всё-таки открыть несколько проектов в виде табов, но это адски сложно и неуправляемо. Клавиатура по-прежнему управляет бессмысленными табами файлов, и жить так нельзя.
В анонсе беты 2.7 я обещал рассказать, как встраивать её в существующие сайты. Понадобится платная версия движка.
Задача: сделать, чтобы Эгея использовала стили, шапку и подвал от вашего сайта, а внутри была сама собой.
Вам нужно сделать свою тему оформления на базе «Встраиваемой». Зайдите в папку themes и сделайте копию папки embeddable. Назовите как-нибудь нормально.
Откройте файл theme-info.php и раскомментируйте в нём все строчки. Пролучится примерно так (это мой):
Самая важная тут с точки зрения нашей задачи — строчка global_styles. Тут нужно указать путь к стилям вашего сайта относительно папки Эгеи (а не этого файла).
Зайдите в настройку Эгеи и выберите свою тему.
В templates/layout.tmpl.php добавьте вёрстку шапки и подвала вашего сайта, то есть заверните содержимое блога в ту же обёртку, что на основном сайте.
Готово!
Всё будет выглядеть как настоящее, потому что к этой странице подцепляются те же стили, что и к другим страницам сайта. А внутренности Эгеи не разваливаются, потому что она также подцепляет ещё и собственные стили. Но делает это избирательно: она не подцепляет стили стандартных ХТМЛ-элементов и поля вокруг страницы. Поэтому эти части выглядят родными.
Если вам нужно перекрыть какие-то стили, используйте файл styles/overrides.css. Изначально он пустой.
Если вы используете систему сборки, то имеет смысл «запечь» стили «Встраиваемой» и ваши перекрытия в основной ЦСС-файл. Перенесите из папки вашей темы styles/main.css и styles/overrides.css куда-то в папку исходников стилей. Это нужно, чтобы Эгея перестала их подцеплять из папки темы. И заимпортируйте в общие стили сайта, например, с помощью СЦССа:
Поезд из аэропорта в город — красный, как обычные пригородные электрички в Германии:
Внутри:
Непонятно, WC значит, что туалет занят или свободен?
Куда едет:
Станция Хакешер-маркт. Городские электрички — жёлто-красные:
Внутри:
Схемы метро висят на соединении вагонов. На экране — название следующей станции и с какой стороны откроются двери.
Метро и городские железные дороги в Берлине объединены в одну систему и изображаются на общей схеме. Хотя визуально и поезда, и станции очень разные. Кольцевая линия здесь не метро, а электрички (S — schnellbahn).
Станция Остбанхоф:
Табличка:
По какому принципу на некоторых станциях написано слово «Берлин» в начале, а на некоторых нет — загадка. В Лондоне такая же петрушка: London Victoria, но просто Liverpool Street. Вроде обе станции в равной степени вокзалы.
Офигенное немецкое расписание:
На жёлтом фоне отправления, на белом — прибытия:
Зум:
Станция Потсдамер-плац:
Против часовой стрелки идёт линия S42, по — S41. Платформы обозначаются соответствующими иконками направлений. Снимают кино:
Станция Александерплац:
Пассажиры изучают расписание:
Обычная станция за пределами самого центра:
Станция «Варшауэрштрассе». Отсюда 10 минут пешком до «Бергхайна» — главного техноклуба мира. Хорошее место:
Главный вокзал Берлина. Расписание занимает два плаката:
Сейчас сюда приедет поезд во Франкфурт-на-Майне:
Смотрите, слева обозначение поезда с буквами A...G. Эта штука показывает, как именно поезд остановится на платформе. Под экраном на фото видно знак D. Это значит, вагон-ресторан остановится там, вагоны первого класса — в зонах A...C, а второго — в зонах E...G.
А вот схема остановки всех поездов на этой платформе:
Красная «струна» между двумя кружками — это где мы сейчас.
Пассажир знает свой номер вагона, поэтому сразу ждёт поезд там, где этот вагон остановится: