{
    "version": "https:\/\/jsonfeed.org\/version\/1.1",
    "title": "Блоги: заметки с тегом представление информации",
    "_rss_description": "Автоматически собираемая лента заметок, написанных в блогах на Эгее",
    "_rss_language": "ru",
    "_itunes_email": "",
    "_itunes_categories_xml": "",
    "_itunes_image": false,
    "_itunes_explicit": "no",
    "home_page_url": "https:\/\/blogengine.ru\/blogs\/tags\/predstavlenie-informacii\/",
    "feed_url": "https:\/\/blogengine.ru\/blogs\/tags\/predstavlenie-informacii\/json\/",
    "icon": false,
    "authors": [
        {
            "name": "Илья Бирман",
            "url": "https:\/\/blogengine.ru\/blogs\/",
            "avatar": false
        }
    ],
    "items": [
        {
            "id": "137681",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-183\/",
            "title": "На интерфейсном курсе: дедубликация элементов",
            "content_html": "<p>В интерфейсе участницы курса я заметил, что список выбранных окон встречается в двух местах в разной роли. Сразу же приходит в голову использовать его в одном месте в обоих смыслах. Ну и это вообще рабочий ход мысли на все случаи жизни. 4 минуты:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/laiarbyW__Y?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 183 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 5 апреля 2024 года.<\/p>\n<p>Открыта запись на курс, который пройдёт 8 ноября — 7 декабря. Сейчас −30% из-за ранней записи, а в рассрочку вообще получается 5530 ₽ \/ мес.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2025-10-07T15:09:07+05:00",
            "date_modified": "2025-10-07T15:08:28+05:00",
            "tags": [
                "видео",
                "пользовательский интерфейс",
                "представление информации",
                "студентам",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Tue, 07 Oct 2025 15:09:07 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "137681",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "136830",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-175\/",
            "title": "Фрагменты интерфейсного курса",
            "content_html": "<p>За те годы, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">почти две сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Разобрал 175 фрагментов.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n  <li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n  <li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n  <li>№ 19. <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n  <li>№ 26. <a href=\"https:\/\/www.youtube.com\/watch?v=Pc0GryUpCgM\">ФИО как в паспорте и эффект японской квартиры<\/a><\/li>\n  <li>№ 89. <a href=\"https:\/\/www.youtube.com\/watch?v=eLOGLY3_h7U\">Прямоугольнизация дизайна и свобода, которую даёт фотошоп<\/a><\/li>\n  <li>№ 119. <a href=\"https:\/\/www.youtube.com\/watch?v=Hwi6ddaRZ38\">О дизайне переключателя (segmented control) и положении кнопки<\/a><\/li>\n  <li>№ 138. <a href=\"https:\/\/www.youtube.com\/watch?v=GNxf6DAZR-Q\">Разное про кассу в магазине<\/a><\/li>\n  <li>№ 146. <a href=\"https:\/\/www.youtube.com\/watch?v=CSvgFqJ8p1Q\">Разбор конфигуратора окон и как классифицировать сообщения об ошибках<\/a><\/li>\n<\/ul>\n<p>Почти самостоятельные лекции:<\/p>\n<ul>\n  <li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a> (это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне)<\/li>\n  <li>№ 33. <a href=\"https:\/\/www.youtube.com\/watch?v=du6SqjjLEzQ\">Физические радиокнопки, рукоятки в самолёте, фотоаппарат Фуджифильм<\/a><\/li>\n  <li>№ 37. <a href=\"https:\/\/www.youtube.com\/watch?v=SwyTvRljimM\">Блиц-пересказ куска питерского доклада про интерфейсы и Ворлд-Чесс<\/a><\/li>\n  <li>№ 46. <a href=\"https:\/\/www.youtube.com\/watch?v=JTqRG_7e3O8\">Про сложное цветовое кодирование и триаду Мейксенара<\/a><\/li>\n  <li>№ 55. <a href=\"https:\/\/www.youtube.com\/watch?v=3q0HH7mUMYA\">Соответствие между логической структурой и выразительными средствами и дизайн-системы<\/a><\/li>\n  <li>№ 167. <a href=\"https:\/\/www.youtube.com\/watch?v=V5StnSF_7sc\">Опрятность прячет проблемы<\/a><\/li>\n<\/ul>\n<p>Метод:<\/p>\n<ul>\n  <li>№ 30. <a href=\"https:\/\/www.youtube.com\/watch?v=-np87CaMjKs\">Метод «Например»<\/a><\/li>\n  <li>№ 40. <a href=\"https:\/\/www.youtube.com\/watch?v=MuDea0wOabA\">Сценка со звонком в пиццерию<\/a><\/li>\n  <li>№ 126. <a href=\"https:\/\/www.youtube.com\/watch?v=ro4EBiCJ1iE\">Решение существует<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n  <li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n  <li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n  <li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n  <li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n  <li>№ 28. <a href=\"https:\/\/www.youtube.com\/watch?v=GrkuX84kKeo\">Улучшаем форму обратной связи Букинг.кома<\/a><\/li>\n  <li>№ 35. <a href=\"https:\/\/www.youtube.com\/watch?v=dckw7tqm1M4\">Первое впечатление от формы<\/a><\/li>\n  <li>№ 50. <a href=\"https:\/\/www.youtube.com\/watch?v=oepQvJtNgUU\">Упорядочиваем вёрстку формы<\/a><\/li>\n  <li>№ 52. <a href=\"https:\/\/www.youtube.com\/watch?v=hPGiFsdTKa8\">Расстояние между полями и сокращение подписей<\/a><\/li>\n  <li>№ 53. <a href=\"https:\/\/www.youtube.com\/watch?v=IR0zLLBf65Y\">Редизайним форму настройки сложной логики<\/a><\/li>\n  <li>№ 63. <a href=\"https:\/\/www.youtube.com\/watch?v=KbZAeVFaEcU\">Добавление нескольких телефонов в форме<\/a><\/li>\n  <li>№ 84. <a href=\"https:\/\/www.youtube.com\/watch?v=phraobT9Ufk\">Разбираем мелочи в форме регистрации<\/a><\/li>\n  <li>№ 85. <a href=\"https:\/\/www.youtube.com\/watch?v=DnTeUK1OqLQ\">Исправляем форму формы, ну и немножко содержание<\/a><\/li>\n  <li>№ 103.<a href=\"https:\/\/www.youtube.com\/watch?v=b4NPKYiT9n4\">Плейсхолдеры в каждом поле — это как иконки у каждого пункта меню<\/a><\/li>\n  <li>№ 104. <a href=\"https:\/\/www.youtube.com\/watch?v=dqnYrhXSMms\">Подробный разбор сложной формы<\/a><\/li>\n  <li>№ 108. <a href=\"https:\/\/www.youtube.com\/watch?v=9RUUtqehkyU\">Кирпичная кладка и другие недостатки формы<\/a><\/li>\n  <li>№ 118. <a href=\"https:\/\/www.youtube.com\/watch?v=9kB6CfCE0aM\">Обозначение обязательных и необязательных полей<\/a><\/li>\n  <li>№ 130. <a href=\"https:\/\/www.youtube.com\/watch?v=ublwi2BmrH0\">Как сделать сетку в форме<\/a><\/li>\n  <li>№ 143. <a href=\"https:\/\/www.youtube.com\/watch?v=VlEbVJGgGXw\">Не надо ставить элементы формы под главную кнопку<\/a><\/li>\n  <li>№ 145. <a href=\"https:\/\/www.youtube.com\/watch?v=WjX759lGaHI\">У Гугля плохой дизайн<\/a><\/li>\n  <li>№ 154. <a href=\"https:\/\/www.youtube.com\/watch?v=YIwCjtdp5Y4\">Форма слишком сложная<\/a><\/li>\n  <li>№ 156. <a href=\"https:\/\/www.youtube.com\/watch?v=5gxBJOV4yzA\">Размеры и кнопка в форме<\/a><\/li>\n  <li>№ 159. <a href=\"https:\/\/www.youtube.com\/watch?v=rMnnM3o_JXo\">Поле поиска — это не часть полей формы<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a><\/p>\n<p>Элементы интерфейса:<\/p>\n<ul>\n  <li>№ 60. <a href=\"https:\/\/www.youtube.com\/watch?v=NdBt_Oqydk4\">Рассуждения о текстовых кнопках<\/a><\/li>\n  <li>№ 67. <a href=\"https:\/\/www.youtube.com\/watch?v=WqFfT7yDMJg\">Меняем табы на переключалку и настраиваем вёрстку<\/a><\/li>\n  <li>№ 72. <a href=\"https:\/\/www.youtube.com\/watch?v=IV2nVMcaQ7U\">Представляем выбор внятно радиокнопками<\/a><\/li>\n  <li>№ 76. <a href=\"https:\/\/www.youtube.com\/watch?v=wihXJHHK3yo\">Так это кнопка или ссылка? Оказывается, это радиокнопка!<\/a><\/li>\n  <li>№ 114. <a href=\"https:\/\/www.youtube.com\/watch?v=n4Cb774L2_U\">Что не так с аккордеоном<\/a><\/li>\n  <li>№ 116. <a href=\"https:\/\/www.youtube.com\/watch?v=9tewBcFm-1M\">Как назвать чупа-чупс<\/a><\/li>\n  <li>№ 144. <a href=\"https:\/\/www.youtube.com\/watch?v=ZFLMkM02lp8\">Три вида серенького текста в поле<\/a><\/li>\n  <li>№ 147. <a href=\"https:\/\/www.youtube.com\/watch?v=FusPcntg-oI\">Показываю старинные радиокнопку и чекбокс<\/a><\/li>\n  <li>№ 151. <a href=\"https:\/\/www.youtube.com\/watch?v=mMTivJldcAQ\">Про хоум-индикатор<\/a><\/li>\n  <li>№ 169. <a href=\"https:\/\/www.youtube.com\/watch?v=hpnt4JyiU2o\">У прямоугольника недостаточно признаков поля<\/a><\/li>\n<\/ul>\n<p>Интерфейс:<\/p>\n<ul>\n  <li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n  <li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n  <li>№ 44. <a href=\"https:\/\/www.youtube.com\/watch?v=2aQnKL5nLUw\">Упрощаем экран успешного заказа пиццы<\/a><\/li>\n  <li>№ 61. <a href=\"https:\/\/www.youtube.com\/watch?v=-zzLglJ9bEc\">Упрощаем первый экран кассы самообслуживания, добавляем кнопку «У меня булка»<\/a><\/li>\n  <li>№ 74. <a href=\"https:\/\/www.youtube.com\/watch?v=aLETIvOafg0\">Так это форма или мастер?<\/a><\/li>\n  <li>№ 75. <a href=\"https:\/\/www.youtube.com\/watch?v=zngun6Kw1q4\">Точно описываем поведение интерфейса для разработчиков<\/a><\/li>\n  <li>№ 77. <a href=\"https:\/\/www.youtube.com\/watch?v=U_9t3-mJXp0\">Жму синюю кнопку на автомате, не читая<\/a><\/li>\n  <li>№ 83. <a href=\"https:\/\/www.youtube.com\/watch?v=D0zKnGG10tY\">Уважать ли интерфейсные традиции разных платформ?<\/a><\/li>\n  <li>№ 86. <a href=\"https:\/\/www.youtube.com\/watch?v=wq4MQNpFrbg\">Не надо ничего активировать<\/a><\/li>\n  <li>№ 97. <a href=\"https:\/\/www.youtube.com\/watch?v=jwbEj5v3bu8\">Ширина и прокрутка на десктопе<\/a><\/li>\n  <li>№ 101. <a href=\"https:\/\/www.youtube.com\/watch?v=pn_X2x_8XPo\">Елена Семёновна и валидация ввода<\/a><\/li>\n  <li>№ 105. <a href=\"https:\/\/www.youtube.com\/watch?v=Ew75feYtGMs\">Как именно работает взаимодействие?<\/a><\/li>\n  <li>№ 107. <a href=\"https:\/\/www.youtube.com\/watch?v=GBj17b4l10s\">Как делать, чтобы программа не тормозила<\/a><\/li>\n  <li>№ 109. <a href=\"https:\/\/www.youtube.com\/watch?v=-8neywtnhT8\">Двухпанельный интерфейс<\/a><\/li>\n  <li>№ 115. <a href=\"https:\/\/www.youtube.com\/watch?v=Tq8Rh7GPqhM\">Мир пользователя<\/a><\/li>\n  <li>№ 121. <a href=\"https:\/\/www.youtube.com\/watch?v=xKPaH3XiW-4\">О связях сущностей в сложных системах<\/a><\/li>\n  <li>№ 122. <a href=\"https:\/\/www.youtube.com\/watch?v=XvPjm7mQ0n8\">Думать из мира пользователя<\/a> (продолжение из 115)<\/li>\n  <li>№ 149. <a href=\"https:\/\/www.youtube.com\/watch?v=UENZW1gNjpU\">Двойная обратная связь<\/a><\/li>\n  <li>№ 150. <a href=\"https:\/\/www.youtube.com\/watch?v=crgZi_CW6xU\">Зелёный значит «всё хорошо»<\/a><\/li>\n  <li>№ 153. <a href=\"https:\/\/www.youtube.com\/watch?v=9E-iYfjEqg0\">В играх всё иначе<\/a><\/li>\n  <li>№ 155. <a href=\"https:\/\/www.youtube.com\/watch?v=cG6jewXdWL4\">Кнопка «Сохранить» — плохой знак<\/a><\/li>\n  <li>№ 168. <a href=\"https:\/\/www.youtube.com\/watch?v=ax1BrxWlcOw\">Что делать, пока ЭВМ думает медленно?<\/a><\/li>\n<\/ul>\n<p>Таблицы:<\/p>\n<ul>\n  <li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n  <li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n  <li>№ 29. <a href=\"https:\/\/www.youtube.com\/watch?v=N2LINRApqmg\">Круговая диаграмма для красоты, табличка для пользы дела<\/a><\/li>\n  <li>№ 39. <a href=\"https:\/\/www.youtube.com\/watch?v=MgwYwu3wkk4\">Дизайн универсальных таблиц с непредсказуемым содержимым<\/a><\/li>\n  <li>№ 65. <a href=\"https:\/\/www.youtube.com\/watch?v=oz571oi6w24\">Живые спарклайны в таблице<\/a><\/li>\n  <li>№ 102. <a href=\"https:\/\/www.youtube.com\/watch?v=QyHEWiMR_0A\">Как выравнивать цифры в таблицах<\/a><\/li>\n  <li>№ 112. <a href=\"https:\/\/www.youtube.com\/watch?v=zSJijCINU58\">Собираем табличку с диапазоном и разной точностью<\/a><\/li>\n  <li>№ 113. <a href=\"https:\/\/www.youtube.com\/watch?v=ZDvDnJ1HSP0\">Рекомендую жирную, а не бледную шапку в таблице<\/a><\/li>\n  <li>№ 117. <a href=\"https:\/\/www.youtube.com\/watch?v=PBzl0pIUqk0\">Горизонтальная прокрутка в таблицах<\/a><\/li>\n  <li>№ 142. <a href=\"https:\/\/www.youtube.com\/watch?v=tOiNW_F_PH4\">Про динамические таблицы<\/a><\/li>\n  <li>№ 157. <a href=\"https:\/\/www.youtube.com\/watch?v=36V12nuC0kY\">Иерархия в таблице<\/a><\/li>\n  <li>№ 171. <a href=\"https:\/\/www.youtube.com\/watch?v=0F-zmFtcWwI\">Повышаем плотность таблиц<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a><\/p>\n<p>Графики, диаграммы, инфографика:<\/p>\n<ul>\n  <li>№ 34. <a href=\"https:\/\/www.youtube.com\/watch?v=u682Zi8_FBk\">Визуализация помогает увидеть закономерности<\/a><\/li>\n  <li>№ 43. <a href=\"https:\/\/www.youtube.com\/watch?v=BvugvUfyXmg\">Объясняю про тафтианские 45 градусов на графике<\/a><\/li>\n  <li>№ 94. <a href=\"https:\/\/www.youtube.com\/watch?v=8986vOikHRk\">Если данных мало, то и график не нужен<\/a><\/li>\n  <li>№ 95. <a href=\"https:\/\/www.youtube.com\/watch?v=WSXYgIwdziI\">Рассуждения про инфографику и её задачи<\/a><\/li>\n  <li>№ 98. <a href=\"https:\/\/www.youtube.com\/watch?v=9pf94f8Mz7Q\">Когда визуализация потрачена впустую<\/a><\/li>\n  <li>№ 110. <a href=\"https:\/\/www.youtube.com\/watch?v=qsDWBf-xcVs\">В чём проблема интерактивных графиков<\/a><\/li>\n  <li>№ 111. <a href=\"https:\/\/www.youtube.com\/watch?v=wJJdSn4Vk-Q\">Нужны не круговые диаграммы, а таблица<\/a><\/li>\n  <li>№ 132. <a href=\"https:\/\/www.youtube.com\/watch?v=Urn9TDalPg4\">Дискуссия о задачах инфографики<\/a><\/li>\n  <li>№ 134. <a href=\"https:\/\/www.youtube.com\/watch?v=zMmO0bWqELQ\">Музыкальная нотация и чтение с листа<\/a><\/li>\n  <li>№ 172. <a href=\"https:\/\/www.youtube.com\/watch?v=Oz3A44Em8ms\">Толщина — носитель цвета<\/a><\/li>\n<\/ul>\n<p>Редактура в дизайне:<\/p>\n<ul>\n  <li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n  <li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n  <li>№ 49. <a href=\"https:\/\/www.youtube.com\/watch?v=H3UvwkQH8_o\">Редактура привела к радиокнопке<\/a><\/li>\n  <li>№ 66. <a href=\"https:\/\/www.youtube.com\/watch?v=-6LaXViTWzc\">Исследование о тексте в интерфейсе Эпла (1980-е)<\/a><\/li>\n  <li>№ 70. <a href=\"https:\/\/www.youtube.com\/watch?v=Zphn9ixcd0U\">Показать примечание в контексте и заодно сократить<\/a><\/li>\n  <li>№ 80. <a href=\"https:\/\/www.youtube.com\/watch?v=AmuCRWsSdpA\">Редактируем интерфейс конфигуратора окон<\/a><\/li>\n  <li>№ 92. <a href=\"https:\/\/www.youtube.com\/watch?v=bYk0_q6tWLA\">Поле «Комментарий для курьера»<\/a><\/li>\n  <li>№ 96. <a href=\"https:\/\/www.youtube.com\/watch?v=1l35NtOBogE\">Жирный против курсива<\/a><\/li>\n  <li>№ 120. <a href=\"https:\/\/www.youtube.com\/watch?v=H-tk4IhJWnA\">Непонятный выбор и названия кнопок<\/a><\/li>\n  <li>№ 127. <a href=\"https:\/\/www.youtube.com\/watch?v=oJkMBxIeLE0\">Редактируем регистрацию на вымышленном сайте<\/a><\/li>\n  <li>№ 129. <a href=\"https:\/\/www.youtube.com\/watch?v=5e2pwuF8raQ\">Формулировки ошибок в форме<\/a><\/li>\n  <li>№ 135. <a href=\"https:\/\/www.youtube.com\/watch?v=ERNjOfUbXZY\">Сокращаем текст про почту<\/a><\/li>\n<\/ul>\n<p>Вёрстка:<\/p>\n<ul>\n  <li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n  <li>№ 42. <a href=\"https:\/\/www.youtube.com\/watch?v=sXRWQ05cO3I\">Улучшаем эстетику с помощью контраста и прямоугольности<\/a><\/li>\n  <li>№ 73. <a href=\"https:\/\/www.youtube.com\/watch?v=49DSUMomhNE\">Верстаем интерфейс конструктора окон<\/a><\/li>\n  <li>№ 78. <a href=\"https:\/\/www.youtube.com\/watch?v=JFKJHdQJvNQ\">Неудачные выравнивательные связи<\/a><\/li>\n  <li>№ 99. <a href=\"https:\/\/www.youtube.com\/watch?v=yj5dFy9HQ-Y\">Комментирую вёрстку окна<\/a><\/li>\n  <li>№ 160. <a href=\"https:\/\/www.youtube.com\/watch?v=UeSCu7MFeAw\">Двигаем иконки в виджете<\/a><\/li>\n  <li>№ 161. <a href=\"https:\/\/www.youtube.com\/watch?v=a0HYHigmUx8\">Вписываем кусок карты в виджет<\/a><\/li>\n  <li>№ 162. <a href=\"https:\/\/www.youtube.com\/watch?v=cbpDb3k_t5k\">Чистим виджет от шума<\/a><\/li>\n  <li>№ 164. <a href=\"https:\/\/www.youtube.com\/watch?v=AebU9xyd-QI\">Виджет умного дома с иконками<\/a><\/li>\n  <li>№ 173. <a href=\"https:\/\/www.youtube.com\/watch?v=EaSKacTWobU\">Срисовываем большой круг для виджета<\/a><\/li>\n  <li>№ 174. <a href=\"https:\/\/www.youtube.com\/watch?v=aV65V1H4w3I\">Срисовываем виджет погоды<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n  <li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n  <li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n  <li>№ 27. <a href=\"https:\/\/www.youtube.com\/watch?v=X1v54YA8g7c\">Cкруглённое поле поиска и ужасный шрифт Мирьяд-про<\/a><\/li>\n  <li>№ 79. <a href=\"https:\/\/www.youtube.com\/watch?v=58GldX-JZig\">Улучшаем дизайн кнопки<\/a><\/li>\n  <li>№ 81. <a href=\"https:\/\/www.youtube.com\/watch?v=rlCxhBCxJww\">Классические признаки поля ввода и кнопки<\/a><\/li>\n  <li>№ 87. <a href=\"https:\/\/www.youtube.com\/watch?v=ox38_G9lQuo\">Вспомогательные линии — тоньше и скромнее<\/a><\/li>\n  <li>№ 91. <a href=\"https:\/\/www.youtube.com\/watch?v=hieOe3wu-7E\">Аналогия между элементами интерфейса и буквами шрифта, которые можно взять готовые<\/a><\/li>\n  <li>№ 93. <a href=\"https:\/\/www.youtube.com\/watch?v=hh1oSLA0XaE\">Задисейбленность кнопки<\/a><\/li>\n  <li>№ 140. <a href=\"https:\/\/www.youtube.com\/watch?v=Z8C1RMcR2fk\">Выбор цветов для интерфейса<\/a><\/li>\n  <li>№ 141. <a href=\"https:\/\/www.youtube.com\/watch?v=E40xHhr73Ig\">Шрифты с засечками в интерфейсе<\/a><\/li>\n  <li>№ 148. <a href=\"https:\/\/www.youtube.com\/watch?v=X7mBhTG08xA\">Настраиваем толщины линий<\/a><\/li>\n  <li>№ 152. <a href=\"https:\/\/www.youtube.com\/watch?v=hvv_ohLK1xU\">Много стилей и плохие тени<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n  <li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n  <li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n  <li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n  <li>№ 71. <a href=\"https:\/\/www.youtube.com\/watch?v=TAg6cnGIsh4\">Запрещаю выравнивание по центру<\/a><\/li>\n<\/ul>\n<p>Бизнесовое и продуктовое:<\/p>\n<ul>\n  <li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n  <li>№ 32. <a href=\"https:\/\/www.youtube.com\/watch?v=qeyRl3IVSGQ\">Закоулки интерфейса можно просто не делать<\/a><\/li>\n  <li>№ 38. <a href=\"https:\/\/www.youtube.com\/watch?v=k6iyy4vJ1Co\">Продаём окна, объясняя разницу профилей<\/a><\/li>\n  <li>№ 47. <a href=\"https:\/\/www.youtube.com\/watch?v=6rDKRg6SlVc\">Аккуратное внедрение нового дизайна без ущерба привычкам<\/a><\/li>\n  <li>№ 48. <a href=\"https:\/\/www.youtube.com\/watch?v=MhdZzXw_Tzc\">Что, если на реализацию хорошего интерфейса нет времени<\/a><\/li>\n  <li>№ 56. <a href=\"https:\/\/www.youtube.com\/watch?v=3polv_KHa5g\">Разделяем сценарии оплаты частично, ровно по счёту и впрок<\/a><\/li>\n  <li>№ 57. <a href=\"https:\/\/www.youtube.com\/watch?v=TeolvcH5f_8\">Соблазняем человека пиццей, а не текстом «Ваша корзина пуста»<\/a><\/li>\n  <li>№ 59. <a href=\"https:\/\/www.youtube.com\/watch?v=UcIjtMreNHA\">Постоянные напоминания о цене могут мешать покупать<\/a><\/li>\n  <li>№ 64. <a href=\"https:\/\/www.youtube.com\/watch?v=PQzVzgYfvfQ\">Вопросы клиента к интерфейсу кассы самообслуживания<\/a><\/li>\n  <li>№ 82. <a href=\"https:\/\/www.youtube.com\/watch?v=2qV6CCRT6lA\">Заранее спросить у клиента про сео и персональные данные<\/a><\/li>\n  <li>№ 88. <a href=\"https:\/\/www.youtube.com\/watch?v=Mt45AuwOnvA\">Убрал шум — добавь сигнал!<\/a><\/li>\n  <li>№ 90. <a href=\"https:\/\/www.youtube.com\/watch?v=-GHjDFHWrBA\">Классно упростить себе задачу<\/a><\/li>\n  <li>№ 100. <a href=\"https:\/\/www.youtube.com\/watch?v=yTIrl1jnEHU\">Программисты могли бы подумать о пользе для бизнеса<\/a><\/li>\n  <li>№ 106. <a href=\"https:\/\/www.youtube.com\/watch?v=3fzeLHVhvy0\">Оговорка, что интерфейс — это не всё<\/a><\/li>\n  <li>№ 136. <a href=\"https:\/\/www.youtube.com\/watch?v=qh5BmDJ48yI\">Дисейблить ли кнопку с точки зрения канонов интерфейса и бизнеса?<\/a><\/li>\n  <li>№ 175. <a href=\"https:\/\/www.youtube.com\/watch?v=NqKDGROn8AQ\">Работа дизайнера — разобраться в теме<\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n  <li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n  <li>№ 41. <a href=\"https:\/\/www.youtube.com\/watch?v=NF8fC2Cp8iU\">Перерисовываю и улучшаю кусок интерфейса в Фигме с помощью компонентов<\/a><\/li>\n  <li>№ 45. <a href=\"https:\/\/www.youtube.com\/watch?v=H3CF-RG9lIc\">Режимы наложения слоёв с овощами и фруктами<\/a><\/li>\n  <li>№ 54. <a href=\"https:\/\/www.youtube.com\/watch?v=uILlCs5L_mY\">Секреты встроенной скриншотилки на Маке<\/a><\/li>\n<\/ul>\n<p>Работа над дизайном и подача:<\/p>\n<ul>\n  <li>№ 36. <a href=\"https:\/\/www.youtube.com\/watch?v=czu2l7RfEWs\">Оставляйте введённый запрос в поле поиска и рисуйте клавиатуру<\/a><\/li>\n  <li>№ 58. <a href=\"https:\/\/www.youtube.com\/watch?v=2tANVy6u2TQ\">Не описывайте макеты и не делайте «невозможные» макеты<\/a><\/li>\n  <li>№ 128. <a href=\"https:\/\/www.youtube.com\/watch?v=zCldGigmk04\">Что не так с ваерфреймами<\/a><\/li>\n  <li>№ 139. <a href=\"https:\/\/www.youtube.com\/watch?v=tqfe5-w0VPo\">Сначала презентуйте линейно, а потом уже рисуйте диаграммы<\/a><\/li>\n  <li>№ 158. <a href=\"https:\/\/www.youtube.com\/watch?v=WjHJhh6K7dk\">Важность подачи дизайна<\/a><\/li>\n  <li>№ 165. <a href=\"https:\/\/www.youtube.com\/watch?v=uCssgVrDCqM\">Крутой интерфейс кассы и крутая его презентация<\/a><\/li>\n  <li>№ 170. <a href=\"https:\/\/www.youtube.com\/watch?v=mlqnrYCBqr0\">Дизайн дизайна, или как расположить макеты на холсте<\/a><\/li>\n<\/ul>\n<p>Разное интересное:<\/p>\n<ul>\n  <li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n  <li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n  <li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n  <li>№ 31. <a href=\"https:\/\/www.youtube.com\/watch?v=bCMAOeqapDI\">Двусмысленная иконка и проверка венгерским языком<\/a><\/li>\n  <li>№ 51. <a href=\"https:\/\/www.youtube.com\/watch?v=SQQLWeCaHs8\">Глючная обработка ввода пользователя в интерфейсе Сафари<\/a><\/li>\n  <li>№ 62. <a href=\"https:\/\/www.youtube.com\/watch?v=4JzD6d9V0nU\">Что делать, если клиент хочет фигню?<\/a><\/li>\n  <li>№ 68. <a href=\"https:\/\/www.youtube.com\/watch?v=x6RbJD24N6o\">Благодарности и в чём польза теории<\/a><\/li>\n  <li>№ 69. <a href=\"https:\/\/www.youtube.com\/watch?v=JoA5JZcBoS0\">Что делать дизайнеру, если разработчики напрограммили всю магию?<\/a><\/li>\n  <li>№ 123. <a href=\"https:\/\/www.youtube.com\/watch?v=zoN15-R2gQ8\">Благодарности<\/a><\/li>\n  <li>№ 124. <a href=\"https:\/\/www.youtube.com\/watch?v=gCTCA_dQOp4\">Мастрид ли Тафти?<\/a><\/li>\n  <li>№ 125. <a href=\"https:\/\/www.youtube.com\/watch?v=35uwvF6SZb8\">Как я отношусь к войсикам и кружочкам<\/a><\/li>\n  <li>№ 131. <a href=\"https:\/\/www.youtube.com\/watch?v=2PC5L3tv6fA\">Когда нужны моноширинные цифры<\/a><\/li>\n  <li>№ 133. <a href=\"https:\/\/www.youtube.com\/watch?v=o2DjvI6nVts\">Плакаты и бумага, которая горит<\/a><\/li>\n  <li>№ 137. <a href=\"https:\/\/www.youtube.com\/watch?v=dfe9kO0a054\">Почему я не могу дать список дизайнеров, за которыми надо следить<\/a><\/li>\n  <li>№ 163. <a href=\"https:\/\/www.youtube.com\/watch?v=K98thEFlCng\">Про компасную стрелку, стороны света и смелость<\/a><\/li>\n  <li>№ 166. <a href=\"https:\/\/www.youtube.com\/watch?v=GLfjVm4Douk\">Как быть с пустой лепёшкой<\/a><\/li>\n<\/ul>\n<p>Потом разберу ещё. А вы пока приходите на следующий курс, который пройдёт 30 августа — 28 сентября.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2025-07-21T19:21:32+05:00",
            "date_modified": "2025-07-21T19:24:14+05:00",
            "tags": [
                "Курсы",
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Mon, 21 Jul 2025 19:21:32 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "136830",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "131870",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-150\/",
            "title": "Фрагменты интерфейсного курса (1—150)",
            "content_html": "<p>За те три года, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">полторы сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Разобрал 150 фрагментов, <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-175\/\">потом разберу ещё<\/a>.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n  <li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n  <li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n  <li>№ 19. <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n  <li>№ 26. <a href=\"https:\/\/www.youtube.com\/watch?v=Pc0GryUpCgM\">ФИО как в паспорте и эффект японской квартиры<\/a><\/li>\n  <li>№ 89. <a href=\"https:\/\/www.youtube.com\/watch?v=eLOGLY3_h7U\">Прямоугольнизация дизайна и свобода, которую даёт фотошоп<\/a><\/li>\n  <li>№ 119. <a href=\"https:\/\/www.youtube.com\/watch?v=Hwi6ddaRZ38\">О дизайне переключателя (segmented control) и положении кнопки<\/a><\/li>\n  <li>№ 138. <a href=\"https:\/\/www.youtube.com\/watch?v=GNxf6DAZR-Q\">Разное про кассу в магазине<\/a><\/li>\n  <li>№ 146. <a href=\"https:\/\/www.youtube.com\/watch?v=CSvgFqJ8p1Q\">Разбор конфигуратора окон и как классифицировать сообщения об ошибках<\/a><\/li>\n<\/ul>\n<p>Почти самостоятельные лекции:<\/p>\n<ul>\n  <li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a> (это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне)<\/li>\n  <li>№ 33. <a href=\"https:\/\/www.youtube.com\/watch?v=du6SqjjLEzQ\">Физические радиокнопки, рукоятки в самолёте, фотоаппарат Фуджифильм<\/a><\/li>\n  <li>№ 37. <a href=\"https:\/\/www.youtube.com\/watch?v=SwyTvRljimM\">Блиц-пересказ куска питерского доклада про интерфейсы и Ворлд-Чесс<\/a><\/li>\n  <li>№ 46. <a href=\"https:\/\/www.youtube.com\/watch?v=JTqRG_7e3O8\">Про сложное цветовое кодирование и триаду Мейксенара<\/a><\/li>\n  <li>№ 55. <a href=\"https:\/\/www.youtube.com\/watch?v=3q0HH7mUMYA\">Соответствие между логической структурой и выразительными средствами и дизайн-системы<\/a><\/li>\n<\/ul>\n<p>Метод:<\/p>\n<ul>\n  <li>№ 30. <a href=\"https:\/\/www.youtube.com\/watch?v=-np87CaMjKs\">Метод «Например»<\/a><\/li>\n  <li>№ 40. <a href=\"https:\/\/www.youtube.com\/watch?v=MuDea0wOabA\">Сценка со звонком в пиццерию<\/a><\/li>\n  <li>№ 126. <a href=\"https:\/\/www.youtube.com\/watch?v=ro4EBiCJ1iE\">Решение существует<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n  <li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n  <li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n  <li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n  <li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n  <li>№ 28. <a href=\"https:\/\/www.youtube.com\/watch?v=GrkuX84kKeo\">Улучшаем форму обратной связи Букинг.кома<\/a><\/li>\n  <li>№ 35. <a href=\"https:\/\/www.youtube.com\/watch?v=dckw7tqm1M4\">Первое впечатление от формы<\/a><\/li>\n  <li>№ 50. <a href=\"https:\/\/www.youtube.com\/watch?v=oepQvJtNgUU\">Упорядочиваем вёрстку формы<\/a><\/li>\n  <li>№ 52. <a href=\"https:\/\/www.youtube.com\/watch?v=hPGiFsdTKa8\">Расстояние между полями и сокращение подписей<\/a><\/li>\n  <li>№ 53. <a href=\"https:\/\/www.youtube.com\/watch?v=IR0zLLBf65Y\">Редизайним форму настройки сложной логики<\/a><\/li>\n  <li>№ 63. <a href=\"https:\/\/www.youtube.com\/watch?v=KbZAeVFaEcU\">Добавление нескольких телефонов в форме<\/a><\/li>\n  <li>№ 84. <a href=\"https:\/\/www.youtube.com\/watch?v=phraobT9Ufk\">Разбираем мелочи в форме регистрации<\/a><\/li>\n  <li>№ 85. <a href=\"https:\/\/www.youtube.com\/watch?v=DnTeUK1OqLQ\">Исправляем форму формы, ну и немножко содержание<\/a><\/li>\n  <li>№ 103.<a href=\"https:\/\/www.youtube.com\/watch?v=b4NPKYiT9n4\">Плейсхолдеры в каждом поле — это как иконки у каждого пункта меню<\/a><\/li>\n  <li>№ 104. <a href=\"https:\/\/www.youtube.com\/watch?v=dqnYrhXSMms\">Подробный разбор сложной формы<\/a><\/li>\n  <li>№ 108. <a href=\"https:\/\/www.youtube.com\/watch?v=9RUUtqehkyU\">Кирпичная кладка и другие недостатки формы<\/a><\/li>\n  <li>№ 118. <a href=\"https:\/\/www.youtube.com\/watch?v=9kB6CfCE0aM\">Обозначение обязательных и необязательных полей<\/a><\/li>\n  <li>№ 130. <a href=\"https:\/\/www.youtube.com\/watch?v=ublwi2BmrH0\">Как сделать сетку в форме<\/a><\/li>\n  <li>№ 143. <a href=\"https:\/\/www.youtube.com\/watch?v=VlEbVJGgGXw\">Не надо ставить элементы формы под главную кнопку<\/a><\/li>\n  <li>№ 145. <a href=\"https:\/\/www.youtube.com\/watch?v=WjX759lGaHI\">У Гугля плохой дизайн<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a><\/p>\n<p>Элементы интерфейса:<\/p>\n<ul>\n  <li>№ 60. <a href=\"https:\/\/www.youtube.com\/watch?v=NdBt_Oqydk4\">Рассуждения о текстовых кнопках<\/a><\/li>\n  <li>№ 67. <a href=\"https:\/\/www.youtube.com\/watch?v=WqFfT7yDMJg\">Меняем табы на переключалку и настраиваем вёрстку<\/a><\/li>\n  <li>№ 72. <a href=\"https:\/\/www.youtube.com\/watch?v=IV2nVMcaQ7U\">Представляем выбор внятно радиокнопками<\/a><\/li>\n  <li>№ 76. <a href=\"https:\/\/www.youtube.com\/watch?v=wihXJHHK3yo\">Так это кнопка или ссылка? Оказывается, это радиокнопка!<\/a><\/li>\n  <li>№ 114. <a href=\"https:\/\/www.youtube.com\/watch?v=n4Cb774L2_U\">Что не так с аккордеоном<\/a><\/li>\n  <li>№ 116. <a href=\"https:\/\/www.youtube.com\/watch?v=9tewBcFm-1M\">Как назвать чупа-чупс<\/a><\/li>\n  <li>№ 144. <a href=\"https:\/\/www.youtube.com\/watch?v=ZFLMkM02lp8\">Три вида серенького текста в поле<\/a><\/li>\n  <li>№ 147. <a href=\"https:\/\/www.youtube.com\/watch?v=FusPcntg-oI\">Показываю старинные радиокнопку и чекбокс<\/a><\/li>\n<\/ul>\n<p>Интерфейс:<\/p>\n<ul>\n  <li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n  <li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n  <li>№ 44. <a href=\"https:\/\/www.youtube.com\/watch?v=2aQnKL5nLUw\">Упрощаем экран успешного заказа пиццы<\/a><\/li>\n  <li>№ 61. <a href=\"https:\/\/www.youtube.com\/watch?v=-zzLglJ9bEc\">Упрощаем первый экран кассы самообслуживания, добавляем кнопку «У меня булка»<\/a><\/li>\n  <li>№ 74. <a href=\"https:\/\/www.youtube.com\/watch?v=aLETIvOafg0\">Так это форма или мастер?<\/a><\/li>\n  <li>№ 75. <a href=\"https:\/\/www.youtube.com\/watch?v=zngun6Kw1q4\">Точно описываем поведение интерфейса для разработчиков<\/a><\/li>\n  <li>№ 77. <a href=\"https:\/\/www.youtube.com\/watch?v=U_9t3-mJXp0\">Жму синюю кнопку на автомате, не читая<\/a><\/li>\n  <li>№ 83. <a href=\"https:\/\/www.youtube.com\/watch?v=D0zKnGG10tY\">Уважать ли интерфейсные традиции разных платформ?<\/a><\/li>\n  <li>№ 86. <a href=\"https:\/\/www.youtube.com\/watch?v=wq4MQNpFrbg\">Не надо ничего активировать<\/a><\/li>\n  <li>№ 97. <a href=\"https:\/\/www.youtube.com\/watch?v=jwbEj5v3bu8\">Ширина и прокрутка на десктопе<\/a><\/li>\n  <li>№ 101. <a href=\"https:\/\/www.youtube.com\/watch?v=pn_X2x_8XPo\">Елена Семёновна и валидация ввода<\/a><\/li>\n  <li>№ 105. <a href=\"https:\/\/www.youtube.com\/watch?v=Ew75feYtGMs\">Как именно работает взаимодействие?<\/a><\/li>\n  <li>№ 107. <a href=\"https:\/\/www.youtube.com\/watch?v=GBj17b4l10s\">Как делать, чтобы программа не тормозила<\/a><\/li>\n  <li>№ 109. <a href=\"https:\/\/www.youtube.com\/watch?v=-8neywtnhT8\">Двухпанельный интерфейс<\/a><\/li>\n  <li>№ 115. <a href=\"https:\/\/www.youtube.com\/watch?v=Tq8Rh7GPqhM\">Мир пользователя<\/a><\/li>\n  <li>№ 121. <a href=\"https:\/\/www.youtube.com\/watch?v=xKPaH3XiW-4\">О связях сущностей в сложных системах<\/a><\/li>\n  <li>№ 122. <a href=\"https:\/\/www.youtube.com\/watch?v=XvPjm7mQ0n8\">Думать из мира пользователя<\/a> (продолжение из 115)<\/li>\n  <li>№ 149. <a href=\"https:\/\/www.youtube.com\/watch?v=UENZW1gNjpU\">Двойная обратная связь<\/a><\/li>\n  <li>№ 150. <a href=\"https:\/\/www.youtube.com\/watch?v=crgZi_CW6xU\">Зелёный значит «всё хорошо»<\/a><\/li>\n<\/ul>\n<p>Таблицы:<\/p>\n<ul>\n  <li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n  <li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n  <li>№ 29. <a href=\"https:\/\/www.youtube.com\/watch?v=N2LINRApqmg\">Круговая диаграмма для красоты, табличка для пользы дела<\/a><\/li>\n  <li>№ 39. <a href=\"https:\/\/www.youtube.com\/watch?v=MgwYwu3wkk4\">Дизайн универсальных таблиц с непредсказуемым содержимым<\/a><\/li>\n  <li>№ 65. <a href=\"https:\/\/www.youtube.com\/watch?v=oz571oi6w24\">Живые спарклайны в таблице<\/a><\/li>\n  <li>№ 102. <a href=\"https:\/\/www.youtube.com\/watch?v=QyHEWiMR_0A\">Как выравнивать цифры в таблицах<\/a><\/li>\n  <li>№ 112. <a href=\"https:\/\/www.youtube.com\/watch?v=zSJijCINU58\">Собираем табличку с диапазоном и разной точностью<\/a><\/li>\n  <li>№ 113. <a href=\"https:\/\/www.youtube.com\/watch?v=ZDvDnJ1HSP0\">Рекомендую жирную, а не бледную шапку в таблице<\/a><\/li>\n  <li>№ 117. <a href=\"https:\/\/www.youtube.com\/watch?v=PBzl0pIUqk0\">Горизонтальная прокрутка в таблицах<\/a><\/li>\n  <li>№ 142. <a href=\"https:\/\/www.youtube.com\/watch?v=tOiNW_F_PH4\">Про динамические таблицы<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a><\/p>\n<p>Графики, диаграммы, инфографика:<\/p>\n<ul>\n  <li>№ 34. <a href=\"https:\/\/www.youtube.com\/watch?v=u682Zi8_FBk\">Визуализация помогает увидеть закономерности<\/a><\/li>\n  <li>№ 43. <a href=\"https:\/\/www.youtube.com\/watch?v=BvugvUfyXmg\">Объясняю про тафтианские 45 градусов на графике<\/a><\/li>\n  <li>№ 94. <a href=\"https:\/\/www.youtube.com\/watch?v=8986vOikHRk\">Если данных мало, то и график не нужен<\/a><\/li>\n  <li>№ 95. <a href=\"https:\/\/www.youtube.com\/watch?v=WSXYgIwdziI\">Рассуждения про инфографику и её задачи<\/a><\/li>\n  <li>№ 98. <a href=\"https:\/\/www.youtube.com\/watch?v=9pf94f8Mz7Q\">Когда визуализация потрачена впустую<\/a><\/li>\n  <li>№ 110. <a href=\"https:\/\/www.youtube.com\/watch?v=qsDWBf-xcVs\">В чём проблема интерактивных графиков<\/a><\/li>\n  <li>№ 111. <a href=\"https:\/\/www.youtube.com\/watch?v=wJJdSn4Vk-Q\">Нужны не круговые диаграммы, а таблица<\/a><\/li>\n  <li>№ 132. <a href=\"https:\/\/www.youtube.com\/watch?v=Urn9TDalPg4\">Дискуссия о задачах инфографики<\/a><\/li>\n  <li>№ 134. <a href=\"https:\/\/www.youtube.com\/watch?v=zMmO0bWqELQ\">Музыкальная нотация и чтение с листа<\/a><\/li>\n<\/ul>\n<p>Редактура в дизайне:<\/p>\n<ul>\n  <li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n  <li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n  <li>№ 49. <a href=\"https:\/\/www.youtube.com\/watch?v=H3UvwkQH8_o\">Редактура привела к радиокнопке<\/a><\/li>\n  <li>№ 66. <a href=\"https:\/\/www.youtube.com\/watch?v=-6LaXViTWzc\">Исследование о тексте в интерфейсе Эпла (1980-е)<\/a><\/li>\n  <li>№ 70. <a href=\"https:\/\/www.youtube.com\/watch?v=Zphn9ixcd0U\">Показать примечание в контексте и заодно сократить<\/a><\/li>\n  <li>№ 80. <a href=\"https:\/\/www.youtube.com\/watch?v=AmuCRWsSdpA\">Редактируем интерфейс конфигуратора окон<\/a><\/li>\n  <li>№ 92. <a href=\"https:\/\/www.youtube.com\/watch?v=bYk0_q6tWLA\">Поле «Комментарий для курьера»<\/a><\/li>\n  <li>№ 96. <a href=\"https:\/\/www.youtube.com\/watch?v=1l35NtOBogE\">Жирный против курсива<\/a><\/li>\n  <li>№ 120. <a href=\"https:\/\/www.youtube.com\/watch?v=H-tk4IhJWnA\">Непонятный выбор и названия кнопок<\/a><\/li>\n  <li>№ 127. <a href=\"https:\/\/www.youtube.com\/watch?v=oJkMBxIeLE0\">Редактируем регистрацию на вымышленном сайте<\/a><\/li>\n  <li>№ 129. <a href=\"https:\/\/www.youtube.com\/watch?v=5e2pwuF8raQ\">Формулировки ошибок в форме<\/a><\/li>\n  <li>№ 135. <a href=\"https:\/\/www.youtube.com\/watch?v=ERNjOfUbXZY\">Сокращаем текст про почту<\/a><\/li>\n<\/ul>\n<p>Вёрстка:<\/p>\n<ul>\n  <li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n  <li>№ 42. <a href=\"https:\/\/www.youtube.com\/watch?v=sXRWQ05cO3I\">Улучшаем эстетику с помощью контраста и прямоугольности<\/a><\/li>\n  <li>№ 73. <a href=\"https:\/\/www.youtube.com\/watch?v=49DSUMomhNE\">Верстаем интерфейс конструктора окон<\/a><\/li>\n  <li>№ 78. <a href=\"https:\/\/www.youtube.com\/watch?v=JFKJHdQJvNQ\">Неудачные выравнивательные связи<\/a><\/li>\n  <li>№ 99. <a href=\"https:\/\/www.youtube.com\/watch?v=yj5dFy9HQ-Y\">Комментирую вёрстку окна<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n  <li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n  <li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n  <li>№ 27. <a href=\"https:\/\/www.youtube.com\/watch?v=X1v54YA8g7c\">Cкруглённое поле поиска и ужасный шрифт Мирьяд-про<\/a><\/li>\n  <li>№ 79. <a href=\"https:\/\/www.youtube.com\/watch?v=58GldX-JZig\">Улучшаем дизайн кнопки<\/a><\/li>\n  <li>№ 81. <a href=\"https:\/\/www.youtube.com\/watch?v=rlCxhBCxJww\">Классические признаки поля ввода и кнопки<\/a><\/li>\n  <li>№ 87. <a href=\"https:\/\/www.youtube.com\/watch?v=ox38_G9lQuo\">Вспомогательные линии — тоньше и скромнее<\/a><\/li>\n  <li>№ 91. <a href=\"https:\/\/www.youtube.com\/watch?v=hieOe3wu-7E\">Аналогия между элементами интерфейса и буквами шрифта, которые можно взять готовые<\/a><\/li>\n  <li>№ 93. <a href=\"https:\/\/www.youtube.com\/watch?v=hh1oSLA0XaE\">Задисейбленность кнопки<\/a><\/li>\n  <li>№ 140. <a href=\"https:\/\/www.youtube.com\/watch?v=Z8C1RMcR2fk\">Выбор цветов для интерфейса<\/a><\/li>\n  <li>№ 141. <a href=\"https:\/\/www.youtube.com\/watch?v=E40xHhr73Ig\">Шрифты с засечками в интерфейсе<\/a><\/li>\n  <li>№ 148. <a href=\"https:\/\/www.youtube.com\/watch?v=X7mBhTG08xA\">Настраиваем толщины линий<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n  <li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n  <li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n  <li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n  <li>№ 71. <a href=\"https:\/\/www.youtube.com\/watch?v=TAg6cnGIsh4\">Запрещаю выравнивание по центру<\/a><\/li>\n<\/ul>\n<p>Бизнесовое и продуктовое:<\/p>\n<ul>\n  <li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n  <li>№ 32. <a href=\"https:\/\/www.youtube.com\/watch?v=qeyRl3IVSGQ\">Закоулки интерфейса можно просто не делать<\/a><\/li>\n  <li>№ 38. <a href=\"https:\/\/www.youtube.com\/watch?v=k6iyy4vJ1Co\">Продаём окна, объясняя разницу профилей<\/a><\/li>\n  <li>№ 47. <a href=\"https:\/\/www.youtube.com\/watch?v=6rDKRg6SlVc\">Аккуратное внедрение нового дизайна без ущерба привычкам<\/a><\/li>\n  <li>№ 48. <a href=\"https:\/\/www.youtube.com\/watch?v=MhdZzXw_Tzc\">Что, если на реализацию хорошего интерфейса нет времени<\/a><\/li>\n  <li>№ 56. <a href=\"https:\/\/www.youtube.com\/watch?v=3polv_KHa5g\">Разделяем сценарии оплаты частично, ровно по счёту и впрок<\/a><\/li>\n  <li>№ 57. <a href=\"https:\/\/www.youtube.com\/watch?v=TeolvcH5f_8\">Соблазняем человека пиццей, а не текстом «Ваша корзина пуста»<\/a><\/li>\n  <li>№ 59. <a href=\"https:\/\/www.youtube.com\/watch?v=UcIjtMreNHA\">Постоянные напоминания о цене могут мешать покупать<\/a><\/li>\n  <li>№ 64. <a href=\"https:\/\/www.youtube.com\/watch?v=PQzVzgYfvfQ\">Вопросы клиента к интерфейсу кассы самообслуживания<\/a><\/li>\n  <li>№ 82. <a href=\"https:\/\/www.youtube.com\/watch?v=2qV6CCRT6lA\">Заранее спросить у клиента про сео и персональные данные<\/a><\/li>\n  <li>№ 88. <a href=\"https:\/\/www.youtube.com\/watch?v=Mt45AuwOnvA\">Убрал шум — добавь сигнал!<\/a><\/li>\n  <li>№ 90. <a href=\"https:\/\/www.youtube.com\/watch?v=-GHjDFHWrBA\">Классно упростить себе задачу<\/a><\/li>\n  <li>№ 100. <a href=\"https:\/\/www.youtube.com\/watch?v=yTIrl1jnEHU\">Программисты могли бы подумать о пользе для бизнеса<\/a><\/li>\n  <li>№ 106. <a href=\"https:\/\/www.youtube.com\/watch?v=3fzeLHVhvy0\">Оговорка, что интерфейс — это не всё<\/a><\/li>\n  <li>№ 136. <a href=\"https:\/\/www.youtube.com\/watch?v=qh5BmDJ48yI\">Дисейблить ли кнопку с точки зрения канонов интерфейса и бизнеса?<\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n  <li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n  <li>№ 41. <a href=\"https:\/\/www.youtube.com\/watch?v=NF8fC2Cp8iU\">Перерисовываю и улучшаю кусок интерфейса в Фигме с помощью компонентов<\/a><\/li>\n  <li>№ 45. <a href=\"https:\/\/www.youtube.com\/watch?v=H3CF-RG9lIc\">Режимы наложения слоёв с овощами и фруктами<\/a><\/li>\n  <li>№ 54. <a href=\"https:\/\/www.youtube.com\/watch?v=uILlCs5L_mY\">Секреты встроенной скриншотилки на Маке<\/a><\/li>\n<\/ul>\n<p>Работа над дизайном и подача:<\/p>\n<ul>\n  <li>№ 36. <a href=\"https:\/\/www.youtube.com\/watch?v=czu2l7RfEWs\">Оставляйте введённый запрос в поле поиска и рисуйте клавиатуру<\/a><\/li>\n  <li>№ 58. <a href=\"https:\/\/www.youtube.com\/watch?v=2tANVy6u2TQ\">Не описывайте макеты и не делайте «невозможные» макеты<\/a><\/li>\n  <li>№ 128. <a href=\"https:\/\/www.youtube.com\/watch?v=zCldGigmk04\">Что не так с ваерфреймами<\/a><\/li>\n  <li>№ 139. <a href=\"https:\/\/www.youtube.com\/watch?v=tqfe5-w0VPo\">Сначала презентуйте линейно, а потом уже рисуйте диаграммы<\/a><\/li>\n<\/ul>\n<p>Разное интересное:<\/p>\n<ul>\n  <li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n  <li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n  <li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n  <li>№ 31. <a href=\"https:\/\/www.youtube.com\/watch?v=bCMAOeqapDI\">Двусмысленная иконка и проверка венгерским языком<\/a><\/li>\n  <li>№ 51. <a href=\"https:\/\/www.youtube.com\/watch?v=SQQLWeCaHs8\">Глючная обработка ввода пользователя в интерфейсе Сафари<\/a><\/li>\n  <li>№ 62. <a href=\"https:\/\/www.youtube.com\/watch?v=4JzD6d9V0nU\">Что делать, если клиент хочет фигню?<\/a><\/li>\n  <li>№ 68. <a href=\"https:\/\/www.youtube.com\/watch?v=x6RbJD24N6o\">Благодарности и в чём польза теории<\/a><\/li>\n  <li>№ 69. <a href=\"https:\/\/www.youtube.com\/watch?v=JoA5JZcBoS0\">Что делать дизайнеру, если разработчики напрограммили всю магию?<\/a><\/li>\n  <li>№ 123. <a href=\"https:\/\/www.youtube.com\/watch?v=zoN15-R2gQ8\">Благодарности<\/a><\/li>\n  <li>№ 124. <a href=\"https:\/\/www.youtube.com\/watch?v=gCTCA_dQOp4\">Мастрид ли Тафти?<\/a><\/li>\n  <li>№ 125. <a href=\"https:\/\/www.youtube.com\/watch?v=35uwvF6SZb8\">Как я отношусь к войсикам и кружочкам<\/a><\/li>\n  <li>№ 131. <a href=\"https:\/\/www.youtube.com\/watch?v=2PC5L3tv6fA\">Когда нужны моноширинные цифры<\/a><\/li>\n  <li>№ 133. <a href=\"https:\/\/www.youtube.com\/watch?v=o2DjvI6nVts\">Плакаты и бумага, которая горит<\/a><\/li>\n  <li>№ 137. <a href=\"https:\/\/www.youtube.com\/watch?v=dfe9kO0a054\">Почему я не могу дать список дизайнеров, за которыми надо следить<\/a><\/li>\n<\/ul>\n<p>Потом разберу ещё. А вы пока приходите на следующий курс, который пройдёт 12 октября — 10 ноября.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-10-11T11:21:14+05:00",
            "date_modified": "2025-07-21T19:23:19+05:00",
            "tags": [
                "Курсы",
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Fri, 11 Oct 2024 11:21:14 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "131870",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "130408",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-148\/",
            "title": "На интерфейсном курсе: настраиваем толщины линий",
            "content_html": "<p>Осмысленно выбранные толщины линий делают иллюстрацию понятнее и красивее. Исправляем на примере окна. 3 минуты с семинара курса:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/X7mBhTG08xA?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Также есть <a href=\"https:\/\/vk.com\/video286049442_456239413\">на ВК-видео<\/a>.<\/p>\n<p>Это фрагмент № 148 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 27 октября 2023 года.<\/p>\n<p>Сегодня — последний день записи на курс, который пройдёт с 31 августа по 29 сентября.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-08-30T11:21:26+05:00",
            "date_modified": "2024-08-30T11:22:02+05:00",
            "tags": [
                "видео",
                "представление информации",
                "студентам",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Fri, 30 Aug 2024 11:21:26 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "130408",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "126161",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/two-positions-in-longform\/",
            "title": "Две позиции в длинном содержимом: прогресс и положение прокрутки",
            "content_html": "<p>Бывает, читаешь электронную книгу, перешёл куда-то по ссылке внутри неё, и потом случайно теряешь, где читал. Или смотришь длинное видео, по ошибке куда-то ткнул не туда, и потом уже фиг найдёшь, где же ты смотрел на самом деле. Хочется, чтобы таких проблем не возникало: хороший интерфейс должен прощать ошибки пользователю.<\/p>\n<p>При чтении документа есть текущая позиция прокрутки, при просмотре видеоролика — текущая позиция воспроизведения. В длинных документах и видеороликах, таких как книги и кино, текущая позиция — это не просто «куда сейчас смотрим», а нечто более весомое: это докуда я дочитал или досмотрел. Эта позиция не должна теряться из-за того, что я ткнул куда-то из любопытства.<\/p>\n<p>Компьютер должен отличать для себя две позиции в длинном содержимом: прогресс и положение прокрутки. Но как это должно работать? Пользователя этим обременять не стоит — компьютер должен сам всё понимать.<\/p>\n<p>На первый взгляд, имеет значение непрерывность и длительность. Если я смотрю на страницы по очереди друг за другом и провожу на каждой более нескольких секунд, можно предположить, что я читаю книгу. Если непрерывно-длительную последовательность составляют страницы до 58-й, но кроме этого я ещё бывал на 158-й, а сейчас на 258-й, то можно считать, что дочитал я лишь до 58-й, и давать мне способ туда вернуться. Если я непрерывно смотрел видео от начала и до 58-й минуты, а сейчас на 25-й, то можно полагать, что я просто отмотал что-то пересмотреть, но глобально я всё ещё на 58-й минуте, и давать мне способ туда вернуться.<\/p>\n<p>Однако и непрерывность, и длительность — вещи условные. В книге я могу пропустить предисловие, потом пролистать где-то несколько скучных страниц или даже целую главу, и продолжать читать, сдвигая свою «весомую» позицию. В видео я могу промотать неприятные сцены или рекламу, также продолжая внимательно смотреть. Кроме того, я мог решить перечитать книгу или отдельную главу с начала; аналогично с видео. В общем случае сложно угадать, что я мог бы иметь в виду. Хочется учесть всю эту недискретность, визуализировать её для пользователя.<\/p>\n<p>Лет десять назад Артём Горбунов придумал идею «термоскроллера». Типа лифт в полосе прокрутки «греет» шахту. Чем дольше мы находимся в какой-то месте, тем горячее она становится. Применим идею к визуализации положения в книге или видеоролике:<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/ilyabirman.ru\/meanwhile\/pictures\/two-positions-in-longform@2x.jpg\" width=\"1000\" height=\"20\" alt=\"\" \/>\n<\/div>\n<p>Отлично видно, что мы прочитали больше половины книги, пропустив предисловие, ну и много чего ещё полистали из любопытства, а сейчас увлеклись разглядыванием чего-то там ближе к концу. Дальше уже можно придумать какую-то эвристику, чтобы определить место, докуда я дочитал, и дать способ к нему быстро прыгнуть. Но главное, что если даже не угадали, то пользователь и сам сориентируется.<\/p>\n",
            "date_published": "2024-03-05T21:59:50+05:00",
            "date_modified": "2024-03-06T17:26:33+05:00",
            "tags": [
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Tue, 05 Mar 2024 21:59:50 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "126161",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "126141",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-139\/",
            "title": "На интерфейсном курсе: сначала презентуйте линейно, а потом уже рисуйте диаграммы",
            "content_html": "<p>На курсе о пользовательском интерфейсе комментирую то, как участница показала свой интерфейс то есть, фактически, презентацию. Вообще, о презентации у нас есть отдельный курс, так что это видео можно считать относящимся и туда, и туда. 6 минут:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/tqfe5-w0VPo?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 139 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 22 сентября 2023 года.<\/p>\n<p>До 15 марта идёт запись на курс, который пройдёт с 16 марта по 14 апреля. Сейчас дешевле на 10% из-за ранней записи.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n<p>Кстати, одновременно идёт и запись <a href=\"https:\/\/bureau.ru\/courses\/presentation-online\/\">на мартовский курс презентаций<\/a> (11⁠—31 марта).<\/p>\n",
            "date_published": "2024-03-04T11:32:39+05:00",
            "date_modified": "2024-03-04T11:32:30+05:00",
            "tags": [
                "видео",
                "Курсы",
                "представление информации",
                "презентации и выступления",
                "студентам",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Mon, 04 Mar 2024 11:32:39 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "126141",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125686",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-134\/",
            "title": "На интерфейсном курсе: музыкальная нотация и чтение с листа",
            "content_html": "<p>Участник курса играл в духовом оркестре и против того, чтобы делать линии нотного стана тоньше линий нот. Обсуждаем разницу между тетрадью в клетку и нотным станом и общий подход к экспериментам с профессиональными нотациями. 8 минут:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/zMmO0bWqELQ?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 134 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 15 сентября 2023 года.<\/p>\n<p>До 2 февраля идёт запись на курс, который пройдёт с 3 февраля по 3 марта.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-01-29T22:28:32+05:00",
            "date_modified": "2024-01-29T22:28:20+05:00",
            "tags": [
                "видео",
                "классическая музыка",
                "представление информации",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Mon, 29 Jan 2024 22:28:32 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125686",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125549",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-125\/",
            "title": "Фрагменты интерфейсного курса (1—125)",
            "content_html": "<p>За те три года, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">больше сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Разобрал 125 фрагментов, <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-150\/\">потом разберу ещё<\/a>.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n<li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n<li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n<li>№ 19. <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n<li>№ 26. <a href=\"https:\/\/www.youtube.com\/watch?v=Pc0GryUpCgM\">ФИО как в паспорте и эффект японской квартиры<\/a><\/li>\n<li>№ 89. <a href=\"https:\/\/www.youtube.com\/watch?v=eLOGLY3_h7U\">Прямоугольнизация дизайна и свобода, которую даёт фотошоп<\/a><\/li>\n<li>№ 119. <a href=\"https:\/\/www.youtube.com\/watch?v=Hwi6ddaRZ38\">О дизайне переключателя (segmented control) и положении кнопки<\/a><\/li>\n<\/ul>\n<p>Почти самостоятельные лекции:<\/p>\n<ul>\n<li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a> (это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне)<\/li>\n<li>№ 33. <a href=\"https:\/\/www.youtube.com\/watch?v=du6SqjjLEzQ\">Физические радиокнопки, рукоятки в самолёте, фотоаппарат Фуджифильм<\/a><\/li>\n<li>№ 37. <a href=\"https:\/\/www.youtube.com\/watch?v=SwyTvRljimM\">Блиц-пересказ куска питерского доклада про интерфейсы и Ворлд-Чесс<\/a><\/li>\n<li>№ 46. <a href=\"https:\/\/www.youtube.com\/watch?v=JTqRG_7e3O8\">Про сложное цветовое кодирование и триаду Мейксенара<\/a><\/li>\n<li>№ 55. <a href=\"https:\/\/www.youtube.com\/watch?v=3q0HH7mUMYA\">Соответствие между логической структурой и выразительными средствами и дизайн-системы<\/a><\/li>\n<\/ul>\n<p>Метод:<\/p>\n<ul>\n<li>№ 30. <a href=\"https:\/\/www.youtube.com\/watch?v=-np87CaMjKs\">Метод «Например»<\/a><\/li>\n<li>№ 40. <a href=\"https:\/\/www.youtube.com\/watch?v=MuDea0wOabA\">Сценка со звонком в пиццерию<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n<li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n<li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n<li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n<li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n<li>№ 28. <a href=\"https:\/\/www.youtube.com\/watch?v=GrkuX84kKeo\">Улучшаем форму обратной связи Букинг.кома<\/a><\/li>\n<li>№ 35. <a href=\"https:\/\/www.youtube.com\/watch?v=dckw7tqm1M4\">Первое впечатление от формы<\/a><\/li>\n<li>№ 50. <a href=\"https:\/\/www.youtube.com\/watch?v=oepQvJtNgUU\">Упорядочиваем вёрстку формы<\/a><\/li>\n<li>№ 52. <a href=\"https:\/\/www.youtube.com\/watch?v=hPGiFsdTKa8\">Расстояние между полями и сокращение подписей<\/a><\/li>\n<li>№ 53. <a href=\"https:\/\/www.youtube.com\/watch?v=IR0zLLBf65Y\">Редизайним форму настройки сложной логики<\/a><\/li>\n<li>№ 63. <a href=\"https:\/\/www.youtube.com\/watch?v=KbZAeVFaEcU\">Добавление нескольких телефонов в форме<\/a><\/li>\n<li>№ 84. <a href=\"https:\/\/www.youtube.com\/watch?v=phraobT9Ufk\">Разбираем мелочи в форме регистрации<\/a><\/li>\n<li>№ 85. <a href=\"https:\/\/www.youtube.com\/watch?v=DnTeUK1OqLQ\">Исправляем форму формы, ну и немножко содержание<\/a><\/li>\n<li>№ 103.<a href=\"https:\/\/www.youtube.com\/watch?v=b4NPKYiT9n4\">Плейсхолдеры в каждом поле — это как иконки у каждого пункта меню<\/a><\/li>\n<li>№ 104. <a href=\"https:\/\/www.youtube.com\/watch?v=dqnYrhXSMms\">Подробный разбор сложной формы<\/a><\/li>\n<li>№ 108. <a href=\"https:\/\/www.youtube.com\/watch?v=9RUUtqehkyU\">Кирпичная кладка и другие недостатки формы<\/a><\/li>\n<li>№ 118. <a href=\"https:\/\/www.youtube.com\/watch?v=9kB6CfCE0aM\">Обозначение обязательных и необязательных полей<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a><\/p>\n<p>Элементы интерфейса:<\/p>\n<ul>\n<li>№ 60. <a href=\"https:\/\/www.youtube.com\/watch?v=NdBt_Oqydk4\">Рассуждения о текстовых кнопках<\/a><\/li>\n<li>№ 67. <a href=\"https:\/\/www.youtube.com\/watch?v=WqFfT7yDMJg\">Меняем табы на переключалку и настраиваем вёрстку<\/a><\/li>\n<li>№ 72. <a href=\"https:\/\/www.youtube.com\/watch?v=IV2nVMcaQ7U\">Представляем выбор внятно радиокнопками<\/a><\/li>\n<li>№ 76. <a href=\"https:\/\/www.youtube.com\/watch?v=wihXJHHK3yo\">Так это кнопка или ссылка? Оказывается, это радиокнопка!<\/a><\/li>\n<li>№ 114. <a href=\"https:\/\/www.youtube.com\/watch?v=n4Cb774L2_U\">Что не так с аккордеоном<\/a><\/li>\n<li>№ 116. <a href=\"https:\/\/www.youtube.com\/watch?v=9tewBcFm-1M\">Как назвать чупа-чупс<\/a><\/li>\n<\/ul>\n<p>Интерфейс:<\/p>\n<ul>\n<li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n<li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n<li>№ 44. <a href=\"https:\/\/www.youtube.com\/watch?v=2aQnKL5nLUw\">Упрощаем экран успешного заказа пиццы<\/a><\/li>\n<li>№ 61. <a href=\"https:\/\/www.youtube.com\/watch?v=-zzLglJ9bEc\">Упрощаем первый экран кассы самообслуживания, добавляем кнопку «У меня булка»<\/a><\/li>\n<li>№ 74. <a href=\"https:\/\/www.youtube.com\/watch?v=aLETIvOafg0\">Так это форма или мастер?<\/a><\/li>\n<li>№ 75. <a href=\"https:\/\/www.youtube.com\/watch?v=zngun6Kw1q4\">Точно описываем поведение интерфейса для разработчиков<\/a><\/li>\n<li>№ 77. <a href=\"https:\/\/www.youtube.com\/watch?v=U_9t3-mJXp0\">Жму синюю кнопку на автомате, не читая<\/a><\/li>\n<li>№ 83. <a href=\"https:\/\/www.youtube.com\/watch?v=D0zKnGG10tY\">Уважать ли интерфейсные традиции разных платформ?<\/a><\/li>\n<li>№ 86. <a href=\"https:\/\/www.youtube.com\/watch?v=wq4MQNpFrbg\">Не надо ничего активировать<\/a><\/li>\n<li>№ 97. <a href=\"https:\/\/www.youtube.com\/watch?v=jwbEj5v3bu8\">Ширина и прокрутка на десктопе<\/a><\/li>\n<li>№ 101. <a href=\"https:\/\/www.youtube.com\/watch?v=pn_X2x_8XPo\">Елена Семёновна и валидация ввода<\/a><\/li>\n<li>№ 105. <a href=\"https:\/\/www.youtube.com\/watch?v=Ew75feYtGMs\">Как именно работает взаимодействие?<\/a><\/li>\n<li>№ 107. <a href=\"https:\/\/www.youtube.com\/watch?v=GBj17b4l10s\">Как делать, чтобы программа не тормозила<\/a><\/li>\n<li>№ 109. <a href=\"https:\/\/www.youtube.com\/watch?v=-8neywtnhT8\">Двухпанельный интерфейс<\/a><\/li>\n<li>№ 115. <a href=\"https:\/\/www.youtube.com\/watch?v=Tq8Rh7GPqhM\">Мир пользователя<\/a><\/li>\n<li>№ 121. <a href=\"https:\/\/www.youtube.com\/watch?v=xKPaH3XiW-4\">О связях сущностей в сложных системах<\/a><\/li>\n<li>№ 122. <a href=\"https:\/\/www.youtube.com\/watch?v=XvPjm7mQ0n8\">Думать из мира пользователя<\/a> (продолжение из 115)<\/li>\n<\/ul>\n<p>Таблицы:<\/p>\n<ul>\n<li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n<li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n<li>№ 29. <a href=\"https:\/\/www.youtube.com\/watch?v=N2LINRApqmg\">Круговая диаграмма для красоты, табличка для пользы дела<\/a><\/li>\n<li>№ 39. <a href=\"https:\/\/www.youtube.com\/watch?v=MgwYwu3wkk4\">Дизайн универсальных таблиц с непредсказуемым содержимым<\/a><\/li>\n<li>№ 65. <a href=\"https:\/\/www.youtube.com\/watch?v=oz571oi6w24\">Живые спарклайны в таблице<\/a><\/li>\n<li>№ 102. <a href=\"https:\/\/www.youtube.com\/watch?v=QyHEWiMR_0A\">Как выравнивать цифры в таблицах<\/a><\/li>\n<li>№ 112. <a href=\"https:\/\/www.youtube.com\/watch?v=zSJijCINU58\">Собираем табличку с диапазоном и разной точностью<\/a><\/li>\n<li>№ 113. <a href=\"https:\/\/www.youtube.com\/watch?v=ZDvDnJ1HSP0\">Рекомендую жирную, а не бледную шапку в таблице<\/a><\/li>\n<li>№ 117. <a href=\"https:\/\/www.youtube.com\/watch?v=PBzl0pIUqk0\">Горизонтальная прокрутка в таблицах<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a><\/p>\n<p>Графики и диаграммы:<\/p>\n<ul>\n<li>№ 34. <a href=\"https:\/\/www.youtube.com\/watch?v=u682Zi8_FBk\">Визуализация помогает увидеть закономерности<\/a><\/li>\n<li>№ 43. <a href=\"https:\/\/www.youtube.com\/watch?v=BvugvUfyXmg\">Объясняю про тафтианские 45 градусов на графике<\/a><\/li>\n<li>№ 94. <a href=\"https:\/\/www.youtube.com\/watch?v=8986vOikHRk\">Если данных мало, то и график не нужен<\/a><\/li>\n<li>№ 95. <a href=\"https:\/\/www.youtube.com\/watch?v=WSXYgIwdziI\">Рассуждения про инфографику и её задачи<\/a><\/li>\n<li>№ 98. <a href=\"https:\/\/www.youtube.com\/watch?v=9pf94f8Mz7Q\">Когда визуализация потрачена впустую<\/a><\/li>\n<li>№ 110. <a href=\"https:\/\/www.youtube.com\/watch?v=qsDWBf-xcVs\">В чём проблема интерактивных графиков<\/a><\/li>\n<li>№ 111. <a href=\"https:\/\/www.youtube.com\/watch?v=wJJdSn4Vk-Q\">Нужны не круговые диаграммы, а таблица<\/a><\/li>\n<\/ul>\n<p>Редактура в дизайне:<\/p>\n<ul>\n<li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n<li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n<li>№ 49. <a href=\"https:\/\/www.youtube.com\/watch?v=H3UvwkQH8_o\">Редактура привела к радиокнопке<\/a><\/li>\n<li>№ 66. <a href=\"https:\/\/www.youtube.com\/watch?v=-6LaXViTWzc\">Исследование о тексте в интерфейсе Эпла (1980-е)<\/a><\/li>\n<li>№ 70. <a href=\"https:\/\/www.youtube.com\/watch?v=Zphn9ixcd0U\">Показать примечание в контексте и заодно сократить<\/a><\/li>\n<li>№ 80. <a href=\"https:\/\/www.youtube.com\/watch?v=AmuCRWsSdpA\">Редактируем интерфейс конфигуратора окон<\/a><\/li>\n<li>№ 92. <a href=\"https:\/\/www.youtube.com\/watch?v=bYk0_q6tWLA\">Поле «Комментарий для курьера»<\/a><\/li>\n<li>№ 96. <a href=\"https:\/\/www.youtube.com\/watch?v=1l35NtOBogE\">Жирный против курсива<\/a><\/li>\n<li>№ 120. <a href=\"https:\/\/www.youtube.com\/watch?v=H-tk4IhJWnA\">Непонятный выбор и названия кнопок<\/a><\/li>\n<\/ul>\n<p>Вёрстка:<\/p>\n<ul>\n<li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n<li>№ 42. <a href=\"https:\/\/www.youtube.com\/watch?v=sXRWQ05cO3I\">Улучшаем эстетику с помощью контраста и прямоугольности<\/a><\/li>\n<li>№ 73. <a href=\"https:\/\/www.youtube.com\/watch?v=49DSUMomhNE\">Верстаем интерфейс конструктора окон<\/a><\/li>\n<li>№ 78. <a href=\"https:\/\/www.youtube.com\/watch?v=JFKJHdQJvNQ\">Неудачные выравнивательные связи<\/a><\/li>\n<li>№ 99. <a href=\"https:\/\/www.youtube.com\/watch?v=yj5dFy9HQ-Y\">Комментирую вёрстку окна<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n<li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n<li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n<li>№ 27. <a href=\"https:\/\/www.youtube.com\/watch?v=X1v54YA8g7c\">Cкруглённое поле поиска и ужасный шрифт Мирьяд-про<\/a><\/li>\n<li>№ 79. <a href=\"https:\/\/www.youtube.com\/watch?v=58GldX-JZig\">Улучшаем дизайн кнопки<\/a><\/li>\n<li>№ 81. <a href=\"https:\/\/www.youtube.com\/watch?v=rlCxhBCxJww\">Классические признаки поля ввода и кнопки<\/a><\/li>\n<li>№ 87. <a href=\"https:\/\/www.youtube.com\/watch?v=ox38_G9lQuo\">Вспомогательные линии — тоньше и скромнее<\/a><\/li>\n<li>№ 91. <a href=\"https:\/\/www.youtube.com\/watch?v=hieOe3wu-7E\">Аналогия между элементами интерфейса и буквами шрифта, которые можно взять готовые<\/a><\/li>\n<li>№ 93. <a href=\"https:\/\/www.youtube.com\/watch?v=hh1oSLA0XaE\">Задисейбленность кнопки<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n<li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n<li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n<li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n<li>№ 71. <a href=\"https:\/\/www.youtube.com\/watch?v=TAg6cnGIsh4\">Запрещаю выравнивание по центру<\/a><\/li>\n<\/ul>\n<p>Бизнесовое и продуктовое:<\/p>\n<ul>\n<li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n<li>№ 32. <a href=\"https:\/\/www.youtube.com\/watch?v=qeyRl3IVSGQ\">Закоулки интерфейса можно просто не делать<\/a><\/li>\n<li>№ 38. <a href=\"https:\/\/www.youtube.com\/watch?v=k6iyy4vJ1Co\">Продаём окна, объясняя разницу профилей<\/a><\/li>\n<li>№ 47. <a href=\"https:\/\/www.youtube.com\/watch?v=6rDKRg6SlVc\">Аккуратное внедрение нового дизайна без ущерба привычкам<\/a><\/li>\n<li>№ 48. <a href=\"https:\/\/www.youtube.com\/watch?v=MhdZzXw_Tzc\">Что, если на реализацию хорошего интерфейса нет времени<\/a><\/li>\n<li>№ 56. <a href=\"https:\/\/www.youtube.com\/watch?v=3polv_KHa5g\">Разделяем сценарии оплаты частично, ровно по счёту и впрок<\/a><\/li>\n<li>№ 57. <a href=\"https:\/\/www.youtube.com\/watch?v=TeolvcH5f_8\">Соблазняем человека пиццей, а не текстом «Ваша корзина пуста»<\/a><\/li>\n<li>№ 59. <a href=\"https:\/\/www.youtube.com\/watch?v=UcIjtMreNHA\">Постоянные напоминания о цене могут мешать покупать<\/a><\/li>\n<li>№ 64. <a href=\"https:\/\/www.youtube.com\/watch?v=PQzVzgYfvfQ\">Вопросы клиента к интерфейсу кассы самообслуживания<\/a><\/li>\n<li>№ 82. <a href=\"https:\/\/www.youtube.com\/watch?v=2qV6CCRT6lA\">Заранее спросить у клиента про сео и персональные данные<\/a><\/li>\n<li>№ 88. <a href=\"https:\/\/www.youtube.com\/watch?v=Mt45AuwOnvA\">Убрал шум — добавь сигнал!<\/a><\/li>\n<li>№ 90. <a href=\"https:\/\/www.youtube.com\/watch?v=-GHjDFHWrBA\">Классно упростить себе задачу<\/a><\/li>\n<li>№ 100. <a href=\"https:\/\/www.youtube.com\/watch?v=yTIrl1jnEHU\">Программисты могли бы подумать о пользе для бизнеса<\/a><\/li>\n<li>№ 106. <a href=\"https:\/\/www.youtube.com\/watch?v=3fzeLHVhvy0\">Оговорка, что интерфейс — это не всё<\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n<li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n<li>№ 41. <a href=\"https:\/\/www.youtube.com\/watch?v=NF8fC2Cp8iU\">Перерисовываю и улучшаю кусок интерфейса в Фигме с помощью компонентов<\/a><\/li>\n<li>№ 45. <a href=\"https:\/\/www.youtube.com\/watch?v=H3CF-RG9lIc\">Режимы наложения слоёв с овощами и фруктами<\/a><\/li>\n<li>№ 54. <a href=\"https:\/\/www.youtube.com\/watch?v=uILlCs5L_mY\">Секреты встроенной скриншотилки на Маке<\/a><\/li>\n<\/ul>\n<p>Работа над дизайном и подача:<\/p>\n<ul>\n<li>№ 36. <a href=\"https:\/\/www.youtube.com\/watch?v=czu2l7RfEWs\">Оставляйте введённый запрос в поле поиска и рисуйте клавиатуру<\/a><\/li>\n<li>№ 58. <a href=\"https:\/\/www.youtube.com\/watch?v=2tANVy6u2TQ\">Не описывайте макеты и не делайте «невозможные» макеты<\/a><\/li>\n<\/ul>\n<p>Разное интересное:<\/p>\n<ul>\n<li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n<li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n<li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n<li>№ 31. <a href=\"https:\/\/www.youtube.com\/watch?v=bCMAOeqapDI\">Двусмысленная иконка и проверка венгерским языком<\/a><\/li>\n<li>№ 51. <a href=\"https:\/\/www.youtube.com\/watch?v=SQQLWeCaHs8\">Глючная обработка ввода пользователя в интерфейсе Сафари<\/a><\/li>\n<li>№ 62. <a href=\"https:\/\/www.youtube.com\/watch?v=4JzD6d9V0nU\">Что делать, если клиент хочет фигню?<\/a><\/li>\n<li>№ 68. <a href=\"https:\/\/www.youtube.com\/watch?v=x6RbJD24N6o\">Благодарности и в чём польза теории<\/a><\/li>\n<li>№ 69. <a href=\"https:\/\/www.youtube.com\/watch?v=JoA5JZcBoS0\">Что делать дизайнеру, если разработчики напрограммили всю магию?<\/a><\/li>\n<li>№ 123. <a href=\"https:\/\/www.youtube.com\/watch?v=zoN15-R2gQ8\">Благодарности<\/a><\/li>\n<li>№ 124. <a href=\"https:\/\/www.youtube.com\/watch?v=gCTCA_dQOp4\">Мастрид ли Тафти?<\/a><\/li>\n<li>№ 125. <a href=\"https:\/\/www.youtube.com\/watch?v=35uwvF6SZb8\">Как я отношусь к войсикам и кружочкам<\/a><\/li>\n<\/ul>\n<p>Потом разберу ещё. А вы пока приходите на следующий курс, который пройдёт 3 февраля — 3 марта.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-01-19T12:00:00+05:00",
            "date_modified": "2024-10-11T11:21:34+05:00",
            "tags": [
                "Курсы",
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Fri, 19 Jan 2024 12:00:00 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125549",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125470",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-100\/",
            "title": "Фрагменты интерфейсного курса (1—100)",
            "content_html": "<p>За те три года, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">больше сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Разобрал 100 фрагментов, <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-125\/\">потом разберу ещё<\/a>.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n<li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n<li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n<li>№ 19. <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n<li>№ 26. <a href=\"https:\/\/www.youtube.com\/watch?v=Pc0GryUpCgM\">ФИО как в паспорте и эффект японской квартиры<\/a><\/li>\n<li>№ 89. <a href=\"https:\/\/www.youtube.com\/watch?v=eLOGLY3_h7U\">Прямоугольнизация дизайна и свобода, которую даёт фотошоп<\/a><\/li>\n<\/ul>\n<p>Почти самостоятельные лекции:<\/p>\n<ul>\n<li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a> (это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне)<\/li>\n<li>№ 33. <a href=\"https:\/\/www.youtube.com\/watch?v=du6SqjjLEzQ\">Физические радиокнопки, рукоятки в самолёте, фотоаппарат Фуджифильм<\/a><\/li>\n<li>№ 37. <a href=\"https:\/\/www.youtube.com\/watch?v=SwyTvRljimM\">Блиц-пересказ куска питерского доклада про интерфейсы и Ворлд-Чесс<\/a><\/li>\n<li>№ 46. <a href=\"https:\/\/www.youtube.com\/watch?v=JTqRG_7e3O8\">Про сложное цветовое кодирование и триаду Мейксенара<\/a><\/li>\n<li>№ 55. <a href=\"https:\/\/www.youtube.com\/watch?v=3q0HH7mUMYA\">Соответствие между логической структурой и выразительными средствами и дизайн-системы<\/a><\/li>\n<\/ul>\n<p>Метод:<\/p>\n<ul>\n<li>№ 30. <a href=\"https:\/\/www.youtube.com\/watch?v=-np87CaMjKs\">Метод «Например»<\/a><\/li>\n<li>№ 40. <a href=\"https:\/\/www.youtube.com\/watch?v=MuDea0wOabA\">Сценка со звонком в пиццерию<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n<li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n<li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n<li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n<li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n<li>№ 28. <a href=\"https:\/\/www.youtube.com\/watch?v=GrkuX84kKeo\">Улучшаем форму обратной связи Букинг.кома<\/a><\/li>\n<li>№ 35. <a href=\"https:\/\/www.youtube.com\/watch?v=dckw7tqm1M4\">Первое впечатление от формы<\/a><\/li>\n<li>№ 50. <a href=\"https:\/\/www.youtube.com\/watch?v=oepQvJtNgUU\">Упорядочиваем вёрстку формы<\/a><\/li>\n<li>№ 52. <a href=\"https:\/\/www.youtube.com\/watch?v=hPGiFsdTKa8\">Расстояние между полями и сокращение подписей<\/a><\/li>\n<li>№ 53. <a href=\"https:\/\/www.youtube.com\/watch?v=IR0zLLBf65Y\">Редизайним форму настройки сложной логики<\/a><\/li>\n<li>№ 63. <a href=\"https:\/\/www.youtube.com\/watch?v=KbZAeVFaEcU\">Добавление нескольких телефонов в форме<\/a><\/li>\n<li>№ 84. <a href=\"https:\/\/www.youtube.com\/watch?v=phraobT9Ufk\">Разбираем мелочи в форме регистрации<\/a><\/li>\n<li>№ 85. <a href=\"https:\/\/www.youtube.com\/watch?v=DnTeUK1OqLQ\">Исправляем форму формы, ну и немножко содержание<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a><\/p>\n<p>Таблицы:<\/p>\n<ul>\n<li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n<li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n<li>№ 29. <a href=\"https:\/\/www.youtube.com\/watch?v=N2LINRApqmg\">Круговая диаграмма для красоты, табличка для пользы дела<\/a><\/li>\n<li>№ 39. <a href=\"https:\/\/www.youtube.com\/watch?v=MgwYwu3wkk4\">Дизайн универсальных таблиц с непредсказуемым содержимым<\/a><\/li>\n<li>№ 65. <a href=\"https:\/\/www.youtube.com\/watch?v=oz571oi6w24\">Живые спарклайны в таблице<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a><\/p>\n<p>Графики и диаграммы:<\/p>\n<ul>\n<li>№ 34. <a href=\"https:\/\/www.youtube.com\/watch?v=u682Zi8_FBk\">Визуализация помогает увидеть закономерности<\/a><\/li>\n<li>№ 43. <a href=\"https:\/\/www.youtube.com\/watch?v=BvugvUfyXmg\">Объясняю про тафтианские 45 градусов на графике<\/a><\/li>\n<li>№ 94. <a href=\"https:\/\/www.youtube.com\/watch?v=8986vOikHRk\">Если данных мало, то и график не нужен<\/a><\/li>\n<li>№ 95. <a href=\"https:\/\/www.youtube.com\/watch?v=WSXYgIwdziI\">Рассуждения про инфографику и её задачи<\/a><\/li>\n<li>№ 98. <a href=\"https:\/\/www.youtube.com\/watch?v=9pf94f8Mz7Q\">Когда визуализация потрачена впустую<\/a><\/li>\n<\/ul>\n<p>Интерфейс:<\/p>\n<ul>\n<li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n<li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n<li>№ 44. <a href=\"https:\/\/www.youtube.com\/watch?v=2aQnKL5nLUw\">Упрощаем экран успешного заказа пиццы<\/a><\/li>\n<li>№ 60. <a href=\"https:\/\/www.youtube.com\/watch?v=NdBt_Oqydk4\">Рассуждения о текстовых кнопках<\/a><\/li>\n<li>№ 61. <a href=\"https:\/\/www.youtube.com\/watch?v=-zzLglJ9bEc\">Упрощаем первый экран кассы самообслуживания, добавляем кнопку «У меня булка»<\/a><\/li>\n<li>№ 67. <a href=\"https:\/\/www.youtube.com\/watch?v=WqFfT7yDMJg\">Меняем табы на переключалку и настраиваем вёрстку<\/a><\/li>\n<li>№ 72. <a href=\"https:\/\/www.youtube.com\/watch?v=IV2nVMcaQ7U\">Представляем выбор внятно радиокнопками<\/a><\/li>\n<li>№ 74. <a href=\"https:\/\/www.youtube.com\/watch?v=aLETIvOafg0\">Так это форма или мастер?<\/a><\/li>\n<li>№ 75. <a href=\"https:\/\/www.youtube.com\/watch?v=zngun6Kw1q4\">Точно описываем поведение интерфейса для разработчиков<\/a><\/li>\n<li>№ 76. <a href=\"https:\/\/www.youtube.com\/watch?v=wihXJHHK3yo\">Так это кнопка или ссылка? Оказывается, это радиокнопка!<\/a><\/li>\n<li>№ 77. <a href=\"https:\/\/www.youtube.com\/watch?v=U_9t3-mJXp0\">Жму синюю кнопку на автомате, не читая<\/a><\/li>\n<li>№ 83. <a href=\"https:\/\/www.youtube.com\/watch?v=D0zKnGG10tY\">Уважать ли интерфейсные традиции разных платформ?<\/a><\/li>\n<li>№ 86. <a href=\"https:\/\/www.youtube.com\/watch?v=wq4MQNpFrbg\">Не надо ничего активировать<\/a><\/li>\n<li>№ 97. <a href=\"https:\/\/www.youtube.com\/watch?v=jwbEj5v3bu8\">Ширина и прокрутка на десктопе<\/a><\/li>\n<\/ul>\n<p>Редактура в дизайне:<\/p>\n<ul>\n<li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n<li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n<li>№ 49. <a href=\"https:\/\/www.youtube.com\/watch?v=H3UvwkQH8_o\">Редактура привела к радиокнопке<\/a><\/li>\n<li>№ 66. <a href=\"https:\/\/www.youtube.com\/watch?v=-6LaXViTWzc\">Исследование о тексте в интерфейсе Эпла (1980-е)<\/a><\/li>\n<li>№ 70. <a href=\"https:\/\/www.youtube.com\/watch?v=Zphn9ixcd0U\">Показать примечание в контексте и заодно сократить<\/a><\/li>\n<li>№ 80. <a href=\"https:\/\/www.youtube.com\/watch?v=AmuCRWsSdpA\">Редактируем интерфейс конфигуратора окон<\/a><\/li>\n<li>№ 92. <a href=\"https:\/\/www.youtube.com\/watch?v=bYk0_q6tWLA\">Поле «Комментарий для курьера»<\/a><\/li>\n<li>№ 96. <a href=\"https:\/\/www.youtube.com\/watch?v=1l35NtOBogE\">Жирный против курсива<\/a><\/li>\n<\/ul>\n<p>Вёрстка:<\/p>\n<ul>\n<li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n<li>№ 42. <a href=\"https:\/\/www.youtube.com\/watch?v=sXRWQ05cO3I\">Улучшаем эстетику с помощью контраста и прямоугольности<\/a><\/li>\n<li>№ 73. <a href=\"https:\/\/www.youtube.com\/watch?v=49DSUMomhNE\">Верстаем интерфейс конструктора окон<\/a><\/li>\n<li>№ 78. <a href=\"https:\/\/www.youtube.com\/watch?v=JFKJHdQJvNQ\">Неудачные выравнивательные связи<\/a><\/li>\n<li>№ 99. <a href=\"https:\/\/www.youtube.com\/watch?v=yj5dFy9HQ-Y\">Комментирую вёрстку окна<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n<li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n<li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n<li>№ 27. <a href=\"https:\/\/www.youtube.com\/watch?v=X1v54YA8g7c\">Cкруглённое поле поиска и ужасный шрифт Мирьяд-про<\/a><\/li>\n<li>№ 79. <a href=\"https:\/\/www.youtube.com\/watch?v=58GldX-JZig\">Улучшаем дизайн кнопки<\/a><\/li>\n<li>№ 81. <a href=\"https:\/\/www.youtube.com\/watch?v=rlCxhBCxJww\">Классические признаки поля ввода и кнопки<\/a><\/li>\n<li>№ 87. <a href=\"https:\/\/www.youtube.com\/watch?v=ox38_G9lQuo\">Вспомогательные линии — тоньше и скромнее<\/a><\/li>\n<li>№ 91. <a href=\"https:\/\/www.youtube.com\/watch?v=hieOe3wu-7E\">Аналогия между элементами интерфейса и буквами шрифта, которые можно взять готовые<\/a><\/li>\n<li>№ 93. <a href=\"https:\/\/www.youtube.com\/watch?v=hh1oSLA0XaE\">Задисейбленность кнопки<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n<li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n<li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n<li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n<li>№ 71. <a href=\"https:\/\/www.youtube.com\/watch?v=TAg6cnGIsh4\">Запрещаю выравнивание по центру<\/a><\/li>\n<\/ul>\n<p>Бизнесовое и продуктовое:<\/p>\n<ul>\n<li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n<li>№ 32. <a href=\"https:\/\/www.youtube.com\/watch?v=qeyRl3IVSGQ\">Закоулки интерфейса можно просто не делать<\/a><\/li>\n<li>№ 38. <a href=\"https:\/\/www.youtube.com\/watch?v=k6iyy4vJ1Co\">Продаём окна, объясняя разницу профилей<\/a><\/li>\n<li>№ 47. <a href=\"https:\/\/www.youtube.com\/watch?v=6rDKRg6SlVc\">Аккуратное внедрение нового дизайна без ущерба привычкам<\/a><\/li>\n<li>№ 48. <a href=\"https:\/\/www.youtube.com\/watch?v=MhdZzXw_Tzc\">Что, если на реализацию хорошего интерфейса нет времени<\/a><\/li>\n<li>№ 56. <a href=\"https:\/\/www.youtube.com\/watch?v=3polv_KHa5g\">Разделяем сценарии оплаты частично, ровно по счёту и впрок<\/a><\/li>\n<li>№ 57. <a href=\"https:\/\/www.youtube.com\/watch?v=TeolvcH5f_8\">Соблазняем человека пиццей, а не текстом «Ваша корзина пуста»<\/a><\/li>\n<li>№ 59. <a href=\"https:\/\/www.youtube.com\/watch?v=UcIjtMreNHA\">Постоянные напоминания о цене могут мешать покупать<\/a><\/li>\n<li>№ 64. <a href=\"https:\/\/www.youtube.com\/watch?v=PQzVzgYfvfQ\">Вопросы клиента к интерфейсу кассы самообслуживания<\/a><\/li>\n<li>№ 82. <a href=\"https:\/\/www.youtube.com\/watch?v=2qV6CCRT6lA\">Заранее спросить у клиента про сео и персональные данные<\/a><\/li>\n<li>№ 88. <a href=\"https:\/\/www.youtube.com\/watch?v=Mt45AuwOnvA\">Убрал шум — добавь сигнал!<\/a><\/li>\n<li>№ 90. <a href=\"https:\/\/www.youtube.com\/watch?v=-GHjDFHWrBA\">Классно упростить себе задачу<\/a><\/li>\n<li>№ 100. <a href=\"https:\/\/www.youtube.com\/watch?v=yTIrl1jnEHU\">Программисты могли бы подумать о пользе для бизнеса<\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n<li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n<li>№ 41. <a href=\"https:\/\/www.youtube.com\/watch?v=NF8fC2Cp8iU\">Перерисовываю и улучшаю кусок интерфейса в Фигме с помощью компонентов<\/a><\/li>\n<li>№ 45. <a href=\"https:\/\/www.youtube.com\/watch?v=H3CF-RG9lIc\">Режимы наложения слоёв с овощами и фруктами<\/a><\/li>\n<li>№ 54. <a href=\"https:\/\/www.youtube.com\/watch?v=uILlCs5L_mY\">Секреты встроенной скриншотилки на Маке<\/a><\/li>\n<\/ul>\n<p>Работа над дизайном и подача:<\/p>\n<ul>\n<li>№ 36. <a href=\"https:\/\/www.youtube.com\/watch?v=czu2l7RfEWs\">Оставляйте введённый запрос в поле поиска и рисуйте клавиатуру<\/a><\/li>\n<li>№ 58. <a href=\"https:\/\/www.youtube.com\/watch?v=2tANVy6u2TQ\">Не описывайте макеты и не делайте «невозможные» макеты<\/a><\/li>\n<\/ul>\n<p>Разное интересное:<\/p>\n<ul>\n<li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n<li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n<li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n<li>№ 31. <a href=\"https:\/\/www.youtube.com\/watch?v=bCMAOeqapDI\">Двусмысленная иконка и проверка венгерским языком<\/a><\/li>\n<li>№ 51. <a href=\"https:\/\/www.youtube.com\/watch?v=SQQLWeCaHs8\">Глючная обработка ввода пользователя в интерфейсе Сафари<\/a><\/li>\n<li>№ 62. <a href=\"https:\/\/www.youtube.com\/watch?v=4JzD6d9V0nU\">Что делать, если клиент хочет фигню?<\/a><\/li>\n<li>№ 68. <a href=\"https:\/\/www.youtube.com\/watch?v=x6RbJD24N6o\">Благодарности и в чём польза теории<\/a><\/li>\n<li>№ 69. <a href=\"https:\/\/www.youtube.com\/watch?v=JoA5JZcBoS0\">Что делать дизайнеру, если разработчики напрограммили всю магию?<\/a><\/li>\n<\/ul>\n<p>Потом разберу ещё. А вы пока приходите на следующий курс, который пройдёт 3 февраля — 3 марта.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-01-15T11:25:34+05:00",
            "date_modified": "2024-01-19T11:05:10+05:00",
            "tags": [
                "Курсы",
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Mon, 15 Jan 2024 11:25:34 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125470",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125471",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-75\/",
            "title": "Фрагменты интерфейсного курса (1—75)",
            "content_html": "<p>За те три года, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">больше сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Пока разобрал первые 75 фрагментов, <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-100\/\">потом разберу ещё<\/a>.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n<li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n<li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n<li>№ 19. <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n<li>№ 26. <a href=\"https:\/\/www.youtube.com\/watch?v=Pc0GryUpCgM\">ФИО как в паспорте и эффект японской квартиры<\/a><\/li>\n<\/ul>\n<p>Почти самостоятельные лекции:<\/p>\n<ul>\n<li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a> (это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне)<\/li>\n<li>№ 33. <a href=\"https:\/\/www.youtube.com\/watch?v=du6SqjjLEzQ\">Физические радиокнопки, рукоятки в самолёте, фотоаппарат Фуджифильм<\/a><\/li>\n<li>№ 37. <a href=\"https:\/\/www.youtube.com\/watch?v=SwyTvRljimM\">Блиц-пересказ куска питерского доклада про интерфейсы и Ворлд-Чесс<\/a><\/li>\n<li>№ 46. <a href=\"https:\/\/www.youtube.com\/watch?v=JTqRG_7e3O8\">Про сложное цветовое кодирование и триаду Мейксенара<\/a><\/li>\n<li>№ 55. <a href=\"https:\/\/www.youtube.com\/watch?v=3q0HH7mUMYA\">Соответствие между логической структурой и выразительными средствами и дизайн-системы<\/a><\/li>\n<\/ul>\n<p>Метод:<\/p>\n<ul>\n<li>№ 30. <a href=\"https:\/\/www.youtube.com\/watch?v=-np87CaMjKs\">Метод «Например»<\/a><\/li>\n<li>№ 40. <a href=\"https:\/\/www.youtube.com\/watch?v=MuDea0wOabA\">Сценка со звонком в пиццерию<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n<li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n<li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n<li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n<li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n<li>№ 28. <a href=\"https:\/\/www.youtube.com\/watch?v=GrkuX84kKeo\">Улучшаем форму обратной связи Букинг.кома<\/a><\/li>\n<li>№ 35. <a href=\"https:\/\/www.youtube.com\/watch?v=dckw7tqm1M4\">Первое впечатление от формы<\/a><\/li>\n<li>№ 50. <a href=\"https:\/\/www.youtube.com\/watch?v=oepQvJtNgUU\">Упорядочиваем вёрстку формы<\/a><\/li>\n<li>№ 52. <a href=\"https:\/\/www.youtube.com\/watch?v=hPGiFsdTKa8\">Расстояние между полями и сокращение подписей<\/a><\/li>\n<li>№ 53. <a href=\"https:\/\/www.youtube.com\/watch?v=IR0zLLBf65Y\">Редизайним форму настройки сложной логики<\/a><\/li>\n<li>№ 63. <a href=\"https:\/\/www.youtube.com\/watch?v=KbZAeVFaEcU\">Добавление нескольких телефонов в форме<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a><\/p>\n<p>Таблицы, графики и диаграммы:<\/p>\n<ul>\n<li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n<li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n<li>№ 29. <a href=\"https:\/\/www.youtube.com\/watch?v=N2LINRApqmg\">Круговая диаграмма для красоты, табличка для пользы дела<\/a><\/li>\n<li>№ 34. <a href=\"https:\/\/www.youtube.com\/watch?v=u682Zi8_FBk\">Визуализация помогает увидеть закономерности<\/a><\/li>\n<li>№ 39. <a href=\"https:\/\/www.youtube.com\/watch?v=MgwYwu3wkk4\">Дизайн универсальных таблиц с непредсказуемым содержимым<\/a><\/li>\n<li>№ 43. <a href=\"https:\/\/www.youtube.com\/watch?v=BvugvUfyXmg\">Объясняю про тафтианские 45 градусов на графике<\/a><\/li>\n<li>№ 65. <a href=\"https:\/\/www.youtube.com\/watch?v=oz571oi6w24\">Живые спарклайны в таблице<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a><\/p>\n<p>Интерфейс:<\/p>\n<ul>\n<li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n<li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n<li>№ 44. <a href=\"https:\/\/www.youtube.com\/watch?v=2aQnKL5nLUw\">Упрощаем экран успешного заказа пиццы<\/a><\/li>\n<li>№ 60. <a href=\"https:\/\/www.youtube.com\/watch?v=NdBt_Oqydk4\">Рассуждения о текстовых кнопках<\/a><\/li>\n<li>№ 61. <a href=\"https:\/\/www.youtube.com\/watch?v=-zzLglJ9bEc\">Упрощаем первый экран кассы самообслуживания, добавляем кнопку «У меня булка»<\/a><\/li>\n<li>№ 67. <a href=\"https:\/\/www.youtube.com\/watch?v=WqFfT7yDMJg\">Меняем табы на переключалку и настраиваем вёрстку<\/a><\/li>\n<li>№ 72. <a href=\"https:\/\/www.youtube.com\/watch?v=IV2nVMcaQ7U\">Представляем выбор внятно радиокнопками<\/a><\/li>\n<li>№ 74. <a href=\"https:\/\/www.youtube.com\/watch?v=aLETIvOafg0\">Так это форма или мастер?<\/a><\/li>\n<li>№ 75. <a href=\"https:\/\/www.youtube.com\/watch?v=zngun6Kw1q4\">Точно описываем поведение интерфейса для разработчиков<\/a><\/li>\n<\/ul>\n<p>Редактура в дизайне:<\/p>\n<ul>\n<li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n<li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n<li>№ 49. <a href=\"https:\/\/www.youtube.com\/watch?v=H3UvwkQH8_o\">Редактура привела к радиокнопке<\/a><\/li>\n<li>№ 66. <a href=\"https:\/\/www.youtube.com\/watch?v=-6LaXViTWzc\">Исследование о тексте в интерфейсе Эпла (1980-е)<\/a><\/li>\n<li>№ 70. <a href=\"https:\/\/www.youtube.com\/watch?v=Zphn9ixcd0U\">Показать примечание в контексте и заодно сократить<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n<li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n<li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n<li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n<li>№ 27. <a href=\"https:\/\/www.youtube.com\/watch?v=X1v54YA8g7c\">Cкруглённое поле поиска и ужасный шрифт Мирьяд-про<\/a><\/li>\n<li>№ 42. <a href=\"https:\/\/www.youtube.com\/watch?v=sXRWQ05cO3I\">Улучшаем эстетику с помощью контраста и прямоугольности<\/a><\/li>\n<li>№ 73. <a href=\"https:\/\/www.youtube.com\/watch?v=49DSUMomhNE\">Верстаем интерфейс конструктора окон<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n<li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n<li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n<li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n<li>№ 71. <a href=\"https:\/\/www.youtube.com\/watch?v=TAg6cnGIsh4\">Запрещаю выравнивание по центру<\/a><\/li>\n<\/ul>\n<p>Бизнесовое и продуктовое:<\/p>\n<ul>\n<li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n<li>№ 32. <a href=\"https:\/\/www.youtube.com\/watch?v=qeyRl3IVSGQ\">Закоулки интерфейса можно просто не делать<\/a><\/li>\n<li>№ 38. <a href=\"https:\/\/www.youtube.com\/watch?v=k6iyy4vJ1Co\">Продаём окна, объясняя разницу профилей<\/a><\/li>\n<li>№ 47. <a href=\"https:\/\/www.youtube.com\/watch?v=6rDKRg6SlVc\">Аккуратное внедрение нового дизайна без ущерба привычкам<\/a><\/li>\n<li>№ 48. <a href=\"https:\/\/www.youtube.com\/watch?v=MhdZzXw_Tzc\">Что, если на реализацию хорошего интерфейса нет времени<\/a><\/li>\n<li>№ 56. <a href=\"https:\/\/www.youtube.com\/watch?v=3polv_KHa5g\">Разделяем сценарии оплаты частично, ровно по счёту и впрок<\/a><\/li>\n<li>№ 57. <a href=\"https:\/\/www.youtube.com\/watch?v=TeolvcH5f_8\">Соблазняем человека пиццей, а не текстом «Ваша корзина пуста»<\/a><\/li>\n<li>№ 59. <a href=\"https:\/\/www.youtube.com\/watch?v=UcIjtMreNHA\">Постоянные напоминания о цене могут мешать покупать<\/a><\/li>\n<li>№ 64. <a href=\"https:\/\/www.youtube.com\/watch?v=PQzVzgYfvfQ\">Вопросы клиента к интерфейсу кассы самообслуживания<\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n<li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n<li>№ 41. <a href=\"https:\/\/www.youtube.com\/watch?v=NF8fC2Cp8iU\">Перерисовываю и улучшаю кусок интерфейса в Фигме с помощью компонентов<\/a><\/li>\n<li>№ 45. <a href=\"https:\/\/www.youtube.com\/watch?v=H3CF-RG9lIc\">Режимы наложения слоёв с овощами и фруктами<\/a><\/li>\n<li>№ 54. <a href=\"https:\/\/www.youtube.com\/watch?v=uILlCs5L_mY\">Секреты встроенной скриншотилки на Маке<\/a><\/li>\n<\/ul>\n<p>Работа над дизайном и подача:<\/p>\n<ul>\n<li>№ 36. <a href=\"https:\/\/www.youtube.com\/watch?v=czu2l7RfEWs\">Оставляйте введённый запрос в поле поиска и рисуйте клавиатуру<\/a><\/li>\n<li>№ 58. <a href=\"https:\/\/www.youtube.com\/watch?v=2tANVy6u2TQ\">Не описывайте макеты и не делайте «невозможные» макеты<\/a><\/li>\n<\/ul>\n<p>Разное интересное:<\/p>\n<ul>\n<li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n<li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n<li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n<li>№ 31. <a href=\"https:\/\/www.youtube.com\/watch?v=bCMAOeqapDI\">Двусмысленная иконка и проверка венгерским языком<\/a><\/li>\n<li>№ 51. <a href=\"https:\/\/www.youtube.com\/watch?v=SQQLWeCaHs8\">Глючная обработка ввода пользователя в интерфейсе Сафари<\/a><\/li>\n<li>№ 62. <a href=\"https:\/\/www.youtube.com\/watch?v=4JzD6d9V0nU\">Что делать, если клиент хочет фигню?<\/a><\/li>\n<li>№ 68. <a href=\"https:\/\/www.youtube.com\/watch?v=x6RbJD24N6o\">Благодарности и в чём польза теории<\/a><\/li>\n<li>№ 69. <a href=\"https:\/\/www.youtube.com\/watch?v=JoA5JZcBoS0\">Что делать дизайнеру, если разработчики напрограммили всю магию?<\/a><\/li>\n<\/ul>\n<p>Потом разберу ещё. А вы пока приходите на следующий курс, который пройдёт 3 февраля — 3 марта.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-01-09T12:28:12+05:00",
            "date_modified": "2024-01-15T11:26:23+05:00",
            "tags": [
                "Курсы",
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Tue, 09 Jan 2024 12:28:12 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125471",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125288",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-132\/",
            "title": "На интерфейсном курсе: дискуссия о задачах инфографики",
            "content_html": "<p>С участником курса обсуждаем представление данных в виде круговой диаграммы или таблицы. Я жалуюсь, что сложно понять, как данные взаимосвязаны, а участник говорит, что ему наоборот легко понять. В итоге получается дискуссия о задачах инфографики, и я рассказываю о том, чему мы в этом смысле учим на курсе. 10 минут:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/Urn9TDalPg4?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 132 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 8 сентября 2023 года.<\/p>\n<p>До 2 февраля идёт запись на курс, который пройдёт с 3 февраля по 3 марта.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2024-01-01T20:15:21+05:00",
            "date_modified": "2024-01-01T20:15:06+05:00",
            "tags": [
                "видео",
                "инфографика",
                "круговые диаграммы",
                "представление информации",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Mon, 01 Jan 2024 20:15:21 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125288",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125215",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-50\/",
            "title": "Фрагменты интерфейсного курса (1—50)",
            "content_html": "<p>За те три года, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">больше сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Пока разобрал первые 50 фрагментов, <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-75\/\">потом разберу ещё<\/a>. Считайте, что это вам вместо сериальчиков на новогодние каникулы.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n<li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n<li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n<li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n<li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n<li>№ 19. <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n<li>№ 26. <a href=\"https:\/\/www.youtube.com\/watch?v=Pc0GryUpCgM\">ФИО как в паспорте и эффект японской квартиры<\/a><\/li>\n<\/ul>\n<p>Почти самостоятельные лекции:<\/p>\n<ul>\n<li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a> (это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне)<\/li>\n<li>№ 33. <a href=\"https:\/\/www.youtube.com\/watch?v=du6SqjjLEzQ\">Физические радиокнопки, рукоятки в самолёте, фотоаппарат Фуджифильм<\/a><\/li>\n<li>№ 37. <a href=\"https:\/\/www.youtube.com\/watch?v=SwyTvRljimM\">Блиц-пересказ куска питерского доклада про интерфейсы и Ворлд-Чесс<\/a><\/li>\n<li>№ 46. <a href=\"https:\/\/www.youtube.com\/watch?v=JTqRG_7e3O8\">Про сложное цветовое кодирование и триаду Мейксенара<\/a><\/li>\n<\/ul>\n<p>Метод:<\/p>\n<ul>\n<li>№ 30. <a href=\"https:\/\/www.youtube.com\/watch?v=-np87CaMjKs\">Метод «Например»<\/a><\/li>\n<li>№ 40. <a href=\"https:\/\/www.youtube.com\/watch?v=MuDea0wOabA\">Сценка со звонком в пиццерию<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n<li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n<li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n<li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n<li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n<li>№ 28. <a href=\"https:\/\/www.youtube.com\/watch?v=GrkuX84kKeo\">Улучшаем форму обратной связи Букинг.кома<\/a><\/li>\n<li>№ 35. <a href=\"https:\/\/www.youtube.com\/watch?v=dckw7tqm1M4\">Первое впечатление от формы<\/a><\/li>\n<li>№ 50. <a href=\"https:\/\/www.youtube.com\/watch?v=oepQvJtNgUU\">Упорядочиваем вёрстку формы<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a><\/p>\n<p>Таблицы, графики и диаграммы:<\/p>\n<ul>\n<li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n<li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n<li>№ 29. <a href=\"https:\/\/www.youtube.com\/watch?v=N2LINRApqmg\">Круговая диаграмма для красоты, табличка для пользы дела<\/a><\/li>\n<li>№ 34. <a href=\"https:\/\/www.youtube.com\/watch?v=u682Zi8_FBk\">Визуализация помогает увидеть закономерности<\/a><\/li>\n<li>№ 39. <a href=\"https:\/\/www.youtube.com\/watch?v=MgwYwu3wkk4\">Дизайн универсальных таблиц с непредсказуемым содержимым<\/a><\/li>\n<li>№ 43. <a href=\"https:\/\/www.youtube.com\/watch?v=BvugvUfyXmg\">Объясняю про тафтианские 45 градусов на графике<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a><\/p>\n<p>Редактура в дизайне:<\/p>\n<ul>\n<li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n<li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n<li>№ 49. <a href=\"https:\/\/www.youtube.com\/watch?v=H3UvwkQH8_o\">Редактура привела к радиокнопке<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n<li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n<li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n<li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n<li>№ 27. <a href=\"https:\/\/www.youtube.com\/watch?v=X1v54YA8g7c\">Cкруглённое поле поиска и ужасный шрифт Мирьяд-про<\/a><\/li>\n<li>№ 42. <a href=\"https:\/\/www.youtube.com\/watch?v=sXRWQ05cO3I\">Улучшаем эстетику с помощью контраста и прямоугольности<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n<li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n<li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n<li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n<li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n<li>№ 41. <a href=\"https:\/\/www.youtube.com\/watch?v=NF8fC2Cp8iU\">Перерисовываю и улучшаю кусок интерфейса в Фигме с помощью компонентов<\/a><\/li>\n<li>№ 45. <a href=\"https:\/\/www.youtube.com\/watch?v=H3CF-RG9lIc\">Режимы наложения слоёв с овощами и фруктами<\/a><\/li>\n<\/ul>\n<p>Бизнесовое и продуктовое:<\/p>\n<ul>\n<li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n<li>№ 32. <a href=\"https:\/\/www.youtube.com\/watch?v=qeyRl3IVSGQ\">Закоулки интерфейса можно просто не делать<\/a><\/li>\n<li>№ 38. <a href=\"https:\/\/www.youtube.com\/watch?v=k6iyy4vJ1Co\">Продаём окна, объясняя разницу профилей<\/a><\/li>\n<li>№ 47. <a href=\"https:\/\/www.youtube.com\/watch?v=6rDKRg6SlVc\">Аккуратное внедрение нового дизайна без ущерба привычкам<\/a><\/li>\n<li>№ 48. <a href=\"https:\/\/www.youtube.com\/watch?v=MhdZzXw_Tzc\">Что, если на реализацию хорошего интерфейса нет времени<\/a><\/li>\n<\/ul>\n<p>Разное интересное:<\/p>\n<ul>\n<li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n<li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n<li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n<li>№ 31. <a href=\"https:\/\/www.youtube.com\/watch?v=bCMAOeqapDI\">Двусмысленная иконка и проверка венгерским языком<\/a><\/li>\n<li>№ 36. <a href=\"https:\/\/www.youtube.com\/watch?v=czu2l7RfEWs\">Оставляйте введённый запрос в поле поиска и рисуйте клавиатуру<\/a><\/li>\n<li>№ 44. <a href=\"https:\/\/www.youtube.com\/watch?v=2aQnKL5nLUw\">Упрощаем экран успешного заказа пиццы<\/a><\/li>\n<\/ul>\n<p>Потом разберу ещё. А вы пока приходите на следующий курс, который пройдёт 3 февраля — 3 марта.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-12-28T18:38:27+05:00",
            "date_modified": "2024-01-09T12:28:22+05:00",
            "tags": [
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Thu, 28 Dec 2023 18:38:27 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125215",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125177",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-25\/",
            "title": "Фрагменты интерфейсного курса (1—25)",
            "content_html": "<p>За те три года, что <a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\">мой интерфейсный курс<\/a> идёт в онлайне, я выложил уже <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/ui-course-frags\/\">больше сотни фрагментов с наших семинаров<\/a>. Они уже сами представляют собой неплохую базу материала, правда, не очень структурированного. Пришло время навести хотя бы немного порядка.<\/p>\n<p>Пока разобрал первые 25 фрагментов, <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frags-1-50\/\">потом разберу ещё<\/a>. Считайте, что это вам вместо сериальчиков на новогодние каникулы.<\/p>\n<p>Сборная солянка:<\/p>\n<ul>\n<li>№ 1. <a href=\"https:\/\/www.youtube.com\/watch?v=xzUNC_VGNFk\">Разбираем пару таблиц, заглядываем к Мильчину, потом смотрим и двигаем форму<\/a><\/li>\n<li>№ 2. <a href=\"https:\/\/www.youtube.com\/watch?v=_Jv9dT2B7Nc\">Обсуждаем тафтианские точки во времени в расписаниях, разбираем кусок формы для Ай-ОСа<\/a><\/li>\n<li>№ 9. <a href=\"https:\/\/www.youtube.com\/watch?v=gUklbkeDdYg\">Незаконно упрощаем, упаковываем несколько полей в одно и обсуждаем тестирование<\/a><\/li>\n<li>№ 16. <a href=\"https:\/\/www.youtube.com\/watch?v=99o_4c7HTUk\">О важности дефолтных значений в калькуляторе, о нежелательных связях из-за сетки<\/a><\/li>\n<li>№ 19 <a href=\"https:\/\/www.youtube.com\/watch?v=5VCi1KN7WdE\">Чёткие края фоток, выбор стеклопакетов и нелинейное анду в Фотошопе<\/a><\/li>\n<\/ul>\n<p>Это впоследствие превратилось в самостоятельную лекцию в блоке об информационном дизайне:<\/p>\n<ul>\n<li>№ 3. <a href=\"https:\/\/www.youtube.com\/watch?v=LBBWjtEHLxU\">Папочка comparisons, листаю и комментирую после лекций об информационном дизайне<\/a><\/li>\n<\/ul>\n<p>Формы:<\/p>\n<ul>\n<li>№ 4. <a href=\"https:\/\/www.youtube.com\/watch?v=bPSaKS1bbsE\">Двигаем простенькую форму регистрации, чтобы стало поаккуратнее<\/a><\/li>\n<li>№ 5. <a href=\"https:\/\/www.youtube.com\/watch?v=OMJV8exdbnU\">Избавляемся от рамки, наводим порядок в корзине, упрощаем поля адреса, мочим звёздочки<\/a><\/li>\n<li>№ 11. <a href=\"https:\/\/www.youtube.com\/watch?v=how0mkG7ui4\">Первое впечатление, синтаксис и язык формы заказа с доставкой<\/a><\/li>\n<li>№ 15. <a href=\"https:\/\/www.youtube.com\/watch?v=c91KziF01sQ\">Верстаем, сокращаем, верстаем, сокращаем, верстаем, сокращаем форму<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/web-forms\/\">веб-формы<\/a>.<\/p>\n<p>Таблицы:<\/p>\n<ul>\n<li>№ 8. <a href=\"https:\/\/www.youtube.com\/watch?v=IvzDUzH-Sk0\">Сверхплотная упаковка шапки таблицы и вёрстка карманного словаря<\/a><\/li>\n<li>№ 10. <a href=\"https:\/\/www.youtube.com\/watch?v=mE0pZIVgJLE\">Что не позволено базе данных, то позволено обычной таблице<\/a><\/li>\n<\/ul>\n<p class=\"foot\">См. также тег: <a href=\"https:\/\/ilyabirman.ru\/meanwhile\/tags\/tables\/\">таблицы<\/a>.<\/p>\n<p>Редактура в дизайне:<\/p>\n<ul>\n<li>№ 7. <a href=\"https:\/\/www.youtube.com\/watch?v=1DdsndXWHSE\">Механически редактируем примечание к таблице<\/a><\/li>\n<li>№ 24. <a href=\"https:\/\/www.youtube.com\/watch?v=bxSu-Vx0Nz8\">Отступления от синтаксиса интерфейса и линейки в таблицах<\/a><\/li>\n<\/ul>\n<p>Эстетика:<\/p>\n<ul>\n<li>№ 12. <a href=\"https:\/\/www.youtube.com\/watch?v=kmlb272BAdo\">Как делать градиенты в инфографике<\/a><\/li>\n<li>№ 13. <a href=\"https:\/\/www.youtube.com\/watch?v=29GAdT6dXBA\">Упаковка таблицы, симультанный контраст и борьба за красоту цветов<\/a><\/li>\n<li>№ 17. <a href=\"https:\/\/www.youtube.com\/watch?v=td6deeU-7kU\">Срисовываем экран интерфейса у Эпла, чтобы выглядело нормально<\/a><\/li>\n<\/ul>\n<p>Ход:<\/p>\n<ul>\n<li>№ 6. <a href=\"https:\/\/www.youtube.com\/watch?v=BKu6wqOvgfg\">Ставим красную блямбу рядом с таблицей<\/a><\/li>\n<li>№ 20. <a href=\"https:\/\/www.youtube.com\/watch?v=CaiDj7OOUbc\">Изображаем нестандартную конструкцию окна символом<\/a><\/li>\n<li>№ 25. <a href=\"https:\/\/www.youtube.com\/watch?v=N2Qk697fe24\">Чтобы пользователь нажал, можно написать «Жми!» <\/a><\/li>\n<\/ul>\n<p>Инструмент:<\/p>\n<ul>\n<li>№ 18. <a href=\"https:\/\/www.youtube.com\/watch?v=vHCy9izr0v4\">Последовательное волшебство в интерфейсе Фотошопа<\/a><\/li>\n<\/ul>\n<p>Разное:<\/p>\n<ul>\n<li>№ 14. <a href=\"https:\/\/www.youtube.com\/watch?v=tYJMrY5zWlo\">Как работает автоматическая вёрстка рекомендаций в будущей Эгее 2.10<\/a><\/li>\n<li>№ 21. <a href=\"https:\/\/www.youtube.com\/watch?v=fPVmyMbixXw\">Что бы я поменял в дизайне Бёрдвью спустя девять лет<\/a><\/li>\n<li>№ 22. <a href=\"https:\/\/www.youtube.com\/watch?v=7Mc6IaaXNsc\">Технические ограничения и дизайн для будущего<\/a><\/li>\n<li>№ 23. <a href=\"https:\/\/www.youtube.com\/watch?v=xq7ntaU6FTU\">Как продать подписку на «Афишу»<\/a><\/li>\n<\/ul>\n<p>А вы пока приходите на следующий курс, который пройдёт 3 февраля — 3 марта.<\/p>\n<p><a href=\"https:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-12-26T15:46:10+05:00",
            "date_modified": "2024-01-09T11:59:18+05:00",
            "tags": [
                "пользовательский интерфейс",
                "представление информации"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Tue, 26 Dec 2023 15:46:10 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125177",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "125044",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-131\/",
            "title": "На интерфейсном курсе: когда нужны моноширинные цифры",
            "content_html": "<p>Рассказываю на курсе, что моноширинные цифры нужны в таблицах и в случае динамических данных, показываю примеры. 3 минутки:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/2PC5L3tv6fA?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 131 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 8 сентября 2023 года.<\/p>\n<p>До 22 декабря идёт запись на курс, который пройдёт с 23 декабря по 21 января.<\/p>\n<p>Дед Мороз принесёт вам мешок новых знаний!<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-12-21T13:47:59+05:00",
            "date_modified": "2023-12-21T13:47:17+05:00",
            "tags": [
                "видео",
                "представление информации",
                "студентам",
                "таблицы",
                "фрагменты курса ПИ",
                "Шрифты"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Thu, 21 Dec 2023 13:47:59 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "125044",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "123957",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/solar-system-model-melbourne-video\/",
            "title": "Видео по вторникам: модель Солнечной системы в Мельбурне",
            "content_html": "<p>Модель Солнечной системы в масштабе 1 к миллиарду в Мельбурне:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/ry122Jqpxu4?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Захотелось слетать в Мельбурн и посмотреть своими глазами. Очень мощное сравнение.<\/p>\n",
            "date_published": "2023-10-31T11:47:35+05:00",
            "date_modified": "2023-10-31T00:35:42+05:00",
            "tags": [
                "видео",
                "представление информации",
                "сравнение"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Tue, 31 Oct 2023 11:47:35 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "123957",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "123251",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-117\/",
            "title": "На интерфейсном курсе: горизонтальная прокрутка в таблицах",
            "content_html": "<p>Что делать, если без горизонтальной прокрутки таблица не влезает? Может быть, всё-таки упихнуть. Может быть, дать частичную прокрутку, чтобы нужные вещи оставались в поле зрения. 4 минуты:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/PBzl0pIUqk0?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 117 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 4 мая 2023 года.<\/p>\n<p>До 6 октября идёт запись на курс, который пройдёт с 7 октября по 5 ноября.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-09-29T19:46:40+05:00",
            "date_modified": "2023-12-26T15:10:19+05:00",
            "tags": [
                "видео",
                "листание и прокрутка",
                "представление информации",
                "студентам",
                "таблицы",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Fri, 29 Sep 2023 19:46:40 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "123251",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "122302",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-111\/",
            "title": "На интерфейсном курсе: нужны не круговые диаграммы, а таблица",
            "content_html": "<p>Небольшой кусочек, где я говорю, почему круговые диаграммы мешают въехать в данные, и почему тут нужна обычная таблица. 3 минуты:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/wJJdSn4Vk-Q?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 111 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 24 марта 2023 года.<\/p>\n<p>До 25 августа идёт запись на курс, который пройдёт с 26 августа по 24 сентября. Сейчас действует скидка 10% из-за ранней записи.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-08-12T11:35:57+05:00",
            "date_modified": "2023-08-14T19:16:43+05:00",
            "tags": [
                "видео",
                "информационный дизайн",
                "круговые диаграммы",
                "представление информации",
                "студентам",
                "таблицы",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Sat, 12 Aug 2023 11:35:57 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "122302",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "122201",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-110\/",
            "title": "На интерфейсном курсе: в чём проблема интерактивных графиков",
            "content_html": "<p>Участник курса нарисовал график, но он оказался интерактивным — разные данные на нём появляются в зависимости от того, куда кликнул пользователь. Рассказываю, почему это проблема даже на уровне подхода, но ещё разбираем и конкретные проблемы в самом интерфейсе. 6 минут:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/qsDWBf-xcVs?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 110 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 24 марта 2023 года.<\/p>\n<p>До 25 августа идёт запись на курс, который пройдёт с 26 августа по 24 сентября. Сейчас действует скидка 10% из-за ранней записи.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-08-08T11:27:55+05:00",
            "date_modified": "2023-08-14T19:16:33+05:00",
            "tags": [
                "видео",
                "информационный дизайн",
                "представление информации",
                "студентам",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Tue, 08 Aug 2023 11:27:55 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "122201",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "119459",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-102\/",
            "title": "На интерфейсном курсе: как выравнивать цифры в таблицах",
            "content_html": "<p>Снова борюсь с заблуждением, что цифры надо выравнивать по правому краю. Цифры надо выравнивать по разрядам! Если у них в результате этого сравняются правые края — ну хорошо, но это побочный эффект, а не самоцель. А то, что все любят выравнивать по правому — так это потому что так быстрее напрограммировать. 3 минутки:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/QyHEWiMR_0A?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 102 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 16 декабря 2022 года.<\/p>\n<p>До 26 мая идёт запись на курс, который пройдёт с 27 мая по 25 июня.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-05-20T12:17:06+05:00",
            "date_modified": "2023-08-14T19:14:03+05:00",
            "tags": [
                "видео",
                "представление информации",
                "студентам",
                "таблицы",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Sat, 20 May 2023 12:17:06 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "119459",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        },
        {
            "id": "118848",
            "url": "https:\/\/ilyabirman.ru\/meanwhile\/all\/ui-course-frag-98\/",
            "title": "На интерфейсном курсе: когда визуализация потрачена впустую",
            "content_html": "<p>Ещё один спич про то, когда нужна, а когда не нужна визуализация. Например, визуализация иногда помогает выявить манипуляции с данными. 4 минуты:<\/p>\n<div class=\"e2-text-video\">\n<iframe src=\"https:\/\/www.youtube.com\/embed\/9pf94f8Mz7Q?enablejsapi=1\" allow=\"autoplay\" frameborder=\"0\" allowfullscreen><\/iframe>\n<\/div>\n<p>Это фрагмент № 98 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 11 ноября 2022 года.<\/p>\n<p>До 26 мая идёт запись на курс, который пройдёт с 27 мая по 25 июня.<\/p>\n<p><a href=\"http:\/\/bureau.ru\/educenter\/ui-online\/\" class=\"button buy-button big-button\">Почитать о курсе<\/a><\/p>\n<p class=\"foot\">Программа, отзывы, запись<\/p>\n",
            "date_published": "2023-04-28T20:06:48+05:00",
            "date_modified": "2023-08-14T19:12:26+05:00",
            "tags": [
                "видео",
                "информационный дизайн",
                "Курсы",
                "представление информации",
                "фрагменты курса ПИ"
            ],
            "author": {
                "name": "Илья Бирман",
                "url": "https:\/\/ilyabirman.ru\/meanwhile\/",
                "avatar": "https:\/\/ilyabirman.ru\/meanwhile\/pictures\/userpic\/userpic@2x.jpg?1573933764"
            },
            "_date_published_rfc2822": "Fri, 28 Apr 2023 20:06:48 +0500",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "118848",
            "_rss_enclosures": [],
            "_e2_data": {
                "is_favourite": false,
                "links_required": null,
                "og_images": []
            }
        }
    ],
    "_e2_version": 4079,
    "_e2_ua_string": "Aegea 11.0 (v4079e)"
}