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

Благодарят тут как-то так: «тешекюлер».

Наверное, это слово буквально означает «благодарности», прямо как thanks в английском. Ведь окончание -лер означает множественное число. Откуда я это знаю? Когда-то я увидел в аэропорту слово kapılar, и это были выходы на посадку. Я тогда подумал: «о, на капиляр похоже». Но что-то не сходилось: капиляр-то в единственном числе, а выходы — во множественном. И потом я увидел, что один выход на посадку — это kapı. Значит -lar — это множественное число.

А, тогда, наверное, капы — это гейт в смысле ворота. Тут же много топонимов, заканчивающихся на -kapı. В Москве тоже есть всякие Покровские ворота. И в Лондоне есть Queen’s Gate. Короче, в городах так бывает, и логично предположить, что это оно. Тут я вспомнил, что дербентской схеме у нас тоже были Орта-капы и Кыхляр-капы, причём в районе старого города. Сомнений не осталось.

Но вернёмся к «тешекюлер». У меня же был kapılar, а тут-то -ler. Кажется, это один хрен. Много слов вокруг заканчиваются на -lar и -ler, причём если в слове есть всякие ı, o, u, то там -lar, а если i, ö, ü, то вроде -ler. Видимо, в турецком работает гармония гласных и окончание просто подстраивается под те гласные, которые там были в корне.

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

Пишу комментарий к студенческой работе в школе. Работа почему-то на английском, ну я и комментирую тоже на английском, раз такое дело.

Пишу:

The ‘Basket’ screen looks very busy with a lot of thin lines that separate stuff from some other stuff.

По-русски это было бы примерно так:

Экран «Корзина» выглядит слишком замороченно из-за кучи линий, которые что-то от чего-то отделяют.

В том месте, где я написал that, можно было бы написать which:

The ‘Basket’ screen looks very busy with a lot of thin lines, which separate stuff from some other stuff.

Как выбрать между that от which? Зависит от того, что вы пытаетесь сказать.

Через that объясняют, о чём идёт речь ранее. О каких именно lines идёт речь? О lines that отделяют. Без этой части, начинающейся с that, предыдущая часть предложения неполна.

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

Если можно сказать через which, то можно вообще поставить точку и сказать отдельно:
The ‘Basket’ screen looks very busy with a lot of thin lines. The lines separate stuff from some other stuff.

Но я же имел в виду не это, так что — that.

Если потянуть окно за любую сторону, оно начнёт изменять ширину или высоту в этом направлении. А с нажатым альтом оно симметрично потянется и с противоположной стороны (как в Фотошопе, да).

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

Если даблкликнуть в любую сторону окна, окно «вырастет» с этой стороны до края экрана. Если даблкликнуть в угол — вырастет до соответствующего угла.

Поэтому чтобы вырастить окно на весь экран, но не переходить в кретинский полноэкранный режим, достаточно альт-даблклика в любой его угол.

Разумеется, вы этого не знали, хотя работаете на Маке последние восьмь лет.

См. также:

• Moving OS X Lion windows by dragging the borders

На днях я рассказывал, как хреново работает Фейсбук с длинными постами: обрезает в случайном месте, теряет место чтения при разворачивании. А как надо? Давайте сначала разберёмся с обрезанием.

Обрезать в случайном месте — это неуважение к автору и тексту и лишнее подтверждение тому, что Фейсбуку плевать, что вы там пишете. И это пример лютой технозависимости: машине проще всего резать по определённому числу символов, вот она и режет. За этим даже нет эстетического резона вроде «вместиться в определённый элемент дизайна» (что тоже было бы неуважением к автору и тексту, но хотя бы имело бы гуманистические корни), потому что физический размер строк одинаковой длины в символах в общем случае может отличаться в разы (iii — ЮЮЮ). Даже в моём примере из Фейсбука до конца строки влезло бы ещё несколько слов:

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

Почему-то анал в этом случае — главный чемпион:

Больше примеров — у меня в телеграме.

Соответственно, если без обрезания не обойтись, то обрезать надо аккуратно. Как делает Эгея?

