WebDesign Master
1.39K subscribers
38 photos
23 links
Уникальные авторские уроки и курсы по веб-разработке и современному веб-дизайну.
Download Telegram
Channel created
Сегодня мы рассмотрим установку и настройку Visual Studio Code для веб-разработки. В результате мы получим удобную, лаконичную рабочую среду с необходимыми плагинами, которые я использую в своей работе.

YouTube: https://youtu.be/JSGPd1E16-o
VK: https://vk.com/video-90356326_456239479
6🔥4🎉2
Сегодня мы создадим крутую 3D сцену с использованием HTML, CSS и JavaScript. Мы рассмотрим интересные приёмы вёрстки - создадим эффектный анимированный фон, переливающееся освещение сцены, 3D эффект вращения айтемов.

YouTube: https://youtu.be/eBbrEQw7kcg
VK: https://vk.com/video-90356326_456239510
🔥103
В этом уроке мы рассмотрим создание сайта с различными эффектами, анимациями. Галерея будет выполнена с эффектом parallax при скролле, а при клике мы проработаем анимацию открытия и закрытия изображений.

YouTube: https://youtu.be/TX1HZnhJLGM
VK: https://vk.com/video-90356326_456239508
🔥83
В этом уроке мы рассмотрим создание сайта с потрясающей 3D анимацией скролла, используя возможности современного HTML, CSS и JavaScript. Мы разработаем модель движения слайдов в глубину, а также поработаем с аудио и видео контентом на странице.

YouTube: https://youtu.be/GLbI7BGdQ3o
VK: https://vk.com/video-90356326_456239507
🔥92
В этом уроке мы рассмотрим создание сайта с плавной анимацией, реализуем самый простой способ оформления контента в виде плиток Masonry на чистом CSS и добавим поддержку темной темы ОС (Dark Mode).

YouTube: https://youtu.be/kyoTYFTLm8A
VK: https://vk.com/video-90356326_456239506
🔥71
В этом уроке мы рассмотрим создание красивого сайта с Parallax эффектом при скролле. Ключевой особенностью данного примера является реализация эффекта Parallax на сайте.

YouTube: https://youtu.be/F5ZKI-g-_qo
VK: https://vk.com/video-90356326_456239511
🔥104
В этом уроке мы создадим интересный крутой сайт-портфолио с диагональным плавным скроллом. Мы рассмотрим нестандартный способ синхронизации вертикальных слайдов на JS. Также мы разработаем CSS анимацию инерции для скролла.

YouTube: https://youtu.be/oT0FN1PtmRU
VK: https://vk.com/video-90356326_456239505
🔥91
В этом уроке мы рассмотрим создание сайта с горизонтальным скроллом. Ключевой особенностью данного примера является красивый parallax эффект, который добавляет глубину и объем в сцену.

YouTube: https://youtu.be/QFq6PiZ1BQ8
VK: https://vk.com/video-90356326_456239504
🔥102
Сегодня мы рассмотрим создание сайта с крутой анимацией скролла при помощи GSAP ScrollTrigger и GSAP ScrollSmoother.

YouTube: https://youtu.be/zKjYfxei5vc
VK: https://vk.com/video-90356326_456239509
🔥132
В этом уроке мы рассмотрим создание сайта с красивым 3D эффектом. Ключевой особенностью данного примера является реализация эффекта глубины на сайте посредством 3D перспективы.

YouTube: https://youtu.be/2tAPxjcGLms
VK: https://vk.com/video-90356326_456239512
🔥135
В этом уроке мы рассмотрим создание сайта с красивой 3D анимацией волны при наведении мыши на чистом HTML и CSS. Главный замысел урока - показать возможности стилизации соседних элементов в CSS.

YouTube: https://youtu.be/3bLmhwU6ses
VK: https://vk.com/video-90356326_456239499
🔥122
В этом уроке мы рассмотрим создание сайта с красивым эффектом при скролле. Ключевой особенностью данного примера является реализация синхронной анимации посредством использования библиотеки GSAP.

YouTube: https://youtu.be/gQFZyN-0NxQ
VK: https://vk.com/video-90356326_456239502
🔥142👍1
В этом уроке мы рассмотрим создание красивого сайта с анимацией заголовка при скролле. Я покажу, как происходит создание таких крутых сайтов и на реальном прмере подробно объясню все моменты и тонкие нюансы разработки. Ключевой особенностью данного примера является реализация анимации заголовка на сайте посредством CSS transition.

YouTube: https://youtu.be/I4NdTuDfJBk
VK: https://vk.com/video-90356326_456239500
👍52🔥177🤩3❤‍🔥1🥰1
Всем привет, друзья! Добро пожаловать в большой комплексный курс по веб-дизайну.

Курс: https://webdesign-master.ru/courses/webdesign/
Анонс на YouTube: https://youtu.be/Ki5VISmGxmI
Анонс VK: https://vk.com/video-90356326_456239485

Мы изучим историю веб-дизайна, основы, весь софт, который понадобится в работе: Figma, Photoshop, редакторы векторной графики и полезные утилиты. Мы задействуем все возможности современных инструментов и нейросетей, которые помогут нам создавать потрясающие крутые работы.
🔥52👍188🤗1
В этом уроке мы рассмотрим создание красивого сайта с Parallax эффектом при движении мыши. Это лучшая CSS практика в одном уроке - мы затронем очень много интересных приемов, это импорт и работа с переменными из JavaScript, создание светлой и темной темы, использование вложенных переменных CSS и математические операции над ними. Очень много логики, очень много функциональной составляющей данного примера ложится именно на CSS. Это мощный и интересный урок, в котором вы обязательно найдете для себя много нового.

YouTube: https://youtu.be/eJfHZl9LsDI
VK: https://vk.com/video-90356326_456239497
🔥60👍15👏2🙏21
В этом уроке мы рассмотрим создание красивого интерактивного компонента галереи-аккордеона. Это крутой пример современного UI-компонента, который можно использовать в галереях, портфолио или как элемент навигациии на сайте или в приложении. В процессе изучения урока, мы затронем очень важные моменты разработки, такие, как поддержка светлой и темной темы, работу с Flexbox, переменными CSS, адаптацией Flex-элементов для мобильных устройств, работу с color-mix, flex-grow и многие другие важные аспекты.

YouTube: https://youtu.be/Hrm_fiUyeGU
VK: https://vk.com/video-90356326_456239517
🔥72👍122🤩1
Добро пожаловать в большой комплексный курс по языку программирования JavaScript.

Курс: https://webdesign-master.ru/courses/javascript/
Анонс на YouTube: https://youtu.be/PPru4M40IIY
Анонс VK: https://vk.com/video-90356326_456239519

В данном курсе мы максимально подробно, разбирая каждый шаг и каждый момент, изучим язык JavaScript с полного нуля. Курс отлично подойдёт тем, кто хочет получить актуальную, крутую базу, перед тем как двигаться дальше и изучать современные библиотеки и фреймворки.
🔥33👍73🤩2