Multimedia- FINALs

Réussis tes devoirs et examens dès maintenant avec Quizwiz!

<table width="500" or "

Sets width of table, in pixels or as a percentage of document width

Hyperlinks

"hot spots" or "jumps" used to locate an external file, website or place in the presentation; represented by colored and underlined text

Comparing Web Hosts File transfer technology

(ftp, webDAV, editor compatibility) Some hosts do not support some web editors and may require the use of their ftp program.

LINES AS A CHART

...

LINES THAT CONNECT

...

LINES THAT MAKE A FRAME

...

LINES THAT ORGANIZE TABLE

...

LINES THAT SHOW EMOTIONS

...

LINES THAT SHOW MOVEMENT

...

3-D Graphics and Animation

3-D animations are more complex. Creating 3-D animations involves modeling, animation, and rendering.

Order of Tags

BALLOON

A circle or bubble enclosing copy in an illustration Often used in cartoons

RASTER GRAPHIC

A graphic made up of pixels; also known as a bitmapped graphic.

Resizing a Raster Image

A small image that is enlarged is easily distorted. Pixels are not added, just enlarged It is better to start with a large image and make it smaller File size will remain the same An image must be edited to reduce file size.

A Player

A standalone player is a separate program that can play video and audio files without the browser software being open.

END MARK/SIGN

A symbol that indicates the end of an article or news item Symbols vary

Purpose of a Website

A website is developed to build a relationship with a target audience and are created for the following reasons: Sell Social Inform Entertain Hybrid

Folder Structure

A website should be saved in one folder (the Root Folder). Subfolders can be used to organize content within the root folder.

Common Vector File Formats

AI - Adobe Illustrator EPS - Encapsulated Postscript

The website MUST contain an Index/Home Page.A business website should contain:

About Us Contact Us Privacy Policy

<hr />

Adds an horiziontal ruler

Adds an image

Accessibility Issues

All US government websites must meet the needs of all users including people with disabilities. About 8% of all users have a disability that makes using a traditional website very difficult or impossible. Provide text equivalent for non-text elements. Ensure that all information conveyed in color is also available without color. Provide text only pages that are useful for screen readers. Provide equivalent alternatives for multimedia elements that are synchronized Do not require style sheets.

Computer Generated Animation

All images, objects and animation are created on the computer. Typically uses 3-D images. Adds two steps to the animation process. Motion capture can be used to create animation. Actors wear special suits that allow the computer to capture their movements. The movements can then be applied to computer-generated graphics. Modeling Rendering

SMALL CAPS

All letters are caps BUT the first letter appears larger than the rest of the capitals.

Text Editors

Allow developers to write code in plain text Notepad Notepad2 Wordpad Microsoft Word should not be used to create webpages.

Transparency

Allows the background color of an image to be "eliminated" or made transparent so that the background behind the image can be seen. It makes part of the image invisible, or "see-through."

Webbed Structure

Allows users to jump to any page on the website Used for sites with a few inter-related pages The order of the viewing doesn't matter. Must be consistent or user will get confused Navigation bars or menus are included on all pages.

Traditional Animation

Also called (cel animation) or hand-drawn animation. Begins with a storyboard. A preliminary soundtrack is recorded. Penciled drawings are made by lead animators of keyframes. Pencil tests are prepared. Artists called in-betweeners draw the frames between the keyframes. The drawings are traced onto cels and painted. Finally, they are photographed

Raster Graphics

Also called bitmap graphics Consist of grids of tiny dots called pixels Have a fixed resolution and cannot be resized without altering image quality Edited in paint programs

Path Based Animation

Also called vector animation. An object follows a path which is a line, or vector, inserted by the animator. A motion path can include curves, loops, and angles. The computer calculates the correct position of the object as it moves along the path and generates the frames to create the animation Vector graphics or animated gifs can be used to create animations with very small file sizes. The small file sizes make this type of animation very popular on the Web. Many of the banner ads and embedded animations viewed on web sites use this technology because it loads so quickly and is easy to use.

Lossy

Alters and/or eliminates some data The more the image is reduced, the more the quality is degraded

Using HTML Tags

An HTML tag begins with a < character and ends with a > character. Between these characters is the actual tag name, such as body or head. <body> is an example of a correct tag. Tags should appear in pairs, with an opening tag <html> and a closing tag </html>. The only difference between the opening and closing tag is the / used in the closing tag. Text entered between the HTML tags is formatted with the code specified by those tags.

DROPPED CAP

An enlarged character at the beginning of a paragraph Drops below the line of text Grabs the reader's attention

Choose an appropriate file type.

Animated GIF AVI MOV MPEG SWF

Uses of Computer Animation: Advertising

Animation can be used to catch the viewer's eye. Popular for banner ads on websites.

MOV

Apple QuickTime Movie (MOV) Files can be either downloaded or streamed. Run on many different operating systems. Must be viewed in the QuickTime player which is a free download.

Comparing Web Hosts Storage Reliability

Are backup servers in place to host site when main server is offline?

Rules for Using Attributes

Attributes are entered inside the opening tag but not in the closing tag. Attributes are keyed in name/value pairs. Syntax: name="value" The attribute should have an equal symbol followed by the value or setting for the attribute. Attribute values should be enclosed inside quotation marks.

Adding Attributes to Tags

Attributes provide additional information about tags and control how the tag will be interpreted by the browser. href is the attribute instructing the browser to set the text between the anchor tags as a hyperlink to the specified web address.

AVI

Audio Video Interleave (AVI) Microsoft's animation and video format for computers running the Windows operating system. Does not compress animation as much as other formats. Will not play on all operating systems or in all players.