Число символов, в которое нужно уложиться, считается примерным ориентиром, а не точным значением. Если нужно уложиться в 140 символов, а текст имеет длину 143, то Эгея просто не будет его трогать. Если текст заметно длинее предела, то Эгея разделит его на предложения и постарается взять столько полных предложений, сколько влезет. Вот, например, сниппет этой заметки:

Но если в результате получилось слишком мало (или не влезло вообще ни одного предложения целиком), она будет искать другие признаки безопасных мест: точки с запятой, тире, запятые, скобки. Только если ничего из этого нет, то она будет ориентироваться на пробелы. И только если и пробелов нет, она обрежет по числу символов. Отсутствие пробелов — верный признак, что самому автору было плевать на смысл, так что не страшно, если Эгее будет немножко тоже.

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

Казалось бы, если я могу такое напрограммировать, то что мешает Фейсбуку? Да то, что никому даже в голову не приходила идея, что есть хоть какой-то смысл стараться сделать хорошо, просто нет такого понятия в мире Фейсбука даже.

Но что же делать, если у вас дизайн, и вам ну вот прям надо уложиться в определённый прямоугольник, плюс-минус слово никак нельзя?

Тогда вместо многоточия можно прятать не влезающие штуки под градиент. Например, наложить его на последнюю строчку текста, как сделано в бюролекциях:

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

Ругать отдельные решения в интерфейсе Фейсбука странно, ведь там вообще всё сделано ужасно. Но вот об эту чушь запинаюсь каждый раз и просто не могу понять: как, почему?!

Длинные посты Фейсбук обрезает в случайном месте (дебил) и ставит туда штуку See more. Если её нажать, он разворачивает пост, но не вниз, а вверх! То есть та строчка, которую ты читал и не дочитал, улетает в неизвестном направлении, а перед твоими глазами оказывается что попало:

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

У меня, как и у всех нормальных людей, ОКР на тему тротуарной плиточки. Типа, наступать на швы надо одинаковое количество раз разными ногами. Или там, если перешагнул ливнесточный жёлоб левой ногой, то потом надо перешагнуть следующий уже правой. В моей жизни царит баланс и гармония.

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

И я заметил, что для этого мне совершенно не нужно думать или что-то рассчитывать! Моё тело идеально само корректирует длину шага так, чтобы всё шло как по маслу. Я просто вижу очередную полоску красных плиток в семи метрах и откуда-то знаю, как бежать, чтобы на следующую наступить другой ногой. Получается, баланс и гармония даются мне легко.

Пример дебильного интерфейса — когда нельзя просто ввести полный номер телефона, а надо обязательно выбрать страну из списка:

Особенно тяжело, когда у тебя там +44. Я не знаю, что искать: UK? United Kingdom? Britain? Great Britain? England?.. Даже если есть правильный ответ на этот вопрос, не факт, что у авторов формы такие же представления.

Отдельная дичь, что тут кастомная выпадайка вместо стандартной, а значит — конечно же — на поддержку клавиатуры все забили и приходится скролить туда-сюда в этой амбразуре.

Что за +44? Спасибо, что спросили! Это Дримсим.

Показываю, как я верстаю интерфейсы. Общий принцип — делать из всего прямоугольники. Видео хорошо идёт на двойной скорости или даже ещё быстрее, если ваш проигрыватель такое даёт. На этот раз длинный видос, целых 16 минут:

Это фрагмент № 73 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 11 февраля 2022 года.

До 28 октября идёт запись на курс, который пройдёт с 29 октября по 27 ноября.

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

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

Уведомления часто вылезают не вовремя: пока я пишу предложение или пытаюсь слушать собеседника. Хотя во многих случаях нет причин уведомлять секунда в секунду. Утром напоминалка выпить витаминку вылезла во время пробежки — ну ё-моё, понятно же, что я не буду её пить во время пробежки, дождись ты, пока я добегу?

