#UI_ревью 9. Interactive Login Form

Работа: Outcrowd Сильная работа, которая вызывает вау-эффект, на деле довольно трудоёмкая для разработки, хотя выполнимая. + Без слов считываемая идея, что они следят за курсором, это даёт очень эмоциональный эффект «они меня видят». Такое уже было у Tunnelbear, но в этот раз выполнено более выразительно. + Эффект усиливается их реакцией на ситуацию: пароль неверный или видимый. Забавно отыграны такие эмоции как сочувствие, фрустрация, неловкость, и от этого мы начинаем сопереживать им обратно. + Мультяшный стиль с ярким применением принципов анимации Уолта Диснея. + Простые формы героев, при этом сами они все особенные благодаря исполнению лица, цветам и разнообразию форм. + Поскольку все движущиеся элементы локализованы в блоке слева, понятен механизм экспорта анимации Lottie из After Effects через Bodymovin. C анимацией по тригеру каждой ситуации проблем быть не должно. – Что будет сложно реализовать: движение каждой формы вроде зрачка, лица или рта придётся привязывать к курсору по отдельности, это существенная ручная работа. Дизайн настолько удачный, что его даже плагиатят. Если тебе понравился разбор, поддержи пост звездой. Так мне будет понятно, что такой контент тебе нужен. По теме: Анимация приложения для горных прогулок @slashdesigner #первые_шаги #UI_анимация

Посмотрите, что нашли!

В рубрике «Находка» мы делимся интересными инструментами, сайтами и приложениями, о которых знают единицы. → Библиотека интерфейсов с примерами различных анимаций. 🎙 Это большой цифровой архив UI/UX-анимаций и микроинтеракций из лучших приложений. Можно быстро отфильтровать примеры по паттернам, смотреть подборки по приложениям, разбирать сториборды и заглядывать в глоссарий с объяснениями паттернов. Сохрани в закладки — пригодится, когда захочешь оживить интерфейс. 😘
Изображение поста

Курс по UI-анимации снова доступен со скидкой! 🛍