DXF -

AutoCAD

The Home/Index Page

Automatically loads when URL is keyed into the web browser. Sometimes called the front page. Introduces the website and communicates the purpose of the website. Serves as an index for the website. Should create a positive first impression of the website. Should be named index.html All major options for the website should be shown on home page. Access to home page should be possible from any other page on the website. The home page should contain navigational links or menus to provide viewers with the links they will need to navigate the website.

What are web standards?

Basic set of guidelines for authoring languages used to make webpages. Developed by the World Wide Web Consortium (W3C).

OVERSIZED CURLY QUOTES

Big--oversized quotation marks that draw attention to text Does not need to be a quote

JUSTIFIED TEXT

Both margins are the same

CAPTION

Brief descriptive text, usually accompanying an image

Meta Graphics

Can contain vector and raster data. Shapes in vector graphics can be filled with textures and patterns that are raster graphics. Useful when layering text on top of raster graphics.

CSS

Cascading Style Sheets

Text Issues

Cascading Style Sheets Help ensure consistency throughout the website. Increase editing speed Change settings of the style once to update all documents using that style Similar to styles in word processor

CENTERED TEXT

Centered text on paper

Check relative and absolute links to makesure they work properly

Check relative and absolute links to makesure they work properly.

Before Publishing-

Check relative and absolute links to makesure they work properly. Check spelling Check site in multiple browsers. Validate source code.

Check site in multiple browsers

Check site in Internet Explorer, Opera, Firefox, etc. Notice differences and adjust as necessary.

Types of Images

Clip Art - Photographs - Art Work

Factors that Affect Graphic Format

Color depth Compression Portability Transparency

XHTML is

Combination of HTML and XML Allows the designer to mix HTML and XML so that browsers can display and manage data correctly Originally intended to replace HTML as dominant authoring language Places restrictions on HTML tags so that code is cleaner and can display data as the author intended Requires all HTML tag sets be closed Requires lowercase tags Many devices can't interpret bad HTML code (mobile phones, PDAs)

Hybrid

Combination of: Sell Social Inform Entertain

JPEG - Joint Photographic Experts Group

Commonly Used For: Desktop publishing photographs Photographs and natural artwork Scanned photographs Emailing photographs Digital camera photograph

BMP - Bitmap

Commonly Used For: Editing raster graphics Creating icons and wallpaper On-screen display

PNG - Portable Network Graphics

Commonly Used For: Replacing GIF and TIFF images Online viewing of images

TIFF - Tagged Image File Format

Commonly Used For: Storage container for faxes and other digital images To store raw bitmap data by some programs and devices such as scanners High resolution printing Desktop Publishing images

Layers

Compiling multiple pictures or objects together into one image Layers can be turned on or off Elements can be colored, layered, and resized individually

Compression

Compression refers to how an image is saved in order to reduce the file size. The greater the compression, the lower the quality

Regular Frame

Contain one image or frame

MASTHEAD

Contains the name of the publisher and may include staff names and other related info—usually on page 2

Cloning

Copying part of an image and using it to replace unwanted parts of the image.

CDR -

Corel Draw

These leading graphics programs allow users to:

Create live-action animation Bounce an object Zoom in or out of a scene Fade text or pictures in or out to create other animated effects.

Creates a bulleted list

Creates a hyperlink

Creates a mailto link

Creates a numbered list

The Home/Index Page

Creates a positive first impression of site Communicates the purpose of the website Place the company's logo on the page and use it in a consistent location throughout the website. Include navigational links or menus to provide viewers with the links they will need to navigate the website. Limit to one screen of information. Limit amount of prose text on home page. Show all major options on home page. Enable access to home page from any other page on the website. Announce changes to the website on home page.

Creates a table

Creates a target location within a document

Creates an HTML document

Creates an image/link

<b></b>

Creates bold text

<i></i>

Creates italic text

Creates the largest headline

Creates the smallest headline

<u></u>

Creates underline text

Cropping

Cutting out part of an image Original image retains same file size Cut image can be saved as new object

Writing Web Content

Define acronyms and abbreviations. Use abbreviations sparingly. Avoid jargon. Use familiar words. Make first sentences descriptive. Use active voice. "John hit the baseball." rather than "The baseball was hit by John." Minimize the number of words in sentences and the number of sentences in paragraphs. Sentence: 20 words Paragraph: 6 sentences

HTML Tags: Purpose of Tags

Define and describe text, graphics, hypertext links, and other multimedia elements found on webpages Tell the browser how to display the document. By viewing the source code of a webpage, the user can see the HTML tags used to display the page. To view a webpage's source code: In the browser window, Click on the View menu and choose Source.

Style Sheets

Describe how browsers should present or display information on a webpage. Give web developers more control over layout and page formatting. Cascading Style Sheets (CSS) is a popular style sheet language.

XML is

Describes data types to facilitate data processing Designed to carry data, not to display it Allows the author to define tags to identify each data entry so that the data can be easily imported into other applications

Information Architecture:

Determine the mission/purpose of the website Define goals of the site Define target audience Examine competitive sites Identify the content of the website Determine website structure and navigation

Multimedia

Different types of media including text, video, sound, graphics, and animations

Lists

Display a series of related items in a list. Provide a descriptive heading for the list. Make lists easy to scan and understand Meaningful labels, effective colors, borders, and white space Capitalize first letter and first word in lists. Bullets/Unordered List <ul> for items of equal status or value Place important or most commonly used items at top Numbered/Ordered List <ol> for items where a particular order exists Organize alphabetically or numerically. Start numbered items at 1 rather than 0.

