Course Description

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

Front End & iOS Developer

sandy ludosky

My name is Sandy. I am a freelance Web Designer and Developer based out of Toronto, in Ontario, Canada. I specialize in Front-End development with HTML, CSS, CSS3 Animation, Sass, Javascript and JQuery. I love creating beautiful, professional and user-friendly websites using the Adobe Creative Suite: Photoshop, Illustrator and Flash to name a few. Also, I am keen on Web marketing, Web analytics, Visual Design, Video Editing, Photography and WordPress development. On top of being a Udemy instructor, I am an avid learner of new technologies and digital stuff.

Course curriculum

  • 1

    Getting Started

    • Introduction

    • Download & Set Up

    • Course Files | Download

    • Intro to the Responsive Grid
  • 2

    Responsive Grid

    • Basic Grid

    • Small & Medium Grid

    • Advanced Grid

    • Offset Grid

    • Centered Grid

    • Source Ordering

    • Block Grid
  • 3

    Responsive Project

    • Slider

    • About Us - panel.js

    • Video Pop Up - modal.js

    • Accordion.js

    • Portfolio Gallery - clearing.js

    • Interactive Contact Form - Alert.js

    • Social Media - Foundation Icons
  • 4

    Mobile Optimization

    • Interchange Responsive Content

    • Adaptative Content

    • Responsive NavBar
  • 5

    Alternate Design

    • Introduction to tab.js

    • tabs Customization

    • Team Section

    • tooltip.js

    • tabs & Media Queries

    • Vertical Tabs