Смотрите на эти анимации и думаете, что не сможете также? https://interfaceanimation.ru/">Освоить программу можно меньше чем за неделю. Вы будете готовы к тому, чтобы делать крутые микроинтеракции, делать живой эмоциональный дизайн, презентовать свои работы, и усилите портфолио. А также будете готовы к участию в официальных конкурсах Telegram. Автор: Денис Абдуллин, дизайнер интерфейсов с опытом 10+ лет (Альфа-Банк, Открытие Инвестиции, РБК и в студии из Сан-Франциско), автор канала Хороший интерфейс, и 8-кратный победитель конкурсов Telegram с упоминанием от Павла Дурова. ➡️ https://interfaceanimation.ru/">Узнать подробнее о курсе Что вы получаете: ✔️ Курс из 10 уроков 🔒 Доступ в закрытый чат с кураторами, автором и другими учениками 💬 Живую обратную связь + проверку работ от куратора на платформе и в закрытом чате 👑 Готовые работы в портфолио 💎 Полезные материалы по моушн-дизайну и анимации интерфейсов ⌛️ Помощь с установкой всех программ 🛡 Сертификат о прохождении 🔗 https://interfaceanimation.ru/
Запись лекции Антона Печерицы с Дизайн-выходных в Казани уже в сети!
Антон рассказывает о том, что такое эффектные UI-анимации, почему они так редко встречаются на рынке и почему дизайнерам интерфейсов обязательно стоит этому учиться. Смотрите, сохраняйте и комментируйте. 📱 Ютуб 📱 ВК Видео 💙 Рутуб
Запись лекции арт-директора Beta Disrupt® Антона Печерицы с Дизайн-выходных в Казани уже в сети!
Антон рассказывает о том, что такое эффектные UI-анимации, почему они так редко встречаются на рынке и почему дизайнерам интерфейсов обязательно стоит этому учиться. Смотрите, сохраняйте и комментируйте. 📱 Ютуб 📱 ВК Видео 💙 Рутуб
Библиотека ui анимаций
Ну что, отошли от майских праздников? Пора за работу!
Последние несколько месяцев выдались плотными по задачам, и времени на канал почти не остается. Но контент тем временем всё равно создаётся — пока в черновиках. Просто не успеваю собрать и оформить его в полноценные посты. Но всё обязательно будет — stay tuned, как говорится! Есть пара безумно крутых идей, и я очень надеюсь поделиться ими с вами этим летом. Кстати! В конце марта я начал в бете проводить регулярные практики по UI-анимации в After Effects — каждую пятницу утром. Начали с самого нуля, для тех, кто вообще не работал в AE: погружаемся в детали, изучаем инструменты, скрипты, эффекты, работу с композициями, масками и правильную организацию проекта. Ребята фигачат — и, кстати, у них все отлично получается! Изучают то, что просто так не нагуглишь: базу UI-анимации, которую я собрал за годы практики, ошибок и личного опыта. А я в процессе всё глубже погружаюсь в образовательную часть — ищу, как оптимальнее донести всю эту информацию. @uimotion
Изображение поста
Просто напоминаю, что завтра заканчивается скидка
Завтра заканчивается стартовая скидка на мой курс по анимации интерфейсов. Это курс для тех, кто хочет делать продвинутые UI-анимации в After Effects — от первого кадра до презентации в мокапе. ⚠️ interfaceanimation.ru Меня уже просили несколько человек сохранить цену завтра, так и есть, скидка до 9 мая, всегда имелось ввиду включительно, то есть до конца дня 9 мая. Потом будет уже по обычной регулярной цене. С нетерпением жду ваших отзывов!
#Вдохновение
Подборка ui анимаций с дрибла Подборка тут ➡️ UI/UX дизайнер
#Вдохновение
Подборка ui анимаций с дрибла Подборка тут Web Design Inspiration
Большой набор ui анимаций и микровзаимодействий для твоего вдохновения
Изображение поста
Большой набор ui анимаций и микровзаимодействий для твоего вдохновения
Изображение поста
#Вдохновение
Подборка ui анимаций с дрибла Подборка тут Design Awards
Большой набор ui анимаций и микровзаимодействий для твоего вдохновения
Изображение поста
Swiss Knife v1.2.2 (Win/Mac)
🛡 Swiss Knife — это группа из 20 инструментов, которые можно комбинировать в тысячах вариаций. Играйте с 4 группами, включая параллакс, интерактор, заполнитель и поддержку. Используйте его для любых проектов, анимации персонажей, видеомонтажа, шаблонов, UI/UX-анимации. Источник: Swiss Knife v1.2.2 💾 ССЫЛКА 💬 Комментарии ➡️КАНАЛ⬅️ #plugins #Swiss_Knife #After_Effects #free #бесплатно
🔗 Epic Easings
Визуальный справочник по CSS-анимациям с различными вариантами ускорения (easing). Полезный инструмент для дизайнеров и разработчиков, работающих с плавными переходами в UI. #анимация #CSS #UI #разработка #ресурсы Посмотреть 🔗
🔗 Code My UI
Коллекция креативных примеров анимаций и интерфейсов с готовым кодом. Полезный ресурс для дизайнеров и разработчиков, которые хотят быстро внедрить современные UI-решения в проекты. #UI #анимация #код #дизайн #интерфейсы Посмотреть 🔗
📺 Вебинары с дизайнерами
1. Дизайн карьера в новом мире [YouTube] 2. Из Чертаново в Лондон [YouTube] 3. Как написать письмо [YouTube] 4. Брендинг и CG, плоское и объемное [YouTube] 5. Koshta: дизайн для искусства [YouTube] 6. Беседа с CLAN [YouTube] 7. Эстетика дизайн-студий [YouTube] 8. FYD. Создание 3D-буквы. [YouTube] 9. Основы брендинга и дизайна [YouTube] 10. UI-анимация [YouTube] Продолжение в плейлисте на YouTube. #video #design
Изображение поста
Винегрет из инспирации по разной UI-анимации