В жизни есть способ уведомить, не перебивая: поднять руку. В интерфейсе в принципе тоже есть разные степени «интрузивности» уведомлений: красный кружок, выезжалка, модальное окно, звуки. Но в жизни если я поднял руку, а меня не замечают, я могу через какое-то время поднять её выше, помахать ею, встать в конце концов. Если ничего не помогает, сказать «Простите!».

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

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

Первым делом нужно посмотреть мою Киевскую лекцию о понимании задачи. Там я рассказываю о том, как вообще формулировать задачу и из каких разделов состоит документ-понимание. Я называю три: 1. Задача. 2. Первая версия. 3. Организация работы. В случае с дипломным проектом структура будет другая, но эти три раздела в ней тоже будут, просто под другими названиями.

На странице договора с бюро есть ссылка «Задание». Там нужно взять шаблон для Гугль-документа с вашим будущим пониманием задачи. Это шаблон Задания, то есть приложения к нашему договору. В нём — вот такие разделы:

1. Цели и функции.
2. Элементы дизайна и функциональность.
3. Стоимость.
4. Этапы и сроки.
5. Технические требования.
6. Принципы совместной работы.

Цели и функции — это аналог раздела «Задача» из лекции. Здесь я ожидаю внятный, подробный, убедительный текст с вашей задачей. Очень желательно, чтобы в нём не было подзаголовков: они создают иллюзию структуры, а я хочу, чтобы у вас само изложение было последовательным.

Самое важное пишется в начале. В идеале в первом же абзаце должна быть формулировка задачи, которую нужно решить, и предлагаемого способа решения: «Повысить доверие к продукту такому-то, создав страницу такую-то» или «Заработать на желании людей таком-то, сделав то-то».

Пример первого абзаца из материалов школы:

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

Задачу иногда проще сформулировать, задав сначала некий контекст, описав «ситуацию во вселенной»: «компания производит то-то» или «люди живут так-то». Этому можно посвятить вводный первый абзац, но уже во втором дать формулировку задачи в этой вселенной, начав его со слова «Задача:».

Один из примеров первых двух абзацев, который был в киевской лекции:

Компания ‹...› 10 лет занимается промышленным альпинизмом, участвует в крупных строительных работах по всей России.

Задача: рассказать потенциальным клиентам о компании, об опыте в промышленном альпинизме, способности работать на крупных объектах; вызвать доверие и уважение. Для решения этой задачи будет создан новый сайт, который расскажет:

• что мы умеем делать;
• что мы уже сделали.

Начиная с третьего абзаца можно уже давать все подробности: и о вселенной, и о задаче, и о способе решения. Там же стоит рассказать о конкретном планируемом содержании продукта, планах по монетиазации, продвижению, оценке успехов. Это самый главный и содержательный раздел. Здесь можно описать всё видение вашего продукта на годы вперёд, если оно у вас уже есть

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

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

Здесь мы просто в назывном порядке перечисляем, что именно входит в проект из того, что мы нафантазировали в предыдущем разделе (а что — не входит). Если причина выбора определённой функциональности для первой итерации неочевидна, можно добавить короткое обоснование: «чтобы на защите сделать то-то, в первой версии реализуем сё-то».

Стоимость — этот раздел нужно убрать.

Этапы и сроки — надо всё заполнить в соответствии с планом третьей ступени. Тут почему-то иногда студенты ломают вёрстку таблицы, всё куда-то съезжает или вдруг появляются рамки. Пожалуйста, не ломайте!

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

Принципы совместной работы — это как раз «Организация работы» из лекции. Здесь надо внести минимум изменений в стандартный бюрошный текст так, чтобы это имело смысл для дипломного проекта. Там поменяются роли, уйдут оговорки о том, в каком случае бюро не несёт ответственности перед клиентом. Когда вы пришлёте мне первую версию понимания задачи, я обязательно спрошу у вас, что вы здесь поменяли. Рекомендую прям выделить жёлтеньким изменённые формулировки, чтобы я сразу это увидел.

Будьте внимательны: это — мои требования, и если у вас другой арт-директор, у него могут быть другие. Может, Ильяхову покажется, что я тут полную ахинею написал, и он отправит вас всё переделывать.

Ну и приходите к нам учиться.