Text Issues-Size

Display resolutions and operating systems vary. 12 point on one machine may display as 14 point on another. Windows web browsers typically display type that is 2 to 3 points larger than a Macintosh.

Obtain a Domain Name

Domain names can be registered for a fixed period of time (usually 1 year but no more than 10 years). ICANN (Internet Corporation for Assigned Names and Numbers) maintains a list of accredited registrars. Registrars are the only companies allowed to assign domain names. Registration cost vary but are generally between $10 and $35 although some web hosts will register the domain for free. ICANN manages InterNIC, a searchable list of URLs. Has a WhoIs feature that provides information regarding the registered owner and the registrar that assigned the domain name.

Scrubbing

Dragging the playhead across the timeline in order to preview the animation.

Multimedia Overall considerations: Audio

Effective, low bandwidth way to enhance content. File sizes are smaller than video. Do not use as much bandwidth as video.

United States Website Accessibility Legislation

Equal access to and use of information on their websites for individuals and employees with disabilities. The information must be comparable to that provided to individuals and employees without disabilities. Applies ONLY to the United States.

Fair Use

Fair use allows others to use copyright material without infringing on the rights of the owner

ENTERTAINING BULLETS

Fancy bullets

Advantages of Splash page

Fast loading Gets all information on the page quickly Catches the user's attention for a short time

Types of Web Hosts

Free Shared Dedicated

Gradient

Filling an object/image with a smooth transition from one color to another.

Uses of Computer Animation: Entertainment

Films, computer games and virtual reality. 3D graphics are popular for these types of animations because they are more realistic. Virtual Reality is the use of technology to immerse a user into an artificial environment. Interaction occurs when the user moves around and manipulates simulated 3D objects in the environment. Requires high-quality graphics using 3D technology. Requires high frame rates for smooth motion, and high image resolution for realistic detail.

HTML is

First and still primary language for developing webpages/sites. Uses codes, or tags, to instruct the browser how to display text and images. Is platform independent

SHADOW FONT

Font that has a slight shadow in it

ORNAMENTAL FONT

Fonts designed strictly to catch the eye; should be used sparingly.

Publish the animation.

For animations distributed over the Internet: -Upload the file to the host computer. -Create a link to the file or embed it into the web page. -Test the animation in different browsers. For animations distributed on CDs or DVDs: -Burn the file onto the disk. -Finalize the disk. -Test the disk in several different CD or DVD players.

SCRIPT/CURSIVE FONT

Formal and elegant font used for wedding and prom invitations. Also called cursive or handwriting.

Common link errors:

Forward slash in relative link http:// before a relative link Mistyping a web address using wrong case or mistaking a _ for a blank space

Frame

Frames hold the content that the movie displays or plays at that point in time. The number of frames determines the length of the animation. The higher the number of frames, the longer the animation. .

Common Raster Formats

GIF JPEG BMP PNG TIFF

Multimedia Overall considerations: Animation

GIF format Doesn't require special plug-in Has no interface control. Flash becoming dominant animation format.

Animated GIF

Graphics Interchange Format (GIF) Pronounced "jiff" or "gif" Animated GIFs can contain 2-D or 3-D images. They are used for cartoons, logos, graphics with transparent areas, and animations. GIF files are popular for the use on the Web because they: Have small file sizes. Do not require a special plug-in or player. Are supported by most browsers

Uses of Vector Graphics

Graphics that will be scaled (or resized) Architectural drawings and CAD programs Flow charts Logos that will be scaled (resized) Cartoons and clip art Graphics on websites Because they have very small file sizes. This allows them to load quickly. Fonts and specialized text effects

Advantages of Web Standards

Helps ensure webpages display consistently in all browsers. Internet Explorer, Mozilla Firefox, Opera, and other browsers display the website exactly the same way. Faster website development. Faster downloading of websites Equal access to information. Differences in browser and/or operating system versions do not limit the user's access to the site. Differences in hardware do not limit the user's access to the site.

TRACKING

Horizontal spacing between all of characters in a large block of text. Makes a block of text seem more open or more dense.

Portability

How easily you can open, modify, and view the files on computers using different operating systems, software and browsers.

Comparing Web Hosts Storage

How much storage space can the customer afford? What size is the site? Check the cumulative size of the root folder if no web editor.

HTML

HyperText Markup Language

Analyze and optimize the animation.

Identify potential problems that may occur when downloading and playing a movie. If the entire movie will be downloaded before it is played, determine which parts of the movie are taking the most time to download. If the movie will be delivered through a streaming connection, look for ways to reduce or control the pauses during download and playback. Animations should be optimized in order to: Reduce the file size for quicker downloads. Make the video or animation play more smoothly during playback. Maintain sufficient quality for viewing. Videos can be optimized anytime or only when they are published. Optimizing animation involves fine-tuning compression settings. Optimize the sounds in the Library by compressing to MP3

Guidelines for Using Sound

If the animation is for a Web site, keep the overall file size small for faster downloads by using more compact MP3 files and looping a shorter sound segment. On the other hand, if the animation is part of a presentation delivered in an auditorium equipped with a high-quality audio system, use the highest quality sound file possible. When creating or choosing the sounds to include in the animation, keep the intended purpose of the animation in mind.

ART/GRAPHIC

Illustrations and photographs used to convey meaning and add appeal. Most anything that is not text

Match The Image Quality To The Delivery Method.

Images that will be displayed on a monitor do not need a high resolution. Using a low resolution means smaller file sizes. Images with small file sizes load quicker. Images that will be printed need a higher resolution. Images with 150 PPI are sufficient for printing on most personal desktop printers. Images with 300 PPI are better for printing on more sophisticated printers and will produce higher-quality photographs.

