Нейронка бы молча сделала зелёный огонёк Я вот подумал дальше про зелёный огонёк. Представим, что задание добавить зелёный огонёк клиент даёт не дизайнеру, который потом идёт ко мне утверждать макеты, а сразу нейросети. Она послушно его добавит: аккуратно встроит с учётом правил дизайн-системы, применит какой-нибудь скилл чтобы красиво анимировать. Всё будет сделано на высшем уровне, и клиент подумает: ну всё, дизайнеры мне не нужны. Многие клиенты уже так и думают. Нейросеть вряд ли станет спрашивать, зачем этот огонёк вообще и не лучше ли решить проблему иначе. Нейросети не особо сопротивляются плохим задачам. Иногда предлагают другой способ решить обозначенную проблему, но когда в запросе уже есть готовое решение — «добавь зелёный огонёк» — они его и реализуют. Технически уже вполне возможно научить нейросеть сомневаться и спорить. Но я думаю, что такое поведение встраивать в них не будут, потому что оно не будет пользоваться спросом. Нейросеть, которая на каждую прямую просьбу задаёт вопрос, а не фигню ли ты придумал, будет ужасно бесить. Человек хочет быстрый результат, так что пойдёт попросит «нормальную, которая просто сделает и не трахает мозг». С людьми ровно то же самое! Я понимаю, что тоже раздражаю, когда вместо того, чтобы «просто сделать», начинаю докапываться до того, зачем меня о чём-то просят. Но мне за это как раз и платят. Модель работы со всеми этими сомнениями в задаче требует участия двух сторон. Клиент должен быть готов принимать твоё сопротивление, видеть в нём смысл, а ты должен иметь волю, чтобы это сопротивления оказывать, несмотря на дискомфорт (но и отключать, если это сейчас не к месту). Клиенты тоже не любят многочасовые обсуждения и согласования понимания задачи, но идут в это, потому что знают, что без этого хорошего результата не выйдет. Получается, что отличие в работе с нейросетью такое. К нейросети клиент должен сам прийти с явным приглашением к сопротивлению, иначе она будет просто делать, как говорят. А к дизайнеру клиент может просто прийти с задачей, но неожиданно для себя столкнуться с сопротивлением. И тут уже искусство дизайнера в том, чтобы хорошо провести переговоры и помочь клиенту увидеть, что его сопротивление неслучайно. Нейросеть, конечно, тоже может освоить переговоры, и наверняка даже более искусно, чем человека. Но тут мы приходим к тому, что для этого у неё должна быть точка зрения, она должна сама как-то хотеть: https://ilyabirman.ru/meanwhile/all/neuro-competition-2/ Но ей-то всё равно!

