ZURB has been practicing product design since 1998 and in our online courses and training programs, you’ll learn the same valuable skills our designers use on a daily basis. Learn the fundamentals of prototyping with the 50% lighter-fewer style overrides-single click project spin up Foundation 6. In this 4-hour live webinar class, we'll walk you through the world's most advanced front-end framework. If you have a basic knowledge of HTML/CSS and want to learn how to use Foundation in your projects, this class is for you.
Learn how to build flexible and complex responsive layouts with the grid.
Learn how to quickly prototype with navigation, form, button elements and much more.
Learn from ZURB’s product designers
Here are your instructors that are teaching this class.
Tim is a ZURB designer and a key contributor to Foundation. He has many Foundation projects under his belt, and will be bringing you up to speed on getting started with Foundation 6.
A troubleshooting master and Foundation expert, Rafi manages the Foundation Forum. Rafi Benkual managed people, stores and small organizations before joining ZURB as our Customer Advocate.
Brandon is a mastermind when it comes to Foundation. He contributed several key components and of the latest version of our framework.
Master the Powerful Framework Used By...
A Word From Our Students
Here's a few words from folks who took the course.
The presentation was very clear and concise. It was obvious that you guys enjoy working on Foundation. I walked away excited about the possibilities. Nice work!
North Virginia Community College
All speakers explained the components of the framework in a fun and engaging manner.
Very knowledgeable instructors. Great content that was covered in timely manner. Effective delivery mechanism. Great moderation.
What you’ll learn in this class
Using Foundation 6
Learn how to go from Prototype to Production with Foundation 6
9:00AM - 9:45AM PDT
- Getting started with Foundation: Learn the quickest way to get Foundation configured and installed
- Explanation of our mobile first approach: Use the mobile-first grid to get support for the largest number of old devices.
- Deep dive into our flexible, powerful grid: Learn how to quickly build complex responsive layouts using the Foundation grid.
Prototyping with Foundation part 1
Faster prototyping with Foundation UI components
10:00AM - 10:45AM PDT
- Block grid: Create evenly spaced blocks and get elements to line up easily.
- Source Ordering: Shift columns around between our breakpoints to dictate how responsive layouts are viewed.
- Buttons: Create clear calls to action by just adding a style.
- Typography: Get great looking type and vertical rhythm right out of the box.
- Callouts: Highlight content or sections of your page.
- Forms: Layout inputs, selects, and labels to create easy to use forms.
Prototyping with Foundation part 2
Faster prototyping with Foundation navigation components
11:00AM - 11:45AM PDT
- Navigation: How to quickly implement 5 common navigation patterns.
- Pagination, Breadcrumbs: Create useful sub-navigation patterns that create simple user flows.
- Magellan: Build a solid navigation that scrolls users to the content they want to see.
- Visibility classes: Show different navigation or content elements for different devices.
12:00PM - 12:45PM PDT
- Toggler: Creating your own plugins with toggler and using Motion UI to animate them.
- Reveal: Create dead-simple responsive modals and add Motion UI animations.
- Dropdown Pane: Organize multi-tier content — just add links and go.
Why our class format rocks
This class is presented live by members of the ZURB team! You'll get a chance to interact with us directly.
We conduct the class online via GoToTraining, so you can attend from anywhere in the world.
Get all your questions answered during the live Q&A sessions. Each class topic is paired with dedicated Q&A time.
Keep the recording
After you complete the class, we'll send you the class slides, examples and the recording so you'll always have it to reference.