Создаем веб-анимацию.

🎨 Half Rez 2025 Light and Life. Захватывающий своей красотой авторский проект американского дизайнера Кевина Готро. В нём он размышляет о бренности бытия на фоне постоянной гонки технологий и стресса в творческой индустрии.

(Must see 👀) для дизайнеров, чтобы не остаться

без клиентов и работы в 2026, даже если ты новичок Что происходит в дизайне прямо сейчас? 90% работают в хаосе — выгорают, бегают из проекта в проект и боятся остаться без клиентов Я полгода тестировала новые фишки и инструменты на себе. Смотрела, что работает на фоне изменений рынка – и сейчас записываю полноценный урок, который собирает всё в одну систему 50+ слайдов, которые повлияют на ваш следующий год: 1️⃣ твердые навыки, необходимые дизайнеру в 2026 году помимо базы, также поговорим про доп.компетенции (UX, нейросети, анимации, авторский стиль) 2️⃣ клиенты/трудостройство здесь даже не буду расписывать что подготовила — но скажу, что столько не дают даже на платных обучениях если у вас сейчас трудности с клиентами или есть какие-либо вопросы — уверена, мой урок закроет их 3️⃣ масштабирование и стратегия развития в долгосрок на эту тему мало кто ставит ставку именно в дизайне — но я покажу стратегию развития вдолгосрок в этой нише ↑ без этого в 2026 будет сложно остаться востребованным дизайнером Урок дропну скоро. Следите за обновлениями :) 🔥 — если ждете
Изображение поста

Как запечь экспрешены и зачем это нужно 🍳

