CSUMB-MIST
  • Home
    • Annotated Bibliography
    • Applications
    • Professional Organizations
  • Term 1A & 1B
    • T1. A. 501 Technology Workshop >
      • Set Up, ePortfolio
      • Audio / Video
      • Instructional Video
      • Interactive Video and Multimedia
      • Learning Management Systems
      • Tools- Research/ Searching
      • Webology
      • 501 Assignments
    • T1. A. 524 Instructional Technology >
      • Intro, ISD, Controversies
      • Behaviorism / Cognitivism
      • Constructivism
      • Performance/ Change Management
      • Views, Issues, Lecternnosaurus
      • Trends, Issues, Ethics
      • Current Issues/ New Directions
      • Wrap Up
      • 524 Assignments
    • T1. B. 522 Instructional Design >
      • Introduction, ISD Model
      • Needs Analysis 1
      • Task Analysis 2
      • Analysis / Design 1
      • Design 2
      • Asynchronous Seminar
      • Implementation / Evaluation 2
      • 522 Assignments
    • T1. B. 511 Writing Workshop >
      • APA / In-Text Citations
      • Evaluation APA/ Reference
      • Conjunction
      • Apostrophe
      • Annoted Bibliography
      • Implementation / Evaluation 2
      • Guides
      • Workshop Reflection
      • 511 Assignments
  • Term 2
    • T2. 520 Learning Theories >
      • Learning Theory
      • The Brain, Skinner
      • Robert Gagné - Information
      • Social Constructivism/ Metacognition
      • Inuit Holistic Lifelong L.M.
      • Albert Bandura
      • Motivation in Learning
      • Putting It All Together
      • 520 Assignments
    • T2. 531 Multimedia Tools >
      • Basics
      • Audio
      • Scripting, Editing, Titles
      • Framing, shots, and Movements
      • Preparation, Lighting, and Interviews
      • Theory and Copyright
      • Final Instructional Video
      • 531 Assignments
  • Term 3
    • T3. 526 Interactive Multimedia Instruction >
      • Authoring Software
      • Try it/ Guide me
      • Test me
      • Drag and Drop
      • Final Projects
      • Tin Can
      • Project Simulation
      • Audio / Images
  • Term 4
    • T4. 622 Assessment/ Evaluation >
      • Evaluation
      • Inferential Statistics and Evaluation Models
      • T-Test / Meaning of Scores
      • Data Collection Methods
      • Usability Test / Performance Assessment
      • Evaluation Data
      • Ethics, Bias, and Effective Evaluation
      • Data Analytics and Wrapping Up
  • Term 5
    • T5. 541 Multimedia Tools II: Interactive Media >
      • HTML5 / Common Tags
      • CSS
      • jQuery UI Lab 2
      • jQuery UI Lab 3
      • Storyboard/ lab 4
      • Local Storage Lab 5
      • Image Map/ Hot Spot
      • Final Project Description
      • 541 Assignments
      • checking_fluid_levels
    • T4. 626 Advanced Instructional Design >
      • 1 ISD Models, Team Projects
      • 2 Analysis 1, Needs Assessment
      • 3 Task Analysis, Content Types
      • 4 Assessments/ Testing
      • 5 Course Design, Lesson Design
      • 6 Development, Adding Activites
      • 7 Formative Evaluation
      • 8 Final Product
      • 626 Assignments
  • chat room
Picture

Technology Workshop

Graphic Design

0    wk1​​    wk2    wk3    wk4    wk5    wk6    wk7    wk8    assignments

Term 1A.  IST:501

Week 2 Objectives

M3.0 Lecture Materials
M3.1 Graphic Design for Instructors
M3.1 Photo Manipulation Assignment
M3.2 Graphic Layout/ Job Aid Forum
  • Apply the principles of PARC (Proximity, Alignment, Repetition, and Contrast) as they relate to visual design​
  • Perform the following tasks to images: crop, resize, rotate, remove/blur, background, composite images and text
  • Export an image with a transparent background
  • Identify the differences and uses of the image formats .jpeg, .png, .pdf
  • Create an effective graphic using the PARC principles.

Assignments  ​

Picture
  1. Transparent Background, two layers
  2. Photograph with Rounded edges
  3. Composite, two different images
  4. Company Logo