Animation

In the early 1800's, the phenomenon known as persistence of vision gave mankind the first glimpse into the modern world of animation. The rapid display of a sequence of images of 2-D or 3-D artwork or model positions in order to create an illusion of movement. Relies on persistence of vision to create the illusion of movement.

AI - Adobe Illustrator

Industry standard used by developers of vector graphics. Used to create, save, and archive original artwork.

Guidelines For Designing Frame-by-Frame Computer Animations

Insert keyframes at each change in the action Content on keyframes can be changed by: Adding and deleting objects. Replacing one object with another. Moving objects, resizing, or rotating objects. All these actions simulate some kind of motion or action. Add a keyframe at the point where the animation will stop. Allow sufficient time for the image to be viewed after the final content change.

<br />

Inserts a line break

Before using an animation, be sure to answer the following questions:

Is it appropriate for the target audience? Does it help deliver the message? Is it overused? Does it load quickly?

Sets vertical alignment for cell(s) (top, middle, or bottom)

Upload files to a web host

Know protocol being used. FTP—File Transfer Protocol Non-secure transfer that doesn't encrypt access password or allow data encryption during transfer WebDAV-Web Distributed Authoring and Versioning Secure file transfer that uses Web Folders to encrypt password and data during transfer; useful when using multiple authors to create site Does the host require an external uploading application? Does the host accept internal uploading utilities from web editing programs like Microsoft Expression Web or Dreamweaver?

Motion Guide Layer

Layer on which a motion path is drawn. Objects on different layers can be linked to the motion layer so they will follow the motion path. Once linked, they become "guided layers" Multiple objects can be linked to one motion layer. Text layers can also be linked to a motion layer.

Text Issues—Alignment

Left justified text is the most legible option for web pages. Left margin is even and predictable. Ragged right margin will not interfere with legibility Justified text is not recommended for use in webpages. Poor spacing Excessive hyphenation Centered and right justified text are not recommended. Scanning more difficult Ragged left margins make scanning extremely difficult Use indents or a blank line to indicate a new paragraph. Use paragraph tag <p> in html to leave a blank line. Use non-breaking spaces (&nbsp) to indent.

LEFT-ALIGNED TEXT

Left-sided text on paper

MONOSPACE TYPE

Letters share an equal amount of space, not matter their size

PROPORTIONAL TYPE

Letters take up space according to their size.

WATERMARK

Lightly shaded picture underneath the text

JUMPLINE

Line which tells readers which page to refer to for the continuation of an article

Information Architecture:Determine website structure and navigation

Linear Webbed Hierarchical

RULES

Lines that separate Horizontal or vertical lines that can be applied to paragraphs, text boxes, and objects in a publication

Links to that target location from elsewhere in the document

Hierarchical Structure

Looks like a family tree or like a chain of command. Used to organize large amounts of information with categories and subcategories Best way to organize complex bodies of information.

2 Types of Compression

Lossy Lossless

Shared Web Hosts Advantages

Low cost because it is shared with others. Own domain name. Better technical support.

Disadvantages of Vectors

Lower color quality than raster images. They do not support as many colors. Not good for photographic images.

MP3

MP3 is a standard format for music files sent over the Internet that compresses music or other types of audio. The compression process removes sounds that humans cannot hear. To most listeners, MP3 files sound as good as WAV files.

Webpage Design vs. Print Document Design

Many design principles apply to both webpages and print documents. Apply a few fundamental principles to every webpage created. Use clear titles to capture the reader's attention. Include a title in the <head> section in case viewers bookmark your page. Place a link to the "home" URL on at least the main pages of the site. Provides connection back to where a page originated.

Pros and Cons of CSS :Disadvantages

May alter the ability of some devices to accurately read and display information.

Disadvantages of Splash page

May prevent search engines from accessing the actual site. Many readers do NOT like splash pages.

EPS - Encapsulated Postscript

Meta Graphic Graphics developers generally save a copy of the AI file in EPS format because it can be opened by computers running different operating systems. Preferred format for vendors/clients who use the graphics in publications due to its portability.

Sets width of border around table cells

Image Output Methods

Monitors Printers

RUNNING HEADER

More familiarly known as a header or footer. A running headline is repeating text that appears, usually at the top of each page or every other page in a book, manual, or newsletter

Sound File Formats

Most animation and video programs enable sound files to be imported in at least two formats: MP3 WAV Wave files have the highest quality sound.

GIF - Graphics Interchange Format

Most common format for: Text Clip art, animations, icons, logos Simple diagrams, line drawings Graphics with large blocks of a single color Graphics with transparent areas Images displayed on computer screens and on websites.

MPEG

Moving Pictures Expert Group (MPEG) A very compressed video format. Files tend to be much smaller and better quality than other formats. Recommended for videos that will be downloaded instead of streamed because it does not require a specific player or plug-in.

Sound could include:

Music Narration Sound Effects

BYLINE

Name of author of article, usually placed just below the headline

Nesting HTML Tags

Nesting refers to the order in which tags are opened and closed. Enter the closing tags in the reverse order from the opening tags. Closing tags in a different order than they were opened may keep the browser from displaying the page as intended by the author.

Free Web Hosts Advantages

No cost May include free email account May include online web editor with GUI

Free Web Hosts Disadvantages

No personalized domain names; usually combines the free site's URL with the path to specific site. Limited storage space. Limited technical support. Allows pop-up advertising in exchange for hosting site.

Images can be viewed in two ways

On a screen or monitor By printing it on paper

Choose the delivery method.