Стабильное меню на новом сайте У меня на сайте текущий пункт меню выделяется жирным. Обычно при таком дизайне возникают прыжки: жирное слово ведь чуть шире обычного, так что при переходах между разделами более правые пункты немного сдвигаются влево-вправо. Бывают редкие «униширинные» шрифты, где разные начертания имеют одинаковую ширину, но не ограничивать же выбор ими. Когда я открыл новый сайт на прошлой неделе, меню у меня прыгало, потому что я не успел докрутить, а открываться уже было пора. Но надо было решить эту проблему. Идея решения простая: каждый пункт меню должен всегда занимать столько места, сколько занимал бы, будь он жирным, даже когда на самом деле он не жирный. Но как это сделать? Можно написать скрипт, который бы как-то незаметно временно рисовал пункты жирными, измерял бы их, а потом жёстко расставлял бы пункты по стабильным позициям. При этом пришлось бы ещё отслеживать адаптивное изменение размеров шрифта при разных ширинах окна и перемерять. Напрограммировать такое с Кодексом — дело минутное, но это тяжеловесно и неэлегантно. Хочется без скрипта. Можно положить внутрь каждого пункта невидимую жирную копию текста, распорку. Это лишний элемент в разметке, тоже не идеально, но смириться можно. Я не нашёл решения совсем без изменения разметки, но зато нашёл, как обойтись атрибутом, без лишних элементов: слово, жирность которого нужно мерить, ставится в атрибут, а потом в ЦССе делается псевдоэлемент, контент которого берётся из этого атрибута. Так уже неплохо. Есть и ещё одна есть сложность: у меня же при наведении под пунктом изменяется цвет подчёркивания, и мне надо, чтобы это подчёркивание было ровно по длине пункта. Если же элемент с текстом растянется до ширины его жирной версии, подчёркивание станет торчать правее видимого конца самого текста, что коряво. Соответственно надо как-то так сверстать, чтобы подчёркнутая часть осталась по ширине видимого текста, а вокруг неё уже была обёртка по ширине жирного текста, которая бы влияла только на лейаут меню. При этом ради Фиттса область нажатия пункта меню у меня дотянута до середины отступа с соседним пунктом. То есть сама ссылка на самом деле больше и чем её обычный текст, и чем её жирный текст. И да, все эти отступы ещё и адаптивятся по-всякому. С адаптивом есть ещё и такой момент. Когда меню не влезает целиком, важно, чтобы ты хотя бы видел, что какие-то пункты ещё есть за пределами экрана. На сайте Бюро для этого давно работает фокус: если меню не влезает полностью, то расстояния между пунктами подкручиваются так, чтобы последний пункт гарантированно обрезался краем экрана, и тем намекал на продолжение. Это я тоже к запуску сделать не успел, но хотел: https://ilyabirman.ru/meanwhile/all/bureau-school-lecture-layout/ В общем, теперь всё распутал: атрибут, используемый ЦССом для измерения жирного текста, стоит у обёртки, а сам текст пункта меню стоит у элемента внутри. Любой пункт можно делать и жирным, и обычным, и подчёркивание при наведении всегда остаётся ровно под буквами. Кликать можно в отступ между пунктами, и ничего никуда не прыгает при переключении. Жирность как бы переезжает с пункта на пункт при переключении, но каждый из них остаётся на своём месте. И расстояние между пунктами растягивается так, чтобы всегда было видно, что есть ещё пункты за краем. Красота!

Как Артём Горбунов показал мне справочник Атабекова 1. Когда-то в начале моей работы в бюро, Артём Горбунов рассказал мне о справочнике Атабекова. Артём часто ссылался на него в контексте разных задач на представление информации: как расположить выноски на иллюстрации, как выбрать толщину линий или тип штриховки на диаграмме. Сначала у меня его даже не было, потом появился какой-то скан, и только спустя несколько лет я нашёл его в каком-то букинистическом магазине на окраине Москвы. И сразу сильно впечатлился. 2. В каждой статье — гора знаний, многие классно иллюстрированы примерами или объяснениями. Посмотрите, какая красота. 3. Особенно мне нравятся вот такой фарш, как справа, когда на иллюстрации тридцать (!) картинок, а в тексте они коротко прокомментированы. Это эталон, к которому я стремлюсь с нашим своим справочником: https://ilyabirman.ru/reference/ Хочется, чтобы там со временем появились все возможные элементы интерфейса и прочие детали с описанием преимуществ и недостатков.

🙃 Magnific выкатили новую модель для картинок Magnific One Что за модель в основе - не известно Но есть повод потестить: в Desktop до 15 октября будет безлимит Режимы: Draft даёт сетку из 8 или 16 вариантов для поиска идеи. Final генерирует по Brand Kit и показывает, соответствует ли картинка бренду. Правки: шрифт, цвета и текст меняются без перегенерации. Auto Layers раскладывает картинку на слои, Designer даёт полный контроль над векторами. По моим тестам модель показала себя хуже чем GPT 2,5, но все же результаты достойные, плюс низкая цена и возможность бесплатных правок подкупает Пишите, как модель вам, кидайте примеры что получается, интересно посмотреть @creadvice

Пользовательский опыт (UX) UX — это впечатление, которое человек получает от взаимодействия с продуктом: насколько всё понятно, удобно и приятно. Чем легче пользоваться сервисом, тем охотнее клиент остаётся и возвращается. Что формирует хороший UX? Минимум действий — чем быстрее пользователь достигает цели, тем лучше Быстрая загрузка — медленные платформы отталкивают Понятный интерфейс — всё должно быть логично и не вызывать вопросов Приятное оформление — гармоничные цвета, удобочитаемые шрифты и заметные кнопки увеличивают вовлечённость Компании вроде Airbnb или Notion инвестируют в UX, потому что довольные пользователи — это не только продажи, но и повторные визиты. Фаундер | Бизнес и Стартапы