Foundation 5-Learn Responsive Design and Rapid Prototyping – Sandy Ludosky

Salepage link: At HERE. Archive: http://archive.is/wip/HE4Ee

Foundation 5 – Learn Responsive Design & Rapid Prototyping

Learn the nuts & bolts of rapid prototyping with Foundation 5, the lightweight framework that makes it faster to code.

Foundation 5 makes it faster to learn and to code.

This workshop is a fast-track to getting up to speed with rapid responsive prototyping with the most advanced responsive Framework.

Topics include:

• A complete guide to the responsive grid
• A tour of the numerous CSS components & Key UI elements
• Dynamic features Integration with orbit slider, reveal modal, Accordion, Lightbox..
• Mobile user experience optimization
• A 1-hour walkthrough : from prototype to beautiful design
• Quizzes, Interactive Exercices

Hand-on and project-based, the course will help you :

• Learn the fundamentals of using Foundation
• Start building responsive web pages
• Sharpen your design skills

So, let’s get started with Foundation 5!

This workshop is the fastest way to get you up and running with Rapid Prototyping, Mobile First & Easy Customization

Course Curriculum

Getting Started with Foundation 5

• Welcome to the Workshop ! (1:21)
• Foundation Files & Project resources (1:51)
• Intro to the Responsive Grid (1:54)

Responsive Grid – The Complete Guide

• Basic Grid
• Small & Medium Grids
• Quiz 1: Quiz
• Advanced Grid (Nesting) (8:35)
• Offset Columns (4:10)
• Quiz 2: Quiz
• Centered Columns (8:18)
• Source Ordering (9:10)
• Block Grid (7:05)
• Quiz 3: Quiz

Responsive Design Project

• Responsive Image Slider (Orbit.js) (8:14)
• “About Us” (Panel) (1:53)
• Content Slider & Equalizer.js (10:39)
• Video Popup (Modal.js) (3:51)
• Accordion.js (3:43)
• Portfolio Gallery (Clearing Lightbox.js) (3:55)
• Interactive Contact Form (Alert.js) (11:42)
• Social Media (Foundation Font Icons) (5:26)

Mobile Device Optimization

• Interchange Responsive Content (6:50)
• Adaptive Content (Media Queries) (5:53)
• Responsive Navbar (6:24)

Alternate Design Work

• Intro to Tab.js (3:31)
• Tabs Customization (3:28)
• “Team” Section Tab (3:49)
• Tooltip.js (3:00)
• Tabs & Media Queries (5:21)
• Vertical Tabs (1:04)
• Last Words (0:30)