Reference/ Guides

  1. Sign up for a Dropbox Account
  2. Pixlr Editor has 4 products. Support article covers the differences
  3. Adobe Photoshop.  Atomic Learning Training in iLearn.
  4. How to use The Rule of Thirds.  Dashburst

PARC

  1. Apply the principles of PARC (Proximity, Alignment, Repetition, and Contrast) as they relate to visual design
  2. Perform the following tasks to images:  crop, resize, rotate, remove / blur background, composite images and text
  3. Export an image with a transparent background
  4. Identify the differences and uses of the image formats .jpeg, .png, .pdf
  5. Create an effective graphic using the PARC principles
  6. Share an image in the appropriate file format, quality and file size

Transparent Background

App:  Adobe Photoshop.
Equipment:  Sony Camera (HDR 6000), MacBook Pro (15 in Retina) white sheet used for backdrop. 
​Operating System:  OSX (Yosemite 10.10.4).
Application:  PIXLR
Steps:

  1.  Set up backdrop/green screen.
  2.  Take photo of object in front of backdrop.
  3.  Use App Adobe Photoshop and create layers.
  4.  Use the "wand" tool to select object.
  5.  Create the "mask area" of the object.
  6.  Delete the unwanted area around object.
  7.  The checkerboard background must be seen.
  8.  Save as png file.
  9.  Post to Weebly.


​Time Required: 1 hour.
Steps 1-3.  Set up/pack up approx 30 minutes
Steps 4-8.  Image manipulation approx 20 minutes
Step 9.  Post to Weebly approx 10 minutes
Picture
Transparent background. PNG file.
Picture
Steps 1. From menu, select "layer tool." Add a new layer, name it. 2. Select "mask," or "vector" tool.

Second Transparent Background

App:  Adobe Photoshop.
Equipment:  Sony Camera (HDR 6000), MacBook Pro (15 in Retina) white sheet used for backdrop. 
​Operating System:  OSX (Yosemite 10.10.4).
Application:  PIXLR
Steps:

  1.   Use App Adobe Photoshop and create layers.
  2.  Use the "wand" tool to select object.
  3.  Create the "mask area" of the object.
  4.  Delete the unwanted area around object.
  5.  The checkerboard background must be seen.
  6.  Save as png file.
  7.  Post to Weebly.


​Time Required: 1 hour.
Steps 1-3.  Set up/pack up approx 30 minutes
Steps 4-8.  Image manipulation approx 20 minutes
Step 9.  Post to Weebly approx 10 minutes
Picture
Picture
The first layer created for my composite. Choose to use only one dinosaur, removed the background and saved onto a layer.

Photograph with Rounded Edges

App:  Adobe Photoshop.
Equipment:  Sony Camera (HDR 6000), MacBook Pro (15 in Retina) white sheet used for backdrop. 
​Operating System:  OSX (Yosemite 10.10.4).
Application:  PIXLR
Steps:
  1.  Use App Adobe Photoshop and create layers.
  2.  Use the "wand" tool to select object.
  3.  Create the "mask area" of the object.
  4.  Delete the unwanted area around object.
  5.  The checkerboard background must be seen.
  6.  Save as png file.
  7.  Post to Weebly.


​Time Required: 1 hour.
Steps 1-3.  Set up/pack up approx 30 minutes
Steps 4-8.  Image manipulation approx 20 minutes
Step 9.  Post to Weebly approx 10 minutes
Picture
Picture

Composite with Two Different Images I

Steps:
  1.  Take photograph of toy dinosaurs.
  2.  Use Adobe Photoshop "wand" tool to select the background then delete the unwanted area.
  3.  Select "layer" and "mask" or "vector mask" tool.
  4.  Have second photograph (Grand Canyon) on a new layer. 
  5.  Arrange layers as needed.  Dinosaurs will be in the front for this example.
​Time Required: 20 minutes.
Equipment:  Sony Camera (HDR 6000), MacBook Pro (15 in Retina).  and two toy dinosaurs.
Operating System:  OSX (Yosemite 10.10.4).
Application:  Adobe Photoshop, Version 12.4
Files: Two Photographs 
Picture
The first of two images to create my composite is from this image of a pair of dinosaurs.
Picture
Image of the Grand Canyon. Used for the background.

Composite with Two Different Images II

