Category Archives: Uncategorized

Package Project

Package Project Steps

  1. Pick a partner or work alone. If working with a partner, you must complete 2 versions of your design.
  2. Check out these package designs for inspiration.
  3. Pick a product. It can be real or you can invent one. If it exists, make sure that your package design is not a copy of what already exists.
  4. Pick a package template, book template or CD cover template.
  5. Brainstorm package/cover idea & get sign-off from Ms. Wilkens.
  6. Print out a template and draw out your ideas/layout on paper & get sign-off from Ms. Wilkens.
  7. Write a list of all the elements that are part of your package design, eg. logo, product info, product image, ingredients, background, text, etc. Then write that list up as your first padlet entry.
  8. Pick digital tools to use and start creating assets. Use your padlet to save and share assets.

Minimum required elements (B Effort)

  • Purpose of the package/cover is clear and relevant to the target audience
  • Images used in package/cover are original
  • Package/cover demonstrates effective use of contrast
  • Package/cover demonstrates effective use of repetition
  • Package/cover demonstrates effective use of alignment 
  • Package/cover demonstrates effective use of proximity
  • Package/cover demonstrates effective use of colors
  • Package/cover demonstrates effective use of typography
  • Package/cover has no spelling or grammatical errors
  • Package/cover is legible
  • Package/cover is nicely assembled
  • If you work as a team, each member needs to produce a different version of the package/cover
  • Package/cover/reflection is turned in on time

Minimum required elements (A Effort)

  • Your branding of the package/cover is unique & creative
  • Package/cover/reflection demonstrates effective use of digital arts tools
  • Package/cover demonstrates an overall understanding of the principles of design

Daily Reflections

At the end of every class, you will update your padlet with screenshots of images you are working on for your package design as well as answering the questions: What did you accomplish? What are you going to work on next? Is anything blocking you?

Due Date: 12/13 (6 days)

  1. Go through the Package Project checklist & verify you have completed everything. 
  2. Upload the digital artifacts from your package design as well as an image of your physical package on your blog. 
  3. Explain how your package design demonstrates each of the following: contrast, repetition, alignment, proximity, colors and typography.

Scavenger Hunt

  • Find an image for each design principle. 
  • It must be part of a product’s package. Think of things you purchase that come in boxes, bottles, containers, or book/album covers.
  • Post image on the matching padlet below.
  • If an image has already been posted, find another one, you cannot post the same image as someone else.
  • When you find an image, right-click and copy image location
  • When you share on padlet
    • Title: First name(s)
    • Description: cite web source
    • Link: copy image location

Padlets

Finished? Try out weavesilk.com. Screenshot at least one image you created and identify it’s design principles as your padlet reflection today.

Collage Project

Due date: Monday, 12/2. Export image and upload to your padlet. Reflect on what you learned and what you could improve next time.

Done early? Photoshop Challenge: Silhouettes

  • Create a silhouette and play with adding a pattern or creating a shadow effect
  • Hot tip: Use the Pen Tool and in Options Bar select Shape Layers. Make sure foreground color is set to black.
  • Find step-by-step instructions here.

Photoshop Project

Vocabulary

  • Contrast – difference between color, value, size
  • Desaturate – make colors more muted (more black or white added)
  • Displacement mapping – gives the surface a sense of depth and detail
  • Filter – individual algorithms that alter the appearance of an image
  • Gradient – specifies a range of position-dependent colors, usually used to fill a shape

Graffiti Project

  • Download this brick wall image to use (source: Pixels)
  • Do not download a font. Find one you can use in Photoshop. Be sure it has a bold option.
  • Pick ONE word to turn into graffiti. Size it as large as possible on the wall.
  • After first day, be sure to save your work and screenshot. Add the screenshot to your Padlet.

Nov 12 & 13 – Stay focused & productive!

  • Wrap-up Graffiti Project. Export & upload impact to your padlet. Reflect on what you enjoyed about this project and what you found challenging (Tuesday)
  • Double-check your reflections to see if they are thorough & meaningful. Update/add as needed (Tuesday)
  • Complete self-evaluation and goal statements (Tuesday)
  • Review self-evaluation and goal statement with Ms. Wilkens (Wednesday)
  • Create your buttons (Wednesday)
  • Do a challenge (Tuesday & Wednesday)
    • Do another graffiti project, but use an image instead of or in addition to text.
    • Create a custom brush with Processing and create a work of art.
    • Create a logo using shapes in Illustrator.
    • Take a selfie and try out the different filters in Photoshop.
    • Create a funny, but appropriate image, using layers and transparency in Photoshop.

