Не существует единого способа решения проблем с интерфейсами. В этой серии мы бросим вызов себе и друг другу, чтобы найти множество способов решения проблем интерфейса и расширить разнообразие наших навыков.
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk создает широкую цветовую палитру с помощью okLCH, попутно проверяя доступные цветовые пары, в...

Думаем о том, как решить научно-фантастический 3D-текст

В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk придаёт #CSS эффект 3D-текста из классического научно-фантастического фильма, делая его интерактивным для прокрутки. По...
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk превращает группу переключателей в группу переключателей изменения выравнивания текста. Узнайте, как протестировать доступ...
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk создает эффект кибер-глюка с помощью CSS-путей и преобразований.
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk развлекается, создавая физические эффекты пользовательского интерфейса с помощью пользовательских свойств CSS, запроса кадра анимации и...
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk создает анимированную стопку карточек, используя источник преобразования, сетку и :has().
В сегодняшнем нашумевшем конкурсе GUI Challenge @AdamArgyleInk в реальном времени кодирует CSS-переходы клип-путей, демонстрирует несколько крутых эффектов и раскрывает ошибки. Я...
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk создает всплывающую подсказку с пользовательским элементом (без веб-компонента!), :has(), преобразованиями и логическими реквизитами...
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk воссоздает классическую иллюзию с помощью CSS.
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk рассказывает о функциях и аспектах компонента карусели: адаптивное оформление тем, адаптация к различным пользователям...
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk создает пару плавающих кнопок действий (FAB) и рассказывает о вопросах UX и CSS...
В сегодняшнем конкурсе GUI Challenge @AdamArgyleInk стилизует все различные типы веб-кнопок с помощью пользовательских свойств и :where() для светлого/темного...
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk показывает, как визуально улучшить элемент диалога, сохраняя при этом доступность и интернациональность...
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk показывает, как стилизовать встроенный элемент прогресса и как реализовать отличный UX-интерфейс чтения с экрана, ли...
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk делится мыслями о том, как создать адаптивный значок с помощью SVG. SVG не только предоставляет бесконечные...
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk делится мыслями о том, как создать компонент переключения тем. Часто веб-сайт позволяет переключаться...
В сегодняшнем выпуске GUI Challenge @AdamArgyleInk делится мыслями о том, как создавать всплывающие уведомления, неинтерактивный и пассивный компонент пользовательского интерфейса, который можно доказать...
В сегодняшнем выпуске GUI @AdamArgyleInk делится своими мыслями о том, как создать 3D-меню видеоигры, которое адаптируется к цветовым предпочтениям ОС,...
В сегодняшней задаче по графическому интерфейсу я поделюсь своими мыслями о том, как предоставить пользователям возможность множественного выбора. Чтобы продемонстрировать множественный выбор, я подготовил фильтр...
В сегодняшней задаче по графическому интерфейсу я поделюсь своими мыслями о том, как решить проблему с разделенными кнопками. Основной компонент для конденсированных интерфейсов, он позволяет легко...
В сегодняшней задаче по графическому интерфейсу я делюсь своими мыслями о том, как решить проблему переключения. Крошечный, насыщенный UX компонент, который в конечном итоге стал одним из самых ...
В сегодняшнем задании по графическому пользовательскому интерфейсу мы создаем компонент хлебных крошек… с изюминкой! Вместо линейного списка ссылок эта хлебная крошка составляет...
В сегодняшнем задании по графическому интерфейсу мы создаем темные, светлые и тусклые цветовые схемы с помощью HSL. CSS работает во всех современных браузерах, устанавливает...
В сегодняшнем выпуске GUI @Adam Argyle делится мыслями о том, как создать в Интернете возможности встроенной прокрутки, которые будут минимальными и отзывчивыми...
В сегодняшнем соревновании по графическому интерфейсу @AdamArgyleInk будет отвечать на ваши комментарии в течение первых 30 минут после выхода эпизода. Соединять...
В сегодняшнем задании по графическому интерфейсу мы создадим и продемонстрируем страницу динамических настроек с ползунками и флажками. Наша страница настроек отзывчива, поддержка...
В сегодняшнем задании по графическому интерфейсу мы создаем компонент вкладок с некоторыми действительно интересными функциями, о которых вы, возможно, даже не задумывались. Наши вкладки со...
Мы попросили сообщество создать компонент боковой навигации по-вашему, и вы все справились! Посмотрите материалы:
В сегодняшней задаче по графическому пользовательскому интерфейсу мы создаем адаптивный и доступный пользовательский интерфейс с выдвижной боковой навигацией, используя CSS и JS. Сиденав работает...
Мы провели стресс-тестирование 5 различных методов центрирования CSS, и я предложил вам предложить свои собственные. Привет Крису Койеру из CSS-Tricks...
Вы видели, как я строю истории по-своему, и я призвал вас всех строить их по-своему. Благодарим @Geoffrich_ за его публикацию в Твиттере! Делать...
В сегодняшнем задании мы проводим стресс-тестирование 5 различных методов центрирования CSS. Посмотрите, какие методы должны занять место в вашем поясе для инструментов...
Добро пожаловать на GUI Challenges, где я создаю интерфейсы по-своему и призываю вас делать это по-своему. Объединив наши творческие умы, мы...