Once videos have been analyzed and optimized to perform best in the intended medium, the next step is to publish. Delivery methods available for distributing animations: -As part of a Web page -On a CD-ROM or DVD. -As an executable file which bundles both the animation and the program to play in a single file. When an animation or an executable file is distributed over the Internet, the entire file must be downloaded before the animation can play. Animations distributed as part of a web page can be either: -Streamed -Downloaded

Pros and Cons of CSS :Advantages

One style sheet can control the formatting for multiple webpages. An entire website can be reformatted by editing one CSS file. Styles can also be set internally. The CSS code is keyed in the header section of the html document.

MUG SHOT

Photo of a person's head and shoulders with that person looking straight ahead.

Rotating

Pivoting an object around its center point

Overall Page Layout

Place the most important items or information near the top! Be consistent in all design elements used on all pages fonts, colors, graphic size and location, alignment, and backgrounds. Use white space to divide the page into "chunks" of information that readers can quickly scan.

DECK

Placed between a headline and an article to provide a lead in to the body of the article.

4 P's of Presentations

Plan, prepare, practice, present

Plug-ins and Players

Plug-ins or players may be required to view an animation over the Internet.

Precedes each list item, and adds a number or symbol depending upon the type of list selected

Prevents the lines within a cell from being broken to fit

Printers

Printers create output by placing ink or toner on paper. The resolution at which printers can print is measured in Dots Per Inch (DPI). Printers are high resolution devices in order to print images clearly without pixelation or blurriness.

UNDERLINED TEXT

Prints with an underscore (_) below each character

Stop Motion Animation

Process of manipulating real-world objects and photographing them one frame at a time. Very popular method with the film industry until computer generated imagery became possible. Now used mainly in clay animation.

Multimedia Overall considerations

Provide controls so that users can stop, start, play, and adjust volume. Be aware that embedded media can make total page file size very large and slow the download process.

Publishing Animated Videos

Publishing animations and animated videos involves the following steps: Analyze and optimize the animation. Choose an appropriate file type. Choose the delivery method. Publish the animation.

Purpose Fair use situations Public domain material

Streaming Advantages

Quick Access - files can start playing as soon as a computer begins receiving the data rather than waiting for the complete file to download before playing. Data is discarded as it is played so a complete copy of the file is not stored on the viewer's computer.

PULL QUOTES

Quotation taken directly from the body of the article Used to draw attention Often made larger Between columns with word wrap Alone in a column surrounded by white space Right justified in the last column Beneath the headline as a deck

Recording Sound Files

Recording Sound Files Sounds can be recorded or captured from a variety of sources. Some animation software allows you to record narration without having to create the sound in a separate program. When recording, be aware that sound files tend to be large. Large sound files will increase the size of the finished animation which means the animation will take longer to download and require more storage space. Keep sound files as small as possible while maintaining sufficient quality by: Recording WAV files at a lower quality setting. Using recording or conversion software that will save the sound file in a compressed format such as MP3.

Site too large

Reduce number and/or size of multimedia files. Reduce number and/or size of images. Edit pages and remove links to files that no longer exist. Remove unnecessary files from host server. Pay for additional storage space.

Lossless

Reduces the file size without losing any pixel data Quality is not compromised Lossless compression is used when it is important for the compressed image to look exactly like the original image.

MASS FONT

Refers to the heaviness of a font

Remember that in order to avoid a violation of copyright law, only original music can be used in professional productions such as Web animations and presentations. Fortunately, there is a large number of inexpensive programs that combine sound loops to create original, royalty-free music for animations and movies.

Transparency

Removing the background color of a raster image to make it "see-through" Allows image to blend in with its background

Programming or Scripting-Based Animation

Requires knowledge of a programming or scripting language.

The quality of an image is dependent upon two factors:

Resolution Aspect Ratio

Advantages of Vectors

Resolution Independent Regardless of how much the image is enlarged or reduced, the image definition and quality remain the same. Small File Sizes Easily transferred over the Internet.

Image Resolution

Resolution is the amount of detail (or data) stored for an image. The higher the resolution, the higher the level of detail in the image. Resolution is measured in PPI, or pixels per inch (the number of pixels contained in one inch). The higher the PPI, the more data that is stored and the better the quality. The higher the PPI, the larger the file size. Image editing software can be used to change the resolution of an image.

Shared Web Hosts Disadvantages

Restrictions on traffic volume (more traffic costs more money!) Offers many options such as email, database support and multiple web editor compatibility.

RIGHT-ALIGNED TEXT

Right-sided text on paper

RUNNING FOOTER

Running content at the bottom of a document on all the pages. Footers used to indicate dates, page numbers and running titles at the bottom of pages.

SANS SERIF FONT

Sans Serif fonts are fonts that do NOT have attributes on the tips Sans Serif means "without serifs."

SVG -

Scalable Vector Graphics Standard format created by W3C Versatile, all-purpose vector format

Information Architecture: Determine the mission/purpose of the website

Sell (e-Commerce) Inform Entertain Social Networking Hybrid

Cascading Style Sheets

Separates content from appearance and gives web authors more control over layout and page format CSS code instructs the Web browser how to format each item.

SERIF FONT

Serif fonts are fonts that have attributes on the tips that add weight and dimension

Sets alignment for cell(s) (left, center, or right)

Sets amount of space between a cell's border and its contents

Sets amount of space between table cells

Sets font color, using name or hex value

Sets number of columns a cell should span (default=1)

Sets number of rows a cell should span (default=1)

Sets off each cell in a row

Sets off each row in a table

Sets off the table header (a normal cell with bold, centered text)