Nov 14 – bonus day (8th grade only)

Nov 18 – New Art Groups – meet in 7/8 Commons

Illustrator Project

Vocabulary

  • DPI – dots per inch
  • Font – typeface, size and weight of text
  • Path – a line or curve with anchor points
  • PPI – pixels per inch
  • Serif vs. Sans Serif
  • Typography

Experiment

  • Experiment with text on a path
  • Create a shape -> Shape Tool
  • Create a curve -> Pen Tool
  • Draw a path -> right-click on Shaper Tool and select Pencil Tool
  • Experiment with Text on each of these objects
  • Right-click on Text and select Text on a Path
  • Select a point on the path of shape, curve or drawing.
  • Move text around and try out different fonts, sizes, colors.
  • NOTE: Need an inspirational quote for your text? Check here.

Take a screenshot of your experiment. On your Padlet share file and reflect: What did you learn? What is your plan for your button?

Create Unity Day Buttons

  • Create a circle and try out gradients.
  • You will create buttons with text on a path inside circle. No uploading images! You can create an image in Piskel or Photoshop.
  • Button 1: Imagine, Discover, Create
  • Button 2: Find a quote to use:
  • Button 3: Your own quote (appropriate & not too silly)
  • For each button you create, be sure to export separately as a .PNG
  • Upload each to your Padlet and reflect: What did enjoy about this activity? What did you find challenging?
  • Finished early? Create something in Piskel, Photoshop or Illustrator OR explore Processing.

Day 5 – Layers: Intro to Photoshop

Vocabulary

  • Background – bottom layer
  • Eraser – removes color and turns transparent
  • Layer – different levels where you can place and move objects around
  • Magic wand – a selection tool based on color
  • Raster image – created with a program like Photoshop or GIMP and are based on pixels. Photos and digital paintings are usually raster images.
  • Transform – Scale and Rotate

Intro to Photoshop

  • Save this image of a hand (Source: istockphoto)
  • Open Photoshop and File -> Open image of hand
  • Search for an object to put in hand (Hint: make sure image has transparent background)
  • File -> Place Embedded and find your object (Hint: notice this created a new layer)
  • Scale, move and rotate as needed (Hint: if you need to scale or rotate later, find options under Edit -> Transform)
  • Search for a background image (Hint: be sure image is larger than the hand image which is 612×408)
  • File -> Place Embedded and find your background
  • Drag background image to bottom of layers (Hint: if you see a lock on hand image, click it to unlock)
  • To make background visible, select layer with hand. Use Magic Wand select white background. Select Edit -> Clear. You should now see your background image.
  • See video tutorial below for more hints
  • On your Padlet share .PNG file and reflect: What did you enjoy about activity? What did you find challenging? Where did you get images?

Day 4 – Color: Processing

Vocabulary of Color

  • Hue – the name of the color
  • Saturation – brilliance or intensity of the color
  • Transparency – how much you can see through a layer
  • Value – lightness or darkness of the color

Painting with code

void setup() {
  size(800,600);
  background(100, 100, 100);
}

void draw() {
 if (mousePressed) {
    background(255, 255, 255);
  }

  fill(200, 200, 200);
  ellipse(mouseX, mouseY, 100, 100);
}

Instructions

  • Copy code above and paste into Sketch Playground.
  • Change mode from P5js to Processing.js.
  • Update color, run, paint and take a screenshot.
  • Add another shape and give it another color.
  • Adjust transparency level for one shape. For example, fill (200, 100, 200, T) where T can be set from 0 to 100. Run, paint and take a screenshot.
  • Keep experimenting until it’s time to reflect. Be sure to capture your experiments along the way.
  • On your Padlet share your favorite screenshot(s) and reflect: What did you enjoy about activity? What did you find challenging?