alfaitstudio
Услуги
  • Интерактивная видеостудия
    • Съёмка в видеостудии с прозрачной доской
    • Проведение онлайн-трансляций и вебинаров
    • Съёмка видео для соцсетей
    • Съёмка видео обзоров/распаковок/анпакингов
    • Съёмка онлайн-курсов
    • Съёмка поздравлений
  • Разработка сайтов на CMS
    • Создание сайтов
    • Создание интернет-магазинов
    • Создание маркетплейсов
    • Создание лэндингов/посадочных страниц
  • Продвижение и реклама
    • Поисковое продвижение и оптимизация
    • Настройка и ведение контекстной и таргетированной рекламы
    • Продвижение в социальных сетях
    • SEO аудит сайта
    • Продвижение интернет магазина
    • Продвижение промышленных и производственных предприятий
  • Графика и дизайн
    • UX/UI дизайн сайтов и приложений
    • Создание 3D моделей
    • Разработка фирменного стиля
    • Создание логотипа
  • 1C - установка и оптимизация
    • Установка и оптимизация 1С сервера
    • Устранение ошибок 1С
    • Создание и настройка обмена данными между 1С и 1С Битрикс
  • Разработка мобильных приложений
    • Разработка приложений для iOS и Android
  • Видеопродакшн
    • Съёмка видеоподкастов
    • Рекламные видеоролики
Пресс-центр
Проекты
  • Дизайн
Команда
Компания
  • О компании
  • Команда
  • Сертификаты
  • Реквизиты
  • Пользовательское соглашение
  • Политика обработки персональных данных
  • Публичный договор-оферта
  • Правила работы в студии
  • Как оставить отзыв