Sets off the title and other information that isn't displayed on the web page itself

Sets off the visible portion of the document

Sets size of font, from 1 to 7

Sets the background color, using name or hex va

Sets the color of followed links, using name or hex value

Sets the color of links on click

Sets the color of links, using name or hex value

Sets the text color, using name or hex value

SWF

Shockwave Flash (SWF) Pronounced "swiff" File format for animation created with Adobe Flash. Files can contain text as well as both vector and raster graphics; also may include interactive actions written in ActionScript. Must be viewed in the Adobe Flash Player which is a free download. Popular format for the Web because: -File size is small. -Support streaming.

Keyframe

Shows where the key (most important) actions occur

Practice

Stage in the creation process of presenting your presentation to a friend to ensure everything works properly and you know the subject matter

Importing Sound Files

Sound files are usually imported into the animation much like image files. Most animation programs require or recommend that each sound object be inserted on its own layer.

Using Sound in Animations

Sound files can be used to enhance an animation. Do not use sound unless it enhances the animation. If the sound is distracting and irrelevant to the animation, do not use it.

LEADING

Space between lines of text

Check spelling

Spelling errors can turn visitors away from site. Use web editor's spell checking utility or copy text to a word processor to check for spelling errors.

The website may contain:

Splash Page Site Map

SIDEBAR- (must clip both the sidebar and part the of related article)

Square box filled with information related to the main story or to a completely separate article

Common Terms in Animation Software

Stage Library Timeline Frame Keyframe Playhead Frames per Second Layers

Prepare

Stage in the creation proceses that ensures you have covered all bases and have everything completed properly prior to giving your presentation

Planning

Stage of the creation process in which you decide your target audience, type of information you will present and how you will present and your goal in presenting

Library

Stores frequently used graphics, movie clips, and buttons.

TEXTURE AS A DESIGN ELEMENT

Texture is an effect applied to a background or as the fill for an object.

Information Architecture: Identify the content of the website

Text Graphics Video, Audio, Animation Forms

Possible Animation for Text

Text can appear and disappear in selected frames in the movie or presentation. Text can fade in or fade out. Text can follow a motion path. Text can scroll or change colors. Text can blink on and off. Text can appear one letter or word at a time.

Text in computer animations

Text performs the same function in an animation as it does in a graphic: it provides information on the subject of the animation or directions to the viewer. An animation program provides the added option of animating the text in some way to make it more effective. To add a text object in animation software: -Create a layer to hold the text -Choose the text tool from the toolbox -Specify text settings -Key the text. Choose formatting options: -Font, font size, and font style -Change text color and alignment

VERTICAL TEXT

Text that is up and down

Streaming

The Streaming Process -Data is held in a temporary storage area called a buffer until it is played by the computer. -There will always be an initial delay while the first frame is buffered. Suppose an animation plays at 5 frames per second. -Each frame will play for 0.2 seconds. -If the first frame takes 0.3 seconds to download, the animation cannot start playing until after that time has elapsed.

What is the W3C?

The W3C is a member organization. Some well known members include: IBM Microsoft America Online Apple Adobe Sun Microsystems

The W3C and Web Standards

The W3C is working to make the web accessible to all users regardless of differences in: Culture Education Ability Resources Physical Limitations

Bandwidth

The amount of data that can be transmitted over a network in a given amount of time. The speed at which data travels over a network depends on: The type of Internet connection for the network. The number of users using the network at that specific time.

Computer Assisted Animation

The computer is used to make the animation process quicker and easier. Usually involves 2-D images Can be hand-drawn and scanned into the computer. Can be drawn directly into the computer using graphics tablets. The images are positioned into keyframes containing the most important movements. Tweening is then performed by the computer to create images between keyframes. Even though computers are now used extensively, many traditional steps are still used.

Monitors

The display resolution on monitors is also measured in PPI. Monitors are low resolution devices, most display 72 PPI.

KERNING

The horizontal spacing between letters or characters.

Color Depth

The number of colors per pixel that can be contained in an image. Most graphics editing programs will allow you to set the color depth for your image. Different graphic formats contain different numbers of colors per pixel.

Frames per Second

The number of frames that appear in one second of the animation. If the animation program creates movies at 12 fps (frames per second) by default, inserting a keyframe and change once every 12 frames results in a change in action for every second. A project with 60 frames results in a 5-second movie.

Timeline

The part of the animation program window that organizes and controls an animation's content over time using layers and frames. In video-editing software, where source clips, transitions, and audio files are arranged to create the video

Stage

The part of the animation program window where the animation's content is composed and manipulated.

WAV (Waveform)

The standard format for sound on computers running the Windows operating system. WAV files produce high-quality sound. Generate large file sizes.

Morphing Animation

The term morphing comes from the word metamorphosis, which is the transformation of one thing into another. The beginning image is inserted. The ending image is inserted. The computer performs the tweening to generate a sequence of images, each of which is slightly different from the one it follows to gradually morph the two objects.

Streaming Disadvantages

The viewer must be connected to the Internet to view the video. The viewer's connection speed influences the quality of playback. Files cannot be saved and viewed later.

Layers

Timeline is divided into layers to help organize content and allow the different layers to be edited separately. Sound would be on a separate layer. Text would be on a separate layer. A motion path would be on a separate layer.

Comparing Web Hosts Traffic

Traffic Does the host allow a maximum number of "hits" per billing cycle? What is the fee for exceeding the traffic allowance if the site becomes popular?

GRADIENT AS A DESIGN ELEMENT

Two colors blended together

Using Color

Use contrasting colors for background and text. Light text on dark background OR Dark text on light background Improves readability

