Unit 1 Graphic design using Adobe Fireworks CS4

Save this PDF as:
Size: px
Start display at page:

Download "Unit 1 Graphic design using Adobe Fireworks CS4"

Transcription

1 Unit 1 Graphic design using Adobe Fireworks CS4 Timing: hours Unit overview To produce quality images for the web, students need to understand how digital images are created and then learn and apply essential graphic design principles. Adobe Fireworks CS4 is an image-editing program designed to create images, effects, and optimization especially for web pages. This unit is project-based, so students plan and evaluate the images they produce. In the unit, students learn to create, modify, and optimize a variety of digital images. They compare image file size and quality during phases of production. The unit balances instruction of specific techniques with encouraging students to research technical aspects of the program on their own. Students are introduced to project evaluation and reflection to incorporate solutions into subsequent projects. Unit objectives At the completion of the unit, students will have developed the following skills: Project management skills Planning a scan Creating a storyboard Following standard copyright practices for text Reviewing and redesigning images Planning graphics based on needs and audience Design skills Optimizing JPEGs and GIFs Editing images Using composition, contrast, and balance Applying the rule of thirds Creating emphasis Applying proximity and patterns Using line Using shape Using unity and color Using typography Design and create original page banner Research and communication skills Understanding graphics types Understanding copyright issues Collecting and analyzing audience needs and purpose to inform design Communicating with peers to review and redesign images Present and communicate design principles to peers Technical skills General Scanning photographs, objects, and drawings Using a digital camera Fireworks Using panel elements and structure Creating text Setting export window options Creating effects Using drawing tools 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 1

2 Activity summary The unit contains the following activities, with handouts and other materials. Activity Activity 1.1: Introduction to graphics and copyright Activity 1.2: Introduction to scanning Activity 1.3: Using a digital camera Activity 1.4: Optimizing graphics for the web Activity 1.5: Making a nameplate Activity 1.6: Planning a logo Activity materials Guide: Principles and rules of copyright Guide: Internet citations Guide: Sample student document Scanner Objects to scan Drawing materials (colored pencils, paper, tape, scissors, and so on) File folders for each student Guide: Scanning Guide: How to scan images without image-editing software Presentation: Introduction to scanning One or more digital cameras Floppy disks or other storage devices, if the camera model requires them Cables to connect the camera to a computer, if needed Software, usually bundled with the camera, that allows for transfer of images from camera to computer Worksheet: Fireworks Optimize panel Guide: Fireworks Optimize panel Guide: How to optimize GIF images Guide: How to optimize JPEG images Worksheet: Fireworks tools Guide: Fireworks panels Guide: How to build a nameplate Guide: How to create effects Worksheet: Nameplate interview Grid paper Drawing materials (pencils, pens, paper, colored pencils, and so on) Presentation: Introduction to graphic design Presentation: Storyboards Activity 1.7: Building a logo Students logo storyboards from Activity Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

3 Activity Activity 1.8: Logo review and redesign Activity 1.9: Planning a page banner Activity 1.10: Building a page banner Activity 1.11: Page banner review and redesign Activity materials Worksheet: Logo review and redesign Examples of page banners of varying designs Grid paper (optional) Drawing materials (pencils, pens, paper, colored pencils, and so on) Students page banner storyboards from Activity 1.9 Guide: How to create a page banner Worksheet: Page banner review and redesign Guide: Review and redesign presentation topics 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 3

4 Activity 1.1 Introduction to graphics and copyright Objectives Identify and distinguish between GIF, JPEG, and PNG formats. Understand how graphics are viewed. Create graphics. Copy and save images and graphics from the Internet, using appropriate citations for copyright. Use copyright terms correctly. Materials Guide: Principles and rules of copyright Guide: Internet citations Guide: Sample student document Time minutes Overview The instructor introduces web graphic formats (GIF, JPEG, and PNG). After a brief class discussion about copyright, students locate, select, save, and annotate a collection of image files, representing the three main file types (GIF, JPEG, and PNG) used to publish on the web. Student product: Text document with images, as well as individual image files Activity steps 1. Introduce the file types available for graphics: GIF, JPEG, and PNG. Discuss how the file types differ and when it is appropriate to use each type of file. You might also distinguish between a Fireworks native PNG and a PNG image. 2. Use a sample website to discuss the types of materials that are copyrighted and explain whether they fall under intellectual property, fair use doctrine, derivative works, or academic standards. Discuss methods students can use to copyright their own work. Guide: Principles and rules of copyright Guide: Internet citations 4 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

