На конференции SIGGRAPH 2021 команда GoogleAI представила систему, которая способна сменить фон портрета с корректным освещением основного объекта. Для этого нужны две фотографии — исходник с портретом и картинка с новым окружением. С видео технология тоже справляется, так что теории это позволит в будущем здорово экономить бюджет при продакшене инди-фильмов. Ну, или сделать супер-реалистичный фон в Zoom.

Пока что у Total Relighting есть несколько проблем вроде плохого распознавания одежды и трудностями с освещением глаз, но даже в текущем виде выглядит впечатляюще.

Технические подробности тут: https://augmentedperception.github.io/total_relighting/

Видео тут: https://youtu.be/KeebkkaZhhI

​​Занимаетесь веб-программированием? Канал @drbrain4web - источник полезной информации не только для новичков, но и для опытных разработчиков.

Здесь вы найдете:

1. интересные заметки,
2. кейсы,
3. тренды,
4. актуальные статьи.

Каждый день мы размещаем для Вас материалы про frontend, backend, инструменты разработчика и многое другое на канале dr.Brain

🧰 Free Streamline illustrations — набор из 80 ярких иллюстраций

Интересное решение переключателя светлой и темной темы.

www.reed.be

fit-content и fit-content(). Питер-Пол Кох показывает, как задавать элементам размеры, зависящие от их содержимого, и чем отличается задание размера для элементов внутри гридов.

https://www.quirksmode.org/blog/archives/2021/04/fitcontent_and.html

🚀 Как создавать доступные цифровые продукты

Первая цель хорошего UX writing – это юзабилити. Прежде чем сделать цифровые продукты индивидуальными, они должны приобрести смысл. Это означает, что ваши слова должны работать для всех ваших пользователей.

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

Об этой истине и UX-writing: Как создавать доступные цифровые продукты

UX/UI Designer

📖 Британский дизайн
🖋 Серия книг "Как Надо"

Английские дизайнеры формируют целую отрасль. Это инфраструктура из клубов, изданий, премий, студий. Поэтому монография состоит из четырех разделов: контекст, школы, студии и среда. Лучшие британские дизайнеры рассказали об истории, настоящем и будущем графдизайна. Куда пойти учиться, где брать вдохновение, как проводить свободное время и как заработать.

WinBox, библиотека для реализации оконных интерфейсов в вебе → https://nextapps-de.github.io/winbox/

Sucrase, альтернатива Babel для ускорения транспиляции в режиме разработки: транспилирует код с прицелом на современные браузеры, работает в 20 раз быстрее Babel → https://github.com/alangpierce/sucrase

Подробное руководство по кастомным свойствам: именование, возможные значения, применение каскада, фолбэки, вычисления, задание типов, трюки и взаимодействие с JavaScript.

https://css-tricks.com/a-complete-guide-to-custom-properties/

Неочевидная особенность регулярных выражений в JavaScript: как не сломать код, вынося регулярки в переменные → https://forweb.dev/ru/blog/stateful-regexps/

Ley - инструмент для миграций баз данных, не привязанный к драйверу

- Поддерживает postgres, pg, better-sqlite3, sqlite, mysql, mysql2 из коробки
- Если нужен драйвер, который не поддерживается, его можно добавить через класс Driver
- Не имеет зависимостей
- Любую миграцию можно откатить
- Не изобретает велосипед и использует интерфейс выбранного драйвера
- Можно расширять функционал Ley CLI для написания своих скриптов миграции

#jslib #nodejs #backend #webdev #migrations #pg #javascript #sqlite #mysql #sql

📦 Clever – Dashboard UI Kit

Современный UI Kit для Figma, профессионально разработанный Webpixels

Скачать бесплатно можно по подписке в нашем боте.

💾 Скачать (бесплатно) | 💸 Купить (39$)

Dezzigners #file @ui8_bot

Верхняя или боковая панель навигации: что лучше подходит для вашего продукта?

Что говорят исследования?
При выборе макета навигации для вашего приложения обычно необходимо определить положение первичной, вторичной и третичной иерархии навигации. Исследование Дженнифер Роуз Кингсбург «Сравнение трехуровневых навигационных структур меню для веб-дизайна» показало, что расположение основной навигации с левой стороны дает множество преимуществ. В 2 исследованиях (по 16 пользователей в каждом) измерялось время, предпочтения и ошибки выбора навигации. Здесь вы можете найти краткое изложение этого исследования. Имейте в виду, что оно было проведено 17 лет назад, и за это время парадигмы дизайна значительно изменились.

Панель навигации слева легче сканировать

Исследования движения глаз показывают, что люди просматривают веб-страницы по F-образному паттерну. Поэтому верхняя, и левая панели навигации соответствуют этому паттерну. Панель навигации слева облегчает вертикальное направление сканирования (списки), что значительно увеличивает скорость, а также требует меньшего количества визуальных фиксаций, поэтому мы можем видеть несколько навигационных ссылок одновременно. (Боковая панель навигации может быть расположена справа для систем письма справа-налево)

Верхняя панель навигации экономит место
Если мы посмотрим на обычные экраны ноутбуков и ту часть, которую занимают компоненты навигации, левая навигация часто будет занимать в 3 раза больше места, чем верхняя. Добавьте к этому немного пространства, зарезервированного для заголовка, поиска или других элементов, таких как уведомления или профиль. Левая панель навигации может легко занять 25% места на странице. Сворачивание боковой панели для экономии места не всегда будет работать, так как вы не можете постоянно размещать длинные метки, а навигация только с помощью иконок будет слишком сильно нагружать память пользователя.

Случаи неудачного перехода на боковую панель навигации
Редизайн навигации – это всегда сложная задача. Пользователи привыкают к навигации, особенно когда используют ваш продукт ежедневно. Даже небольшие изменения в навигации могут запутать их. Независимо от новой кривой обучения, некоторые случаи, такие как переход навигации Jira Cloud на боковое меню, вызвали волну негативной реакции со стороны пользователей. 
Когда Jira опросила часть пользователей, более 95% первых (из 350) отдали предпочтение «старой» верхней панели навигации.

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

Выбор навигации будет зависеть от вашего контекста
Верхняя панель навигации
Занимает мало места и самое видное место на странице. Хорошо работает, когда элементов навигации не слишком много. Рассмотрите возможность использования верхней панели навигации для малых, средних и крупных веб-сайтов, электронной коммерции и веб-приложений, не имеющих иерархической структуры.
Боковая панель навигации
Поддерживает продукты с большим количеством навигационных ссылок, легко масштабируемых и настраиваемых. Рассмотрите возможность использования боковой панели навигации для сложных приложений и веб-сайтов, приложений администратора, настольных приложений и продуктов для управления файлами / контентом, где пользователи могут настраивать меню и нуждаются в структуре дерева / папки.

Источник

Sati Taschiba: «Как я выиграла Red Dot Design Awards в двух категориях и другие 11 дизайн награды в 24 категориях…»
https://designpub.ru/9762bcf7be04