Перейти к содержимому
  • Создание градиентных эффектов

       (4 отзыва)

    Евгений Зубов
    • 21 4,25,2,6,20,3,26,27,28,29 4,6,32 https://creatura.club/uploads/monthly_2016_06/21_%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5_%D1%8D%D1%84%D1%84%D0%B5%D0%BA%D1%82%D0%BE%D0%B2_%D1%81_%D0%B3%D1%80%D0%B0%D0%B4%D0%B8%D0%B5%D0%BD%D1%82%D0%B0%D0%BC%D0%B8.mp4.8790896c3ac938b8eb8661de655a1834.mp4 8 До 10 минут Евгений Зубов display: none; https://creatura.club/uploads/ Средняя сложность display: none;

      Добавьте эффекты с помощью градиентной заливки в те места лендинга где это требуется и уместно.

      Еще один популярный для меня инструмент, который значительно упрощает работу с дизайном – это тонировка. Это, по своей сути, возможность наслаивать элементы друг на друга. Если у нас есть 2 прямоугольника (кнопка и задний фон),то кнопка может быть либо на переднем фоне и будет видна, либо на заднем фоне и не будет видна.

      В каких случаях ее лучше использовать? Как правило, ее можно использовать для красивого оформления заднего фона одного из блока. Техника выглядит следующим образом:

      Берем некий прямоугольник, который используется в качестве заливки блока, заливаем блок фотографией. Далее появляется проблема - фото и текст сливаются. Это можно решить быстро и красиво с помощью тонировки.

      Мы копируем прямоугольник, где используется заливка картинок, вставляем. Далее для созданного прямоугольника убираем заливку, затем, просто меняя прозрачность заливки, делаем самый верхний прямоугольник чуть прозрачнее. В зависимости от степени прозрачности меняется степень тонировки изображения.

      Чтобы текст был читабельным, нужно 2 прямоугольника выделить, кликаем правую кнопкой мыши, выбираем пункт "Упорядочить" и нажимаем на задний план. И после того текст и кнопка переместятся на задний план. Получится очень красивый и оригинальный эффект.

      Если мы хотим изменить цвет тонировки, то мы просто меняем цвет верхнего блока. Это очень простой прием, который сможет разнообразить вид вашего сайта.

      Есть еще один прием, в котором тоже используется способность создавать прозрачные элементы. Но в этот раз мы не будем использовать тонировку, а будем подбирать дополнительный оттенок. Мы берем обычный прямоугольник, делаем непрозрачность 100 %, следующий блок зальем для примера черным цветом.

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

      Мы видим, что в нижней части у нас один оттенок, а в верхней – второй. Если выделим второй элемент, для которого мы и хотим создать дополнительный оттенок, выделяем его, переходим в заливку, в настройку цвета. Берем пипетку, кликаем либо на светлую область, либо на более темную

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

    На этапе разработки дизайна новички сталкиваются с проблемой скудности дизайна. Пытаясь разнообразить его, совершают множество ошибок. В этом уроке вы узнаете, как, используя серию простых приемов, очень легко и просто улучшить дизайн лендинга.


      Жалоба


    Отзывы пользователей


    Слава Баранов

    Понятно

    Поделиться отзывом


    Ссылка на отзыв
    Genka

    +

    Поделиться отзывом


    Ссылка на отзыв

×