WebDesign Master

В этом уроке мы рассмотрим создание сайта с красивым 3D эффектом. Сегодня я покажу, как происходит создание таких крутых сайтов и подробно объясню все моменты и тонкие нюансы разработки. Ключевой особенностью данного примера является реализация эффекта глубины на сайте посредством 3D перспективы. Смотреть на YouTube: https://youtu.be/2tAPxjcGLms Страница урока: https://webdesign-master.ru/blog/html-css/parallax-3d-lens-effect-website.html

Создание сайта с крутой анимацией скролла при помощи GSAP ScrollTrigger и GSAP ScrollSmoother. Смотреть на YouTube: https://youtu.be/zKjYfxei5vc Страница урока: https://webdesign-master.ru/blog/html-css/creative-scroll-website.html

В этом уроке мы рассмотрим создание потрясающего сайта с горизонтальным скроллом. Ключевой особенностью данного примера является красивый parallax эффект, который добавляет глубину и объем в сцену. Я покажу самый простой и универсальный способ создания сайтов с parallax эффектом, который вы с легкостью сможете использовать в ваших проектах. Смотреть на YouTube: https://youtu.be/SJvGH4hJ9aw Страница урока: https://webdesign-master.ru/blog/html-css/horizontal-parallax-scrolling.html

В этом уроке мы создадим интересный крутой сайт-портфолио с диагональным плавным скроллом. Мы рассмотрим нестандартный способ синхронизации вертикальных слайдов на JS и инверсию движения в различных направлениях с помощью CSS. При наведении слайды будут увеличиваться с красивой анимацией. Также мы разработаем CSS анимацию инерции для скролла. Данный пример выглядит потрясающе, однако он довольно прост в реализации. В этом уроке я покажу, как происходит создание таких сайтов на реальном примере, здесь собрано очень много различных техник и приемов разработки, которые пригодятся вам в реальной работе над подобными проектами. Смотреть на YouTube: https://youtu.be/oT0FN1PtmRU Страница урока: https://webdesign-master.ru/blog/html-css/amazing-scroll-portfolio.html

Друзья! Набираем 250 тыс просмотров под последним видео и выходит новый крутой урок! 👉 https://youtu.be/F5ZKI-g-_qo Помочь продвижению можно написав коммент и включив видео фоном до конца! Новый урок почти готов, это будет пушка! 😎

Спрашивали меня многие о моей позиции. Дак вот позиция исключительно пророссийская. Я люблю свою страну. Я люблю нашу демократию и считаю ее одной из самых настоящих демократий, которые существуют в мире. Кто-то говорит, что у нас нет свободы слова? А с чего вы взяли, что здесь все подневольные? У нас всё хорошо.

Всем привет. Подписывайтесь на меня вк: https://vk.com/asklimanov

Дорогие друзья, сейчас действует скидка на все курсы WebDesign Master: https://wd-m.ru/bundle Отписываться не стоит. То, что я приготовил для следующего урока взорвёт ваш мозг. Оценил 1 человек

Сегодня нашёл в архиве старое видео, которое вставлял в Джедая Верстки #7 в 2017 году. И какая-то ностальгия пробирает. Возникает ощущение, что раньше было лучше, что раньше ты чувствовал эту жизнь ярче. Хочется вернуть и то время и тот вайб. Возникает ли у вас такие чувства и что вы думаете по этому поводу? Обсуждаем в группе ВК: https://vk.com/wall-90356326_13165

В этом уроке мы рассмотрим создание красивого сайта с Parallax эффектом при скролле. Сегодня я покажу, как происходит разработка таких крутых сайтов и подробно объясню каждый шаг. Ключевой особенностью данного примера является, конечно-же, реализация эффекта Parallax на сайте - вы удивитесь, насколько просто и быстро можно делать подобные вещи, используя современный CSS. Смотреть на YouTube: https://youtu.be/F5ZKI-g-_qo Страница урока: https://webdesign-master.ru/blog/html-css/parallax-scrolling-website.html

