Multimedia Elements – Text and Graphics
Download
Report
Transcript Multimedia Elements – Text and Graphics
Multimedia Elements – Text
and Graphics
Text in Multimedia Applications
Of all multimedia elements, text is the easiest to
manipulate
General guidelines:
Be concise
Use appropriate fonts
Consider different type styles
Be consistent
Make the text readable
Use restraint
Working with Text
Be concise – text fills < ½ screen
Large amounts of text
Alternatives? - animation, video, narration.
Show a preview and allow user to request
more
Hyper linking
Pop-up messages, scroll bars,
drop-down menus
Use Appropriate Type Fonts
Decorative
Serif
Hard to read
Used for emphasis
Creates illusion of a line and guides the eye
across the screen facilitating readability
Used on large blocks of text
San serif
Clean, simple
Good for headings
Examples of:
Serif, Sans Serif, and Other Fonts
Scanned image: from Multimedia Concepts – James Shuman
Font Type Styles
Type styles: bold, italic, underline
Used for emphasis
Use for links – hypertext
Be consistent
Similar headings – typeface, size, style
Use same font for similar sections
Graphic image for headings
Consistency vs. file size
Make Text Readable - Use Restraint
Choose fonts found in most systems
Avoid “ransom note” effect
Choose only up to four variations of type
styles, fonts and sizes
Creating and Editing Text
Word Processor
Corel Draw
Adobe Illustrator
Scanner
OCR-Optical Character Recognition
Using Text on the Internet
Microsoft IE and Netscape determine the
fonts of your web page
To ensure text is displayed in the desired
way:
Use a font set
Use a Cascading Style Sheet
Embed it in your Web pages
Change the text into an image
Graphics in Multimedia Applications
Graphics in Multimedia Applications
Graphical images - used to add
emphasis, direct attention, illustrate
concepts, and provide background
content
Two types of graphics:
1)
2)
Draw-type graphics or vector graphics –
represent an image as a geometric shape
Bitmap graphics – represents the image
as an array of dots, called pixels
Draw Type Graphics
Draw type or vector graphics
Geometric shape stored as set of
instructions
Smaller than bitmap
Resize, rotate, no distortion
No photo quality
Draw-type Example
Scanned image: from Multimedia Concepts – James Shuman
Bitmap Graphics
Bitmaps – array of dots or pixels
Color depth per pixel
High quality pictures
Photo realistic
Larger than draw-type
File size = pixels x color depth / 8
Graphic Image File Sizes
Image file sizes can
become large, you must
balance the need for quality
images with the need for
small file sizes
Graphics Software
Drawing programs – used to create drawtype graphics
Paint programs – used to create bitmap
images
Image editing programs – useful in making
changes, or applying textures or patterns
to existing images
Graphics Software Programs
Drawing programs –
Adobe Illustrator
Paint programs –
Paint Shop Pro
Image-editing
programs –
Photoshop (does the
work of all 3)
Graphics Programs Features
Graphics types
Compatibility
Graphics files – tiff,
jpeg, bmp, gif …
Layers
Image
enhancement
Selection tools
Color adjustments
Graphics Programs Features (Cont.)
Image manipulation
Filters
Antialiasing
Smoothes edges by
blending colors
Text support
Hardware support
Open architecture
Using Graphics on the Internet
Techniques to speed transfer times
File compression – reduces the file size of
a graphic
Load images in stages
Use thumbnails
Use image editing programs
Graphic Image Sources
Alternative image sources
Clip art
Stock photographs
Video images
Still images
Scanned images
Photo CD’s
Screen-capture programs
Other Resources
Some of the sources for font shopping
EyeWire (www.eyewire.com)
garageFonts (www.garagefonts.com)
LetterSpace (www.letterspace.com)
BitStream (www.bitstream.com)
MyFonts (www.myfonts.com)
T26 (www.tw6.com)
P22 (www.p22.com)
FontHaus (www.fonthaus.com)
The End
University of North Texas
Dr. Vicky Cereijo