Video Description
Now that new tools have blurred the line between the Web’s front and back ends, full stack engineers are in great demand—and for many, that means becoming more comfortable with user interface development. That’s where this hands-on video course comes in. Web designer and host Mike Kivikoski shows you how to use basic design principles to mold your code into something beautiful. By the time you complete this course, you’ll be able to create UI design mockups and then make them real.
- Create a UI pattern with HTML5 and CSS, and refactor and expand it with HAML and SASS
- Learn how to build grid systems of different sizes with CSS and SASS
- Pick up basic typography skills, and learn how to improve your text and display fonts
- Understand color theory, and learn strategies for building a color library
- Dive into production-ready UI patterns that include a button library, a headline library, and content sections
- Get the basics for building (and updating) a single codebase for multiple smartphones and tablets
- Learn about various UI frameworks and their benefits, including Bootstrap, Compass, and Bourbon Neat
Mike Kivikoski runs Atedrake, a web design studio in Somerville, Massachusetts. He has also served as an Adjunct Professor at Endicott College, teaching Intro to Web Development and Intro to Web Design.
Table of Contents
- Introduction 00:00:33
- Learn the Basics of HTML 00:10:39
- Learn the Basics of CSS 00:08:25
- Writing the Basics of CSS 00:16:45
- Creating a UI Pattern 00:15:31
- Expanding on a UI Pattern 00:03:53
- What is HAML and SASS? 00:07:46
- How to Install HAML and SASS 00:07:24
- How to Write in HAML 00:07:15
- Refactoring Our UI Pattern 00:06:13
- Using SASS 00:23:02
- Expanding on Our UI Pattern with SASS 00:10:39
- Learning About Grid Systems 00:11:03
- Grid Systems with HTML & CSS 00:15:45
- Grid Systems with HAML and SASS 00:09:34
- Typography for the Web 00:08:59
- Applications of Typography 00:18:20
- Learn Color Theory for the Web 00:15:08
- Building More UI Patterns 00:17:16
- Build for Mulitple Devices 00:21:26
- UI Frameworks 00:04:32