Picture
Composite of two images with a transparent background.
Picture
Composite of the dinosaur and myself.

Assignment Logo

Company Logo - PDF.
Equipment:  Sony Camera (HDR 6000), MacBook Pro (15 in Retina).
Operating System:  OSX (Yosemite 10.10.4).
Application:  Adobe Photoshop, Version 12.4, Apple Keynote Version 12.4 and Apple Preview Version 8.0.
Steps: 
  1.  Adobe Photoshop was used to create Logo.
  2.  Text, leaf, water drop and pool, blue ring, and
        green background were on separate layers.
  3.  "Masking" tool used on leaf.
​  4.  Save file as PDF.
Time Required: 30 minutes.
Picture

Assignment Logo

d_payne_week_2_logo__6_sep_15_.pdf
File Size: 788 kb
File Type: pdf
Download File

Payne e-Portfolio
Dana Payne

Testing the chat box widget from chatango.com
Titled ​Q&A
.

​​E-mail dpayne@csumb.edu

  • Home
    • Annotated Bibliography
    • Applications
    • Professional Organizations
  • Term 1A & 1B
    • T1. A. 501 Technology Workshop >
      • Set Up, ePortfolio
      • Audio / Video
      • Instructional Video
      • Interactive Video and Multimedia
      • Learning Management Systems
      • Tools- Research/ Searching
      • Webology
      • 501 Assignments
    • T1. A. 524 Instructional Technology >
      • Intro, ISD, Controversies
      • Behaviorism / Cognitivism
      • Constructivism
      • Performance/ Change Management
      • Views, Issues, Lecternnosaurus
      • Trends, Issues, Ethics
      • Current Issues/ New Directions
      • Wrap Up
      • 524 Assignments
    • T1. B. 522 Instructional Design >
      • Introduction, ISD Model
      • Needs Analysis 1
      • Task Analysis 2
      • Analysis / Design 1
      • Design 2
      • Asynchronous Seminar
      • Implementation / Evaluation 2
      • 522 Assignments
    • T1. B. 511 Writing Workshop >
      • APA / In-Text Citations
      • Evaluation APA/ Reference
      • Conjunction
      • Apostrophe
      • Annoted Bibliography
      • Implementation / Evaluation 2
      • Guides
      • Workshop Reflection
      • 511 Assignments
  • Term 2
    • T2. 520 Learning Theories >
      • Learning Theory
      • The Brain, Skinner
      • Robert Gagné - Information
      • Social Constructivism/ Metacognition
      • Inuit Holistic Lifelong L.M.
      • Albert Bandura
      • Motivation in Learning
      • Putting It All Together
      • 520 Assignments
    • T2. 531 Multimedia Tools >
      • Basics
      • Audio
      • Scripting, Editing, Titles
      • Framing, shots, and Movements
      • Preparation, Lighting, and Interviews
      • Theory and Copyright
      • Final Instructional Video
      • 531 Assignments
  • Term 3
    • T3. 526 Interactive Multimedia Instruction >
      • Authoring Software
      • Try it/ Guide me
      • Test me
      • Drag and Drop
      • Final Projects
      • Tin Can
      • Project Simulation
      • Audio / Images
  • Term 4
    • T4. 622 Assessment/ Evaluation >
      • Evaluation
      • Inferential Statistics and Evaluation Models
      • T-Test / Meaning of Scores
      • Data Collection Methods
      • Usability Test / Performance Assessment
      • Evaluation Data
      • Ethics, Bias, and Effective Evaluation
      • Data Analytics and Wrapping Up
  • Term 5
    • T5. 541 Multimedia Tools II: Interactive Media >
      • HTML5 / Common Tags
      • CSS
      • jQuery UI Lab 2
      • jQuery UI Lab 3
      • Storyboard/ lab 4
      • Local Storage Lab 5
      • Image Map/ Hot Spot
      • Final Project Description
      • 541 Assignments
      • checking_fluid_levels
    • T4. 626 Advanced Instructional Design >
      • 1 ISD Models, Team Projects
      • 2 Analysis 1, Needs Assessment
      • 3 Task Analysis, Content Types
      • 4 Assessments/ Testing
      • 5 Course Design, Lesson Design
      • 6 Development, Adding Activites
      • 7 Formative Evaluation
      • 8 Final Product
      • 626 Assignments
  • chat room