https://blogengine.me/blogs/tags/vyorstka/ Автоматически собираемая лента заметок, написанных в блогах на Эгее ru Aegea 11.0 (v4079e) Автоматически собираемая лента заметок, написанных в блогах на Эгее no 137058 https://ilyabirman.ru/meanwhile/all/konspekty-kursa-o-prezentaciyah/ Tue, 12 Aug 2025 14:54:28 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/konspekty-kursa-o-prezentaciyah/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Мы с Мишей Нозиком недавно выложили ещё <a href="https://bureau.ru/news/2025/presentation-trailers-2/">пачку трейлеров</a> курса «Презентация клиенту и публичные выступления». И пока этим занимались, вспомнили, что у наших лекций нет конспектов, а ведь некоторым людям читать удобнее, чем смотреть видео. Кроме того, по конспектам проще искать, и из них проще копировать себе отдельные важные мысли.</p> <p>В общем, начали делать конспекты, пока сделали несколько первых лекций, получается красота:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/presentation-4-lectures.jpg" width="973" height="2560" alt="" /> </div> <p>Если <a href="https://bureau.ru/courses/presentation-online/">зайти на страницу курса</a>, в блоке «Теория» несколько лекций помечены как бесплатные. Первая из них, «Как говорить и как держаться», как раз уже с конспектом, сходите посмотрите.</p> <p>Лекции крутые, но главная польза курса в практике. На семинарах мы буквально заставляем вас репетировать и оттачивать свой рассказ, учим отвечать на каверзные вопросы и реагировать на возникающие проблемы. Мы считаем, что это такой же базовый навык, как ведение переговоров или деловой переписки — повышает эффективность любой работы.</p> <p>Ещё <a href="https://bureau.ru/news/2025/august-masterclass-nozik/">сегодня вечером у Миши будет мастер‑класс про вёрстку слайдов</a>. Это не про дизайн для дизайнеров, а именно основные вещи, как делать понятно и аккуратно, чтобы просто кривизной слайдов к себе доверие не подрывать. Рекомендую. Ну и на курс приходите, понятное дело.</p> 136415 https://ilyabirman.ru/meanwhile/all/ui-course-frag-174/ Thu, 26 Jun 2025 17:25:48 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-174/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Показываю, как добиться, чтобы виджет выглядел нормально, срисовывая системный виджет погоды.  10 минут с Фотошопом в руках:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/aV65V1H4w3I?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>ЧатГПТ от моего лица: «В этом фрагменте я показываю, как полезно буквально „срисовывать“ готовый интерфейс — не для копирования, а как упражнение. Я беру виджет Эпла, накладываю на него свою версию и начинаю дотягивать по отступам, размерам, плотности текста, цвету, логике выравнивания. Иногда в процессе выясняется, что что-то у меня „не так“, хотя я даже не сразу понимаю, почему — просто на фоне оригинала моя версия выглядит неритмичной, рыхлой или слишком жирной. И вот через эту кропотливую механику выравнивания и подгонки приходит понимание: как устроена композиция, какие отступы считаются нормой, где оси выравнивания, как работает цвет и что именно делает оригинал „живым“».</p> <p>Это фрагмент № 174 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 23 февраля 2024 года.</p> <p>Идёт запись на курс, который пройдёт 19 июля — 17 августа. Сейчас −20%, потому что заранее. Недавно обновились несколько лекций и добавилась новая.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 136226 https://ilyabirman.ru/meanwhile/all/ui-course-frag-173/ Sun, 08 Jun 2025 22:07:48 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-173/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Сначала увеличиваем на виджете кружок, глядя на системный виджет часов, а потом ещё экспериментируем с иконкой внутри. 10 минут с Фотошопом в руках:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/EaSKacTWobU?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>ЧатГПТ от моего лица: «В этом фрагменте я говорю о важности сверки с системными образцами. Когда рисуешь свой виджет или иконку, нужно не полагаться на глазомер, а прямо ставить рядом аналогичный элемент из интерфейса iOS — и сравнивать отступы, размеры, пропорции. Если делаешь по-другому, на это должна быть причина, а не просто „так получилось“. Часто именно мелкие отклонения по расстояниям, толщине линий или соотношению элементов делают макет „туповатым“ — словно он из другой системы. Чтобы избежать этого, полезно брать за ориентир реальные компоненты и адаптировать свой дизайн под их язык».</p> <p>Это фрагмент № 173 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 23 февраля 2024 года.</p> <p>Идёт запись на курс, который пройдёт 19 июля — 17 августа. Сейчас аж −30%, потому что заранее. Недавно обновились несколько лекций и добавилась новая.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 134718 https://ilyabirman.ru/meanwhile/all/ui-course-frag-164/ Wed, 19 Feb 2025 20:44:15 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-164/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Обсуждаем виджет умного дома. Я увлекаюсь рисованием иконок стиралки и посудомойки, а потом говорим про всё остальное. 23 минуты:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/AebU9xyd-QI?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> <p> 0:00 Рисуем иконки стиралки и посудомойки<br /> 6:45 Расставляем их по-другому, подписываем<br /> 11:55 Важность прямоугольности<br /> 13:00 Как показывать примерный остаток времени: лаконичность против взгляда новичка. Как сделать оберег от воров.<br /> 17:22 Какие действия стоит делать кнопками прямо на виджете.<br /> 19:27 Сравниваем круги прогресса стирки и заряда наушников<br /> </p> </div> <p>Это фрагмент № 164 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 12 января 2024 года.</p> <p>Идёт запись на курс, который пройдёт 1—30 марта. Сейчас −10% из-за ранней записи.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 133680 https://ilyabirman.ru/meanwhile/all/ui-course-frag-162/ Thu, 16 Jan 2025 15:07:37 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-162/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Интерфейсный курс скоро подорожает, и вот-вот закончится запись на последний поток по старой цене. Заодно — кусочек из курса.</p> <p>Показываю несколько движений, чтобы виджет стал посимпатичнее. 4 минутки:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/cbpDb3k_t5k?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Также есть <a href="https://vkvideo.ru/video286049442_456239450">на ВК-видео</a>.</p> <p>Это фрагмент № 162 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 1 декабря 2023 года.</p> <p>Идёт запись на курс, который пройдёт 18 января — 16 февраля.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 133477 https://ilyabirman.ru/meanwhile/all/ui-course-frag-160/ Sat, 28 Dec 2024 00:54:01 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-160/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Это видео, где я просто в прямом эфире думаю, как можно было бы улучшить виджет, используя тот материал, который в нём уже есть. Никаких озарений, просто ход мысли в реальном времени. 10 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/UeSCu7MFeAw?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Также есть <a href="https://vkvideo.ru/video286049442_456239446">на ВК-видео</a>.</p> <p>Это фрагмент № 160 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 1 декабря 2023 года.</p> <p>Идёт запись на курс, который пройдёт 18 января — 16 февраля. Сейчас −20% из-за ранней записи.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 133260 https://ilyabirman.ru/meanwhile/all/ui-course-frag-157/ Sat, 14 Dec 2024 12:36:06 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-157/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Обсуждаем, делать ли втяжку у подчинённых строк в таблице. Я предпочитаю не делать, если получается не делать. 3 минуты:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/36V12nuC0kY?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Также есть <a href="https://vkvideo.ru/video286049442_456239442">на ВК-видео</a>.</p> <p>Это фрагмент № 157 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 24 ноября 2023 года.</p> <p>Идёт запись на курс, который пройдёт 18 января — 16 февраля. Сейчас −30% из-за ранней записи.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 132498 https://ilyabirman.ru/meanwhile/all/ui-course-frag-152/ Fri, 01 Nov 2024 16:00:56 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-152/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Разбираем интерфейс заправки. Одна из проблем — перебор с количеством стилей. Не надо выделять всё разными шрифтами по важности, ведь получается каша. А ещё тени должны падать вниз и не быть чисто серыми. 6 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/hvv_ohLK1xU?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Также есть <a href="https://vk.com/video286049442_456239429">на ВК-видео</a>.</p> <p>Это фрагмент № 152 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 3 ноября 2023 года.</p> <p>Идёт запись на курс, который пройдёт 7 декабря — 5 января. Всё ещё аж −30% из-за очень ранней записи.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 127795 https://ilyabirman.ru/meanwhile/all/presentation-course-frag-5/ Sat, 04 May 2024 11:30:49 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/presentation-course-frag-5/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Участница курса презентаций Дарья Камышная презентует руководству новый подход к обучению сотрудников, который она предлагает. Первая попытка — <a href="https://ilyabirman.ru/meanwhile/all/presentation-course-frag-4/">в предыдущем видео</a>. Здесь рассказ намного бодрее! Часть рассказа мы вырезали по просьбе Дарьи, так как там были закрытые штуки с её работы. Теперь Миша показывает, как улучшить слайды. 15 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/zyy3Te5sOck?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> <p> 00:00 Дарья презентует<br /> 03:23 Миша показывает, как улучшить слайды<br /> </p> </div> <p>Это фрагмент № 5 онлайн-курса «Презентация клиенту и публичные выступления». Записано на курсе 25 марта 2024 года.</p> <p>Редко выкладываем кусочки оттуда, зацените.</p> <p>До 19 мая идёт запись на курс, который пройдёт с 20 мая по 9 июня. Сэкономьте 10%, записавшись заранее.</p> <p><a href="https://bureau.ru/courses/presentation-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа и запись</p> 124182 https://ilyabirman.ru/meanwhile/all/course-ui-practice-cover/ Wed, 08 Nov 2023 23:08:22 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/course-ui-practice-cover/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>К недавней новости про <a href="http://bureau.ru/news/2023/ui-online-practice-boost/">усиление практики на курсе</a> я нарисовал нехитрую обложку:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-final@2x.png" width="480" height="240" alt="" /> </div> <p>Обложка нужна просто чтобы была хоть какая-то картинка для соцсетей, но при этом нет смысла тратить силы на дизайн кастомной графики. Надо сделать чё-то нормальное по-быстрому.</p> <p>Кажется, что у меня просто написано слово «практика» с переносом.</p> <p>На самом деле, если просто написать слово, получится так:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-initial@2x.png" width="457" height="408" alt="" /> </div> <p>Строки встают так далеко друг от друга, потому что шрифт обычно изначально проектируют для набора полноценного текста. Вот смотрите, как будет выглядеть набор полноценного текста:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-font-example@2x.png" width="460" height="348" alt="" /> </div> <p>То есть со шрифтом всё нормально, но для моей задачи такой отступ выглядит нелепо. Подтягиваем строки друг к другу. Я подтянул так, чтобы расстояние между строками было такое, как толщина горизонтального штриха в этом шрифте:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-tight-explanation@2x.png" width="457" height="260" alt="" /> </div> <p>Получилось так:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-tight@2x.png" width="457" height="260" alt="" /> </div> <p>Дальше мне захотелось упереть букву П левым верхним углом в угол самой плашки. Но при таком крупном наборе видно, что крыша буквы Т торчит левее буквы П в предыдущей строке. В шрифте специально делают так — это называется оптическими компенсациями. Если бы их не было, при взгляде издалека наоборот казалось бы, что Т уехала правее. Но мы-то тут не издалека смотрим, а под микроскопом. Поэтому поставим ровно, ну и упрём в левый край:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-left-aligned@2x.png" width="457" height="260" alt="" /> </div> <p>Сверху, справа и снизу тоже хочется упереть:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-cropped@2x.png" width="439" height="241" alt="" /> </div> <p>Теперь напрягает, что крыша буквы Т <a href="https://ilyabirman.ru/meanwhile/all/almost/">почти, но не совсем</a> совпадает по ширине с П, а вертикальный штрих от И проходит мимо Р, хотя мог бы и попадать:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-misalignments-explanation@2x.png" width="439" height="241" alt="" /> </div> <p>Букве Т надо крышу нарисовать правильной длины, ну и букву И подвинуть правее. Диагонали от И и А могли бы плавнее друг в друга переходить, а потом от К и А. Вообще, заметно, что чем дальше от начала строки, тем сильнее расхождение, поэтому хочется просто нижнюю строку разредить до более плавного попадания:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-almost-aligned@2x.png" width="439" height="241" alt="" /> </div> <p>Теперь замечаю, что левый штрих от К почти, но не совсем проходит через середину А:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-ak-explanation@2x.png" width="439" height="241" alt="" /> </div> <p>Двигаю К чуток левее, чтобы попадало чётко:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-aligned-explanation@2x.png" width="439" height="241" alt="" /> </div> <p>Получается так:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-aligned@2x.png" width="439" height="241" alt="" /> </div> <p>Замечаю, что картинка получилась размера 439×241. Как минимум надо сделать 440×240, чтобы совесть была чиста, но я решаю сделать 480×240 — тогда получится прямоугольник пропорций 2:1. Мелочь, а приятно. Для этого нужно увеличить разрядку в обеих строках, но это и так <a href="https://www.artlebedev.ru/kovodstvo/sections/142/">неплохая идея</a>. Аккуратно делаю, следя за тем, чтобы все выстроенные вертикали сохранились:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-wider@2x.png" width="480" height="240" alt="" /> </div> <p>Перетекание И в А немного нарушилось — ну, значит не судьба. Отступ между строками пришлось на 1 пиксель уменьшить, сломав исходную затею с тем, чтобы это был ровно размер горизонтального штриха. Но кто ж это заметит?</p> <p>Теперь буквы стоят нормально, но всё вместе выглядит дырявенько, да и непонятно, что практика-то? Добавляю надписи «×2» и «и сертификаты с отличием», а заодно ставлю сердечко из обложки курса на фон. Выравниваю надписи на глазок по среднему штриху К:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-decorated@2x.png" width="480" height="240" alt="" /> </div> <p>Готово:</p> <div class="e2-text-picture"> <img src="https://ilyabirman.ru/meanwhile/pictures/practice-final@2x.png" width="480" height="240" alt="" /> </div> <p>Если вы работаете дизайнером, такие вещи вы должны делать просто на автопилоте и даже не считать, что вы что-то задизайнили. Это типа как уборщице поставить ровно стулья в кафе после ухода гостя. Любое конкретное решение на каждом из шагов может быть другим, но важно, чтобы вам было не всё равно.</p> <p>А на курс <a href="https://bureau.ru/courses/ui-online/" class="nu">«<u>Пользовательский интерфейс и представление информации</u>»</a> с усиленной практикой и сертификатами с отличием не забудьте прийти!</p> 118930 https://ilyabirman.ru/meanwhile/all/ui-course-frag-99/ Tue, 02 May 2023 23:29:15 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-99/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Объясняю по элементам, что не так с вёрсткой, почему она выглядит не очень. А ещё есть путаница с ролью элементов: то ли там заголовок, то ли переключалка какая-то. Заодно касаемся темы различий между вкладками и переключалками. 4 минуты:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/yj5dFy9HQ-Y?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 99 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 9 декабря 2022 года.</p> <p>До 26 мая идёт запись на курс, который пройдёт с 27 мая по 25 июня.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 122354 https://ilyabirman.ru/meanwhile/all/ui-course-frag-89/ Tue, 24 Jan 2023 10:34:42 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-89/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Сначала я показываю, какой интерфейс дырявый, и какой сложной формы эти дырки и элементы. А потом в Фотошопе показываю, как залатать все дыры, сделав элементы прямоугольным. Ну и хвалю Фотошоп за свободу, которую не даёт никакая Фигма. 10 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/eLOGLY3_h7U?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 89 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 10 июня 2022 года.</p> <p>До 27 января идёт запись на курс, который пройдёт с 28 января по 26 февраля.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 125173 https://ilyabirman.ru/meanwhile/all/ui-course-frag-85/ Sat, 07 Jan 2023 02:01:25 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-85/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Разбираем дизайн формы. Во-первых, убираем центровку, чтобы стало выглядеть нормально. Во-вторых, наводим порядок со смыслом элементов управления. В-третьих, вспоминаем про теорию близости. А под конец у меня ломается Фотошоп. Но суть всё равно понятна. 5 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/DnTeUK1OqLQ?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 85 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 10 июня 2022 года.</p> <p>До 27 января идёт запись на курс, который пройдёт с 28 января по 26 февраля.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 122360 https://ilyabirman.ru/meanwhile/all/ui-course-frag-78/ Tue, 15 Nov 2022 23:51:50 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-78/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>У участника курса почти, но не совсем выровнялись слова. Но тут случай, когда если совсем выровнять, станет чуть ли не ещё хуже. Обсуждаем неудачные выравнивательные связи и другие совпадения, например коридорчики в наборе. 4 минуты:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/JFKJHdQJvNQ?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 78 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 1 апреля 2022 года.</p> <p>До 2 декабря идёт запись на курс, который пройдёт с 3 декабря по 1 января.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> <p>См. также:</p> <ul> <li><a href="http://ilyabirman.ru/meanwhile/all/almost/">Почти, но не совсем</a></li> </ul> 122365 https://ilyabirman.ru/meanwhile/all/ui-course-frag-73/ Thu, 06 Oct 2022 01:29:04 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-73/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Показываю, как я верстаю интерфейсы. Общий принцип — делать из всего прямоугольники. Видео хорошо идёт на двойной скорости или даже ещё быстрее, если ваш проигрыватель такое даёт. На этот раз длинный видос, целых 16 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/49DSUMomhNE?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 73 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 11 февраля 2022 года.</p> <p>До 28 октября идёт запись на курс, который пройдёт с 29 октября по 27 ноября.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 122367 https://ilyabirman.ru/meanwhile/all/ui-course-frag-71/ Wed, 24 Aug 2022 11:06:02 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-71/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Запрещаю выравнивание по центру, и из-за этого части таблицы начинают хуже разделяться визуально. Как же это починить? Для этого нам понадобится теория близости! 3 минутки:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/TAg6cnGIsh4?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 71 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 4 февраля 2022 года.</p> <p>До 23 сентября идёт запись на курс, который пройдёт с 24 сентября по 23 октября.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 124088 https://ilyabirman.ru/meanwhile/all/ui-course-frag-67/ Tue, 05 Jul 2022 13:58:10 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-67/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Участник нарисовал аккуратный интерфейс заправки. Но мы делаем его ещё лучше, меняя некоторые мелочи. 9 минут:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/WqFfT7yDMJg?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> <p> 00:00 Превращаем вкладки слева в элемент выбора<br /> 03:34 Не выровнять ли кнопки цифровой клавиатуры с полем ввода?<br /> </p> </div> <p>Это фрагмент № 67 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 10 декабря 2021 года.</p> <p>До 22 июля идёт запись на курс, который пройдёт с 23 июля по 21 августа</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 125125 https://ilyabirman.ru/meanwhile/all/ui-course-frag-50/ Thu, 28 Oct 2021 23:21:17 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-50/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>В теории форм интерфейсного курса одна из мыслей такая: просто внешняя опрятность формы сильно влияет на ощущение простоты. А оно в свою очередь важно для конверсии. Тут небольшой фрагмент курса, где я навожу порядок в форме. 3 минуты:</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/oepQvJtNgUU?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> </div> <p>Это фрагмент № 50 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 24 марта 2021 года.</p> <p>До 7 ноября идёт запись на курс, который пройдёт с 13 ноября по 12 декабря.</p> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 125157 https://ilyabirman.ru/meanwhile/all/ui-course-frag-16/ Thu, 01 Oct 2020 11:09:37 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-16/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Фрагмент № 16 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 5 августа 2020 года. Покажите дизайнерам.</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/99o_4c7HTUk?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> <p> 00:00 Как визуализировать фичи стеклопакета<br /> 02:53 Общее впечатление от калькулятора окон<br /> 05:45 Важная штука: калькулятор сразу настроен на какое-то окно. Сразу есть пример<br /> 08:00 Проблема вёрстки: тяжёлое ниже лёгкого<br /> 08:40 Проблема вёрстки: сетка связала несвязанные вещи<br /> </p> </div> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> 125159 https://ilyabirman.ru/meanwhile/all/ui-course-frag-14/ Mon, 14 Sep 2020 13:48:44 +0500 Илья Бирман https://ilyabirman.ru/meanwhile/all/ui-course-frag-14/ <p><a href="https://ilyabirman.ru/meanwhile/">Илья Бирман</a>:</p> <p>Сегодня срыв покровов — показываю кое-что из-под капота Эгеи 2.10. Пришло время выложить очередной фрагмент моего онлайн-курса, а там я рассказывал ребятам, как Эгея 2.10 автоматически верстает этаж рекомендаций (это то, что последние пару месяцев вы видите тут под заметками).</p> <p>В общем, фрагмент № 14 онлайн-курса «Пользовательский интерфейс и представление информации». Записано на курсе 31 июля 2020 года. Покажите дизайнерам и разработчикам.</p> <div class="e2-text-video"> <iframe src="https://www.youtube.com/embed/tYJMrY5zWlo?enablejsapi=1" allow="autoplay" frameborder="0" allowfullscreen></iframe> <p> 00:00 Задача и примеры<br /> 01:35 Дизайн «раскладок» для разных случаев<br /> 04:29 Описание раскладок в коде<br /> 05:50 Автоматический выбор и оценка раскладок<br /> 07:47 Режим отладки<br /> </p> </div> <p><a href="http://bureau.ru/educenter/ui-online/" class="button buy-button big-button">Почитать о курсе</a></p> <p class="foot">Программа, отзывы, запись</p> <p>Кстати, с тех пор, как я это рассказывал на курсе, Эгея стала ещё умнее. Думаю, уже скоро дам попробовать всем.</p>