Text Issues—Text as a Graphic

Use for banners and navigational graphics. Avoid using text as a graphic for headings, subheadings and body text in case the graphic does not load properly on the viewer's browser.

Headings and Titles

Use headings that are unique from one another, descriptive and relate to the content they introduce. Use headings in the appropriate HTML order. Helps users get a sense of hierarchy of information on the page Also helps users of assistive technologies understand the level of importance of information Use a descriptive, unique, concise, and meaningful title for each webpage in the website. Titles display in the browser's title bar. Titles are used by search engines to identify pages and are listed on the results page.

Text Issues—General Guidelines

Use initial caps for headlines and headings. Use sentence case for body text. All caps are difficult to read. Use italics to stress foreign words or phrases or to list book and periodical titles. Use bold to emphasize headings. Do not use underlining—it implies a hyperlink. Indicate to users when a link will move them to a page on a different website. Add URL below the link Add an exit disclaimer Add an interim page warning the user that they are leaving your site and requiring them to click an additional link to leave your site.

Multimedia Overall considerations: Tags

Use object or embedded tags to include multimedia elements in page. Use anchor tags and href attributes to link to video. Use combinations of anchor and image tags to link to video.

Hyperlinks

Use relative hyperlinks to point to other files within the website. Use absolute hyperlinks to point to other websites.

Text Issues—Typefaces

Use typefaces designed for on-screen viewing Sans serif typefaces are easier to read on computer screens. Use "font-family" property in styles to specify typeface.

Multimedia Overall considerations: Video

Use video sparingly. Video files tend to be large. They require more storage and slow the download speed of the webpage

Graphics on the Web

Use video, animation, and audio only when they help convey or support the website's content. Place the organization's logo in a consistent place on every page Use images that add value and increase the clarity of the information on the site. Ensure that images load quickly. Use several small images rather than a large single image. Include height and weight pixel dimension attributes in the image tag. Use thumbnails to preview larger images. Use simple background images.

Multimedia Overall considerations: Slideshows

Use when image quality is a top priority. Uses a smaller file size than most video so storage and bandwidth are optimized. Combine with audio for additional emphasis

Filters

Used to apply special effects to an image that would be too difficult to create manually.

Authoring Languages

Used to control the appearance and functionality of webpages when displayed in a browser HTML (HyperText Markup Language) XML (eXtensible Markup Language) XHTML (eXtensible HTML)

Linear Structure

Users view pages one at a time in a specific order. Topics are arranged in chronological, alphabetical, or series specific order. Pages have links to the next page and back to previous or index page only.

ISP is most common web host for

Usually package Internet access, email, and limited web site storage for its customers Can be a solution for personal or small business use

Validate source code

Validating checks for errors in HTML code such as: Tags spelled incorrectly Tags left open Validating does not find spelling errors in text. Some validators correct errors while others just highlight the error. Many web editors contain internal validating utilities. For sites created in a text editor, validating is available online and via free downloads.

Vector Graphics

Vector Graphics Vector graphics are created from mathematical formulas used to define lines, shapes and curves. Edited in draw programs Shapes can be edited by moving points called nodes (drawing points)

Playhead

Vertical red marker in the timeline that shows which frame is the current frame.

Dedicated Web Hosts Disadvantages

Very expensive Requires high-level computer skills.

Factors that influence the delivery of computer animations:

Viewer's bandwidth, or connection speed. Streaming rate Playback rate

Dedicated Web Hosts Advantages

Website is hosted on its own server—not shared with others. Very powerful—can accommodate any kind of software.

Comparing Web Hosts Cost

What can the customer afford?

BLEED

When graphic goes up to and even appears to run off the edge of the page

: Rollover or Mouseover

When the mouse is moved over an image, it changes to a different image so quickly that it looks as if the change has occurred in a single instant. Created by using scripting languages such as Javascript. Rollovers are extremely important for navigation buttons on user interface designs.

Metadata

data about data

HTML

While many old browsers can display "old" HTML, newer ones rely on the current standard. Remember, web pages are accessed from desktop computers, mobile phones and handheld devices—all using a variety of browser technologies!

WMF -

Windows Metafile

KICKER

Words positioned above a headline, usually as a lead-in or teaser

The leading graphics programs designed specifically for creating and editing 3D images are:

Xara 3D 3ds Max 4 Maya Blender Flash Cinema 4D

Popular Vector Graphic Software

Xara Xtreme Adobe Illustrator CorelDraw DXF - AutoCAD Inkscape - open source software similar to Adobe Illustrator.

Site Map

a basic skeleton of the website intended to help users quickly locate information on the website.

Website -

a collection of related webpages.

Multimpedia Presentation

a computer based, interactive experience that incorporates text, graphics, sound and video

Webpage -

a document stored on a web server which can be accessed and viewed using a web browser on a computer or mobile device. It can contain: Graphics, audio and video. Hyperlinks to other documents on the World Wide Web.

a list of options that use hyperlinks to move to other parts of the presentation

TABLE OF CONTENTS

a listing of the major entries in a publication

interactivity

ability of user to interact with an application

PORTRAIT ORIENTATION

a page or worksheet rotated so it is longer than it is wide.

LANDSCAPE PORIENTATION

a page or worksheet rotated so it is wide than it is longer .

optical center

a point slightly above and to the right of the mathematical center of the screen

Frame-by-Frame Animation

a sequence to create the optical illusion of movement. Digital animation is based on the frame by frame animation process. The quality of frame-based animation depends on the frame rate. Frame Rate = Frames per Second The more frames per second, the smoother the motion appears.

LOGO

