Lessons:15Length:2.5 hours
1.1 Welcome to the Course
Let’s begin with a quick overview of what this course entails and the things you’ll be learning to help developers understand your designs. I'll also introduce you to the design we’ll be working on.
1.Introduction
1.1Welcome to the Course01:16
1.1
Welcome to the Course
01:16
2.Laying the Foundation
2.1Basic Wrapper Layout06:51
2.1
Basic Wrapper Layout
06:51
2.2Design Shortcut: Start With an Image10:21
2.2
Design Shortcut: Start With an Image
10:21
2.3Create Content for the First Panel14:32
2.3
Create Content for the First Panel
14:32
2.4Start Forming a Color Palette09:11
2.4
Start Forming a Color Palette
09:11
2.5Test Color Contrasts as You Go03:45
2.5
Test Color Contrasts as You Go
03:45
2.6Choose and Preview in a Handoff Application Designed for Coding07:06
2.6
Choose and Preview in a Handoff Application Designed for Coding
07:06
2.7Check for Half Pixels and Prevent Misalignment13:41
2.7
Check for Half Pixels and Prevent Misalignment
13:41
3.Fleshing Out Content
3.1Create a CSS-Ready Gradient Background05:46
3.1
Create a CSS-Ready Gradient Background
05:46
3.2Basic Typography and Buttons12:36
3.2
Basic Typography and Buttons
12:36
3.3Don’t Forget to Design Links!06:07
3.3
Don’t Forget to Design Links!
06:07
3.4Complete Typography: Headings, Line Heights, and Margins22:35
3.4
Complete Typography: Headings, Line Heights, and Margins
22:35
3.5Ensure Content Is Collapse Friendly15:52
3.5
Ensure Content Is Collapse Friendly
15:52
3.6Tidy Up and Add Notes for the Coder13:35
3.6
Tidy Up and Add Notes for the Coder
13:35
4.Conclusion
4.1Wrapping Up07:54
4.1
Wrapping Up
07:54