Внимание! Обновлен закрытый курс «Я - Автор!» - подробнейшее руководство по инфобизнесу на YouTube от автора с годовым доходом более 5 млн. руб. Обновлена техническая часть - настройки, пресеты для монтажа в Premiere Pro, в рекомендации добавлен недорогой, но классный ноутбук для веб-разработки, записи и монтажа. Также в рекомендации добавлена гарнитура с качественным микрофоном и функцией мониторинга голоса, которую я сейчас использую сам. Обновлены и актуализированы некоторые видеоуроки. Курс регулярно эволюционирует и развивается, добро пожаловать за обновлениями :-) Купить курс: https://wd-m.ru/author/buy Комплект со скидкой: https://wd-m.ru/bundle Обновить: courses@webdesign-master.ru

Сегодня мы рассмотрим создание красивого плавающего изображения-курсора с parallax эффектом на CSS. Мы затронем очень много иснтересных приемов CSS. Это импорт и работа с переменными из JavaScript, использование простых переменных CSS и математические операции над ними, очень много логики, очень много функциональной составляющей этого потрясающего примера ложится именно на CSS. Приятного просмотра. Смотреть видео: https://youtu.be/Qq31jcQ3clk Страница урока: https://webdesign-master.ru/blog/html-css/floating-image-lesson.html

Сегодня мы рассмотрим создание красивого плавающего изображения-курсора с parallax эффектом на CSS. Мы затронем очень много иснтересных приемов CSS. Это импорт и работа с переменными из JavaScript, использование простых переменных CSS и математические операции над ними, очень много логики, очень много функциональной составляющей этого потрясающего примера ложится именно на CSS. Приятного просмотра. Смотреть видео: https://youtu.be/Qq31jcQ3clk Страница урока: https://webdesign-master.ru/blog/html-css/floating-image-lesson.html

Сегодня мы рассмотрим создание красивого плавающего изображения-курсора с parallax эффектом на CSS. Мы затронем очень много иснтересных приемов CSS. Это импорт и работа с переменными из JavaScript, использование простых переменных CSS и математические операции над ними, очень много логики, очень много функциональной составляющей этого потрясающего примера ложится именно на CSS. Приятного просмотра.

В этом уроке мы разработаем красивый сайт с плавной анимацией перемещения в области просмотра, рассмотрим самый простой способ оформления контента в виде плиток Masonry на чистом CSS и добавим поддержку темной темы ОС (Dark Mode). Кроме того, я покажу, как правильно разрабатывать прелоадер для подобных сайтов. Смотреть видео: https://youtu.be/kyoTYFTLm8A Страница урока: https://webdesign-master.ru/blog/html-css/create-draggable-site.html

В этом уроке мы рассмотрим создание сайта с потрясающей 3D анимацией скролла, используя возможности современного HTML, CSS и JavaScript. Мы разработаем модель движения слайдов в глубину, поработаем над кастомной анимацией, плавностью, красиво оформим композицию с помощью CSS, а также поработаем с аудио и видео контентом на странице. Смотреть видео: https://youtu.be/GLbI7BGdQ3o Страница урока: https://webdesign-master.ru/blog/html-css/create-3d-scroll-site.html

В этом уроке мы рассмотрим создание потрясающей странички с различными эффектами, анимациями. Галерея будет выполнена с эффектом parallax при скролле, а при клике мы проработаем анимацию открытия и закрытия изображений. Мы создадим анимированный фон, который повторяет цвета изображений и плавно переливается из одного цвета в другой с эффектом Blur. Поработаем с триггерами для анимации скрытия, появления заголовка и текста нашей композиции. Бонусом мы разберем создание текстового градиента с помощью CSS. Я рекомендую посмотреть этот урок до конца, здесь я собрал много различных техник и приёмов, которые вам пригодятся в работе. Смотреть видео: https://youtu.be/TX1HZnhJLGM Страница урока: https://webdesign-master.ru/blog/html-css/create-cool-gallery-miami.html

Сегодня мы рассмотрим установку и настройку Visual Studio Code для верстки. В результате мы получим удобную, лаконичную рабочую среду с необходимыми плагинами, которые я использую в своей работе. VS Code в настоящее время является самым популярным редактором кода благодаря широкому функционалу, кроссплатформенности, огромному сообществу разработчиков как самого редактора, так и расширений для него и открытой лицензии. Этот редактор я могу смело рекомендовать к использованию. Смотреть видео: https://youtu.be/JSGPd1E16-o Страница урока: https://webdesign-master.ru/blog/tools/vscode.html