---
layout: slide-deck
title: "Finding patterns"
desc: "A group activity helping recognize common patterns on the web and comparing them to practiced patterns."

group_work: true

slides:
  - type: super-big-text
    content: |
      **Finding patterns**

  - content: |
      ## Set up

      1. Form into pairs
      2. Get out pencils & paper
      3. You’ll be shown a pattern—determine the code assignment we’ve done that is most similar

  - type: image
    image: pattern-1.jpg

  - type: image
    image: pattern-2.jpg

  - type: image
    image: pattern-3.jpg

  - type: image
    image: pattern-4.jpg

  - type: image
    image: pattern-5.jpg

  - type: image
    image: pattern-6.jpg

  - type: image
    image: pattern-7.jpg

  - type: image
    image: pattern-8.jpg

  - type: image
    image: pattern-9.jpg

  - type: image
    image: pattern-10.jpg

  - type: image
    image: pattern-11.jpg

---

---
layout: slide-deck
title: "Finding patterns"
desc: "A group activity helping recognize common patterns on the web and comparing them to practiced patterns."

group_work: true

slides:
  - type: super-big-text
    content: |
      **Finding patterns**

  - content: |
      ## What & why

      Many websites are made of up of similar design patterns, repeated and tweaked to create a new website.

      When we can determine what pattern the design matches we can more easily duplicate it.

      **Matching patterns to references we’ve done before simplifies writing code.**

  - content: |
      ## Set up

      1. Form into pairs
      2. Get out pencils & paper
      3. You’ll be shown a pattern—determine the code assignment we’ve done that is most similar

  - type: image
    image: pattern-1.jpg

  - type: image
    image: pattern-2.jpg

  - type: image
    image: pattern-3.jpg

  - type: image
    image: pattern-4.jpg

  - type: image
    image: pattern-5.jpg

  - type: image
    image: pattern-6.jpg

  - type: image
    image: pattern-7.jpg

  - type: image
    image: pattern-8.jpg

  - type: image
    image: pattern-9.jpg

  - type: image
    image: pattern-10.jpg

  - type: image
    image: pattern-11.jpg

---

Add a “What & why” section to finding patterns
Add a “What & why” section to finding patterns
