Jump to content
  • Работа с градиентами

       (17 reviews)

    Евгений Зубов
    • 39 4,25,6,20,3,26,27,28,29 4,6,32 https://creatura.club/uploads/monthly_2016_01/3.6.3_Rabota_s_gradientami.mp4.f4810a0f479066b9668125b8db9d75c2.mp4 4 До 5 минут display: none; https://creatura.club/uploads/ Средняя сложность display: none;
      1. Пройдите тестирование для урока
      2. Оцените урок и сдайте задание

      В этому уроке мы рассмотрим работу с градиентами цветов в программе Adobe Muse. Заходим в программу, создадим сразу какой-нибудь графический блок и зайдем в меню "Заливка", нажав на надпись "Заливка" в верхнем меню программы. Поставим заливку не сплошную, а градиентную. Мы видим, что в настройках появились 2 цвета: черный и белый. А для каждого цвета есть непрозрачность. Также появилась настройка значения "Фокуса", "Направление" градиента, "Размера" градиента и "Фиксация" градиента. Мы можем поменять цвет градиента на синий, например, и оранжевый. На этом примере понятно, что такое градиент. Это изменение цвета от одного к другому. Сейчас мы видим плавное изменение цвета от синего к оранжевому на всем протяжении прямоугольника.

      Направление градиента - по горизонтали. Если мы поставим направление градиента по вертикали, то увидим, что цвет в данном случае изменяется от синего к оранжевому в вертикальном направлении, причем первый цвет сверху, а второй снизу. При горизонтальном расположении первый цвет справа, а второй слева. Мы можем также изменить фокус гралиента. По умолчанию стоит 50 %. Это значит, что относительно сторон данного прямоугольника фокус градиента у нас сейчас находится ровно посередине. Поставим направляющую линию и заливку. Если же мы начнем менять данное значение, то вы увидите, как фокус градиента смещается вправо при значениях больше 50. Если же мы меняем значение фокуса меньше 50, то фокус будет смещаться влево.

      Вот таким образом мы можем создавать те эффекты, которые нам необходимы. Максимально мы можем сместить фокус градиента на 87 % вправо и на 13 % влево. Либо это вверх и вниз, если у нас градиент расположен по вертикали. Давайте снова поставим 50 %. Это можно делать вручную, вбивая значение, а можно изменять положение ползунка. Мы также можем менять непрозрачность каждого из цветов отдельно. Если мы сейчас уберем непрозрачность синего цвета до 0, то вы увидите, как постепенно меняется оранжевый цвет и переходит в белый. Но при этом оранжевый цвет проходит некую синеву перед тем, как стать белым слева. Белым он становится, потому что задний фон белого цвета. Если бы заливка в браузере у нас была другого цвета, то оранжевый плавно переходил бы через синий в цвет фона нашей основной страницы. Поставим снова 100% и рассмотрим, что такое размер.

      Размер сейчас выбирается автоматически. Также мы можем поставить размер фиксированный. Кога мы выбираем фиксированный размер градиента, то у нас есть возможность изменять это значение в пикселях. Что это означает? Это означает то, что сейчас зона перехода составляет 200 пикселей. То есть это то значение, на котором происходит изменение цвета. То есть в данный момент стоит 144 пикселя, а это означает,что на расстоянии 144 пикселя и происходит плавный переход от синего к оранжевому. Если выставим это значение больше, то мы практически увидим синий прямоугольник, поскольку он гораздо меньше, чем 5000 пикселей.

      На этом мы заканчиваем данный урок. Выполните задание к уроку, ответьте на вопросы и переходите к следующему уроку.

    Познакомитесь с невероятно мощным и полезным инструментом - палитрой. Увидите как управлять градиентом и в каких случаях он применим. Узнаете как объединять градиенты и редактировать их. Изучите инструменты управления градиентами.


      Report Занятие


    User Feedback


    Zhanibek_jez

    +

    Share this review


    Link to review
    Guest Падалко Сергей

    Прошел

    Share this review


    Link to review
    Алексей

    Грамотно.

    Share this review


    Link to review
    Андрей А

    Спасибо, все понятно.

    Share this review


    Link to review
    Sharovich

    Спасибо. Всё понятно

    Share this review


    Link to review
    YanaZamkova

    понятно

    Share this review


    Link to review
    gladir1

    Урок посмотрела. Повторила. Все понятно

    Share this review


    Link to review
    7dgoni6

    Спасибо.

    Share this review


    Link to review

×