Придбаний [Lynda.com] Создание отзывчивого дизайна одностраничного сайта (Анимация макета)

[Gadzhi]

Создание отзывчивого дизайна одностраничного сайта

Часть 3 (Анимация макета)

Lynda.com на русском​

Оригинальное название: Building a Responsive Single-Page Design
Автор: Ray Villalobos
Продолжительность: 4ч 58м (1ч 50м)
Дата релиза: 23 сентября, 2014 год
Перевод: голос + субтитры


Внимание читать всем, прежде чем задавать вопросы!!!

Курс "Создание отзывчивого дизайна одностраничного сайта". Разбивается на 3 части.

1.
2.
3. Анимация макета (текущая складчина)

Содержание текущего курса

1. Введение
2. С чего начать

3. Работа с Sass ()
4. Создание отзывчивого сеточного дизайна с Susy ()

1. Анимация макета
2. Заключение

Складчина будет проведена по мере набора желающих, не зависимо от 2-х остальных складчин.

--------------------------------------------------------------------------------------------------------------------------------------------------

Научитесь создавать динамический, отзывчивый дизайн одностраничного сайта с помощью HTML, JavaScript и CSS. Продемонстрированный в этом курсе веб-сайт сочетает в себе плавающую навигацию, столбцы, которые подгоняются, не захламляя при этом макет сайта или HTML-разметку, и анимированные эффекты прокрутки, реагирующие на указания пользователя. Автор Рей Виллалобос показывает, как все это реализовать. Он начинает со скудного, легко-читаемого шаблона, а затем объясняет, как с помощью четырех перечисленных ниже фреймворков добавлять функции, которые сделают дизайн одностраничных сайтов настолько искусными:

• Compass, чьи Sass-примеси способствуют запуску таких CSS3 функций, как Flexbox
• Susy 2 – фреймворк, отделяющий математику от отзывчивого сеточного дизайна
• ScrollMagic, используемый для добавления волшебных эффектов прокрутки
• Breakpoint, который позволяет моментально писать медиа-запросы в Sass

Но этот курс посвящен не только инструментам. Это реальный проект, в котором кратко изложено множество дизайнерских задач, с которыми ежедневно сталкиваются разработчики веб-сайтов. Приступите к просмотру курса прямо сейчас и узнайте, как использовать HTML, jQuery и CSS для создания собственного динамического, отзывчивого дизайна.

Темы курса:

• Предварительный анализ проекта
• Создание базовых стилей
• Создание собственных Sass-примесей
• Кодирование навигации
• Как с помощью сеток сделать навигацию отзывчивой
• Использование разделенного макета
• Создание промежуточной анимации
• Управление сценами с помощью прокрутки

Заинтересовались – подписывайтесь!

Демо:

Скрытое содержимое.

http://www.lynda.com/CSS-tutorials/Building-Responsive-Single-Page-Design/182174-2.html

Складчины по теме