Principals of Layout Design

Students will understand the four major principals of Gestalt (Proximity, Alignment, Repetition, and Contrast) in order to revise design samples.


  1. Typing Practice
  2. What is wrong with this ad (Slide 2)?
    1. Polls Everywhere
    2. Results
  3. G4 – Layout Design Presentation (Above)
    1. You will need the Design Practice File
    2. Save as a .jpeg – “Every slide” and post completed slides to WordPress as G4 – Layout Practice as a Slideshow
  4. Sample Project Revision
    1. Complete this form with a neighbor, be sure to sight all four principals at least once in your responses.
  5. Project Work Time – Keep the principles of Gestalt in mind as you design your Graphic Novel PSA with your groups
      1. Resources
        1. Assignment Website
        2. Editing Photos Screencast
        3. Creating your Layout Screencast
  6. Closure


Photoshop Layouts


G4 - Graphic Novel Rough Draft

  1. Typing for 5 minutes
  2. Editing Your Photos – Video Instructions
    1. Filter–> Artistic–> Poster Edges
    2. Copying the subject to a layer
    3. Adjusting the Hue/Saturation
    4. Blend Modes – Shadows and Glows
  3. Creating your Layout in Photoshop – Video tutorials (sorry this one is long…but it shows you how to do all of the following)
    1. Create the document
    2. Inserting Multiple images
    3. Adding a stroke around your image
    4. Creating text boxes and bubbles
    5. Incorporating Illustrations
  4. Group Work Time
    1. Review Expectations and Class Dojo
    2. While some work on layouts, others could continue to edit photos.


Graphic Novel Planning Day

Objective: Students will plan their graphic novel PSA using panels frames and gutters and create frames that effectively incorporate photography and text.

This slideshow requires JavaScript.


  1. Typing Practice at or
  2. Graphic Novels – Elements and Vocabulary in Graphic Novels
    1. Use the arrows to connect the Vocabulary to their samples in this Powerpoint File. – When finished, save it as a .jpeg and upload it to wordpress as part of G2 – Brainstorm and Plan
  3. Group Work Time
    1. Expectations and Behaviors – Review Class Dojo
    2. G3 – Photo Plan
      1. Working with your group, develop an outline of your Graphic Novel PSA (on scratch paper).
      2. Make a list of what photos you will need to take.
  4. IFF all groups have their photolist, we will go out to the quad to take photos.
    1. When we return, upload the photos to your computer and begin editing in photoshop. {Make sure to duplicate layers and use the Save As option)  – Have one person add it to their G3 post as a gallery so they are stored online as well.
    2. If it is raining we will use this file instead of your own pictures to practice.
      1. Select the subject with lasso or quick select tool
      2. Filter – Poster Edges – to get Graphic Novel Effects
      3. Filters – Experiment with other filters
      4. Adjustment – Threshold – Black and White
      5. Liquify – For Exaggeration
      6. Perspective Warp (Ctrl+T)
      7. Need More Ideas?
    3. Be consistent between MOST of your photo edits so that your frames will look similar.
  5. Up Next – Using a Layout Program – Fotofusion to Create your Graphic Novel Rough Draft (G4)

Graphic Novels

Objective: Students will explore the concept of Graphic Novels and create an outline of their own graphic novel Public Service Announcement.

G2 - After completing the post, bring your dialogue to life using the "For Fun Account" at and the Snipping Tool

G1 – After completing the post, bring your dialogue to life using the “For Fun Account” at and the Snipping Tool


  1. TypingWeb
  2. Reflections and Planning for the 2012-2013 Photobook
    1. Upload your top 3 best projects here
    2. For Each image, include a message with a credit line
      1. Your Name, Project Title, Date Created, Program Used, Brief Description
  3. New Post: {G1 – A Dialogue}
    1. Create a a Dialogue between two people about one of the following topics:
      1. A storeowner accusing a teenager of shoplifting
      2. A teacher calling your home to (complain or praise) about what you did today.
      3. A break-up over the phone between two middle-schoolers.
      4. Recreate a scene from your favorite TV show, Book or Movie
      5. A student athlete who is talking to his coach after missing the final shot (or catch or goal) in a championship.
      6. Another conversation of your choice
  4. – Bring your story to life as a comic, add the image to your post in G1
    1. What, Why, and How
    2. Create an account – Just for Fun
    3. Create a Comic – Choose a quickie, we don’t have much time.
      1. Set your scene and your characters
      2. Add text.
      3. Use the Snipping tool to take a picture of your image and save it as a .jpg and POST to WordPress with G1.
  5. The Graphic Novel PSA Assignment – Working in groups of up to 4, create a graphic novel style Publish Service Announcement to provide essential information to Locke Students as they prepare for the end of the year.Graphic Novel Brainstorm and Plan
    1. TODAY {G2 – Brainstorm and Sketch} – Due Today (or at the start of next class)
      1. Use a piece of paper or
    2. Looking Ahead
      1. G3 – List of Photos you need to take.
      2. G4 – Rough Draft
        1. Also Post your Rough Draft to this Tumblr
      3. G5 -Final Draft and Self Assess Using Rubric



