Все для веб-дизайнера
Записи с метками Анимация
Главные тренды веб-дизайна в 2020 году
1 Фев
Новый год принес нам новые тенденции в веб-дизайне. Мы уже начинаем видеть, некоторые элементы дизайна, которые будут горячими трендами в 2020 году (и, возможно, в будущем). Большинство из этих популярных идей веб-дизайна являются логическим продолжением проектов прошлых лет, а именно: больше градиентов, необычная типография и много минимализма. Но также появляются все больше проектов которые имеют «темные режимы», больше интерфейсов со звуковыми и трехмерными элементами.
Бесплатные генераторы для веб-дизайнеров
13 Окт
Вы ищете способ избавиться от рутины и иметь больше времени для искусства и творчества? Суровая реальность такова, что каждый проект включает в себя скучные, повседневные задачи, которые необходимо выполнить. Но это не значит, что вам должно быть скучно до смерти — выход есть. Воспользуйтесь помощью онлайн-сервисов и генераторов, созданных специально для таких ситуаций, как UPNG , Lists и Font Generator . Все эти крошечные инструменты выполняют утомительные, повседневные задачи веб-дизайнеров и разработчиков.
Бесплатные векторные иллюстрации для сайтов
1 Июн
Наконец-то, новая тенденция в графическом дизайне и иллюстрациях для веб-сайтов — это использование графических иллюстраций. Все любят иллюстрации. Будь то дизайнер, разработчик или обычный пользователь, нарисованные от руки картинки всегда радуют глаз. Они привносят аутентичность и индивидуальность в любые проекты, которым не хватает тепла и изюминки, которое можно найти в реальном мире. Характер таких иллюстраций помогает эффективно донести информацию и показать оригинально идею. Они обогащают ваш сайт, не портя контент.
Эффект анимации текста при помощи TweenMax
22 Фев
Сегодня мы хотели бы поделиться с вами небольшим текстовым эффектом для слайд-шоу. Идея состоит в том, чтобы показать след затухания текста при переходе между слайдами слайд-шоу. Анимации сделаны с использованием TweenMax. Мы создали пять демонстраций с различной типографикой и эффектами для изображений при переходе от одного слайда к другому. Компоновка текстового эффекта создается с помощью контейнера flexbox, который уменьшает высоту каждого текстового контейнера, чтобы все помещалось в область просмотра (высоту).
Как создать эффект 3d изображений на WebGL
12 Фев
В наши дни WebGL становится довольно популярным, поскольку позволяет нам создавать уникальную интерактивную графику на сайтах. Возможно, вы видели недавние эффекты искажения текста, используя Blotter.js или анимированные строчки при помощи WebGL, созданные с помощью библиотеки THREE.MeshLine. Сегодня вы узнаете, как быстро создать интерактивный «фальшивый» 3D-эффект для изображений с простым WebGL.
Меню сайта в виде сетки с помощью anime.js
2 Фев
Сегодня мы хотели бы поделиться с вами небольшой анимацией меню. Идея состоит в том, чтобы использовать квадраты разного размера которые выдвигаются и заполняют экран. Это весьма необычный подход к реализации меню, по этому к нему стоит приглянуться. Мы используем anime.js для анимации и imagesLoaded для предварительной загрузки изображений. Обратите внимание, что данный эффект является экспериментальным и работает только современных браузерах, давайте посмотрим, что у нас получилось.
