Натхнення
Круті кнопки, анімації та стилі, які можна прямо зараз потягти у свій пет-проєкт.
1 Основи смаку
Чому ШІ-дизайн виглядає шаблонно і як це виправити
Чому ШІ-дизайн сайтів виглядає однаково і дешево: дефолтний градієнт, безликий шрифт, текст по центру, емодзі. І 4 принципи смаку, які це лікують.
Колір і контраст в інтерфейсі: палітра та темна тема
Палітра інтерфейсу без болю: один-два акценти плюс нейтральні, контраст тексту 4.5 до 1, і чому темна тема - це теплий сірий, а не чорний фон.
Шрифтові пари і сітка: типографіка для новачків
Як обрати шрифт, зібрати робочу шрифтову пару, побудувати драбинку розмірів та ієрархію заголовків і посадити все на сітку з єдиним кроком відступів. На пальцях, для новачків.
2 Деталі, що вирішують
Гарні кнопки та ефект скла: як зробити дорогий інтерфейс
Як зробити гарну кнопку та ефект liquid glass: форма, мʼяка тінь, контур, стани hover і active, розмиття фону. Плюс готові брифи для нейромережі.
Мікроанімації та переходи в інтерфейсі: таймінг, easing, амплітуда
Мікроанімації та переходи в UI: як таймінг, плавність (easing) і амплітуда роблять інтерфейс живим. Розбираємо зворотний звʼязок, появу елементів і доступність.
Живі фони та градієнти: як оживити фон сайту
Живі фони та градієнти для сайту: радіальне сяйво, mesh-градієнт, повільний рух і зерно. Як оживити фон і не перебрати з ефектами.