Контакты
Ещё
    Задать вопрос
    Мой кабинет
    Корзина0
    +7 (800) 555-26-23
    Заказать звонок
    88005552623@mail.ru
    Тюмень, ул. Ленина 2а, ТРЦ Панорама, 6 этаж 603 офис
    • Вконтакте
    • Telegram
    • YouTube
    • Одноклассники
    • Whats App
    • Viber
    0
    +7 (800) 555-26-23
    Заказать звонок
    alfaitstudio
    Услуги
    • Интерактивная видеостудия
      Интерактивная видеостудия
      • Съёмка в видеостудии с прозрачной доской
      • Проведение онлайн-трансляций и вебинаров
      • Съёмка видео для соцсетей
      • Съёмка видео обзоров/распаковок/анпакингов
      • Съёмка онлайн-курсов
      • Съёмка поздравлений
    • Разработка сайтов на CMS
      Разработка сайтов на CMS
      • Создание сайтов
      • Создание интернет-магазинов
      • Создание маркетплейсов
      • Создание лэндингов/посадочных страниц
    • Продвижение и реклама
      Продвижение и реклама
      • Поисковое продвижение и оптимизация
      • Настройка и ведение контекстной и таргетированной рекламы
      • Продвижение в социальных сетях
      • SEO аудит сайта
      • Продвижение интернет магазина
      • Продвижение промышленных и производственных предприятий
    • Графика и дизайн
      Графика и дизайн
      • UX/UI дизайн сайтов и приложений
      • Создание 3D моделей
      • Разработка фирменного стиля
      • Создание логотипа
    • 1C - установка и оптимизация
      1C - установка и оптимизация
      • Установка и оптимизация 1С сервера
      • Устранение ошибок 1С
      • Создание и настройка обмена данными между 1С и 1С Битрикс
    • Разработка мобильных приложений
      Разработка мобильных приложений
      • Разработка приложений для iOS и Android
    • Видеопродакшн
      Видеопродакшн
      • Съёмка видеоподкастов
      • Рекламные видеоролики
    Пресс-центр
    Проекты
    • Дизайн
    Команда
    Компания
    • О компании
    • Команда
    • Сертификаты
    • Реквизиты
    • Пользовательское соглашение
    • Политика обработки персональных данных
    • Публичный договор-оферта
    • Правила работы в студии
    • Как оставить отзыв
    Контакты

      Видеостудия

      Разработка сайтов

      Дизайн и графика

      1С - установка и оптимизация

      Реклама и продвижение

      alfaitstudio
      Услуги
      • Интерактивная видеостудия
        Интерактивная видеостудия
        • Съёмка в видеостудии с прозрачной доской
        • Проведение онлайн-трансляций и вебинаров
        • Съёмка видео для соцсетей
        • Съёмка видео обзоров/распаковок/анпакингов
        • Съёмка онлайн-курсов
        • Съёмка поздравлений
      • Разработка сайтов на CMS
        Разработка сайтов на CMS
        • Создание сайтов
        • Создание интернет-магазинов
        • Создание маркетплейсов
        • Создание лэндингов/посадочных страниц
      • Продвижение и реклама
        Продвижение и реклама
        • Поисковое продвижение и оптимизация
        • Настройка и ведение контекстной и таргетированной рекламы
        • Продвижение в социальных сетях
        • SEO аудит сайта
        • Продвижение интернет магазина
        • Продвижение промышленных и производственных предприятий
      • Графика и дизайн
        Графика и дизайн
        • UX/UI дизайн сайтов и приложений
        • Создание 3D моделей
        • Разработка фирменного стиля
        • Создание логотипа
      • 1C - установка и оптимизация
        1C - установка и оптимизация
        • Установка и оптимизация 1С сервера
        • Устранение ошибок 1С
        • Создание и настройка обмена данными между 1С и 1С Битрикс
      • Разработка мобильных приложений
        Разработка мобильных приложений
        • Разработка приложений для iOS и Android
      • Видеопродакшн
        Видеопродакшн
        • Съёмка видеоподкастов
        • Рекламные видеоролики
      Пресс-центр
      Проекты
      • Дизайн
      Команда
      Компания
      • О компании
      • Команда
      • Сертификаты
      • Реквизиты
      • Пользовательское соглашение
      • Политика обработки персональных данных
      • Публичный договор-оферта
      • Правила работы в студии
      • Как оставить отзыв
      Контакты
        0
        alfaitstudio
        0
        • Мой кабинет
        • Услуги
          • Назад
          • Услуги
          • Интерактивная видеостудия
            • Назад
            • Интерактивная видеостудия
            • Съёмка в видеостудии с прозрачной доской
            • Проведение онлайн-трансляций и вебинаров
            • Съёмка видео для соцсетей
            • Съёмка видео обзоров/распаковок/анпакингов
            • Съёмка онлайн-курсов
            • Съёмка поздравлений
          • Разработка сайтов на CMS
            • Назад
            • Разработка сайтов на CMS
            • Создание сайтов
            • Создание интернет-магазинов
            • Создание маркетплейсов
            • Создание лэндингов/посадочных страниц
          • Продвижение и реклама
            • Назад
            • Продвижение и реклама
            • Поисковое продвижение и оптимизация
            • Настройка и ведение контекстной и таргетированной рекламы
            • Продвижение в социальных сетях
            • SEO аудит сайта
            • Продвижение интернет магазина
            • Продвижение промышленных и производственных предприятий
          • Графика и дизайн
            • Назад
            • Графика и дизайн
            • UX/UI дизайн сайтов и приложений
            • Создание 3D моделей
            • Разработка фирменного стиля
            • Создание логотипа
          • 1C - установка и оптимизация
            • Назад
            • 1C - установка и оптимизация
            • Установка и оптимизация 1С сервера
            • Устранение ошибок 1С
            • Создание и настройка обмена данными между 1С и 1С Битрикс
          • Разработка мобильных приложений
            • Назад
            • Разработка мобильных приложений
            • Разработка приложений для iOS и Android
          • Видеопродакшн
            • Назад
            • Видеопродакшн
            • Съёмка видеоподкастов
            • Рекламные видеоролики
        • Пресс-центр
        • Проекты
          • Назад
          • Проекты
          • Дизайн
        • Команда
        • Компания
          • Назад
          • Компания
          • О компании
          • Команда
          • Сертификаты
          • Реквизиты
          • Пользовательское соглашение
          • Политика обработки персональных данных
          • Публичный договор-оферта
          • Правила работы в студии
          • Как оставить отзыв
        • Контакты
        • Корзина0
        • +7 (800) 555-26-23
        88005552623@mail.ru
        Тюмень, ул. Ленина 2а, ТРЦ Панорама, 6 этаж 603 офис
        • Вконтакте
        • Telegram
        • YouTube
        • Одноклассники
        • Whats App
        • Viber
        • Главная
        • Пресс-центр
        • Блог
        • Анимируем градиент в Figma

        Анимируем градиент в Figma

        13 сентября 2022
        Блог

        Фоновые градиенты – тренд, который пришел в веб-дизайн и графический дизайн в 2021 г. и остается актуальным до сих пор. Статичный градиент уже “приелся” пользователям, а анимированным можно добиться эффекта “вау” на сайте.

        В данной статье я расскажу, как создать анимированный градиент в Figma.

        Шаг первый. Область под градиент

        Создаем фрейм под наш градиент. Ставим галочку в пункт “Clip content”, чтобы объекты не выходили за пределы области.

        Также сделаем ещё две вещи:

        • ставим скругление углов на 30°;
        • выбираем цвет фоновой заливки #232324.
        аннимированный-градиент-шаг-1.jpg

        Шаг второй. Создаем случайные формы

        Нажимаем “P” для того, чтобы нарисовать контур фигуры, затем “Shift+X”, чтобы задать цвет заливки. После кликаем кнопку “Done”. Таким же образом создаём ещё две формы.

        аннимированный-градиент-шаг-2.jpg

        Шаг третий. Добавляем размытие

        Сгруппируем недавно созданные формы и задаём им параметр “Layer Blur”. Со значением можно поиграться самостоятельно, я же поставил его на 135.

        аннимированный-градиент-шаг-3.jpg

        Шаг четвертый. Добавляем шум

        Нажимаем комбинацию клавиш “Shift+I” и в поиске ищем плагин под названием Noise. Создаём шум, размер которого будет равен размеру вашего фрейма. Настройки плагина выставляются на глаз.

        После того как шум был добавлен, меняем параметр наложения на “Soft Light” и регулируем параметр прозрачности. Я установил его на значении в 50%.

        аннимированный-градиент-шаг-3ю5.jpg

        Шаг пятый. Дублирование

        Продублируем созданный фрейм два раза. После чего в каждой новой копии изменим параметры фигур, то есть позицию, размер, форму и т.д.

        аннимированный-градиент-шаг-4.jpg

        Шаг шестой. Параметры анимации

        Перейдём во вкладку “Prototype” и добавим анимации со следующими свойствами, показанными ниже:

        аннимированный-градиент-шаг-6.jpg

        Шаг седьмой. Цикл анимации

        Цикл должен получится следующим Frame1 -> Frame2-> Frame3> Frame1

        шаг 7.jpg

        Шаг восьмой. Готовый результат

        Если всё сделано правильно, то должно получится примерно следующее:

        Подписаться на
        рассылку

        Будьте в курсе последних новостей отрасли

        Подписаться

        Команда

        • Данил Долганов
          Графический дизайнер
          Данил Долганов
          E-mail
          r2d2@alfaopt.com
          Написать сообщение
        • Комментарии
        Загрузка комментариев...
        Назад к списку
        Услуги
        Интерактивная видеостудия
        Разработка сайтов на CMS
        Продвижение и реклама
        Графика и дизайн
        1C - установка и оптимизация
        Разработка мобильных приложений
        Видеопродакшн
        Продукция
        Компания
        О компании
        Команда
        Сертификаты
        Реквизиты
        Пользовательское соглашение
        Политика обработки персональных данных
        Публичный договор-оферта
        Правила работы в студии
        Как оставить отзыв
        Проекты
        Пресс-центр
        Контакты
        Подписка на рассылку
        +7 (800) 555-26-23
        Заказать звонок
        88005552623@mail.ru
        Тюмень, ул. Ленина 2а, ТРЦ Панорама, 6 этаж 603 офис
        • Вконтакте
        • Telegram
        • YouTube
        • Одноклассники
        • Whats App
        • Viber
        Версия для печати
        Политика конфиденциальности
        © 2023
        0

        Ваша корзина пуста

        Исправить это просто: выберите в каталоге интересующий товар и нажмите кнопку «В корзину»
        В каталог
        Заказать звонок
        Написать сообщение
        Оставить отзыв
        Ближайший офис