Please enable JavaScript to use CodeHS

TCH047DE3 Web Design 1 OHVA - Outline

  1. Getting Started - What is the Web?

    1. 1.1 Welcome

    2. Video 1.1.1 Welcome to Web Design
    3. Check for Understanding 1.1.2 Welcome to Web Design Quiz
    4. Free Response 1.1.3 Websites in Your Life
    5. Free Response 1.1.4 What is Web Design?
    6. Free Response 1.1.5 Course Goals
    7. Connection 1.1.6 Web Design and Web Development
    8. Connection 1.1.7 Meet a Web Developer

    9. 1.2 The Internet

    10. Video 1.2.1 What is The Internet?
    11. Check for Understanding 1.2.2 What is the Internet? Quiz
    12. Connection 1.2.3 Internet Censorship: Google's Dragonfly Project
    13. Free Response 1.2.4 Internet Censorship Reflection
    14. Connection 1.2.5 The Right to Remain Anonymous?
    15. Free Response 1.2.6 Anonymity Reflection
    16. Video 1.2.7 How does the Internet Work?
    17. Check for Understanding 1.2.8 How does the Internet Work? Quiz
    18. Free Response 1.2.9 Internet Protocols

    19. 1.3 Browsers

    20. Video 1.3.1 Browsers
    21. Check for Understanding 1.3.2 Browser Quiz
    22. Connection 1.3.3 What is a Browser?
    23. Connection 1.3.4 Your Browser
    24. Free Response 1.3.5 Explaining a Browser

    25. 1.4 Viewing Websites

    26. Video 1.4.1 Viewing Websites
    27. Check for Understanding 1.4.2 Viewing Websites Quiz
    28. Free Response 1.4.3 Explaining a URL

    29. 1.5 Getting Started - What is the Web? Quiz

    30. Unit Quiz 1.5.1 Getting Started - What is the Web? Quiz
    31. Badge 1.5.2 Getting Started Badge

  2. HTML - Structuring Websites

    1. 2.1 Introduction to HTML

    2. Video 2.1.1 Introduction to HTML
    3. Check for Understanding 2.1.2 Introduction to HTML Quiz
    4. Example 2.1.3 Our First HTML Page
    5. Exercise 2.1.4 Say Hello!

    6. 2.2 Structure of an HTML Page

    7. Video 2.2.1 Structure of an HTML Page
    8. Check for Understanding 2.2.2 Structure of an HTML Page Quiz
    9. Example 2.2.3 HTML Template
    10. Example 2.2.4 Hello World Page
    11. Exercise 2.2.5 The <title> Tag
    12. Exercise 2.2.6 Your First HTML Page

    13. 2.3 Formatting Text

    14. Video 2.3.1 Formatting Text
    15. Check for Understanding 2.3.2 Formatting Text Quiz
    16. Example 2.3.3 Dictionary
    17. Exercise 2.3.4 Word Definitions
    18. Exercise 2.3.5 Pet Names
    19. Exercise 2.3.6 Call of the Wild
    20. Badge 2.3.7 Formatting Badge

    21. 2.4 Links

    22. Video 2.4.1 Links
    23. Check for Understanding 2.4.2 Links Quiz
    24. Example 2.4.3 The <a> Tag
    25. Exercise 2.4.4 Bookmarks
    26. Exercise 2.4.5 Encyclopedias

    27. 2.5 Images

    28. Video 2.5.1 Images
    29. Check for Understanding 2.5.2 Images Quiz
    30. Example 2.5.3 The <img> Tag
    31. Example 2.5.4 Building the CodeHS Homepage
    32. Exercise 2.5.5 Collage on a Theme
    33. Exercise 2.5.6 Linking an Image
    34. Exercise 2.5.7 National Parks

    35. 2.6 Copyright

    36. Video 2.6.1 Copyright
    37. Check for Understanding 2.6.2 Copyright Quiz
    38. Example 2.6.3 Citing Sources Example
    39. Connection 2.6.4 Exploring Creative Commons
    40. Free Response 2.6.5 Response: Creative Commons
    41. Free Response 2.6.6 Finding Images
    42. Exercise 2.6.7 Make a Collage
    43. Free Response 2.6.8 Why Copyright is Important

    44. 2.7 HTML Lists

    45. Video 2.7.1 HTML Lists
    46. Check for Understanding 2.7.2 HTML Lists Quiz
    47. Example 2.7.3 Grocery Shopping
    48. Exercise 2.7.4 Class Planning
    49. Exercise 2.7.5 Dream Destinations
    50. Exercise 2.7.6 Vacation Guides

    51. 2.8 HTML Tables

    52. Video 2.8.1 HTML Tables
    53. Check for Understanding 2.8.2 HTML Tables Quiz
    54. Example 2.8.3 Address Book
    55. Exercise 2.8.4 National Sports
    56. Exercise 2.8.5 Table of Favorites

    57. 2.9 HTML Styling

    58. Video 2.9.1 HTML Styling
    59. Check for Understanding 2.9.2 HTML Styling Quiz
    60. Example 2.9.3 Stylish Address Book
    61. Exercise 2.9.4 Background Colors
    62. Exercise 2.9.5 Style Your Class List
    63. Badge 2.9.6 Styling Badge

    64. 2.10 HTML Colors

    65. Video 2.10.1 HTML Colors
    66. Check for Understanding 2.10.2 HTML Colors Quiz
    67. Example 2.10.3 HTML Colors Examples
    68. Exercise 2.10.4 Create Your Own Color
    69. Exercise 2.10.5 Gradients
    70. Connection 2.10.6 Color Wheel
    71. Exercise 2.10.7 Using Good Colors

    72. 2.11 HTML - Structuring Websites Quiz

    73. Unit Quiz 2.11.1 HTML - Structuring Websites Quiz
    74. Badge 2.11.2 HTML Badge

  3. CSS - Styling Websites

    1. 3.1 Introduction to CSS

    2. Video 3.1.1 Introduction to CSS
    3. Check for Understanding 3.1.2 Introduction to CSS Quiz
    4. Example 3.1.3 Styling your H1s
    5. Exercise 3.1.4 First style with CSS
    6. Exercise 3.1.5 List Styling
    7. Exercise 3.1.6 Endangered Animals: Skeleton

    8. 3.2 CSS Select by Tag

    9. Video 3.2.1 CSS Select by Tag
    10. Check for Understanding 3.2.2 CSS Select by Tag Quiz
    11. Example 3.2.3 Rainbow
    12. Example 3.2.4 Puppy Styling
    13. Exercise 3.2.5 Set List
    14. Exercise 3.2.6 Your Appliance Recommendations
    15. Exercise 3.2.7 Endangered Animals: Style the Headers

    16. 3.3 CSS Select by Class

    17. Video 3.3.1 CSS Select by Class
    18. Check for Understanding 3.3.2 CSS Select by Class Quiz
    19. Example 3.3.3 Simple Checkerboard
    20. Exercise 3.3.4 Swim Meet
    21. Exercise 3.3.5 Favorite Things
    22. Exercise 3.3.6 Endangered Animals: Add Color Coding

    23. 3.4 CSS Select by ID

    24. Video 3.4.1 CSS Select by ID
    25. Check for Understanding 3.4.2 CSS Select by ID Quiz
    26. Example 3.4.3 Logo
    27. Exercise 3.4.4 Must Do Today!
    28. Exercise 3.4.5 Lomeli's Menu
    29. Exercise 3.4.6 Endangered Animals: Add Pictures
    30. Badge 3.4.7 Selector Badge

    31. 3.5 The Cascade

    32. Video 3.5.1 The Cascade
    33. Check for Understanding 3.5.2 The Cascade Quiz
    34. Example 3.5.3 Using Importance
    35. Example 3.5.4 Order of Precedence
    36. Exercise 3.5.5 We Really Like Dairy
    37. Exercise 3.5.6 Style the Table

    38. 3.6 CSS - Styling Websites Quiz

    39. Unit Quiz 3.6.1 CSS - Styling Websites Quiz
    40. Badge 3.6.2 CSS Badge

  4. Project - Create Your Homepage

    1. 4.1 Homepage: Your First Website

    2. Example 4.1.1 Example Homepage
    3. Connection 4.1.2 Real World Homepage
    4. Challenge 4.1.3 Set Up Your codehs.me Website
    5. Challenge 4.1.4 Create Your Homepage
    6. Badge 4.1.5 Create Your Homepage Badge

  5. The Internet

    1. 5.1 Getting Started - The Internet

    2. Video 5.1.1 Welcome to the Internet
    3. Check for Understanding 5.1.2 Welcome to the Internet Quiz
    4. Free Response 5.1.3 The Internet and You

    5. 5.2 Internet Hardware

    6. Video 5.2.1 Hardware of the Internet
    7. Check for Understanding 5.2.2 Internet Hardware Quiz
    8. Connection 5.2.3 The Internet is in the Ocean

    9. 5.3 Internet Addresses

    10. Video 5.3.1 Internet Addresses
    11. Check for Understanding 5.3.2 Internet Addresses Quiz
    12. Free Response 5.3.3 The Need for Addresses
    13. Check for Understanding 5.3.4 4-bit Addresses
    14. Free Response 5.3.5 IPv4 vs IPv6

    15. 5.4 DNS

    16. Video 5.4.1 DNS
    17. Check for Understanding 5.4.2 DNS Quiz
    18. Connection 5.4.3 How Does DNS Work?
    19. Free Response 5.4.4 How Does DNS Work?

    20. 5.5 Routing

    21. Video 5.5.1 Routing
    22. Check for Understanding 5.5.2 Routing Quiz
    23. Free Response 5.5.3 Redundancy
    24. Traceroute 5.5.4 Route Tracing

    25. 5.6 Packets and Protocols

    26. Video 5.6.1 Packets and Protocols
    27. Check for Understanding 5.6.2 Packets and Protocols Quiz
    28. Resource 5.6.3 Passing Notes
    29. Connection 5.6.4 How the Internet Works
    30. Free Response 5.6.5 The Story of the Internet

    31. 5.7 The Impact of the Internet

    32. Video 5.7.1 The Impact of the Internet
    33. Check for Understanding 5.7.2 The Impact of the Internet Quiz
    34. Connection 5.7.3 Pokemon Go: Unintended Effects

    35. 5.8 The Internet Quiz

    36. Unit Quiz 5.8.1 The Internet Quiz

  6. Web Design Pretest

    1. 6.1 Web Design Pretest

    2. Notes 6.1.1 About the Pretest
    3. Survey 6.1.2 Mindsets
    4. Quiz 6.1.3 Knowledge & Skills: Web Design

  7. Advanced HTML and CSS

    1. 7.1 Getting Started - Advanced HTML and CSS

    2. Video 7.1.1 Getting Started
    3. Example 7.1.2 Example: Image Filters
    4. Example 7.1.3 Example: Animations
    5. Example 7.1.4 Example: Interactions

    6. 7.2 Multi-file Websites

    7. Video 7.2.1 Splitting Your Site into Files
    8. Check for Understanding 7.2.2 Splitting Your Site into Files Quiz
    9. Example 7.2.3 Multipage Site Example
    10. Exercise 7.2.4 Add a Style Sheet
    11. Exercise 7.2.5 Dividing the Site
    12. Exercise 7.2.6 Career Site: Creating Structure

    13. 7.3 Embedding iframes

    14. Video 7.3.1 Embedding iframes
    15. Check for Understanding 7.3.2 Embedding IFrames Quiz
    16. Example 7.3.3 Embedding CodeHS
    17. Example 7.3.4 Embedding a Map
    18. Exercise 7.3.5 Embedding a Website
    19. Exercise 7.3.6 Embed a Tweet
    20. Exercise 7.3.7 Embed a Video
    21. Exercise 7.3.8 Career Site: Include Outside Information

    22. 7.4 Divs

    23. Video 7.4.1 Divs
    24. Check for Understanding 7.4.2 Divs Quiz
    25. Example 7.4.3 Divvying up the Site
    26. Exercise 7.4.4 Quotes
    27. Exercise 7.4.5 Flags
    28. Exercise 7.4.6 Career Site: Separate the Content
    29. Badge 7.4.7 Div Badge

    30. 7.5 Spans

    31. Video 7.5.1 Spans
    32. Check for Understanding 7.5.2 Spans Quiz
    33. Example 7.5.3 Span Formatting
    34. Exercise 7.5.4 Vocabulary
    35. Exercise 7.5.5 Text Decoration
    36. Exercise 7.5.6 Career Site: Style Special Pieces

    37. 7.6 Combining CSS Selectors

    38. Video 7.6.1 Combining CSS Selectors
    39. Check for Understanding 7.6.2 Combining CSS Selectors Quiz
    40. Example 7.6.3 More Specific Styling
    41. Exercise 7.6.4 Choosing Nested Tags
    42. Exercise 7.6.5 Highlight the First Item
    43. Exercise 7.6.6 Calorie Recommendations

    44. 7.7 The Don't Repeat Yourself Principle

    45. Video 7.7.1 Don't Repeat Yourself
    46. Check for Understanding 7.7.2 Don't Repeat Yourself Quiz
    47. Example 7.7.3 Styling Multiple Tags
    48. Example 7.7.4 Style Similar Items with Same Class
    49. Exercise 7.7.5 Managing Change
    50. Exercise 7.7.6 Condense CSS Rules
    51. Free Response 7.7.7 Why DRY?

    52. 7.8 Special Selectors

    53. Video 7.8.1 Special Selectors
    54. Check for Understanding 7.8.2 Special Selectors Quiz
    55. Example 7.8.3 Vote For Me
    56. Example 7.8.4 Vote For Me Pt 2
    57. Exercise 7.8.5 Extend Vote For Me
    58. Exercise 7.8.6 Special Vendors
    59. Exercise 7.8.7 Checklist
    60. Exercise 7.8.8 Career Website: Add Milestones
    61. Badge 7.8.9 Special Selectors Badge

    62. 7.9 Visibility

    63. Video 7.9.1 Visibility
    64. Check for Understanding 7.9.2 Visibility Quiz
    65. Example 7.9.3 Display Example
    66. Example 7.9.4 Fading Text
    67. Exercise 7.9.5 Favorite Sea Creature
    68. Exercise 7.9.6 Caption on Demand

    69. 7.10 Reading Documentation

    70. Video 7.10.1 Reading Documentation
    71. Check for Understanding 7.10.2 Reading Documentation Quiz
    72. Example 7.10.3 Using Docs: Float
    73. Example 7.10.4 Using Docs: <blockquote> Tag
    74. Exercise 7.10.5 Style the Table
    75. Exercise 7.10.6 Electric Company
    76. Exercise 7.10.7 Career Website: Add Pictures

    77. 7.11 Using the Inspector

    78. Video 7.11.1 Using the Inspector
    79. Check for Understanding 7.11.2 Using the Inspector Tool Quiz
    80. Connection 7.11.3 Inspector Quick Start
    81. Check for Understanding 7.11.4 Classes and IDs
    82. Check for Understanding 7.11.5 Exploring the Art Museum
    83. Check for Understanding 7.11.6 What's Your Style?

    84. 7.12 The Box Model

    85. Video 7.12.1 The Box Model
    86. Check for Understanding 7.12.2 The Box Model Quiz
    87. Example 7.12.3 Adding Space Using Margin
    88. Example 7.12.4 Adding Space Using Padding
    89. Example 7.12.5 Combining Margin and Padding
    90. Exercise 7.12.6 I need some space!
    91. Exercise 7.12.7 I need some breathing room!
    92. Free Response 7.12.8 Where is space added?
    93. Exercise 7.12.9 Align Content Side by Side
    94. Exercise 7.12.10 Career Website: Separate Content
    95. Connection 7.12.11 Design with the Box Model
    96. Badge 7.12.12 Box Badge

    97. 7.13 Image Manipulation

    98. Video 7.13.1 Image Manipulation
    99. Check for Understanding 7.13.2 Image Manipulation Quiz
    100. Example 7.13.3 Grayscale Filter
    101. Example 7.13.4 Blur Filter
    102. Example 7.13.5 Hue Rotation
    103. Exercise 7.13.6 Invert Filter
    104. Exercise 7.13.7 Blurred
    105. Exercise 7.13.8 Hue Rotation Comparisons
    106. Exercise 7.13.9 Overexposure
    107. Exercise 7.13.10 Grayscale Art
    108. Exercise 7.13.11 Aesop's Fables Part 1
    109. Exercise 7.13.12 Aesop's Fables Part 2

    110. 7.14 Animation

    111. Video 7.14.1 Animation
    112. Check for Understanding 7.14.2 Animation Quiz
    113. Example 7.14.3 Animated Image Filter
    114. Exercise 7.14.4 Animated Invert Filter
    115. Exercise 7.14.5 Album Cover
    116. Exercise 7.14.6 Aesop's Fables Part 3

    117. 7.15 Interaction

    118. Video 7.15.1 Interaction
    119. Check for Understanding 7.15.2 Interaction Quiz
    120. Example 7.15.3 Interactive Image Filter
    121. Example 7.15.4 Smooth Interactive Image Filter
    122. Example 7.15.5 Smooth Change on Click
    123. Exercise 7.15.6 Button Interaction
    124. Exercise 7.15.7 Create Your Own Tooltip
    125. Exercise 7.15.8 Aesop's Fables Part 4
    126. Exercise 7.15.9 Career Website: Engage the User
    127. Connection 7.15.10 CSS Tricks

    128. 7.16 Advanced HTML and CSS Quiz

    129. Unit Quiz 7.16.1 Advanced HTML and CSS Quiz
    130. Badge 7.16.2 Advanced HTML and CSS Badge

  8. Project - Tell a Story

    1. 8.1 Project: Tell a Story

    2. Connection 8.1.1 Real World Example: Infographic
    3. Challenge 8.1.2 Project: Tell a Story
    4. Badge 8.1.3 Tell a Story Badge

  9. Bootstrap

    1. 9.1 What is Bootstrap?

    2. Video 9.1.1 What is Bootstrap?
    3. Example 9.1.2 Example Bootstrap Mobile Site
    4. Connection 9.1.3 Real World Bootstrap: OneNYC
    5. Free Response 9.1.4 Responsive vs Unresponsive
    6. Free Response 9.1.5 Favorite Bootstrap Site

    7. 9.2 Getting Started with Bootstrap

    8. Video 9.2.1 Getting Started with Bootstrap
    9. Check for Understanding 9.2.2 Getting Started Quiz
    10. Example 9.2.3 First Bootstrap Page
    11. Example 9.2.4 Container-Fluid Page
    12. Exercise 9.2.5 Using the Bootstrap Skeleton
    13. Exercise 9.2.6 Your First Bootstrap
    14. Challenge 9.2.7 1. Photo Portfolio
    15. Connection 9.2.8 Container Docs

    16. 9.3 Jumbotron Pages

    17. Video 9.3.1 Jumbotron Pages
    18. Check for Understanding 9.3.2 Jumbotron Pages Quiz
    19. Example 9.3.3 First Jumbotron Page
    20. Example 9.3.4 Realty: Jumbotron
    21. Exercise 9.3.5 Your First Jumbotron
    22. Exercise 9.3.6 Add a Jumbotron!
    23. Challenge 9.3.7 2. Photo Portfolio
    24. Connection 9.3.8 Jumbotron Docs
    25. Badge 9.3.9 Jumbotron Badge

    26. 9.4 The Bootstrap Grid System

    27. Video 9.4.1 The Grid System
    28. Check for Understanding 9.4.2 The Bootstrap Grid Quiz
    29. Example 9.4.3 Grid System Example
    30. Example 9.4.4 Column Overflow
    31. Example 9.4.5 Different Device Sizes
    32. Example 9.4.6 Example Layout
    33. Example 9.4.7 Realty: Grid System
    34. Exercise 9.4.8 Grid Practice
    35. Exercise 9.4.9 Endangered Animals
    36. Challenge 9.4.10 3. Photo Portfolio
    37. Connection 9.4.11 Grid System Docs

    38. 9.5 Bootstrap Components

    39. Video 9.5.1 Bootstrap Components
    40. Check for Understanding 9.5.2 Bootstrap Components Quiz
    41. Example 9.5.3 Page Headers
    42. Example 9.5.4 Making Buttons
    43. Example 9.5.5 Button Groups
    44. Example 9.5.6 Using Glyphicons
    45. Example 9.5.7 Realty: Buttons and Page Headers
    46. Exercise 9.5.8 Header and Buttons
    47. Exercise 9.5.9 Glyphicon Buttons
    48. Challenge 9.5.10 4. Photo Portfolio
    49. Connection 9.5.11 Button Docs
    50. Connection 9.5.12 Glyphicon Docs

    51. 9.6 More Bootstrap Components

    52. Video 9.6.1 More Bootstrap Components
    53. Check for Understanding 9.6.2 More Bootstrap Components Quiz
    54. Example 9.6.3 Thumbnail Skeleton
    55. Example 9.6.4 Kitten Thumbnails
    56. Example 9.6.5 Table Skeleton
    57. Example 9.6.6 Striped Tables
    58. Example 9.6.7 Realty: Thumbnails
    59. Exercise 9.6.8 Shoe Shop
    60. Exercise 9.6.9 Adding Captions
    61. Exercise 9.6.10 Bootstrap Tables
    62. Exercise 9.6.11 Favorite TV Shows
    63. Exercise 9.6.12 Favorite Animals
    64. Challenge 9.6.13 5. Photo Portfolio
    65. Connection 9.6.14 Thumbnail Docs
    66. Connection 9.6.15 Table Docs

    67. 9.7 Navigation Bars

    68. Video 9.7.1 Navigation Bars
    69. Check for Understanding 9.7.2 Navigation Bars Quiz
    70. Connection 9.7.3 Navbar Docs
    71. Example 9.7.4 Simple Nav Tabs
    72. Example 9.7.5 Basic Navbar
    73. Example 9.7.6 Basic Collapsable Navbar
    74. Example 9.7.7 Realty: Navbar
    75. Example 9.7.8 Realty: Collapsable Navbar
    76. Exercise 9.7.9 Navigation Links
    77. Exercise 9.7.10 Navbar Alignment
    78. Exercise 9.7.11 Making Navbars
    79. Challenge 9.7.12 6. Photo Portfolio

    80. 9.8 Drop Down Menus

    81. Video 9.8.1 Drop Down Menus
    82. Check for Understanding 9.8.2 Drop Down Menus Quiz
    83. Example 9.8.3 Basic Dropdown
    84. Example 9.8.4 Realty: Dropdown
    85. Exercise 9.8.5 World Traveller
    86. Exercise 9.8.6 Which Animal?
    87. Exercise 9.8.7 Dropdown Nav
    88. Challenge 9.8.8 7. Photo Portfolio
    89. Connection 9.8.9 Drop Down Menu Docs
    90. Badge 9.8.10 Menu Badge

    91. 9.9 Using Bootstrap Examples

    92. Video 9.9.1 Using Bootstrap Examples
    93. Check for Understanding 9.9.2 Using Bootstrap Examples Quiz
    94. Connection 9.9.3 Bootstrap Starter Templates
    95. Example 9.9.4 Realty: Carousel
    96. Example 9.9.5 Blog Bootstrap Template
    97. Example 9.9.6 Carousel Bootstrap Template
    98. Example 9.9.7 Dashboard Bootstrap Template
    99. Example 9.9.8 Cover Bootstrap Template
    100. Example 9.9.9 Cover Site From Template
    101. Challenge 9.9.10 Modify the Template
    102. Challenge 9.9.11 8. Photo Portfolio

    103. 9.10 Bootstrap Challenges

    104. Challenge 9.10.1 Sticky Navbar
    105. Challenge 9.10.2 Adding Interactions
    106. Challenge 9.10.3 Team Page
    107. Challenge 9.10.4 9. Photo Portfolio

    108. 9.11 Bootstrap Quiz

    109. Unit Quiz 9.11.1 Bootstrap Quiz
    110. Badge 9.11.2 Bootstrap Badge

  10. Bootstrap Project

    1. 10.1 Bootstrap Project

    2. Example 10.1.1 Example Mobile Responsive Website
    3. Connection 10.1.2 Real World Bootstrap: University of Washington
    4. Connection 10.1.3 Real World Bootstrap: Maple
    5. Challenge 10.1.4 Project: Create a Mobile Responsive Website
    6. Badge 10.1.5 Bootstrap Project Badge

  11. Designing User Interfaces

    1. 11.1 Intro to Design Thinking

    2. Video 11.1.1 Intro to Design Thinking
    3. Check for Understanding 11.1.2 Intro to Design Thinking
    4. Free Response 11.1.3 User Interface Scavenger Hunt
    5. Connection 11.1.4 Case Study: Helping Blind People See
    6. Free Response 11.1.5 Case Study Responses
    7. Connection 11.1.6 Crash Course: Empathize
    8. Free Response 11.1.7 Empathize Notes
    9. Connection 11.1.8 Crash Course: Define
    10. Free Response 11.1.9 Problem Statement
    11. Connection 11.1.10 Crash Course: Ideate
    12. Free Response 11.1.11 Ideate Notes
    13. Connection 11.1.12 Crash Course: Prototype and Test
    14. Free Response 11.1.13 Testing Notes
    15. Free Response 11.1.14 Topic Brainstorm
    16. Free Response 11.1.15 Narrowing Down Topics

    17. 11.2 Empathy

    18. Video 11.2.1 Empathy
    19. Check for Understanding 11.2.2 Empathy Quiz
    20. Connection 11.2.3 A Cafeteria Designed for Me
    21. Free Response 11.2.4 A Cafeteria Designed for Me
    22. Connection 11.2.5 Accessibility
    23. Free Response 11.2.6 Accessibility Tips
    24. Free Response 11.2.7 Accessibility: Designing for ALL
    25. Connection 11.2.8 How to Interview
    26. Free Response 11.2.9 How to Interview
    27. Free Response 11.2.10 User Interview

    28. 11.3 Define

    29. Video 11.3.1 Define
    30. Check for Understanding 11.3.2 Define Quiz
    31. Connection 11.3.3 Make a Composite Character Profile
    32. Free Response 11.3.4 Composite Character Profile
    33. Free Response 11.3.5 Point-of-View Statement Brainstorm
    34. Free Response 11.3.6 POV Statement

    35. 11.4 Ideate

    36. Video 11.4.1 Ideate
    37. Check for Understanding 11.4.2 Ideate Quiz
    38. Connection 11.4.3 Stoke
    39. Free Response 11.4.4 Get Stoked
    40. Connection 11.4.5 Brainstorming Tips
    41. Free Response 11.4.6 Ideate!

    42. 11.5 Prototype

    43. Video 11.5.1 Prototype
    44. Check for Understanding 11.5.2 Prototype Quiz
    45. Connection 11.5.3 Brainstorm Selection
    46. Free Response 11.5.4 Harvest Ideas from the Brainstorm
    47. Connection 11.5.5 Wizard of Oz Prototyping
    48. Connection 11.5.6 Example Wizard of Oz Paper Prototype
    49. Free Response 11.5.7 Make Your Paper Prototypes!

    50. 11.6 Test

    51. Video 11.6.1 Test
    52. Check for Understanding 11.6.2 Testing Quiz
    53. Connection 11.6.3 Testing with Users
    54. Connection 11.6.4 Example: How to User Test
    55. Free Response 11.6.5 How to User Test Responses
    56. Connection 11.6.6 Example: How NOT to User Test
    57. Free Response 11.6.7 How NOT to User Test Responses
    58. Free Response 11.6.8 Test Prototype 1
    59. Free Response 11.6.9 Test Prototype 2
    60. Free Response 11.6.10 Improve Your Prototype

    61. 11.7 Designing User Interfaces Quiz

    62. Unit Quiz 11.7.1 Designing User Interfaces Quiz
    63. Badge 11.7.2 Designing User Interfaces Badge

  12. Final Project

    1. 12.1 Final Web Design Project

    2. Free Response 12.1.1 Milestones
    3. Challenge 12.1.2 Final Project
    4. Badge 12.1.3 Final Project Badge
    5. Badge 12.1.4 Web Design Completed