Finishing the Illustrations

Objective:  Students will finish their illustrations and begin exploring how to capture their community through photography.

1st 9:40-10:22
Snack 10:22-10:32
CS 11:24-12:45
Lunch 12:45-1:17
CS 1:22-2:12
6th period 2:18-3


D9 - Choice Illustration - Elizabeth S. 2013, It is not Justin Bieber.

D9 – Choice Illustration – Elizabeth S. 2013, It is not Justin Bieber.


  1. Typing Practice
  2. New York Times Contest –
  3. Principals Appreciation
  4. If you don’t know Dr. G, what do you appreciate about Locke 1?  You can thank her for helping to make that possible.
  5. Google Form and Grade Check – Reflection and Graphic Novel Diagnostic
  6. Work Time – D9 – Choice Illustration – Or finish up any remainign work
    1. D7 – Illustration Process – Creating Outlines
    2. D8 – Coloring in Illustrator – In Progress (You can get started)
    3. D5 – 3 of Me
    4. Make Up Work
  7. Done with Everything? Extra Credit Animations!
    1. D10 – Extra Credit – Learn how to create animations in photoshop

Read to Learn How:

  1. Save for web as a .gif and post to your wordpress {D10 – Extra Credit}
  2. You will need this file

The Illustration Process

Objective: Work through the process of illustration, from starting with a sketch, to outlining the image and finally adding fills, colors and effects to your image.

Wednesday Mini Lesson: D7.5 – Follow the instructions on this file in illustrator

Vance/Rogers – 1)Typing 2) Online Coloring 3) Coloring in Paint 4) SpellingCity/Vocab

HW: Bring Headphones for upcoming classes to follow the videos.


  1. Typing Practice at
  2. D7 – Illustration Process – Creating Outlines
  3. D8 – Coloring in Illustrator – In Progress (You can get started)
  4. Make Up Work
  5. Get a Head start on D9

Revisiting D5 – 3 of Me

If you need to contact Mr. Levin, please complete the form below.

Drawing in Illustrator

Objective: Use the brush, pen, and selection tools in illustrator to design a logo for yourself.

Mr. Vance/Ms. Rogers

Typing Practice, Logo Quiz, Spelling/Vocab, Drawing in Paint, SpellingCity/Freerice


  1. Typing Practice at
  2. New Post: {D6 – Hello, My Name Is} – 5 minute brainstorm to answer the following questions –
    • What are my strengths in this class?
    • What are my weaknesses in this class?
    • What are my favorite colors?
    • What artwork do I like?
    • What would I like to make in this class (Tshirts, Stencils, Posters, Resumes, Presentations, other)
    • What work would I like to do in the future?
  3. Complete this survey during the Presentation
  4. Today’s Project – D6 – Hello, My Name is
  5. Pen Tool Review – Stroke over the numbers using the Pen Tool in Photoshop then add to your D4 Gallery
    1. Pen Tool Review – Click Here for File
    2. Re-Open your D4 -Pen tool Intro Post
    3. Click on the gallery
    4. Click the Edit Gallery Button
    5. Click Add Images on the left

Click the gallery, then click the edit gallery button and add the the pen tool review to your post.

Introduction to Drawing and Digital Photography


  • Given 3 templates in photoshop, students will use the Pen tool to create, stroke and fill paths in increasingly more difficult scenarios.
  • Students will use Photoshop selection tools to combine three images into a single photo-montage containing at least three images of themselves in a single scene.