5 3. Have students search the Internet to find and save at least one sample of each type of graphic: GIF, JPEG, and PNG. Ask students to consider whether they would need to seek permission should they choose to use the graphic in any work they might create. 4. Have students save all their work in two ways: as a set of individual graphic files (for later use) and in a text document that includes notes about the graphics. Guide: Sample student document 5. Have students identify copyright-protected graphics on each site and write a citation for each graphic they download. 6. For each object or piece of information that is copyrighted, have students explain the rationale for copyright, using key vocabulary terms, and indicate what type of permission would need to be obtained for using this work. Preparation Find a website to use as an example for showing students copyrighted materials. If you choose to use the Principles and rules of copyright, Internet citations, or Sample student document guides, make photocopies. If you don t want students to do an open-ended graphics search, create a list of websites they can investigate and use later for their logo and page banner projects. Students will use a text document to save images with notes. You might want to try this yourself to see how a document will look. Review the Sample student document guide. Rationale Visual images and graphics are an important part of digital design. Selecting the appropriate graphic file types is an important part of the technical aspects of constructing web-ready materials. Background resources Conduct a search (perhaps on using the following keywords: image, image type, GIF images, JPEG images, or PNG images. Website with more information on copyright: Stanford University Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 5

6 Assessment Does not meet expectations Meets expectations Exceeds expectations Images Absent or incomplete. Documents include identification of each image file type, but students cannot clearly articulate the differences between file types or when to use a particular file type. Documents include identification of each image file type and students can clearly articulate the differences between file types as well as clearly explain when to use each file type. Copyright citations Absent or incomplete. Students practice good use of copyright citations for each image, but student rationales do not include clear rationale on why the image is copyrighted. However, students have not synthesized their research to be able to identify the type of permission needed to use the images in other work. Students practice good use of copyright citations for each image, and student rationales include clear rationale on why the image is copyrighted. Students have synthesized their research to be able to identify the type of permission needed to use images in other work. ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students II. Communication and Collaboration Students use digital media and environments to communicate and work collaboratively, including at a distance, to support individual learning and contribute to the learning of others. Students: A. interact, collaborate, and publish with peers, experts, or others employing a variety of digital media and formats. B. communicate information and ideas effectively to multiple audiences using a variety of media and formats. III. Research and Information Fluency Students apply digital tools to gather, evaluate, and use information. Students: B. locate, organize, analyze, evaluate, synthesize, and ethically use information from a variety of sources and media. 6 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

7 C. evaluate and select information sources and digital tools based on appropriateness to specific tasks. Adobe Certified Associate, Web Communication objectives 1.3 Demonstrate knowledge of standard copyright rules (related terms, obtaining permission, and citing copyrighted material). 4.4 Insert images and apply alternative text on a web page. Key terms GIF JPEG PNG copyright intellectual property fair-use doctrine derivative works academic standards bibliography 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 7

8 Activity 1.2 Introduction to scanning Objectives Create scanned black-and-white images and color images. Modify file type, resolution, and image size of images. Materials Scanner Graphics, photographs, or objects to scan Instructor workstation connected to a projector, or an overhead projector, for presentation slides Guide: Scanning Guide: How to scan images without image-editing software Presentation: Introduction to Scanning Drawing materials (colored pencils, paper, tape, scissors, and so on) File folders for each student Time minutes Overview Students gather images from magazines, newspapers, or books, artwork, or other objects they find (leaves, flowers, and so on) to practice scanning and to create graphical content to include in future projects. In class, the instructor starts with a demonstration of scanning. Students produce an individual body of work (electronic files and folders with original materials). Student product: A file folder with original images (or photocopies of images), a set of electronic image files, and an annotated document with all image files Activity steps 1. Briefly demonstrate the four steps in using a scanner: Plan, Scan, Edit, Save. Guide: Scanning Guide: How to Scan Images without Image-Editing Software Presentation: Introduction to scanning 8 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

9 2. Explain the importance of planning. Have students answer the planning questions found in the Scanning guide for each of the objects or images they will scan. 3. Demonstrate the first scan pass. Talk about the orientation and placement of objects or images on the scanner, cleanliness of the glass, and so on. Be sure to mention not to lift the cover while the scan is in process. Note: Sometimes the lamp takes several minutes to warm up; remind students to be patient. 4. Explain scan mode, resolution, and image size (crop) and how these affect file size. Have students write down the scan mode and resolution they will use for their objects and images. 5. Demonstrate how to set the scan mode, resolution, and image size (crop). If you re using the Scanning guide, you might have students add specific directions for the class scanner to the handout. 6. Explain the file types. If you are using a stand-alone scanner, have students save the files in TIF or BMP format. Have students write down where they saved the document, the name of the document, the size of the document, and the scan mode and resolution they used. Ask students to save the scanned images in one specified folder (directory). Note: Make sure students save files in the native format file type and the web-ready file type. 7. Have students practice scanning. They should create at least one black-and-white image and one color image. 8. Have students scan their images and objects and then save their work in two ways: as individual image files and in a text document that includes all images with notes about each image. (For ideas, look at the Sample student document guide in Activity 1.1: Introduction to graphics and copyright.) Preparation Ask students to bring in images to scan that represent themselves or their interests. These could be magazine pictures, photos, hand drawings, or objects they find (leaves, flowers, and so on). Determine how students will store files on workstations or the school server. Find out how much space is available for each student. Optional: Review the presentation, Introduction to scanning. Modify the How to scan images without image-editing software guide instructions to be scanner specific, as desired. Have drawing materials (colored paper, pencils, glue, scissors, and so on) available for students wishing to create original artwork. Note: If your classroom has limited resources, you might complete this activity in conjunction with Activity 1.3: Using a digital camera. Half the class can complete scanning while the other half works with the digital camera. Switch groups during the next class period so all students have a chance to learn both types of equipment Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 9

10 Rationale Scanning is part of the designer s toolbox. It is one of the many ways of capturing and creating assets to include in electronic documents such as web pages. Images whether they are photographs, original art, charts, diagrams, or objects become part of the overall message and tone of a presentation (such as a web page or PowerPoint document). Background resources Introduction to scanning presentation Scanning guide A comprehensive look at scanners and graphics: You can also search, using keywords such as scanning, scanned image, or scanning tips. Assessment Does not meet expectations Meets expectations Exceeds expectations Scanning Absent or incomplete. Students research and gather images and objects from multiple sources. Students plan their scans, taking into account minimum scanning considerations when planning a scan. Students research and gather images or objects from multiple sources. Students create a new image by scanning a combination of objects and/or images at once. Students plan their scans, well and can clearly articulate the reasons for their decisions. Scan document and images Absent or incomplete. Students have one blackand-white scanned mage and one color image. Students have saved their graphic files and saved a text file that includes their images with notes that state filename, file size, resolution, images dimensions, and file type. Students have more than one black-and-white scanned mage and more than one color image. Students have saved their graphic files and saved a text file that includes their images with notes that state filename, file size, resolution, images dimensions, and file type. 10 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

11 ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students I. Creativity and Innovation Students demonstrate creative thinking, construct knowledge, and develop innovative products and processes using technology. Students: A. apply existing knowledge to generate new ideas and products and processes. B. create original works as a means of personal and group expression III. Research and Information Fluency Students apply digital tools to gather, evaluate, and use information. Students: A. plan strategies to guide inquiry. B. locate, organize, analyze, evaluate, synthesize, and ethically use information from a variety of sources and media. C. evaluate and select information sources and digital tools based on the appropriateness to specific tasks. VI. Technology Operations and Concepts Students demonstrate a sound understanding of technology concepts, systems and operations. Students: A. understand and use technology systems. B. select and use applications effectively and productively. C. troubleshoot systems and applications. D. transfer current knowledge to learning of new technologies. Key terms Typical scanning modes: Line art: Pen-and-ink drawings, black-and-white logos, and so on. Halftones: Pictures from books, newspapers, and magazines. Color: Color photos. True Color: Use when the destination is a color printer or a monitor set to display millions of colors and the selection area contains: Color photograph. Color drawing or illustration. Picture with shades of gray that you want to tint with a color. Grayscale: Use when displaying or printing the image in black and white and the selection area contains: Black-and-white photograph. Color drawing or illustration. Color photograph. Halftone picture. Picture with shades of gray. Spot color: Output type eliminates small variations on a solid color block. Black & white: Use when the image will not need to be scaled in another program, the destination is a printer, and the selection area contains a black-and-white drawing Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 11

12 Web palette: Use only when the destination is a web page being viewed in a browser and the selection area contains: Color photograph. Color drawing or illustration. Picture with shades of gray. System palette: The best general-purpose output type for displaying an image on a monitor set to display 256 colors. Use when the destination is for a desktop presentation on a monitor and the selection area contains: Color photograph. Color drawing or illustration. Picture with shades of gray. Optimized palette: Use when the destination is a color printer or or when you want a small file size and the selection area contains: Color photograph that is mostly one color. Color drawing or illustration that is mostly one color. Picture with shades of gray. 12 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

13 Activity 1.3 Using a digital camera Objectives Use a digital camera to capture and save images. Construct a document that demonstrates the ability to differentiate among file types and to minimize file size by using optimization strategies. Materials One or more digital cameras Floppy disks or other storage devices, if the camera model requires them Cables to connect the camera to a computer, if needed Software, usually bundled with the camera, that enables the transfer of images from camera to computer Time minutes Overview The instructor demonstrates the use of the digital camera. Students practice using the camera and then save their images to the computer. Student product: Digital photograph files and a document with annotations and images Activity steps 1. Briefly demonstrate how to use a digital camera. Focus on selecting resolution and framing the picture. Here are some general tips for digital cameras: Fully charge the camera (varies with model, but usually about six hours). When the battery dies, all photographs in the camera are erased unless the camera comes with a storage card such as a compact flash card. Blurry pictures are more common when using digital cameras because you can take a picture while looking at the LCD. This can cause you to hold the camera unsteadily. If the camera has an optical viewfinder, use it instead of the LCD, or hold the camera tightly with both hands and keep your elbows tucked to your body. Close-up pictures tend to be more successful. Digital photographs do not enlarge as well as traditional film unless the resolution of the camera is set at a higher setting. You might want to review the setting options on the camera. 2. Hand out any camera instructions, if you made them Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 13

14 3. Discuss the concept of the rule of thirds. (You may want to have students research the rule of thirds on the web.) 4. Have students take at least four photographs. Photographs can be of the same subject with different resolution settings. 5. Discuss how students used framing and the rule of thirds as design principles when creating their images. 6. Have students save their work in two ways: as separate image files and in a text document with images and notes about each image. Preparation Because there are so many different types of cameras, this activity does not include step-by-step instructions. You may want to create a short student handout that outlines the basic steps for your cameras. Check the file formats and resolution available on the camera so you know the acceptable range. You may want to try downloading files to workstations. Rationale Digital cameras are part of the arsenal of tools designers need to use to produce original images. Although many types of cameras are available, there are common elements in their use that are important for developing a sound foundation in design. Background resources A site that offers a variety of information about digital cameras (see Digital photography for tips on taking photographs) A site with links to tips for taking great pictures Assessment Does not meet expectations Meets expectations Exceeds expectations Digital camera No photographs taken. Students can take photos that also exhibit design principles such as the rule of thirds. Students take photos that exhibit design principles such as the rule of thirds. articulate the reasons for their decisions. Students take into consideration audience and purpose when taking their photos. 14 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

15 Does not meet expectations Meets expectations Exceeds expectations Images Absent or incomplete. Students have four images with annotations including file type and resolution. Students have four images with annotations including file type, resolution, audience, and purpose. ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students VI. Technology Operations and Concepts Students demonstrate a sound understanding of technology concepts, systems and operations. Students: A. understand and use technology systems. B. select and use applications effectively and productively. C. troubleshoot systems and applications. D. transfer current knowledge to learning of new technologies. Key terms resolution rule of thirds frame (framing) 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 15

16 Activity 1.4 Optimizing graphics for the web Objectives Optimize images as GIF and JPEG files. Create the smallest possible image file size while maintaining desired image quality. Save and export image files. Materials Adobe Fireworks CS4 installed on student and instructor workstations Projection system for instructor workstation or overhead slides with screenshots Worksheet: Fireworks Optimize panel Guide: Fireworks Optimize panel Guide: How to optimize GIF images Guide: How to optimize JPEG images Time minutes Overview The instructor demonstrates image optimization. Then students use Adobe Fireworks CS4 to optimize their scanned and photo images. Student product: Optimized GIF and JPEG images Activity steps 1. To test the difference in download times, have students visit sites with GIF and JPEG images to see examples of large and small files. Discuss the differences between the images in each category. 2. Using large GIF and JPEG sample images, introduce the Optimize panel in Fireworks. 3. Demonstrate to students the methods available for optimizing an image. Worksheet: Fireworks Optimize panel Guide: Fireworks Optimize panel 4. As an experiment, divide the class into small groups and assign half of the groups to optimize one of the JPEGs they scanned previously; assign the other half of the groups to optimize a GIF they 16 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

17 scanned previously. All JPEG groups should have the same image, and all GIF groups should have the same image. Guide: How to optimize GIF images Guide: How to optimize JPEG images 5. Groups should optimize and save their graphics in two ways: Make the graphic file size as small as possible. Make the graphic file as small as possible while keeping as much image quality as possible. 6. At the end of the experiment, have each group show their two images and report the mechanisms they used to optimize the images. 7. Use each sample image to discuss the benefits of optimization and the balance that must be reached to preserve quality. 8. Have students optimize their images from Activity 1.2 and Activity 1.3 to prepare for creating a nameplate, logo, or page banner. Preparation Locate sample images by searching the web. For example, at you can select Images and Advanced Image Search. On the Advanced Image Search page, alternately choose large and small from the Size pop-up menu and alternately choose JPG files and GIF files from the File Types pop-up menu. Enter topic words of your choice in the Find results section. Install sample images for the optimization demonstration on student and instructor workstations. Review the elements of the Fireworks Optimize panel. Practice optimizing with the How to optimize GIF images and How to optimize JPEG images guides. You can practice on the large sample images to prepare for the class demonstration. If you plan to give students the guides or worksheet, make photocopies. Extensions Individual Work and Building Group Dynamics: A method to help students learn a new technical skill while building group dynamics is to require all group members to complete the technical task. Following task completion, the group members negotiate one product to represent the group. This negotiation might lead to choosing one member s work or integrating the work of all the individuals into a common product. Technical Help in the Classroom: To encourage students to develop self-sufficiency when seeking help, you can assign a small group or pair of students to research challenging skills and present their findings to the class. Ask them to define key terms (such as optimization) and to explain the relevance of these terms to the task at hand. Then ask students to give a three- to five-minute oral report at the beginning of class, demonstrating the skill and reporting their findings Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 17

18 Rationale Optimization is important for web graphics. Successful websites enable visitors to download web pages quickly. Website success also depends on image quality. Although small file size is important, designers balance file size with image quality. Background resources Resource for information on GIF versus JPEG image types and reduction. Possible search keywords for finding more information on the web: optimize, optimize graphics, image compression Review the Fireworks Optimize panel guide. Review the How to optimize GIF images guide. Review the How to optimize JPEG images guide. Assessment Does not meet expectations Meets expectations Exceeds expectations Optimization Absent or incomplete. Students can optimize GIF and JPEG images. Students can optimize GIF and JPEG images as well as balance quality with file size and articulate benefits of optimization. ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students I. Creativity and Innovation Students demonstrate creative thinking, construct knowledge, and develop innovative products and processes using technology. Students: A. apply existing knowledge to generate new ideas and products and processes. IV. Critical Thinking, Problem-Solving & Decision-Making Students use critical thinking skills to plan and conduct research, manage projects, solve problems and make informed decisions using appropriate digital tools and resources. Students: A. identify and define authentic problems and significant questions for investigation. B. plan and manage activities to develop a solution or complete a project. D. use multiple processes and diverse perspectives to explore alternative solutions. 18 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

19 VI. Technology Operations and Concepts Students demonstrate a sound understanding of technology concepts, systems and operations. Students: A. understand and use technology systems. B. select and use applications effectively and productively. C. troubleshoot systems and applications. D. transfer current knowledge to learning of new technologies. Key terms JPEG GIF palette optimize crop image size 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 19

20 Activity 1.5 Making a nameplate Objectives Use graphics tools and effects in Adobe Fireworks CS4. Explain and document a process. Materials Adobe Fireworks CS4 installed on student and instructor workstations Projection system for instructor workstation or overhead slides with screenshots of the Fireworks interface Worksheet: Fireworks tools Guide: Fireworks panels Guide: How to build a nameplate Guide: How to create effects Worksheet: Nameplate interview Time minutes Overview The instructor briefly demonstrates Fireworks tools and effects by building a sample nameplate. Students explore Fireworks by designing and constructing a personal nameplate. Students explain their process and choices through peer interviews. Student product: Online nameplate Activity steps 1. Demonstrate building a nameplate, highlighting the tools necessary for creating various effects in Fireworks drawing and color panels. Identify the main panels: the Tools panel and the Property inspector. Worksheet: Fireworks tools Guide: Fireworks panels 2. Have students start Fireworks at individual workstations and open a new document. Note: To prepare for effects they might use later, have students draw their rectangles small enough to allow about 30 pixels of blank area around all sides. 20 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

21 3. Have them choose the size of their nameplates (a typical rectangular nameplate canvas is ). Guide: How to build a nameplate 4. Allow students time to create and save their nameplates. Encourage them to explore the variety of effects in Fireworks they can use in building their nameplates. Guide: How to create effects 5. Have students optimize their nameplates by exporting them as GIFs or JPEGs. 6. Have student partners interview each other about their completed nameplates. Some topics to cover are: Fireworks functions used to create your nameplate Effects used on your nameplate Step-by-step description of how you created your nameplate Worksheet: Nameplate interview Preparation You might want to practice using the tools in Fireworks to see how the activity works, following the guidelines in the How to build a nameplate guide. Review the Fireworks panels guide. Make photocopies of the Nameplate interview worksheet for students. Extensions Integrating Images: Suggest that students integrate scanned images with the effects they are creating in Fireworks. More Nameplates: If some students finish quickly, have them design nameplates for their pets, family, or friends. Optional Wrap-up: Discuss how professional web developers document the design process. Documenting shares expertise and provides designers with a written record for themselves and others to replicate the work. Rationale Success in online graphic design stems from understanding graphic design tools and how to apply their capabilities, and by studying and understanding design principles. Designers often explore new graphics tools before using them within a formal design. Communicating about tool use and design process strengthens knowledge of the tool. Background resources Fireworks Help 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 21

22 Online material available for Fireworks Assessment Does not meet expectations Meets expectations Exceeds expectations Nameplate Absent or incomplete. Students use the drawing tools, filters, and effects to create a nameplate. Students use the drawing tools, filters, and effects to create a nameplate. Students take into account design elements when creating their nameplates. Interviews Absent or incomplete. Students provide a description of their process and the tools they used. Students conducting the interviews take notes on the answers from their interviewee. Students provide a description of their process and the tools they used, including reasons they choose the specific effects and how they are a means of personal expression. Students conducting the interviews take detailed notes on the answers from their interviewee. ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students I. Creativity and Innovation Students demonstrate creative thinking, construct knowledge, and develop innovative products and processes using technology. Students: A. apply existing knowledge to generate new ideas and products and processes. B. create original works as a means of personal and group expression II. Communication and Collaboration Students use digital media and environments to communicate and work collaboratively, including at a distance, to support individual learning and contribute to the learning of others. Students: A. interact, collaborate, and publish with peers, experts or others employing a variety of digital environments and media. B. communicate information and ideas effectively to multiple audiences using a variety of media and formats. 22 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

23 V. Digital Citizenship Students understand human, cultural, and societal issues related to technology and practice legal and ethical behavior. Students: B. exhibit positive attitudes toward technology uses that support collaboration, learning, and productivity. VI. Technology Operations and Concepts Students demonstrate a sound understanding of technology concepts, systems and operations. Students: A. understand and use technology systems. B. select and use applications effectively and productively. C. troubleshoot systems and applications. D. transfer current knowledge to learning of new technologies. Key terms Tools panel stroke effect object emboss bevel drop shadow panel 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 23

24 Activity 1.6 Planning a logo Objectives Create a storyboard using graphic design principles. Materials Presentation: Introduction to graphic design Presentation: Storyboards Projector for presentations Grid paper (optional) Drawing materials (pencils, pens, paper, colored pencils, and so on) Time minutes Overview The instructor presents sample logos and leads a discussion about graphic design elements and principles used in creating logos and other graphical elements. Then the instructor describes the use of storyboards in design. Students produce storyboards for their logos. Student product: A paper storyboard for a logo Activity steps 1. Introduce the overall project: creating a logo students can use as an identifying element for themselves, for a fictional organization such as a design firm or a nonprofit, or for a school group. 2. Show students sample logos and ask them to identify visual cues that help the logo stick in their minds. Discuss how these logos are appropriate branding for the organizations they represent. Discuss how these designs reach the organization s target audience and meet the company goals. 3. Introduce graphical design topics. If you use the presentation Introduction to graphic design, have students identify the design elements on the sample logos on each slide. Presentation: Introduction to graphic design 4. After introducing design principles, ask students how they might change the sample logos to depict a different design principle. For example, how might they make a symmetrical logo into an asymmetrical logo and what impact would that make on the idea the logo communicates? 24 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

25 5. Introduce the storyboard concept as follows: The typical use of a storyboard is in designing movies or animated cartoons, to depict what happens in the story. A storyboard contains scene-by-scene drawings of the sequence of action, camera angles, background, and so on. As the name implies, the storyboard is meant to tell the story visually with sufficient detail to enable the production crew to understand what they will create. A graphic storyboard shows all the elements of the graphic, indicating size, location, color, and font. A website storyboard might go through several iterations before going into production. First create rough sketches to convey the big picture and the basic site structure so all team members understand the scope of the project. Convert these rough sketches to finished sketches that can be shared with other parts of an organization or an outside client. Presentation: Storyboards 6. Have students create a storyboard for a logo that represents them as an individual or a logo that represents a nonprofit organization or a fictional digital design company. You might use grid paper and suggest the following guidelines: Indicate the intended focus, purpose, and audience of your design. The storyboard can be in black and white, with colors labeled. If you create your storyboard with colored pens or pencils, use colors that match the design. Indicate whether your design illustrates horizontal symmetry, vertical symmetry, diagonal symmetry, radial symmetry, or asymmetry. On the back of your storyboard, explain why you selected one style over another. Indicate the scale you are using. In other words, if your paper design is larger or smaller than the final product, say what size the finished product will be. Professional designers usually illustrate logos larger than the finished product so details are easy to see. On the back of the storyboard, indicate any other design decisions you made and state why. Preparation Review the Introduction to graphic design and Storyboards presentations. (Some slides have notes.) Review the background resources listed in the following section. You might want to download and prepare sample logos such as those on the following websites: Extensions More design investigation: Add more graphic design exploration to this activity by having students use the Internet to find examples of each design principle Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 25

26 Rationale A storyboard is a fundamental tool for planning and thinking visually in digital design. Creating storyboards with sufficient detail ensures that many problems are worked out on paper prior to investing in production. It is a crucial step that leads to the development of other planning tools: asset production, cost estimation, hardware requirements, and software requirements. Background resources Graphic design A short introduction to graphic design theory, explaining the aspects of design to consider when composing a piece of fine art or producing a graphic layout A brief discussion of the main principles of design Logos Logo design articles and tips Types of logos and their construction Storyboards Definition of the storyboard concept, plus sample storyboards A theoretical approach to storyboards Assessment Does not meet expectations Meets expectations Exceeds expectations Storyboard Absent or incomplete. Students draw their logo and include all the specifications and design principles needed to build the logo. Students draw their logo and include all the specifications and design principles needed to build the logo. Students clearly articulate the design principles in use and how they apply to their proposed logo design. 26 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

27 Design principles Does not meet expectations Meets expectations Exceeds expectations Absent or incomplete. Students can name design principles and describe what they are. Students can name design principles and describe what they are. Students can apply this knowledge to predicting how design principle changes can alter the visual and meaningful impact of a graphic. ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students II. Communication and Collaboration Students use digital media and environments to communicate and work collaboratively, including at a distance, to support individual learning and contribute to the learning of others. Students: A. interact, collaborate, and publish with peers, experts or others employing a variety of digital environments and media. B. communicate information and ideas effectively to multiple audiences using a variety of media and formats. IV. Critical Thinking, Problem-Solving & Decision-Making Students use critical thinking skills to plan and conduct research, manage projects, solve problems and make informed decisions using appropriate digital tools and resources. Students: A. identify and define authentic problems and significant questions for investigation. B. plan and manage activities to develop a solution or complete a project. C. collect and analyze data to identify solutions and/or make informed decisions. Adobe Certified Associate, Web Communication objectives 1.1 Identify the purpose, audience, and audience needs for a website. 2.3 Demonstrate knowledge of page layout design concepts and principles. 2.5 Demonstrate knowledge of flowcharts, storyboards, and wireframes to create web pages and a site map (site index) that maintain the planned website hierarchy Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 27

28 Key terms audience purpose asymmetry (asymmetrical) axis of symmetry balance chroma complementary color composition contrast emphasis hue radial symmetry shade storyboard symmetry (symmetrical) tint tone unity white space 28 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

29 Activity 1.7 Building a logo Objectives Develop a digital logo based on a storyboard. Materials Adobe Fireworks CS4 installed on all student workstations Students logo storyboards from Activity 1.6 Time minutes Overview Students produce their logo, based on their storyboard. Student product: Digital logo Activity steps 1. Have students look through their storyboards as you discuss production. 2. Discuss possible canvas sizes for logos. Typical sizes are pixels (very small), pixels, pixels, and pixels (fairly large for web purposes). 3. Introduce drawing and image-editing tools such as the Line, Rectangle, Pen, and Eraser tools. 4. Allow students time to build their logos. 5. Allow students time to present their logos to each other or the class. Preparation Review the drawing tools in Fireworks. As needed, go to the Help menu in Fireworks to access stepby-step procedures. Extension Using Local Experts: Assign students as resource specialists. Extra hands and heads will enable you to manage the classroom without students expecting you to be the sole software expert. For example, have 2008 Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 29

30 some of your top students act as local experts to help others use a software product. As students become more familiar with the software, more students will be able to share the responsibility of being the local experts. Rationale Using a storyboard as a guide, professionals use the authoring software required to meet their design needs. Often a design requires designers to learn new techniques or aspects of the authoring software. Background resources A tour of the features of Fireworks Check the Fireworks technical support area for a variety of resources, most notably technical notes (TechNotes) and tutorials. Assessment Does not meet expectations Meets expectations Exceeds expectations Logo Absent or incomplete. Logo reflects the basic elements identified on the storyboard. Techniques used to build the logo reflect a basic knowledge of Fireworks. Logo reflects all concepts (both sketches and design principles) from the storyboard. Techniques used to build the logo reflect effective and productive uses of Fireworks. ISTE NETS*S Standards for Students This activity is aligned to the ISTE NETS*S Technology Standards. Depending on the subject and content area the student selects you may research your own state content standards to see how this activity aligns to your state requirements. ISTE NETS*S: Curriculum and Content Area Standards NETS for Students VI. Technology Operations and Concepts Students demonstrate a sound understanding of technology concepts, systems and operations. Students: A. understand and use technology systems. B. select and use applications effectively and productively. C. troubleshoot systems and applications. D. transfer current knowledge to learning of new technologies. 30 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

31 Adobe Certified Associate, Web Communication objectives 4.3 Follow a flowchart, storyboards, and wireframes to create web pages and a site map (site index) that maintain the planned website hierarchy Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 31

32 Activity 1.8 Logo review and redesign Objectives Identify aspects of redesign and its importance in web design. Reflect on a digital image and identify what could be improved. Create a storyboard for the redesign of an image. Modify an existing image Materials Adobe Fireworks CS4 installed on all student workstations Worksheet: Logo review and redesign Time minutes Overview The instructor introduces the concepts of review and redesign. Students review their own work in reference to their goals, intentions, and design constraints. Student product: Redesign write-up and new logo Activity steps 1. Through a class discussion, define review and redesign. Explore what redesign means for student work in the context of web design and why it might be useful as a step of the overall project process. Develop class definitions and discuss possible steps or questions that will help in redesigning a product. Some possible categories for review include the following: Meeting initial focus, purpose, and audience Changing focus, purpose, or audience Applying good design principles Worksheet: Logo review and redesign 2. Have students individually review their own logos to redesign them. 3. After the review, have students create storyboards of their proposed redesign changes to create new logos. 4. Make sure students save a copy of their old logos to put in their electronic portfolios. 32 Graphic design using Adobe Fireworks CS Adobe Systems Incorporated

33 5. Have students build their redesigned logos. Preparation Before teaching this activity, it might be helpful to compile your own steps for redesign to help you guide the student discussion. Students complete the logo project in this activity. If you want to do a full project assessment, use the sample project rubric in the Course overview and setup. Extensions Defining redesign: Have students use various resources, such as books and the Internet, in addition to brainstorming definitions for the word redesign. This gives students an opportunity to practice web research skills. Presentations: Have students present their redesigns to the class, outlining the changes they made and why they made them. Rationale Designers reflect on their work and subsequently redesign to improve their work. One method of revision is to evaluate your own work in reference to your previously stated goals and ideas. Background resources These resources discuss the design process, including redesign: Koberg, Don and Jim Bagnall. The Universal Traveler: A Soft-Systems Guide to Creativity, Problem- Solving and the Process of Reaching Goals. Los Altos, CA: Crisp Publications, Inc., The graphic design process: To find more Internet information on redesign and the design process, some helpful search keywords are redesign cycle and design process Adobe Systems Incorporated Graphic design using Adobe Fireworks CS4 33

Web design & planning

Web design & planning Instructor Guide Timing: 12 to 18 hours Level: Ages 15 and up Web design & planning Project Overview In this project, student teams work on a project to build a website for a client. The client selects

More information

Web Design Scope and Sequence Student Outcomes (Objectives Skills/Verbs)

Web Design Scope and Sequence Student Outcomes (Objectives Skills/Verbs) Title/ Length of Unit Resources: Standard/ Strand Essential Questions 1. recur throughout life 2. are key inquiries within discipline 3. help student make sense of core content Web Design Scope and Sequence

More information

Web design and planning

Web design and planning Project 2 Web design and planning Timing: 12 to 18 hours Project overview In this project, student teams work on a project to build a website for a client. Each team might have a different client, depending

More information

Fireworks CS4 Tutorial Part 1: Intro

Fireworks CS4 Tutorial Part 1: Intro Fireworks CS4 Tutorial Part 1: Intro This Adobe Fireworks CS4 Tutorial will help you familiarize yourself with this image editing software and help you create a layout for a website. Fireworks CS4 is the

More information

TABLE OF CONTENTS. SECTION ONE: OVERVIEW... 4 Who are these guidelines for?... 4 What is a visual identity guideline?... 4

TABLE OF CONTENTS. SECTION ONE: OVERVIEW... 4 Who are these guidelines for?... 4 What is a visual identity guideline?... 4 VISUAL IDENTITY TABLE OF CONTENTS SECTION ONE: OVERVIEW... 4 Who are these guidelines for?... 4 What is a visual identity guideline?... 4 SECTION TWO: VISUAL IDENTITY GUIDLINES... 5 Corporate identity

More information

126.47. Web Design (One Credit), Beginning with School Year 2012-2013.

126.47. Web Design (One Credit), Beginning with School Year 2012-2013. 126.47. Web Design (One Credit), Beginning with School Year 2012-2013. (a) General requirements. Students shall be awarded one credit for successful completion of this course. This course is recommended

More information

ART 170: Web Design 1

ART 170: Web Design 1 Banner Design Project Overview & Objectives Everyone will design a banner for a veterinary clinic. Objective Summary of the Project General objectives for the project in its entirety are: Design a banner

More information

Visual and Performing Arts Subject Template (Required Information needed to prepare for course submission)

Visual and Performing Arts Subject Template (Required Information needed to prepare for course submission) Visual and Performing Arts Subject Template (Required Information needed to prepare for course submission) Course Purpose: What is the purpose of this course? Please provide a brief description of the

More information

Adobe Dreamweaver Exam Objectives

Adobe Dreamweaver Exam Objectives Adobe Dreamweaver audience needs for a website. 1.2 Identify webpage content that is relevant to the website purpose and appropriate for the target audience. 1.3 Demonstrate knowledge of standard copyright

More information

Digital Web Design Syllabus/Online Course Plan

Digital Web Design Syllabus/Online Course Plan Digital Web Design Syllabus/Online Course Plan Certificated Teacher: Date: 2015-2016 Desired Results Digital Web Design: Grades 9 12 Credit: X one semester (.5) two semesters (1) Estimate of hours per

More information

Graphic Design. Background: The part of an artwork that appears to be farthest from the viewer, or in the distance of the scene.

Graphic Design. Background: The part of an artwork that appears to be farthest from the viewer, or in the distance of the scene. Graphic Design Active Layer- When you create multi layers for your images the active layer, or the only one that will be affected by your actions, is the one with a blue background in your layers palette.

More information

Fireworks for Graphics and Images

Fireworks for Graphics and Images Fireworks for Graphics and Images Joan Weeks SLIS Computer Labs Mgr. October 2009 Fireworks for Banners and Images Fireworks is a web developer s tool to make banners and graphics, as well as format images

More information

How to create buttons and navigation bars

How to create buttons and navigation bars How to create buttons and navigation bars Adobe Fireworks CS3 enables you to design the look and functionality of buttons, including links and rollover features. After you export these buttons from Fireworks,

More information

SMART Board Training Outline Trainer: Basel Badran

SMART Board Training Outline Trainer: Basel Badran Sharjah Higher Colleges of Technology SMART Board Training Outline Trainer: Basel Badran What is a SMART Board? o Concept & Technology SMART Board Components: o Smart Tools Start Center Recorder Keyboard

More information

COMMERCIAL PHOTOGRAPHY Basic Digital Photography

COMMERCIAL PHOTOGRAPHY Basic Digital Photography COMMERCIAL PHOTOGRAPHY Basic Digital Photography This course is part of a sequence of courses that prepares individuals to use artistic techniques combined with a commercial perspective to effectively

More information

Standards/Measurement Criteria. (**Draft) Graphic Communications

Standards/Measurement Criteria. (**Draft) Graphic Communications (**Draft) Graphic Communications Photo Imaging - Option C CIP No. 10.0300 *These state standards are designed to be delivered in a sequence of courses. *Standards 1-17 are to be taught as an introduction

More information

Web Design Foundations (2015-16)

Web Design Foundations (2015-16) Course Description Web Design Foundations is a course that prepares students with work-related web design skills for advancement into postsecondary education and industry. The course is intended to develop

More information

MassArt Studio Foundation: Visual Language Digital Media Cookbook, Fall 2013

MassArt Studio Foundation: Visual Language Digital Media Cookbook, Fall 2013 INPUT OUTPUT 08 / IMAGE QUALITY & VIEWING In this section we will cover common image file formats you are likely to come across and examine image quality in terms of resolution and bit depth. We will cover

More information

CTE Graphics / Web Design I

CTE Graphics / Web Design I Graphics / Web Design I Curriculum Map Teacher Pages GRAPHICS/WEB I Curriculum Map Teacher Pages Semester 1 3.0 DEMONSTRATE VERBAL AND NONVERBAL COMMUNICATION SKILLS REQUIRED BY THE MEDIA INDUSTRY 3.1

More information

Animation Action STUDIO. PROJECT 11 For use with Chapter 8. Objective SUPPLIES

Animation Action STUDIO. PROJECT 11 For use with Chapter 8. Objective SUPPLIES STUDIO PROJECT 11 For use with Chapter 8 Name Animation Action Date Class Period Objective Draw a simple animation sequence in a sketchbook and import your drawings into a multimedia program to create

More information

HS Web Design Business and Technology

HS Web Design Business and Technology Scope And Sequence Timeframe Unit Instructional Topics Course Description Web Design students will learn how to create and maintain web pages using the prevailing techniques and software. Students will

More information

CompuScholar, Inc. Alignment to Tennessee Web Design Foundations Standards

CompuScholar, Inc. Alignment to Tennessee Web Design Foundations Standards CompuScholar, Inc. Alignment to Tennessee Web Design Foundations Standards Tennessee Course Details: Course Name: Primary Career Cluster: Course Code: Credit: Grade Level: Teacher Resources: Web Design

More information

ACE: Illustrator CC Exam Guide

ACE: Illustrator CC Exam Guide Adobe Training Services Exam Guide ACE: Illustrator CC Exam Guide Adobe Training Services provides this exam guide to help prepare partners, customers, and consultants who are actively seeking accreditation

More information

Art Submission Guidelines

Art Submission Guidelines Art Submission Guidelines Organizing artwork for your manuscript may seem like a daunting task, but the following guidelines will walk you through our art submission process. Whether you have a large set

More information

Guide To Creating Academic Posters Using Microsoft PowerPoint 2010

Guide To Creating Academic Posters Using Microsoft PowerPoint 2010 Guide To Creating Academic Posters Using Microsoft PowerPoint 2010 INFORMATION SERVICES Version 3.0 July 2011 Table of Contents Section 1 - Introduction... 1 Section 2 - Initial Preparation... 2 2.1 Overall

More information

Scanning in Windows XP: Basics Learning guide

Scanning in Windows XP: Basics Learning guide Scanning in Windows XP: Basics Learning guide If you have ever wanted to scan documents and images on different scanners in your department, you've probably faced the difficulties that arise from needing

More information

IE Class Web Design Curriculum

IE Class Web Design Curriculum Course Outline Web Technologies 130.279 IE Class Web Design Curriculum Unit 1: Foundations s The Foundation lessons will provide students with a general understanding of computers, how the internet works,

More information

ELEMENTS AND PRINCIPLES OF DESIGN

ELEMENTS AND PRINCIPLES OF DESIGN APPENDIX A1 4 T T ELEMENTS AND PRINCIPLES OF DESIGN Groups: 1. Select an advertisement. 2. Examine the advertisement to find examples of a few elements and principles of design that you are familiar with.

More information

Links. Blog. Great Images for Papers and Presentations 5/24/2011. Overview. Find help for entire process Quick link Theses and Dissertations

Links. Blog. Great Images for Papers and Presentations 5/24/2011. Overview. Find help for entire process Quick link Theses and Dissertations Overview Great Images for Papers and Presentations May 26, 2011 Web Tips Definitions Using the Michigan Tech logo Photography 101 Great images from others Great images you create PDF conversion Final words

More information

Fireworks 3 Animation and Rollovers

Fireworks 3 Animation and Rollovers Fireworks 3 Animation and Rollovers What is Fireworks Fireworks is Web graphics program designed by Macromedia. It enables users to create any sort of graphics as well as to import GIF, JPEG, PNG photos

More information

National Education Technology Standards and Performance Indicators As Aligned with the ODS Educator Personal Technology Use Proficiency Exam

National Education Technology Standards and Performance Indicators As Aligned with the ODS Educator Personal Technology Use Proficiency Exam National Education Technology Standards and Performance Indicators As Aligned with the ODS Educator Personal Technology Use Proficiency Exam 1. Creativity and Innovation Demonstrate creative thinking,

More information

BAA Yearbook 11. Coquitlam. District Name: District Number: SD #43. Developed by: Aryn Gunn. Date Developed: April 2004. Gleneagle Secondary

BAA Yearbook 11. Coquitlam. District Name: District Number: SD #43. Developed by: Aryn Gunn. Date Developed: April 2004. Gleneagle Secondary BAA Yearbook 11 District Name: Coquitlam District Number: SD #43 Developed by: Aryn Gunn Date Developed: April 2004 School Name: PrincipaPsName: Gleneagle Secondary Dave Matheson Board/Authority Approval

More information

Computer Graphics Scope and Sequence Student Outcomes (Objectives Skills/Verbs)

Computer Graphics Scope and Sequence Student Outcomes (Objectives Skills/Verbs) Title/ Length of Unit Resources: Standard/ Strand Essential Questions 1. recur throughout life 2. are key inquiries within discipline 3. help student make sense of core content Computer Graphics Scope

More information

MyGraphicsLab ADOBE ILLUSTRATOR CC COURSE FOR GRAPHIC DESIGN & ILLUSTRATION Curriculum Mapping to ACA Objectives

MyGraphicsLab ADOBE ILLUSTRATOR CC COURSE FOR GRAPHIC DESIGN & ILLUSTRATION Curriculum Mapping to ACA Objectives ADOBE ILLUSTRATOR CC COURSE FOR GRAPHIC DESIGN & ILLUSTRATION Curriculum Mapping to ACA Domain Domain 1.0 Setting Project Requirements 1.1 Identify the purpose, audience, and audience needs for preparing

More information

Understanding Resolution and the meaning of DPI, PPI, SPI, & LPI

Understanding Resolution and the meaning of DPI, PPI, SPI, & LPI Understanding Resolution and the meaning of DPI, PPI, SPI, & LPI 2003, 2006, and 2012 David Creamer I.D.E.A.S. Publishing Consultant & Trainer Authorized Adobe Training Provider for Photoshop, Illustrator,

More information

Instructions for Creating a Poster for Arts and Humanities Research Day Using PowerPoint

Instructions for Creating a Poster for Arts and Humanities Research Day Using PowerPoint Instructions for Creating a Poster for Arts and Humanities Research Day Using PowerPoint While it is, of course, possible to create a Research Day poster using a graphics editing programme such as Adobe

More information

COMPUTER GRAPHICS GRADES 10-12. THE EWING PUBLIC SCHOOLS 1331 Lower Ferry Road Ewing, NJ 08618

COMPUTER GRAPHICS GRADES 10-12. THE EWING PUBLIC SCHOOLS 1331 Lower Ferry Road Ewing, NJ 08618 COMPUTER GRAPHICS GRADES 10-12 THE EWING PUBLIC SCHOOLS 1331 Lower Ferry Road Ewing, NJ 08618 BOE Approval Date: 5/31/11 Michael Nitti Revised by: EHS Technology Teachers Superintendent In accordance with

More information

Multimedia Applications

Multimedia Applications Multimedia Applications Department: CTE Grade Level: 10-12 Length: Two semesters Prerequisite: Computer Literacy or its equivalent. Credit: 10 units PHILOSOPHY This course is designed for students interested

More information

Digital Design. Foundations of Web Design

Digital Design. Foundations of Web Design Digital Design Foundations of Web Design NOTICE OF RIGHTS Copyright 2013 by Adobe Systems Incorporated. All rights reserved. This work is licensed under a Creative Commons Attribution-Noncommercial-Share

More information

KB COPY CENTRE. RM 2300 JCMB The King s Buildings West Mains Road Edinburgh EH9 3JZ. Telephone: 0131 6505001

KB COPY CENTRE. RM 2300 JCMB The King s Buildings West Mains Road Edinburgh EH9 3JZ. Telephone: 0131 6505001 KB COPY CENTRE RM 2300 JCMB The King s Buildings West Mains Road Edinburgh EH9 3JZ Telephone: 0131 6505001 Email: kbcopy@ed.ac.uk martin.byrne@ed.ac.uk colin.doherty@ed.ac.uk Step 1. Set up page orientation

More information

New Paltz Central School District Technology Computer Graphics 1 and 2. Time Essential Questions/Content Standards/Skills Assessments

New Paltz Central School District Technology Computer Graphics 1 and 2. Time Essential Questions/Content Standards/Skills Assessments September - October October - November New Paltz Central School District Unit 1: Introduction to Graphic Design and Recognize and analyze various forms of Digital class New Media graphic communication.

More information

PASSAIC COUNTY TECHNICAL INSTITUTE GRAPHIC ARTS 1 CURRICULUM GUIDE

PASSAIC COUNTY TECHNICAL INSTITUTE GRAPHIC ARTS 1 CURRICULUM GUIDE PASSAIC COUNTY TECHNICAL INSTITUTE GRAPHIC ARTS 1 CURRICULUM GUIDE Instructors: Mark Phillips / Jose Arce / Luis Colón / Fernando Colón REVISED: June 2011 I. Course Description Graphic Arts 1 Graphic Design

More information

Graphic Design I GT Essential Goals and Objectives

Graphic Design I GT Essential Goals and Objectives Graphic Design I GT Essential Goals and Objectives COURSE DESCRIPTION: This academy was specifically designed to bridge the gap between a client s publication concept and the final printed product. The

More information

INDUSTRY BRIEFS FOR CREATIVE imedia

INDUSTRY BRIEFS FOR CREATIVE imedia INDUSTRY BRIEFS FOR CREATIVE imedia Level 3 Assignment Briefs for Units 311, 312 & 313 Brining the curriculum to life: a partnership between NYBEP Ltd and the Dales Integrated Transport Alliance we are

More information

OCR LEVEL 2 CAMBRIDGE TECHNICAL

OCR LEVEL 2 CAMBRIDGE TECHNICAL Cambridge TECHNICALS OCR LEVEL 2 CAMBRIDGE TECHNICAL CERTIFICATE/DIPLOMA IN IT COMPUTER GRAPHICS H/601/5801 LEVEL 2 UNIT 10 GUIDED LEARNING HOURS: 60 UNIT CREDIT VALUE: 10 COMPUTER GRAPHICS H/601/5801

More information

Saucon Valley School District Planned Course of Study

Saucon Valley School District Planned Course of Study Course Title Grade Level: 10-12 Credits: 0.5 Content Area / Dept. Business / Technology Education Length of Course: Quarter Author(s): Gemma Cody Course Description: is an introductory course designed

More information

What Resolution Should Your Images Be?

What Resolution Should Your Images Be? What Resolution Should Your Images Be? The best way to determine the optimum resolution is to think about the final use of your images. For publication you ll need the highest resolution, for desktop printing

More information

Lesson Plan. Graphic Design & Illustration

Lesson Plan. Graphic Design & Illustration Lesson Plan Course Title: Session Title: Graphic Design & Illustration Telling a Story: Introduction to Bézier Curves Lesson Duration: Approximately 7-10 days [Lesson length is subjective and will vary

More information

Computer Applications

Computer Applications Computer Applications This course is designed to develop computer technology skills. Students will use a variety of computer software and hardware tools and features of an electronic information network.

More information

Wallingford Public Schools - HIGH SCHOOL COURSE OUTLINE. Department: Career and Technical Education Grade(s): 9-12

Wallingford Public Schools - HIGH SCHOOL COURSE OUTLINE. Department: Career and Technical Education Grade(s): 9-12 Wallingford Public Schools - HIGH SCHOOL COURSE OUTLINE Course Title: Graphic Communication Course Number: 7173 Department: Career and Technical Education Grade(s): 9-12 Level(s): Academic Credit: ½ Course

More information

REVISED JUNE 2011. PLEASE DISCARD ANY PREVIOUS VERSIONS OF THIS GUIDE. Graphic Style Guide

REVISED JUNE 2011. PLEASE DISCARD ANY PREVIOUS VERSIONS OF THIS GUIDE. Graphic Style Guide REVISED JUNE 2011. PLEASE DISCARD ANY PREVIOUS VERSIONS OF THIS GUIDE. Graphic Style Guide 1 Introduction 2 Logo Fonts 4 Logo Color 6 Logo Size & Clear Space 8 Logo Composition 10 Logo Application 16 Corporate

More information

RETA Training Module Digital Portfolios

RETA Training Module Digital Portfolios RETA Training Module Digital Portfolios Creating and Updating Electronic Portfolios for Professional Development Developed by Marjorie Sharp Margaret Hoskins Julia Parra Fred Lackey Smith Frederick Kd

More information

CREATING DIGITAL ARTWORK

CREATING DIGITAL ARTWORK CREATING DIGITAL ARTWORK Digital artwork can take several forms: photographs, charts, graphs, diagrams, radiograph, OR any scanned versions of these types of artwork. These guidelines are designed to help

More information

designed and prepared for california safe routes to school by circle design circledesign.net Graphic Standards

designed and prepared for california safe routes to school by circle design circledesign.net Graphic Standards Graphic Standards Table of Contents introduction...2 General Usage...2 Logo lockups: color...3 LOGO LOCKUPS: GRAYSCALE...4 Minimum Staging Area...5 Minimum Logo Size...6 Type Family...7 Color Palettes...8

More information

989.673.5300 x339 Caro MI 48723 URL: www.tuscolaisd.org Email: spiche@tuscolaisd.org

989.673.5300 x339 Caro MI 48723 URL: www.tuscolaisd.org Email: spiche@tuscolaisd.org ADVERTISING DESIGN SYLLABUS SCHOOL: Tuscola Technology Center Instructor: Sheryl Piche ADDRESS: 1401 Cleaver Road Phone: 989.673.5300 x339 Caro MI 48723 URL: www.tuscolaisd.org Email: spiche@tuscolaisd.org

More information

ClarisWorks 5.0. Graphics

ClarisWorks 5.0. Graphics ClarisWorks 5.0 Graphics Level 1 Training Guide DRAFT Instructional Technology Page 1 Table of Contents Objectives... Page 3 Course Description and Organization... Page 4 Technology Requirements... Page

More information

Scope and Sequence. Cluster: Course Name: Course Description: Course Requirements: Course Equipment:

Scope and Sequence. Cluster: Course Name: Course Description: Course Requirements: Course Equipment: Scope and Sequence Cluster: Course Name: Course Description: Course Requirements: Course Equipment: Information Technology Digital & Interactive Multimedia (One-Half to One Credit) Through the study of

More information

GUIDEBOOK FOR TECHNOLOGY COMPETENCIES BOSTON COLLEGE LYNCH SCHOOL OF EDUCATION

GUIDEBOOK FOR TECHNOLOGY COMPETENCIES BOSTON COLLEGE LYNCH SCHOOL OF EDUCATION GUIDEBOOK FOR TECHNOLOGY COMPETENCIES BOSTON COLLEGE LYNCH SCHOOL OF EDUCATION Contents Summary of Required Technology Competencies....2 Guidelines for Demonstration of Technology Competencies...3 Available

More information

2015 - Photography 4-H Project Newsletter

2015 - Photography 4-H Project Newsletter 2015 - Photography 4-H Project Newsletter Welcome to the 4-H Photography Project! This newsletter is your guide to the project. It contains rules, guidelines and suggestions. Read it carefully and keep

More information

GRAPHIC DESIGN BITES FOR MARKETERS

GRAPHIC DESIGN BITES FOR MARKETERS GRAPHIC DESIGN BITES FOR MARKETERS VOL 1 2014 DESIGN EVALUATION Giving design feedback p3 HIERARCHY Learn why and how the hero leads the page p7 EPS What exactly is an.eps file? p5 More Maki COMING SOON

More information

Course Title: Multimedia Design

Course Title: Multimedia Design Course Title: Multimedia Design Unit: Multimedia Hardware and Software Content Standard(s) and 1. Compare types of multimedia, including presentation, desktop publishing, Web page design, graphic design,

More information

Dreamweaver and Fireworks MX Integration Brian Hogan

Dreamweaver and Fireworks MX Integration Brian Hogan Dreamweaver and Fireworks MX Integration Brian Hogan This tutorial will take you through the necessary steps to create a template-based web site using Macromedia Dreamweaver and Macromedia Fireworks. The

More information

m ac romed ia Fl a s h Curriculum Guide

m ac romed ia Fl a s h Curriculum Guide m ac romed ia Fl a s h Curriculum Guide 1997 1998 Macromedia, Inc. All rights reserved. Macromedia, the Macromedia logo, Dreamweaver, Director, Fireworks, Flash, Fontographer, FreeHand, and Xtra are trademarks

More information

The University of Chicago Press Art Submission Requirements

The University of Chicago Press Art Submission Requirements Art Submission Requirements revised september 2005 Contents Overview 3 Requirements For Submitting Hard-Copy Originals 4 1. Introduction 5 Black and white photographic images 5 Color photographic images

More information

MISSION VALLEY REGIONAL OCCUPATION PROGRAM COMPUTER GRAPHICS DESIGN COURSE OUTINE

MISSION VALLEY REGIONAL OCCUPATION PROGRAM COMPUTER GRAPHICS DESIGN COURSE OUTINE MISSION VALLEY REGIONAL OCCUPATION PROGRAM COMPUTER GRAPHICS DESIGN COURSE OUTINE 1. Course Title: Motion Graphics (Selected Studies) 2. CBEDS Title: Graphic Communications 3. CBEDS Number: 5751 4. Job

More information

2014 New Jersey Core Curriculum Content Standards - Technology

2014 New Jersey Core Curriculum Content Standards - Technology 2014 New Jersey Core Curriculum Content s - Technology Content Area Grade Content Statement Students will: Technology A. Technology Operations and Concepts: Students demonstrate a sound understanding of

More information

HIGH SCHOOL COURSE OUTLINE

HIGH SCHOOL COURSE OUTLINE OFFICE OF CURRICULUM, INSTRUCTION AND PROFESSIONAL DEVELOPMENT HIGH SCHOOL COURSE OUTLINE Department Visual/Performing Arts Course Title Digital Art & Imaging Course Code 1046 Grade Level 9-12 Course Length

More information

Tips for optimizing your publications for commercial printing

Tips for optimizing your publications for commercial printing Tips for optimizing your publications for commercial printing If you need to print a publication in higher quantities or with better quality than you can get on your desktop printer, you will want to take

More information

MADISON PUBLIC SCHOOLS. Digital Advertising II

MADISON PUBLIC SCHOOLS. Digital Advertising II MADISON PUBLIC SCHOOLS Digital Advertising II Authored by: Dani Bratton Reviewed by: Lee Nittel, Director of Curriculum and Instruction Thomas Paterson, Supervisor of Science and Technology Education Approval

More information

Course code Course title Prerequisites Lecture hours Lab hours Credit hrs

Course code Course title Prerequisites Lecture hours Lab hours Credit hrs GRAPHIC DESIGN COURSE DESCRIPTIONS The proposed curriculum adheres to the guidelines of the National Association of Schools in Art and (NASAD) Undergraduate Programmes in Graphic. BA Year 2 30 credits

More information

Adobe Training Services Exam Guide. ACE: Illustrator CS6

Adobe Training Services Exam Guide. ACE: Illustrator CS6 Adobe Training Services Exam Guide ACE: Illustrator CS6 Adobe Training Services provides this exam guide to help prepare partners, customers, and consultants who are actively seeking accreditation as Adobe

More information

Computer/Technology Curriculum 2015-2016 Kindergarten

Computer/Technology Curriculum 2015-2016 Kindergarten Kindergarten K.1 Students will understand BASIC COMPUTER SKILLS. (a) Students will learn how to log onto a computer with their username and password (b) Students will become proficient in using the mouse

More information

Digital Photography. Digital Cameras and Digital Photography. Your camera. Topics Your Camera Exposure Shutter speed and f-stop Image Size Editing

Digital Photography. Digital Cameras and Digital Photography. Your camera. Topics Your Camera Exposure Shutter speed and f-stop Image Size Editing Digital Cameras and Digital Photography Topics Your Camera Exposure Shutter speed and f-stop Image Size Editing Faculty Innovating with Technology Program Aug 15, 2006 Digital Photography Your camera Virtually

More information

Neshannock Township School District Curriculum Overview Computer Graphics Plan Course of Study

Neshannock Township School District Curriculum Overview Computer Graphics Plan Course of Study Neshannock Township School District Curriculum Overview Computer Graphics Plan Course of Study Course Objectives: Materials: Knowledge Base: Grading Procedure and Assessments: Curriculum Alignment: Course

More information

Logo Standards Guideline

Logo Standards Guideline Logo Standards Guideline TABLE OF CONTENTS Nurturing The Brand 1 Logo Guidelines 2 Correct Usage 2 Color Guidelines 6 How to Use the Provided Logo Files 9 Glossary 10 NURTURING THE BRAND THE FOLLOWING

More information

Preparing Illustrations for Publication

Preparing Illustrations for Publication UNIVERSITY OF NEVADA PRESS Preparing Illustrations for Publication The following instructions are intended to guide you through the process of assembling and submitting the art program for your book. Any

More information

Image Resolution. Color Spaces: RGB and CMYK. File Types and when to use. Image Resolution. Finding Happiness at 300 dots-per-inch

Image Resolution. Color Spaces: RGB and CMYK. File Types and when to use. Image Resolution. Finding Happiness at 300 dots-per-inch Image Resolution Color Spaces: RGB and CMYK File Types and when to use Image Resolution Finding Happiness at 300 dots-per-inch Rules to remember Text should be 400dpi at the final size in the layout. Images

More information

NETS for Students: Achievement Rubric

NETS for Students: Achievement Rubric NETS for Students: Achievement Rubric DRAFT (March 22, 2005) Purpose: This draft version of the NETS for Students: Achievement Rubric is available online for educational technology professionals to review

More information

Digital Asset Management

Digital Asset Management Digital Asset Management Managing the complexity of digital assets to support your business Product images, streaming video, sound bites, logos, Flash animations, presentations, web pages these days, digital

More information

Xerox Multifunction Devices. Verify Device Settings via the Configuration Report

Xerox Multifunction Devices. Verify Device Settings via the Configuration Report Xerox Multifunction Devices Customer Tips March 15, 2007 This document applies to these Xerox products: X WC 4150 X WCP 32/40 X WCP 35/45/55 X WCP 65/75/90 X WCP 165/175 X WCP 232/238 X WCP 245/255 X WCP

More information

Requisite Approval must be attached

Requisite Approval must be attached Requisite Approval must be attached CITRUS COMMUNITY COLLEGE DISTRICT DEPARTMENT Fine and Performing Arts COURSE NUMBER ART 267 TITLE World Wide Web Design II THIS COURSE IS CLASSIFIED AS: DEGREE APPLICABLE

More information

CENTRAL COUNTY REGIONAL OCCUPATIONAL PROGRAM COURSE OUTLINE INTERNET/WEB DESIGN & DEVELOPMENT

CENTRAL COUNTY REGIONAL OCCUPATIONAL PROGRAM COURSE OUTLINE INTERNET/WEB DESIGN & DEVELOPMENT 06/08/04 Course Title: INTERNET/WEB DESIGN & DEVELOPMENT CCROP Course #: Course Length: 556112 (363) 180 hours District Course #: Prerequisites: Approvals: Original CDE Course ID #: 052-98 CDE Certified

More information

WEB DESIGN BASICS WITH ADOBE MUSE Cordei Clottey, IT-Trainer

WEB DESIGN BASICS WITH ADOBE MUSE Cordei Clottey, IT-Trainer 1 Cordei Clottey, IT-Trainer BACKGROUND AND GOAL Adobe Muse is an application which allows us to design and publish websites without having to write any programming code. This course is the first in a

More information

Lesson Plan. Preparation

Lesson Plan. Preparation Portfolio Information Practicum in Interior Design Lesson Plan Performance Objective Upon completion of this assignment, the student will be able to create a portfolio to document personal knowledge and

More information

WAYNESBORO AREA SCHOOL DISTRICT CURRICULUM INTRODUCTION TO GRAPHICS

WAYNESBORO AREA SCHOOL DISTRICT CURRICULUM INTRODUCTION TO GRAPHICS COURSE NAME: Introduction to Graphics UNIT: Introduction to Mac OS NO. OF DAYS: 5 KEY LEARNING(S): Understanding basic operations on a Mac computer UNIT : thinking Logging in Classroom rules and regulations

More information

SOUTHERN REGIONAL SCHOOL DISTRICT BUSINESS CURRICULUM. Course Title: Multimedia Grade Level: 9-12

SOUTHERN REGIONAL SCHOOL DISTRICT BUSINESS CURRICULUM. Course Title: Multimedia Grade Level: 9-12 Content Area: Business Department Course Title: Multimedia Grade Level: 9-12 Unit 1 Digital Imaging 10 Weeks Unit 2 Cell Animation 10 Weeks Unit 3 Sound Editing 10 Weeks Unit 4 Visual Editing 10 Weeks

More information

Information Technology Systems (2012)

Information Technology Systems (2012) Information Technology Systems (2012) Sample work program April 2012 Information Technology Systems (2012) Sample work program Compiled by the Queensland Studies Authority April 2012 This work program

More information

Adobe Certified Expert Program

Adobe Certified Expert Program Adobe Certified Expert Program Product Proficiency Exam Bulletin Adobe Photoshop CS4 Exam # 9A0-094 ACE Certification Checklist The checklist below will help guide you through the process of obtaining

More information

G102 Graphic Design MTCU Code 61820 MTCU Program Name- Advanced Graphic Design Program Learning Outcomes

G102 Graphic Design MTCU Code 61820 MTCU Program Name- Advanced Graphic Design Program Learning Outcomes G102 Graphic Design MTCU Code 61820 MTCU Program Name- Advanced Graphic Design Program Learning Outcomes Synopsis of the Vocational Learning Outcomes* The graduate has reliably demonstrated the ability

More information

K 1 2 K 1 2 K 1 2 K 1 2 K 1 2 K 1 2 K 1 2

K 1 2 K 1 2 K 1 2 K 1 2 K 1 2 K 1 2 K 1 2 Michigan Educational Technology Standards (METS) - K-8 Checklist by Grade Levels Grades K through 2 Technology Standards and Expectations (by the end of Grade 2) 1. Basic Operations and Concepts. a. Students

More information

ACE: After Effects CC

ACE: After Effects CC Adobe Training Services Exam Guide ACE: After Effects CC Adobe Training Services provides this exam guide to help prepare partners, customers, and consultants who are actively seeking accreditation as

More information

Why is it important to do use your hands and traditional tools to create simple designs before jumping on to the computer?

Why is it important to do use your hands and traditional tools to create simple designs before jumping on to the computer? Intro to Graphic Design Essential Questions Unit 1: Traditional Tools Why is it important to sketch your ideas away from the computer instead of sketching on the computer and believing your solution is

More information

Lesson Plan for Media Literacy

Lesson Plan for Media Literacy Constructions Beliefs & Values Audience Intent Form Lesson Plan for Media Literacy Text Production Audience Lesson Focus: What is the focus of the lesson? How will I teach it? The focus of this shared

More information

South Plainfield Public Schools Web Design Scope and Sequence of Curriculum Grade 10-12 Date August 2011

South Plainfield Public Schools Web Design Scope and Sequence of Curriculum Grade 10-12 Date August 2011 Unit (Domain): Part I: Evaluating Current Websites Part II: Creating Web Pages Using Google Sites, Docs and Forms Part III: Using Animation Media for the Web Essential Question(s): How does the World Wide

More information

Information Management & Design Course Descriptions Contact Drew Hunt at Andrew.hunt@kctcs.edu for more information

Information Management & Design Course Descriptions Contact Drew Hunt at Andrew.hunt@kctcs.edu for more information Information Management & Design Course Descriptions Contact Drew Hunt at Andrew.hunt@kctcs.edu for more information IMD 100 Introduction to Information Systems (3) Essential computer concepts and terminology

More information

Table of Contents. I. Banner Design Studio Overview... 4. II. Banner Creation Methods... 6. III. User Interface... 8

Table of Contents. I. Banner Design Studio Overview... 4. II. Banner Creation Methods... 6. III. User Interface... 8 User s Manual Table of Contents I. Banner Design Studio Overview... 4 II. Banner Creation Methods... 6 a) Create Banners from scratch in 3 easy steps... 6 b) Create Banners from template in 3 Easy Steps...

More information