Lottie не поддерживает эффекты и экспрешены, но их можно превратить в ключи – это называется “запекать” анимацию (bake) Простой пример: Если у вас есть экспрешен loopOut("cycle"), нажмите ПКМ → Keyframe Assistance → Convert Expressions to Keyframes – в каждом кадре появится ключи, повторяющий анимацию экспрешена. Теперь такую анимацию можно использовать в Lottie. Существуют плагины, которые действуют как экспрешенны на параметре path, позволяя его изгибать, пускать волны или другие вторичные действия. Например, плагин Crazy Shapes позволяет создавать волны, изгибы, расстягивания на path, которую потом можно запечь. В гифке поста, тело медведя “растекается” благодаря эффекту waves on path. Вручную добиться такой плавности было бы сложно. ❗️ Минус запекания – увеличивается вес файла, так как ключи ставятся в каждом кадре. Решения этой проблемы: 1. Перед запеканием снизить FPS (например, до 12-30), а потом вернуть 60 – это уменьшит количество ключей, но снизит плавность. 2. Удалить лишние ключи вручную, оставив только нужные. 3. Стандартный инструмент smoother. Уменьшает количество ключей, сохраняя анимацию, но не работает на path. Это продвинутая техника, но не заменяет умение анимировать вручную. Инструменты важны, но главное – насмотренность и понимание, какого эффекта вы хотите достичь💪 Есть и другие плагины под разные задачи, Хороший пост про плагин Tilda для анимации волн. #анимация
Моя худшая презентация 💩
2017 год, я работаю в банке. PowerPoint выпускает новый вид анимации — трансформацию (morph) и я очень хочу применить её на реальном проекте. И вот один из руководителей говорит, что нужна КРУТАЯ презентация для выступления. Защита очень важного проекта, бюджеты в сотни миллионов рублей. Я неделю дизайню в поте лица и вот мой шедевр готов. На тот момент я искренне гордился этой презентацией. Честно оцените в комментариях визуал от 0 до 10. Преза под выступление на экране в переговорной комнате. 🚨 На тот момент у меня было 7 лет опыта в дизайне и высшее профильное образование (кафедра инфографики, журфак МГУ) Я всегда угараю, когда мне пишут "опытные" дизайнеры что-то типа: "Ким, я уже 5-6-7-8-10 лет занимаюсь дизайном, зачем мне идти на какие-то курсы?". Да не ходи. Пусть молодые и голодные у тебя всё отберут. Давайте замутим челлендж. Прикрепляю вам ссылку на файл моей презентации (Первые 4 слайда) и описание, что там к чему. Переделывайте мою презу и присылайте гифку с анимацией в комменты + пишите, сколько у вас лет (или месяцев) опыта в дизайне. 🗿 Кстати, на момент создания этого шедевра я зарабатывал как дизайнер порядка 150к в месяц. Но в основном за счет того, что умел грамотно общаться с клиентами \ руководителями и работать со смыслами. Что и легло в основу нашей школы.
Многие продуктовые команды не придают важности реализации UI даже в зрелых продуктах и компаниях, считая, что плохо свёрстанный UI никак не влияет на метрики. На первый взгляд кажется, что если продукт действительно закрывает определённую потребность пользователей, неважно, как он свёрстан. И я здесь даже не говорю про эмоциональную часть с анимациями, иллюстрациями и прочим. В рамках поста ограничусь лишь соответствием реализации на фронтенде тому, что дизайнер спроектировал в Фигме.
В сфере B2C-продуктов, где рынок перенасыщен конкурентами, близкими между собой и в ценах и в ассортименте, на выбор клиента начинают влиять дополнительные аспекты. Как UI влияет на метрики? 🔵Доверие: Customer Acquisition Cost Для когорты новичков, не имеющих опыта с продуктом, особенно важно, как он выглядит — «встречают по одёжке». Когда пользователь взаимодействует с некачественно свёрстанным интерфейсом у него подсознательно формируется негативное ощущения. Повышается вероятность ухода к конкуренту с более качественной реализацией UI при прочих равных. Учитывая, что каждый привлечённый пользователь стоит компании денег, каждый ушедший клиент — это прямая финансовая потеря. 🔵Удобство и порядок: Conversion Rate Качественный UI делает интерфейс интуитивно понятным и простым в использовании, что снижает когнитивную нагрузку и помогает пользователю быстрее достигать своих целей (Time On Task), в итоге повышая конверсию в покупку. 🔵Конкурентоспособность: Retention Нельзя полноценно конкурировать, не выйдя хотя бы на общий уровень качества, не говоря о том, чтобы стать на уровень выше. Став продуктом, UI которого безупречен также как у конкурентов из первой лиги, можно повысить CSAT, NPS, а вместе с этим и возвращаемость с удержанием. 💦💦 Вопреки мнению многих продактов, оунеров и разработчиков, то, как выглядит бренд и его промо-материалы, как выглядит UI продукта в проде, часто становится важным, а иногда и решающим фактором выбора пользователей и имеет высокое влияние на экономику продукта.
Изображение поста
Анимация за 5 шагов
Сравнение анимаций жидкого стекла из презентации и в последней версии iOS
Поздравляем всех, кто попал в шорт-лист Dprofile Award 2025!
В этом году проекты распределились равномерно по разным номинациям. Нигде не было лёгкой борьбы. Жюри нужно было выбрать лучших из десятков кандидатов. Посмотреть шорт-листы можно по ссылкам: Основные — «Интерфейсы»;«Иллюстрация»;«Маркетинг»;«Анимация»;«Брендинг»;«Графика»;«3D». Спецноминации — «Логотипы» от SLOY. «Продуктовый дизайн» от «Фанк.». «UI-дизайн» от Perasperadastra.«Нейросети» от SPELLLENS. «3D-визуализация» от Today. «Мерч» от OTVET. Если ваш проект не попал в шорт-лист, не расстраивайтесь. Вы сможете улучшить его и подать на премию в следующем году. По итогу конкурса мы опубликуем список рекомендаций, чего не хватило некоторым проектам. Победителей объявим 15 ноября на церемонии награждения Dprofile Award, которая пройдёт в рамках фестиваля. Сбор гостей — в 16:30. Начало церемонии награждения — в 17:00. Не пропустите главное дизайн-событие года! Купить билет на Dprofile Fest & Award 2025
Изображение поста
Поздравляем всех, кто попал в шорт-лист Dprofile Award 2025!
В этом году проекты распределились равномерно по разным номинациям. Нигде не было лёгкой борьбы. Жюри нужно было выбрать лучших из десятков кандидатов. Посмотреть шорт-листы можно по ссылкам: Основные — «Интерфейсы»;«Иллюстрация»;«Маркетинг»;«Анимация»;«Брендинг»;«Графика»;«3D». Спецноминации — «Логотипы» от SLOY. «Продуктовый дизайн» от «Фанк.». «UI-дизайн» от Perasperadastra.«Нейросети» от SPELLLENS. «3D-визуализация» от Today. «Мерч» от OTVET. Если ваш проект не попал в шорт-лист, не расстраивайтесь. Вы сможете улучшить его и подать на премию в следующем году. По итогу конкурса мы опубликуем список рекомендаций, чего не хватило некоторым проектам. Победителей объявим 15 ноября на церемонии награждения Dprofile Award, которая пройдёт в рамках фестиваля. Сбор гостей — в 16:30. Начало церемонии награждения — в 17:00. Не пропустите главное дизайн-событие года! Купить билет на Dprofile Fest & Award 2025
Изображение поста
Как представляет себе химическую промышленность человек, который с нею не знаком? Скорее всего так: заводские трубы, жёлтые костюмы и мрачная табличка «опасные отходы» .
Но на деле это одна из самых технологичных и крутых отраслей в стране. Здесь сочетаются IT, инженерия, экология, инновации и большие команды, которые двигают целые регионы вперёд. Мы в aic сделали сайт для КАО «Азот» и увидели другую сторону тяжёлой промышленности — в ней много чистоты, размаха и интеллекта. Чтобы показать индустрию без стереотипов, мы нашли визуальные и смысловые опоры. Из них сложился облик проекта — расскажем о нём подробнее 👇 Если смотреть со стороны, химическая промышленность кажется закрытой и непонятной. ➡️ Мы понимали: в наших силах работать с цифровым образом компании — значит, важно, чтобы сайт не пугал сложностью, а наоборот, вызывал доверие и интерес у партнёров и потенциальных сотрудников. Чтобы переосмыслить образ отрасли, мы сформулировали четыре опорных принципа: ☀️ Чистый и экологичный — стерильность как символ точности, ответственности и бережного отношения к природе. ☀️ Понятный и дружелюбный — интерфейс и язык, которые не требуют «переводчика» даже у тех, кто далёк от химии. ☀️ Динамичный — лёгкое движение элементов и анимации, создающие ощущение современности и технологичности. ☀️ Масштабируемый — система, из которой можно вырастить будущие цифровые сервисы группы компаний. Редизайн превратился в цифровой язык бренда: через визуал, тексты и интерфейс компания рассказывает о химии ясно и открыто. Этот кейс ещё раз доказал: хороший дизайн — это способ говорить на языке смысла. Посмотреть кейс можно на Behance и на DProfile.
Изображение поста
🎨 The Tricky’s Secret. Вдохновляющий короткометражный мультфильм с очень классной сюрреалистичной стилизацией и отличной режиссурой.
Прокачиваем навыки по 2D Animation и Motion Design
@pprostudy - разбираем на какие нажимать кнопки в Premiere Pro, чтобы на выходе был крутой видеоролик @a_study - узнаем, как создаются потрясающие работы по анимации и спецэффектам в популярном приложении After Effects
50 промтов для генерации роликов с примерами получившихся видео. Есть сцены из фантастических боевиков, пластилиновая анимация, театральные представления, рекламные ролики и клипы из LEGO-вселенных.
Изображение поста
🎓 Бесплатный практикум для новичков в презентациях
Простая программа на 5 дней, без сложных терминов и дизайнерских заморочек. ✅ Подойдёт полный новичкам, кто делает презентации для себя \ для работы. Опытным не приходить! Ну, разве что просто потусить в чате и повы@бываться)) 📅 Старт 3 ноября. В пятницу покажу результаты прошлого потока. Весной проводили, был ажиотаж и многие просили повторить. Просили — делаем 🥸 📘 Программа практикума: День 1. Урок в записи. Кому вообще нужно уметь делать презентации? Как одна презентация может изменить карьеру и доход. Почему 90% презентаций проваливаются? День 2. Урок в записи. Дешёвые и дорогие презентации — в чем отличия. 3 уровня дизайна презентаций. Метод Воронина. Практика, которая прокачает ваш вкус и дизайн-чутьё. День 3. Урок в записи. Как делать ВАУ-презентации, вызывающие восхищение. Практика. Создадим свой первый профессиональный слайд за 15 минут. День 4. Прямой эфир. Пошаговый план как заработать первые деньги на презентациях. Где за презы платят по 100 тысяч в месяц и как туда попасть. Практика. Создаём презентацию с помощью нейросетей за 5 минут. День 5. Прямой эфир. Как заработать на анимации и быстро получить первых клиентов. Практика. Создаём профессиональную анимацию за 5 минут. 🎁 В конце получите 3 шаблона презентаций, за каждую из которых реальные клиенты платили по 100 000 рублей. 250 мест бесплатно, потом 5000 ₽. 👉 Забирайте место, пока ещё есть.
Изображение поста
Как вам своя уникальная для каждой категории анимация лайка на YouTube?
Мы обновили профтест
Переходите на сайт школы, чтобы определить свои сильные стороны, узнать, какая профессия вам подходит и в каком направлении искать любимое дело. Профтест займет всего 7 минут. Тем, кто пройдет его, откроем курс о самореализации в карьере и подарим доступ ко второй профессии при покупке первой. → Пройти тест, довериться судьбе. А для тех, кому этот мир абсолютно понятен: → «Иллюстратор»«2D-анимация» «3D-дизайнер»
Изображение поста
Создаем анимацию уведомлений.
Анимация слайдера в Figma
Плюс к уровню на Dprofile
Опубликовал новый проект будущего сайта нашего менторского клуба. Вот-вот будет в онлайне, уже очень жду. Программа, информация, условия — всё скоро будет там. Верстка — Алёна Спирина. Фото и видео генерации — SPELLLENS. 3D — Renderteam. Анимации подачи — Марина Талипова. Если хотите присоединиться в клуб на новый поток 2026 года — пишите лично на @alaguta. Я вернусь по факту запуска с условиями входа. Проект: https://dprofile.ru/case/145113/plius-k-urovniu-2026 Приятного просмотра!
Изображение поста