Показываю, как с пустого листа нарисовать и анимировать модный переключатель дневной и ночной темы из оригинального видео "Дизайнер VS Программист". В следующем видео цикла этот элемент будем верстать, а в заключительном видео подводить итоги, насколько такие элементы вообще нужны и кому в действительности тяжелей живётся. :) Таймлайн: 00:00 - Вступление 00:24 - Оригинальное видео, с которого будем срисовывать 01:31 - План всего цикла на эту тему 02:10 - А зачем вообще это делать или смотреть за этим? 04:02 - Начинаем рисовать, рисуем тело компонента 05:06 - Про 8px сетку 06:34 - Про величину скругления 07:16 - Рисуем облака 08:15 - Размещаем облака поверх тела компонента 10:34 - Рисуем солнышко с тенями 14:31 - Тени тела компонента 15:32 - Блики (волны) от солнца 18:02 - Начинаем ночную версию компонента, рисуем луну 18:40 - Рисуем звёзды 19:50 - Создаём компонент с двумя вариантами 21:24 - Создание взаимодействия в режиме презентации 21:57 - Делаем базовую анимацию изменения состояния 23:26 - Добавляем понтов к анимации облаков и звёзд 26:30 - Добавляем понтов к анимации луны и солнца 29:36 - Ура. Итоги и заключительное словоблудие Ссылки из видео: Контур.Гайды:
Оригинальное видео гуглится по запросу "Дизайнер VS Программист" Скачать исходник документа в Figma:
Автор: Github:
Telegram:
--- Music: Bensound.com/royalty-free-music Artist: Benjamin Tissot License code: VXDCSXKLDBEKJLLB