This slideshow requires JavaScript.


  1. Typing Practice at
  2. Mini-Lesson
    1. Vector vs. Raster Artwork
    2. How to learn from screen casts/tutorial
  3. Into to Pen Tool
    1. A quick game – Connect the Dots
  4. Project Work Time – Self Guided
    1. D4 – Intro to the Pen Tool – Deadline Tuesday April 16th
    2. D5 – 3 of Me Photography Project – Rolling Deadline – Only one group of 3 can go out at a time.
  5. Progress Tracker coming soon.
    1. Are you keeping up? Are all of these on your WordPress.
      1. D1 – Freewrite
      2. D2 – Matrix Artwork
      3. D3 – Photo Gallery
      4. D4 – Pen Tool Intro

Ms. Rogers/Mr. Vance

  1. Typing Practice
  2. Complete three (3) connect the dots here.  (Do not save)
  3. Select one of the connect the dots images and copy (ctrl+C) and paste (ctrl+V) into paint.  Use the paint tools to connect the dots and decorate the image.  Save as a jpeg and post to your kidblog (password: student)
  4. Work on Vocabulary Presentations/Spelling City

Homework: Bring Headphones and make sure that your 5 photos are uploaded to WordPress.

Wednesday 4/10/2013

Sorry I am not here.


  1. Typing test at
  2. Complete this Form
  3. Post your 5 photos to WordPress
    1. D3 – Photography Gallery
    2. Upload all 5 images as a Gallery – Detailed Instructions
      1. Click “Add Media”
      2. –>Create Gallery
      3. Upload Files (Highlight Multiple files at once by holding Ctrl)
      4. Click “Create a New Gallery”
    3. Add a brief caption to each image explaining what the picture is of and which of the prompts it relates to.
    4. Under Type – Choose anything other than Thumbnail Grid
  4. Finished Early
    1. Make Up or Redo any Missing or Low Credit Assignments
      1. Check PowerSchool
    2. Extra Credit Assignment:
      1. D3 – Extra Credit
      2. Edit one of your images by following this tutorial.
        1. Tutorial
        2. **Make sure to use SAVE AS and rename the file so that you don’t loose your original image**
        3. If you don’t have an image to use, you may use this one.

Welcome Back – Unit D – Digital Photography and Drawing

Objective: Students will incorporate blending options in photoshop to create a series of images that correspond with their spring break experiences.

This slideshow requires JavaScript.


  1. Typing Practice @ (Typing Test on Wednesday)
  2. Grade Reflection – Click here
    1. Group Project Revisions – If you did not get an A, you may revise and revisit your group projects on your own time during April.  Your group must show your revised draft to Mr. Levin to receive an updated score.
    2. If you are completely missing the group project, it is now an individual project.  – See Mr. Levin for supports and instructions.
  3. New Post – {D1 – 4th Quarter Free-write} – 5 Minutes
    1. Reflect on your spring break – What did you do?  What did you like?  What did you not like?  How do you feel about returning to school?
    2. Goal setting for this final quarter?  What do you hope to accomplish by June 7th?  You should include goals for your academics, activities, home life, and social life.
  4. New Project – D2_MatrixEffects
    1. Challenge: Create a series of three Matrix-style images using the turorial below.  Save all three as jpegs and post as a gallery to a new post in WordPress.  I also recommend saving the original file as a .psd in case you need to return to the file later. The three images should support your reflection from your spring break.
      1. Resources
        1. Instructions, File, Video and Text
    2. Post Title {D2 – Spring Break in the Matrix}
      1. Include: Slideshow of 3 images
    3. <Extension> Exploration of blending Modes
      1. Information About Blend Modes
      2. Use this file – Try changing the blend mode of the text layer from Normal to:
        1. Screen
        2. Multiply
        3. Overlay
        4. Experiment with the rest!
  5. Introduction to Digital Photography and Drawing unit and Homework
    1. Introduction to a few Photography Concepts
    2. Homework {D3 – Photography Gallery}

      1. Post a gallery (you may choose the format, but make sure it looks good) of 5 photos: (Click the link for ideas and suggestions)
        1. One self-portrait (be creative)
        2. One that captures your community (or home, or environment)
        3. One that exemplifies the rule of thirds
        4. One using natural lines
        5. One taken from a unique angle.
      2. You may use a camera, phone, or any other digital photography device.  You may need to borrow from a friend, but you MUST take your own pictures.
      3. You can e-mail them to yourself, post them to instagram or take any steps you need to get the photos onto your WordPress.  (You can even go on WordPress from home)
    1. Take a TYPING TEST
    2. Complete the Survey at
    3. Post your Photography Gallery of 5 images