a symbol that represents a company

A web host is also called

a web server.

non-linear presentation

allows user to interact with a prsentation and control how information will be viewed

Build effect

an effect applied to text that makes it appear on a slide in increments of one letter, word or section at a time; keeps attention

VECTOR GRAPHIC

an image that is created using paths or lines

Splash page

an introduction page that appears while the website is loading. Provides information that is needed only once per visit to the site. May be used as a promotion or lead-in to the site's home page. Show a progress bar indicating the website is loading. Tell the user what kind of browser or software they need to view the site. Allow users to choose their language or country's version of the website.

Adobe Flash

animation program for developing 2-D animations

Graphics

anything on the page that is not actual text, from simple line drawings to fully active images found on the World Wide Web. There are many different graphic file formats. The format you choose depends on several factors.

WHITE SPACE

areas on a page with no text or graphics; designed to provide a visual break and to give other elements on the page a greater impact; also known as negative space

symmetrical balance

arranging elements as mirrored images

asymmetrical balance

arranging of non-identical elements on both sides of an imaginary center line on the screen

linear presentations

author controls flow, a slideshow

Adobe Director

authoring program that uses a movie metaphor with the user as the "director" of the movie; has a scripting language called Lingo which creates CD-ROM's and supports 2D and 3D

NAMEPLATE

banner on the front of a magazine or newsletter that identifies the publication and usually includes the name of the publication, a logo, and a motto

NEUTRAL COLORS DEPICTED IN AN IMAGE

beige, ivory, taupe, black, gray and white.

Navigation buttons

buttons that are hyperlinked to other parts of the presentation allowing user to move through the presentation

Art Work

computer created drawings or paintings; may be raster or vector.

The Root Folder

contains: The Index.html file (index/home page) Products Folder Order Forms Folder

CALMING COLORS DEPICTED IN AN IMAGE

cool colors blues, greens and violets

Traditional animation is

defined as the process of creating the illusion of motion by viewing a series of individual drawings successively.

About Us page

defines the website's purpose and goals.

balance

distribution of optical weight in the layout

XHTML

eXtensible HyperText Markup Language

XML

eXtensible Markup Language

no balance

elements on screen with no regard to optical weight

ensures that the author's rights of images and sounds used in multimedia products are protected and acknowledged. Copyrighted material cannot be used with the owner's permission

rollover

functioin performed as the mouse pointer rolls over and points to an object

treatment

how a presentation will be offered to user

intra-screen unity

how various elements relate to one another on same screen

Uses of Computer Animation: Teaching

illustrating concepts or processes.

A plug-in

is a program that works with the browser to expand its capabilities.

Playback rate

is the rate in frames per second at which the video plays.

Streaming rate

is the rate in frames per second at which videos can be downloaded or transferred to a computer and is determined by: -The viewer's network connection speed. -The content of the video file being downloaded.

*Public domain

material do not have a copyright for the possible following reasons: no copyright issued, copyright expired, or it was not renewed.

Toolbook

multimedia authoring software program

REVERSE TEXT

often used in headlines to draw attention

Sends webpages to viewers

over the Internet upon request.

page containing contact information to make it easy for viewers to communicate with the business.

page informs viewers how their private information will be handled.

Clip Art -

premade graphics that are available online and in many software packages; may be vector or raster.

Rendering -

process of applying colors, textures, shadows, transparency, etc. to create the final image or animation

Modeling -

process of creating a wireframe structure of the 3-D objects and scenes.

Shockwave

program that allows an internet user to play applications created with Adobe Director

Players

programs that allow users to run multimedia

authoring programs

programs used to create multimedia presentations; i.e. Microsoft visual Basic, Adobe Director

Social

provides a network where people can interact online.

Inform

provides information about a cause, event or organization and may provide tutorials or demonstrations.

Entertain

provides information or links to movies, music, magazines, etc.

Patterns

raster graphics used to fill an object or selection

Photographs - raster images that contain millions of colors.

raster images that contain millions of colors.

WRAPPED TEXT

refers to the placement of a picture around text

Persistence of vision

refers to the way our eyes retain images for a split second longer than they actually appear, making a series of quick flashes appear as one continuous picture.

Aspect Ratio

relationship of an object's width to its height

XHTML

requires some modification of the old HTML standard. All tags must be in lowercase. All tags must have a closing tag. All tags must be properly nested. The <html> tag must be the root tag for every document.

Uses of Computer Animation: Selling

showcasing products or services

Uses of Computer Animation: Training

simulating events or demonstrating techniques in presentations.

Fair use

situations apply to use in news reporting, parody, research, and education.

sequential navigational scheme

take user through a controlled, linear process

optical weight

the ability of an element such as a graphic, text, or headline to attract the user's eye

the right of intellectual property and access to possible monetary rewards for owners, which should encourage creativity.

slide transitions

the visual effect of a slide as it moves on and off the screen during a slide show

Multimedia- FINALs

Ensembles d'études connexes

Renal Critical Care Exam

CJL 3510 Ch 13

Peri-operative Care

Traditional Hawaiian Metaphors Worksheet

FINAL REVIEW Q1

Final Chemistry

Unit 4: The Reformation

CRIMINAL LAW

Chapter 11 Marketing

PR Book MCQ - MPRE

Hurst Practice Exam 2

Chapter 9-Activity based costing

Respiratory ATI questions?

Practice Test Questions Review

Medical Readiness Administrative/Healthcare Portal Training

Chapter 17

chapter 12 geography

CH 2: Scarcity and the World of Trade-Offs (dynamic study module)

Business Writing Chapter 5

Ch 14 Bus 102