Compsci 1033

WYSIWYG Programs

"What You See is What You Get" eg Adobe Dreamweaver, Bluegriffon. Create tags for us, user-friendly

Windows Bitmap

(.BMP) • Vector based graphic •Popular image files since they can be imported into nearly any application.

Encapsulated Postscript

(.EPS, .EPSF) • Most widely used bitmapped file format • Supported by image-editing applications, scanning software, page-layout programs, and word processing software. • Supports bit depths from 1 to 32 bits • Cross platforms for MAC, PC, and Unix systems • Most commonly used when the output is printed

Graphics Interchange Format

(.GIF) . • Standard bitmapped format on the Windows platform •Supported by most Windows applications.

Tagged Image File Formats

(.TIF, .TIFF)

WEB HOSTS

(ISPs) COMPANIES that provide space on a server they own for use by their clients as well as providing internet connectivity (rogers, execulink, AOL...) **files must be hosted on webserver provided by ISP to be available on the internet

Ease parameter

(ease-in, ease-out) accelerating/de-accelerating. Motion starts out slow, gains speed, then slows down. Creates a more realistic progression, exaggerates motion, and draws attention to it.

Downsample and reduce bit depth

(ie compress)

MUTLTIMEDIA

(technical): Describes any application or technology that can be used to present: Text, images, sound, animation video

DITHERING (optimizing method)

(when saving GIFs) most common method of reducing the color range of images down to the 256 colors seen in 8-bit GIF images o Juxtaposing pixels of two colors to create the illusion that a third color is present (grainy look)

SUBJECT DIRECTORY - Yahoo, About.com, AOL

-a program that enables the user to search internet sites -internet sites are organized by subject and topic -allowing users to choose a subject interest and then browse the list of resources in that category collection of websites organized by topic Human-selected (hand-picked) internet resources are arranged and classified in hierarchical topics Human editors review webpages, rank them, organize them into categorized list with brief descriptions Wait for human editors Yahoo, about.com, AOL, Open Directory (open directory is 1% size of google)

BITMAP-BASED programs "PAINT"

-ability to edit an image's pixels -images from scanners, cameras -need a "PAINT" program Photoshop, paintshop pro, photoplus (but photoshop v6.0 has vector features)

VECTOR Graphics programs - "DRAW"

-greater control and precision with free-hand tool -display more accurately on screen -download faster because support of Flash and Scalable Vector Graphics (SVG formats) -produce smaller files that download faster -more details in vector-based illustrations -must use a "DRAW" program - draw and edit paths Adobe illustrator or Macromedia FreeHand, Corel Draw

Vector (Zoom in, no pixels) **Vector CANNOT be converted to Bitmap, but Bitmap CAN be converted to vector

-image is represented with lines and arcs that have a mathematical relationship -describes the drawing of the shape - Line: starting point, direction length - Rectangle: start point, width height - Circle: center and radius *SMALLER FILE: records mathematical relationship -as image enlarged (resized): - Dots become larger, edges still clean, crisp - Quality is maintained - no distortion - File size increase

BITMAP (Zoom into pixels)

-images made up of small squares called Pixels -Editing pixels: changing color, shade, brightness Advantages of using a small image rather than larger: -shorter time needed to display on screen -smaller file size Disadvantages: -distortion occurs when image is enlarged -as image is enlarged (resized): - Dots become larger, edges more jagged - Quality decreases - File size increases

- Reduce the download time by using any or all combinations:

1) Reduce file size 2) Choosing .jpg or .gif formats 3) Reducing color resolution (24 bits, 16 bits, 8 bits)

- How does Google work:

1. Gathers the Information: crawl and index billions of pages of WWW, performed by Googlebot, a "spider" which connects to web servers around the world to fetch documents. Spider gives each retrieved page a number so it can refer to the pages it fetched 2. Build a database (index): List every document that contains a certain word 3. Rank results: rank them in terms of relevance - google uses many factors in ranking: a. PageRank algorithm - how many links there are to a web page from other pages, quality of the linking sites b. Frequency of keywords in a webpage c. Appearance - words right next to each other 4. Rank Results: make a list of documents and their scores - take the documents with the highest scores as the best matches a. Google also shows snippets from each document that highlight the words the user typed b.In search ranking, google returns the ranked URLs and the snippets to the user as results page

first permanent photograph was taken between

1820-1830

The first motion picture was recorded between

1880-1890

How many lines of horizontal resolution did TVs from the 1970s have

480

TV's before 1980s had

480 horizontal scan lines

What is 4:1:1 colour sampling?

4: amount of Luminance (Y) 1: amount of U (colour or hue) 1: amount of V (colour or hue) Amount of compression: 50% reduction in storage (12 to 6)

how many seconds to make a good first impression

7-15 seconds

A typical CD can hold about

737MB or 80 minutes of audio

How computers represent sound

: sampling and quantizing Samples are recorded in Hertz (Hz) 1000 samples per second = KiloHertz (KHz) CD quality —> 44,100 samples per second (44,100Hz or 44.1KHz)

Link tags

<a href = "http://www.msn.com"> </a>

Placeholder tags (standalone)

<img src = "mydog.jpg"> <hr>

Multimedia

<img> <embed> add audio <video>

Cel-based animation:

every frame of animation is drawn by hand on clear plastic sheets called celluloids or cels

MULTIMEDIA

everything you can hear or see; Media include texts, books, pictures, music, sounds, CDs, videos, DVDs, MP3 players, iPods, records films etc

Squash and stretch:

exaggerating motion by changing the shape or size of the object being moved

Temporal compression:

examines differences between pairs of consecutive frames and stores those differences in the file rather than writing out the entire frame

Animated Gif

extension: .gif, file size: larger than unanimated gif, need nothing to play it

True or False: it is not possible to add tracks to a HTML5 file.

false

FTP

file transfer protocol Ex: SSH Secure File, Filezilla, WS-FTP, Fugu (for mac) oSome file transfer programs do not connect to all servers

ISP

internet Service Provider à Western, Bell, Rogers, Execulink, Costco o Allows one to connect to the internet o Company that maintains an internet host computer providing internet access and user account for accessing internet, e-mail box, webspace to host website o offers connection via telephone lines, cable TV or personal satellite dish - data travels from one internet host to another along best route, if links overloaded/out of service - rerouted

META-SEARCH ENGINGE/METACRAWLER

internet search engine which searches other search engines o Uses searches of other engines, returns the "top" results, doesn't create its own databases - Top search providers: google (62%), yahoo, msn

Tim Berners-Lee

invented the World Wide Web

Temporal compression (VIDEO)

just save info on keyframes and save the differences on other frames

To slow down motion

keep frame rate the same & increase number of frames between keyframes to stretch out animation, or lower frame rate

Onion skinning:

layering the frames of a motion on top of one another with semi-transparency so that all the frames can be seen in one layered graphic Effects and Parameters

Low, bass-level sounds

less frequent pulses, represented by wider, more spread out waveforms

• Motion guide

lets you animate an object along a path that you draw yourself; only works with symbols

Lossless compression (VIDEO)

looks for large blocks of pixels that are the same to do run length encoding (RLE)

Compression strategies (VIDEO)

lower frame size (less pixels), lower frame rate (changing frame rate by 1/2 will generally 1/2 the file size), pick a codec that does higher compression, lower picture quality of the video, lower the colour depth, play with the audio

Lossy Compression (VIDEO)

lowers video quality but gets better file size and better data rate *depends on codec How does this relate to bit rate? • More compression = lower quality • Ex: 1080p file compressed to 5mbps vs. 480p file compressed to 5mpbs • The latter better quality

Downloading video

making a permanent copy of a file/video on your machine (used to be the only option) Progressive downloads: allow you to listen as soon as it has downloaded enough bits to stay ahead of the download • For the web, usually stored on a HTTP protocol

IMAGE BIT DEPTH (aka COLOR DEPTH

maximum number of colors used to represent an image § The more bits used the more color info stored to describe the color of a pixel · Quality improves and larger file size §Human eye can detect about 10 million colors, therefore, storing more than 10 million colours is pointless, so we only use 24 bit color (16 million colours)

Decibels are logarithmic

meaning they represent powers of 10, and relative — they use human threshold for hearing as a reference point and assign that a decibel value of 0. • 160+ decibels damages ears

Future

multimedia will continue to grow into more than 1 $100 billion industry with top three applications § #1 - Entertainment $15 billion § #2 - Publishing $7 billion § #3 - Education/Training $7 billion o E-leaning, iTV (interactive TV) o Web 2.0 (sharing between users) - trend in web design, development, can refer to second generation of web-based communities and hosted services (social networking, wikis, blogs) which aim to facilitate creativity, collaboration, and sharing between users o Laptops becoming smaller, thinner, more powerful o Legal issues - copyright, rights management, piracy à problematic since rapid technology changes o Better skills - strong understanding of media and moving images as well as traditional IT and programming skills

Panther

name of computer, "server", that hosts uwo website o Host name: panther.uwo.ca o User website: http://www.publish.uwo.ca/~username

Graphics originate from

non-digital medium (paper copy of a photo), outside world, create image - Computers only understand/speak "BINARY" (digits 0 and 1) - convert all words, images, etc. to 0 and 1

Sample Rate

number of samples we take per second of audio (voice: 8KHz, AM radio: 11.025 KHz, FM radio: 22 KHz, CD Quality: 44.1KHz)

- HOW MANY SYSTEMS ARE THERE:

o Binary à (2 Binary Digits/ BITS) 0,1,10,11,100,101, 111,1000 o Octal à (8 Digits - or think of it as 8 number values) 0,1,2,3,4,5,6,7,10,11,12,13,14,15,16,17,20 o Decimal à (10 Digits) 0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20 o Hexadecimalà (16 Digits) 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F, 10,11,12,13,14,15,16,17,18,19,1A,1B,1C,1D,1E,1F,20

- Coding colors

o Black/white = 1 bit ONLY (0 = black, 1 = white) o 2 bits - combination of black and white (01/10) à grey oMore bits, more shades... 4 bits à 24 = 16 grey shades

- Multimedia categories and applications (IBEE)

o Inform - Encarta and interactive world atlas (interactive multimedia including sound, video, and 3-D animation to provide information and illustrate concepts) o Business - businesses delivering marketing applications and employee training on CD's and Internet (job openings, product lines, services) Education - offering instruction (CD-Roms for preschoolers, bio in virtual labs) o Entertainment - largest category (games (CDs/web), proprietary systems (X-box), MP3 players/ipods)

- S-FTP using Secure shell

o SHELL CLIENT: can type in commands by hand - but it's in Unix o FILE TRANSFER CLIENT: allows us to transfer files to panther - o Setting permissions: § Sometimes you can't see your files on internet because files are "locked" after uploaded § Solution 1: change file "permissions" - Every time you upload new file, go to Shell window and type in "publish § Solution 2: change file "permissions" - using Secure File Transfer, everytime you upload new file change permission rights on that file or folder (change properties) · "Horseshoe"- checkmarks shaped in an upside down "u" ·644 for file, 755 for folder

EBAY

online auction and shopping, March 2008 revenues $8.7 billion o Sept 1995 - Pierre Omidyar - Echo Bay consulting, "broken' Laser pointer o Sept 1996 - Jeff Skol (Movie producer) - Marketplace for goods and services o Sept 1998 - went public - Meg Whitman (Harvard, Hasbro) - Vision: "connecting" people oJohn Donahoe - CEO of Ebay

Muybridge

originated the idea of using sequences of slightly different frames to create animated motion

Streaming

ou can watch but file is never permanently saved to your machine, uses buffering (a portion of the video is in the buffer that is larger than the portion of the video you are viewing so the video can be delivered fast enough) • Sometimes requires special streaming server, RTSP • Video starts almost immediately • If the data rate of the encoded video is bigger than the amount of bandwidth available, video will stop playing

Frame rate:

playback speed of the animation; a factor in how smooth the animation appears and how long it takes to play through • Low frame rate = choppy motional each frame stays on screen longer • Increasing frame rate = increases smoothness & shorter run time • Longer and smoother animation — have many frames and still a reasonable frame rate • 8FPS = animation begins to look smooth • High frame rate can also appear choppy if the computer playing the animation is not fast enough to process and display the frame

Representation of sound waves:

pressured spurts of air from vibrations —> sounds • Sinusoidal/wave-based; visualized in wave graphs known as waveforms • Two people talking creates two sets of overlapping waves which actually forms a new wave

HTML

primary website development language; structured language composed of tags that indicate where each element or section begins and ends and the content they each contain.

To speed up motion

reduce the number of frames or increase the frame rate

Hiss reduction

reduces noise within a given frequency range

Server side of website

remote host on which the website resides • Languages used to perform actions on or through the server but with no access to client's computer. • PHP (most common) • Javascript - client-side language Client side scripting: for work that is done on the client's computer rather than on the server • Primary use — adding interactive effects that are based on user input through a mouse, keyboard, or touch screen; makes javascript suitable for simple online games

IMAGE

represented by a grid (array, matrix) of squared picture elements called PIXELS (the smallest image component and thus shows the smallest detail) Pixel - numerical value corresponding to a COLOR INDICATOR (bw or colour) o640x480 screen - 640 dots on each of 480 rows à 300,000 pixels

Normalization

scans audio files to find peak or average level and proportionally increases or reduces levels to obtain the desired volume level

Multicast

send the same stream to many users but they lose the ability to pause, rewind, etc

Tim Berners-Lee

set specifications for HTML language and wrote a browser to read HTML files and output linkable papers in the 1990s. Proposed HTML tags, which come in pairs of opening tags <p> and closing tags </p> Can be nested within each other, no limit to number of levels of nesting Must be opened and closed symmetrically • Ex: <p> <ul> <i> sample content </i> </ul> </p> Basic shell of any HTML file should first contain a DOCTYPE line which indicates what version of HTML is being used (usually <!DOCTPEhtml> to signify that the current version of HTML, HTML 5 is being used. Then starting <html> tag which contains two large sections: <head> and <body> • <head> —> for metadata (title, attaching external info to file) • <body> —> all content and related tags for anything shown on website itself; largest part of any website

CSS/Cascading Style Sheets

sets of style groups that can be applied to who webpages, all elements/tags of a certain type, elements of a specified class, or individual elements • Language complements HTML well • Selection text followed by curly brackets and any number of style statements within those brackets • Styles based on a class begin with a period and the class name (".redtext") • ID-based styles begin with a pound sign and the ID text - ex: #slogan • Never give 2 elements the same ID

BIT

short for Binary Digit, value of "1" or "0" - fundamental units of information in a computer system

MIDI

shows music in notes - deals with music and synthesized sound, does not handle voices or noise well • No sampling or quantizing when storing MIDI files • Hold info such as which instrument is being represented, the note being played, how hard the note was pressed • Cakewalk, Cubase, Finale • 3 minutes of Midi file about 10KB (much smaller than uncompressed waveform — 3 mins = 15MB)

Noise reduction

software examines audio and removes unusual differences from waveform

Web Browser:

software/program that displays formatted websites. Understand HTML code and render the webpages based on their code

Audio can be

streamed or downloaded (same as video)

Cinemagraphs

take a video and keep the movement in one part but cover the rest of the picture with one frame that doesn't move (2011) • Usually stored as an animated gif, need both a still picture and a video

WEB HOSTING

the SERVICE that provides internet users with online systems for storing information, images, video, or any content accessible via the web

Anticipation

the act of building up to a big motion by prefixing it with smaller actions.

Bandwidth

the data transfer rate of a network or Internet connected; how much data can be sent over a specific amount of time • Analogy — getting water from one pool to another via a pipe... • Amount of water in pool = file size • Diameter of pipe = bandwidth (you cannot control) • Amount of pressure/flow is the bitrate

Amplitude

the height of the wave from the top peak to the lowest dip, indicates the volume of that sound. Measured in Decibels (DB)

Follow through

the motion continues after the main action has finished, often based on gravity or momentum from the motion

Arpanet

the name of the predecessor to the internet

IMAGE RESOLUTION (ppi/dpi)

the number and spacing of pixels in an image § The number of pixels per square inch on a computer-generated display § Ex: if resolution 100 ppi, each pixel 1/100th inch § When you increase the number of pixels, increase quality of detail in the resolution § For different output delivery: · Web - set to 72 dpi (smaller graphics, don't see detail) · Laser Printers - 300-600 dpi · High end imagesetters - 1200 dpi, 2400 dpi, or higher (newspapers/magazines)

Image size

the physical dimensions of an image § If number of pixels in an image is FIXED: · decreasing the size of an image increases its resolution (crisper edges) · increasing the size of an image decreases its resolution (pixelated, jagged)

SFTP

the process of moving websites onto web server

DIGITIZATION

the process of translating a piece of information (text, images, sound recording, video) into BINARY BITS (computers only understand/speak binary)

DOMAIN NAME

the text name corresponding to the numeric IP address of a computer on the internet o *only what comes after www - ex: uwo.ca (129.100.0.45); csd.uwo.ca (129.199.19.247) o 2 parts - identifies the NETWORK and the specific COMPUTER o When browsing a website, IP address determines successful communication between your computer and website o A DNS (Domain Name System) maps the domain name to the correct IP address so data can route to the correct computer

Upload

transfer files to server so they can be displayed on the web

IP (Internet Protocol) Address

uniquely identifies each computer/device connected to the internet o An IP Address is 32 bits (4 bytes) wide and may be represented various ways o Consists of 4 numbers (dotted-quad - most popular) = 192.102.249.3 o Each quad must be between 0-255 o Picks a route for a packet, stopping at routers (devices) which pick the next best machine/network to send the packet to (the router is the central switching device).

We communicate

using the five senses

Softsubs

usually stored in a separate file telling what text to appear at what time, can be turned on/off as needed (has to be a .vtt file)

Audio is created by

vibrations which originate from the contact or collision of two or more objects

Napster

was an application that revolutionized/irritated the music industry in 1999

The Rolling Stones

was the first band to give a concert over the Internet

Toy Story

was the first full length feature film that was completely computer generated

Mosaic

was the first graphical browser for the World Wide Web

Databases and External Files

ways to store content so that it can be changed without having to edit the HTML file • Ie for a blogger who wants to update their blog daily Databases: robust, table-like structures for holding data of any kind - or in external files, like text files or specific formatted file types • Allows us to separate content and design • Allows us to store user input data (user names and passwords, shopping carts, product wish lists) • MySQUL - free database, works well with PHP • External files - can be good alternatives to databases but do not work as well for large or complex sites

SPIDER/WEB CRAWLER:

web software that constantly searches for new web pages and follows any links

Adaptive streaming:

when you upload a 4K video Youtube makes several versions of it (1440, 1080) — if user picks Auto it will serve the best quality video it can to avoid buffering depending on the current bandwidth. • People find buffering much more annoying than low quality so YouTube adapts streaming depending on bandwidth

File size increases

with frame number

Shape tweening:

works with non symbols

Finding your IP address

www.showmyip.com, www.whatismyip.com

The Nyquist Limit:

you must take at least 2 samples for every cycle of the wave (so more samples for higher pitched sounds)

Why not to host website on your computer:

§ Expensive, continual connection (needs 24/7 high speed connection), technical (complicated), support (server maintenance requires 24 hour support, skills, knowledge)

Software applications

à Delivery on the Internet Via Website à Combined into a media application to inform, educate, entertain

Quantizing (aka Sample Size): (AUDIO)

• 2-bit sound = 4 tones • Recall: 2^bit number = number of values for sample • CDs use 16-bit rate (65,536 possible values for each sample) • Advantages of higher bit rate: more tones available, accuracy • Disadvantages: larger file size • Height of each sample is converted into a binary number and stored

• Layout/structure

• <center> , <table> <tr> = create row within table • <td> = create cell within table row • <br> = empty line • <hr> = horizontal rule or line • <div> = divider • Add comments: <!— add text here —>

YouTube

• Accepts video in several formats (wmv, avi, mov, mpeg, .mp4) • Uses codec H.264 most commonly • Used to output everything as .flv or .f4v (Flash video) because every computer had Flash but now it converts uploaded vid to mp4 • Youtube always re-encodes your video so don't upload something you have already highly compressed (it will get compressed again, instead upload high quality video)

Computer required FPS

• Computer —> 12-15

How does the sound wave get converted to be stored on our computer?

• Computers have a sound card which digitizes the sound wave from a microphone. • Sound card has an Analog-to-Digital converter for recording (ADC), and a Digital-To-Analog converter for playing audio (DAC) • Operating system communicates with sound card to handle recording and playback

Video (mp4,.mov)

• Flash/other software-specific programs

3D Animation

• Modelling: drawing the skeleton/outline of whatever you want to render • Rendering: putting colour/texture on it - shiny, dull, etc • Animating: makes it move

• Frames per second (fps)

• Movies on film —> 24-30fps • TV originally 29.97fps • Computer displayed video —> 12-15 fps • Humans can distinguish single images at less than 10fps • Digital video —> each frame is a bitmapped graphic, stored as 0s and 1s

Types of HTML tags

• Section/meta tags <html> <body> <head> <title> • Formatting/text tags • <b> = bold • <p> = paragraph • <h1> = header 1 • <i> = italicize • <u> = underline • <ol> = ordered list • <ul> = unordered list • <li> = list item within ordered or unordered list

• TV specs:

• The 50" means 50 diagonal inches • 4K or 1080 or 270 = number of pixels • An I or P means interlaced or progressive

Quantization process for mpeg compression (VIDEO)

• Y=luminance (brightness) • UV (CbCr) = chrominance (color/hue) • Black and white TV only uses Y signal

TCP/IP:

Like a GPS Picks a route for a packet, stopping at routers which pick the next best machine/network to send the package to. If a communication line is down or broken, sends the package back to TCP and TCP sends it again to try a different route. Needs to be able to identify all the machines on the Internet, thus each machine has it's own unique address Uses IP Addresses

Old Fashioned Way of Making a Website

Make HTML file in notepad, type in some tags, save and open in IE, edit source tags in IE, refresh

- Domain name rules

Max of 67 characters (including extension) o 0-9, a-z o Dash character (hyphen) o NO UNDERLINE, no spaces, cannot start or end with dash, case insensitive, no _ o Must end with a domain extension - .net, .com, .org... (TLD)

• Bitmapped graphic

May see it as "CompuServe GIF" since Compuserve created it • One of two standards used on the Web without plug-ins •Gif format only supports up to 256 colors

1993

Mosaic - First graphical browser (web pages with images), by Marc Andreesen, Erin Brina, and Tim Clark (transformed internet from research to household)

• 2010 TVs

Most TVs now are 4K resolution (4096 x 2160) (4k phones and video games being made) • Standard definition resolution was 480 or 576 • HD resolutions started at 420 —> 1080 —> 1440 —> 4K

Animation

Motion stimulated throw playing a sequence of frames (individual images) back to back with minor changes from one image to the next

1969

NETWORK TECHNOLOGY INTRODUCED à ARPANET

1999

Napster debuts, allowing users to download and share MP3s

Why build a website

Reach potential customers o Details on services/products providing testimonials

Sound Editing

Rearrange the waveform — cut, copy, drag, trim parts of the waveform • Overlap 2 or more pieces of audio • Cut words out of waveform • Modify volume — amplify, fade-in, fade-out, envelope, normalize

Animated GIF

Sequence of images + metadata about the animation (frame rate, loop, etc). Most common format • File size affected by size of Gif, number of colours (256 MAX), number of frames, no plug-ins + sound

Website Startup

THE INTERNET: a collection of local, regional, national and international computer networks that are linked together to exchange data and distribute processing tasks o a global system of interconnected computer networks that use the standardized Internet Protocol Suite (TCP/IP) to serve billions of users worldwide; a network of networks o The Internet is hardware - the World Wide Web is software that runs on the Internet! o TCP = Transmission Control Protocol developed by ARPA (ARPANET) o Works by circuit switching or packet switching

- Changing the mood of webpage by changing:

Text attributes - colour, size, font type o Design/layout/placement of text - bullets, alignment, text in groups

How to add in video

To add in video — make sure you encode as mp4, ogg, or WebM file using Adobe Encoder • Put your video somewhere in the folder containing your website (perhaps a subfolder) HTML <video> tag • <video width="320" height="240"> <source src="myvideo/dog.mp4" type = "video/mp4" </video> Parameters • Controls = play button • Autoplay = plays when user arrives at webpage • Loop = how many times it repeats • Muted = mutes audio • Poster = image to be shown while video is downloading or until the user hits the play button • #t=10,22 —> time stamp

5 Types of Animation

Traditional animation (cel animation, rotoscoping) • 2D animation (path-based) • Computer animation • Motion graphics • Stop motion

Links

Type 1 — links to other pages within site • Type 2 — links to different websites (make sure you have http:// in front) • Type 3 — link to email address • Type 4 — link on image • Type 5 — link to spot on page (bookmark or anchors)

Animation in Entertainment

Broadens the realm of possibilities for settings, characters, objects, and actions • CGI: computer-generated imagery/animated special effects maintain realistic feel but also contain mythological elements

- CRAP: Principles of Poster & Webpage Design:

CONTRAST: avoid making 2 elements just similar - either made them same (colour/font) or VERY different o REPETITION: repeat some aspect of the design throughout o ALIGNMENT: items are aligned - creates stronger cohesive unit oPROXIMITY: group related items together *physical groupings imply relationship

website Process

Choose a domain name o Order Web hosting o Meet with the client o Create website - Canadians purchased $40 billion online, 28 hours online each month, 1/373 web pages/CAN household - Web searches worldwide = 5.7 billion per day

- PNG (Portable Network Graphics)

Developed as replacement for GIF due to legal issues with LZW compression - starting to replace o LOSSLESS compression (no discarded) § PNG-8 (max of 256 colours) § PNG-24 (max of 16 million colours) § Allows images to have up to 48 bit color (but would never be necessary) - more for photos o Can set which color bit depth you want to make file sizes smaller o Advantages of PNG: § Lossless compression § Smaller/same size as GIFs keeping lossless (5-25% smaller) § PNG better than JPG with images that contain text or line art § Supports opacity and translucency o Disadvantages of .PNG: § Older browsers may not support § No animation (unlike GIFs) § File size for 24 bit color photographs bigger than JPG files

- Required equipment for delivering applications

Development systems: systems used by multimedia developers to create applications o User systems: systems used to playback multimedia applications oMultimedia developer requires: sound card, video card, microphone, speakers, camera, DVD drives

How does the internet work:

Each page in the manuscript is similar to a packet. Packet: a small group of bytes consisting of a header (tells where it is going: destination and where it came from: source) and the body. (Often 64 bytes for header and 512 bytes for body) Protocol: rules for the format and transmission of data

True or False: all devices that are capable of recording 4K video must have 4K display.

False (they must have at least an 8.8 Megapixel sensor for recording)

True or False: QuickTime and AVI use the same codecs for each compression they do.

False: they use different codecs so you can pick one that gives better compression.

Graphic Attribute

IMAGE QUALITY: Image resolution, image bit depth

- Use of text in multimedia applications varies on:

The type of application - educational, entertainment, business o Audience - children, teens, adults, elderly, ESL (less text for children vs adults)

FILE FORMATS

Universally supported files: universally supported by graphics industry à JPG, GIF § When an image is being sent to another application, convert to JPG or GIF o Proprietary files (NATIVE FILES): Default files used by specific software application, can be Bitmap or vector formats àpsd, dwg, pic - can save in native format or universal format § PSD: Adobe Photoshop, AUP: Audacity, MVMM: moviemaker § Not meant to be transferred to other applications § Software-specific image properties can only be retained when an image is saved in the software's native format (layering in photoshop) o CDR: CorelDraw - vector oDWG: Autocad - Vector

Graphics

Use common universal formats like jpg, gif, png that will work in any browser. • Resize and compress as much as possible in Photoshop before putting it into Bluegriffon - any resizing you do in Bluegriffon will not affect the download speed • Always set alternative text • Meet barriers free access requirements; shows up when page is loading; shows up using a text browser • Set title attribute

Dual role

VISUAL representation of the message oGRAPHICAL element

CODEC

a piece of code that compresses video/audio as it is created, then decompresses when displaying it to the user H.264 (YouTube), DivX • Lossy but can do lossless • Apple and Microsoft only support H.246 • Creates .mp4 files • Used in blu-ray discs, Vimeo, Youtube and Itunes

Video

a sequence of still images (photographs) that create the illusion of moving pictures • Each still image should be called a frame

Content Management System (CMS)

a software that stores and organizes digital content, intermediary between HTML code and web developer or content editor (Wordpress, Wix)

If you take your friend's camera and plug it into your computer and the jpgs will display but the videos won't play, what is the issue?

a) The file is too large b) Your computer does not possess enough colour depth c) You are missing the codec d) You need to put the videos into a folder Answer: c) you are missing the codec

Uniform Resource Locator (URL)

address or location at which files are stored

DATABASE

addresses, page titles, significant words, topics o search engines access the database NOT the internet sites

Regular compression algorithms can be performed on

all frames of an animation as if they were distinct images

Transparency

allows page background to display through the image so the image appears to have no visible border around it à supported by GIF and PNG ONLY

Data Rate or Bit Rate:

amount of video processed per second; file size ÷ length in seconds of video • Video that is 100MB and 10 seconds long • Data rate = 10 • Problems can occur because of bit rate • Affects file size and accessibility • Higher bit rate = better quality video and larger file size

URL: Uniform Resource Locator

an Address of a web document on a computer o Every webpage is referred to by a unique URL

MULTIMEDIA FEATURES

INTERACTIVITY`- o USER CONTROL over the application o Experience ACTIVE rather than passive as with television o Examples: clicking on links on the internet, on-line computer-based exam, driving simulation 2. HYPERLINKING o INDEX allows for "jumping" around sections o Vs Sequential: start at beginning and move to the end (books, movies, videos) § HTML has features that allows you to build hyperlinks to other webpages or location on the same page 3. COMPUTER BASED DELIVERY o Computer-based multimedia applications INTEGRATE the various media components and ALLOW interactivity oModes of delivery of the applications include: video games, interactive web applications, CD ROM disks, info kiosks

Motion tweening

animates symbols only, create tween initially and then go to a frame and move the object and that frame becomes a keyframe, cannot morph

Classic tweening

animates symbols only, need to manually create all keyframes and connect them with a tween, cannot morph (only position and rotate)

Rotoscoping

artist sketches over live action video to create a drawn version of the actual footage

High Retina display

at least 300 ppi (Apple devices, recommend being 10-12 inches away from screen)

Pitch

based on the frequency of the pulses of air creating it

When press a key

binary code sent to RAM (memory) à CPU à Video card à On screen

Measurement system

binary system (base of 2, exponent = number of bits)

BYTE

collection of 8 bits à (28) = 256 possible combinations of 1s and 0s §Ex: 21 = 2 values (0, 1), 22 = 4 values (00, 01, 10, 11)...

Spatial compression (VIDEO)

compresses each frame individually (similar to jpg)

Path-based animation:

computerized, animators must determine where a chapter or object will start and end, the path it takes, and how long the motion takes. Start and end points of motion indicated in keyframes; computer takes all the keyframes. • Uses tweening: computer takes all the keyframes and produces all the frames between them

Powerpoint

created by Microsoft, .ppt (source) .mp4 (final version), file size - fairly large, no plug in required

Flash

created by adobe, extension .fla (source) .swf (movie) .gif, vector images take up less space than GIF bitmapped images. Need flash player to play

Photoshop

created by adobe, extension .psd (source), .mp4 or .gif, no plugin needed to play gif, most browsers can now play .mp4

Tweening

creating the intermediate frames between the starting keyframe and the ending keyframe

Criteria for choosing web hosting company

disk space (5-10GB), bandwidth (amount of traffic that is allowed to occur between your website and the rest of the internet in a given time period), web site speed, database/programming language support, technical support, uptime, FTP access, web statistics summary, scripts availability, web provider

Goal: download web page fast

download time effected by graphic file size and file format o File size § Use smaller sized graphics expressed in "KB" measurement to reduce amount of webspace needed to store image § Recommended file size for graphics on the internet is no larger than about 100KB, otherwise it will add seconds to download time o File Format: .GIF or JPG rather than BMP, TIFF or other o Most graphics software can export from any extension to .jpg or .gif

Sampling process

each frame becomes discrete samples, samples are pixelated

Sampling process:

each frame sampled into a discrete sample, and each sample becomes (more samples = better quality)

Quantization process:

each pixel is assigned a colour Flash became obsolete as Apple made it unusable on their technologies

Quantization process (VIDEO)

each pixel is assigned a colour We can also sample timing with video Higher fps = more accurate motion but larger file sizes For still images RGB colours. For video colour model is YUV (YIQ) or YCbCr

TRUE COLOR

each pixel represents some color shade - Uses 24 bit representation = 16 million colors

Unicast

each user gets his/her own stream of video; server has to send out a lot of data

Special effects

echo, pitch

Sound Compression

educe number of samples (sample rate) • Halving number of samples will half file size • Reduce bit depth (Sample size) • Will affect quality • Halving bit depth will half file size • Reduce number of channels • Mono = one channel • Stereo = two channels • Changing from stereo to mono will half file size • Compress using appropriate codec • Most codecs for audio are lossy (.mp3, .wma,. mp4) • Based on idea that some tones become unable to hear when another tone is present • Most famous audio file format that does lossy compression: MP3 • MP3 can compress a song from a CD to 1/11th of its size • Usually bit rate of 128Kbits per second

Hardsubs

embedded into the video file, cannot be turned off or removed

QUANTIZING

How many discrete values (bits) will I use to represent each pixel à represents the colour combinations

OPTIMIZE IMAGES

- 1) File formats - choose jpg or gif - 2) Reducing color resolution - 24 bits, 16 bits, 8 bit - File formats acceptable on the web: gif, jpg, png - Color resolution o GIF control: color resolution (number of colors) support 8-bit color - 256, 128, 64, 32, 16, 8 bytes § By changing the color resolution (bit depth) can lower download time - BMP files - no compression, stores information about each pixel, each pixel is 1 byte - GIF files - divide image into shapes on a grid (startx, starty, endx, endy, color) o Each shape records 5 bytes o Another way: § Looks for patterns: ex: 12345123451234512345, 1=12345 à 1111 § Builds a decoding hash table (1 = 12345) -JPEG files - conversion programs try to save information about brightness (human eye pays more attention to brightness than color details). If it finds two adjacent pixels with very similar colors, store both pixels as same color and discard other color

How images are used

- For printing: 1) Quality, 2) File Size -For the Web: 1) File Size, 2) Quality (DOWNLOAD speed) - objective - download website as quickly as possible

SEARCH ENGINE - Google, Alta Vista, Hotbot

-A program that enables the user to search internet sites - User types a list of keywords - returns a list of the documents where the keywords were found searches a database of information about the internet Uses spiders, webcrawlers to gather database information of websites; index sites and score pages and puts the information into a database Publisher registers into database, or wait for spider Examples: Google, altavista, Hotbot

Video File Formats

.mov —> AKA QuickTime movie, created by Apple, also for audio, supports MIDI, streamed with QuickTime, can watch video as it is downloaded .avi —> AKA Audio Video Interleave created by Intel .rm —> AKA Real Video, Real Systems, high compression, cross platform, speed over quality, can stream with real server .wmv —> AKA Windows Media, originally created by Apple, now Microsoft, good compression, used by Windows Media Player .mpg, .mpeg, .mp4 —> created by Motion Picture Experts Group (MPEG). DVD must use mpeg-2. Hand held devices often use mpeg-4, good for HD TV, cross platform .flv —> flash video, f4v, created by Adobe, progressive download from web server, becoming obsolete HTML5 —> a new standard for html in webpages, includes a way to watch video on a website that does not require the browser to have a plug in. • Supports MP4, WebM, Ogg

File formats that are uncompressed:

.wav, .aiff. CDDA (compact disk digital audio, standard for CDs, 44KHz, 16 bit per sample, 2 channels) To calculate bit rate for sound: file size in Hz*bit depth*number of channels So CDDA bit rate of... 44100*16*2 = 1411.2Kbits per second

- Advantages of a server:

1) Connected: on all the time and connected to internet 2) Always available: website always available since always on 3)Taken care of: security and maintenance by people

- CREATING A WEBSITE:

1) Planning and Design - Meet with client, decide on colors, fonts, background, links o ALWAYS call splash page index.html - that way domain name leads right to it 2) Implementation - who will maintain? straight HTML programming vs Web page software? complexity, KISS principle, CRAP principles, Test in Netscape, explorer, firefox, documentation Implementation: Designing for Web a. WEB PAGE: HTML (hypertext markup language) - computer instructions used to create web page, browser reads html code i. HTML - cross platform, any computer can read ii. HTML Tags: <tag> xxxxxx </tag> b. WEB SITE: collection of web pages created and maintained by an individual/organization c. WEB SERVER: computer that stores web pages and makes them available for people to see on the internet d. WEB BROWSER: program that allows you to view the internet (IE, FF, Netscape, Safari...) 3) Publish - Web space, use FTP software, upload once website is ready, Back up files 4) Maintenance - who is maintainer, training, update frequently, documentation, backup information oMake sure allow for frequent updates in design

COMPRESSION TECHNIQUES

1024 bytes = 1 KB - GIFs - "LOSSLESS" compression à no discard of data o Does not get blurry or mess o Uses simple technique called LZW compression to reduce files sizes of images by finding repeated patterns of pixels o Never degrades image quality - JPGs - "LOSSY" compression à discards data o Not all information in original image is preserved - NOT the same as original o Degrades image quality o Compression achieved by "forgetting" certain details about the image, which JPG fills in later when it is displayed o Degree of lossiness can be varied by adjusting compression parameters § 0% compression = 100% quality, 95% compression = 5% quality o *work with image in native format then save final in jpg o Uses compression algorithm which can be applied on sliding scale o When saving jpg image, can generally select quality or compression ratio of final image o Observations: § Quality of JPEG file is proportional to the file size § Higher image quality setting (has a lower compression value) results in less data being discarded

History of "Searching the Net"

1990: The first tool for searching the Internet was called "Archie" (short for archives) o Original implementation written in 1990 by Alan Emtage, Bill Heelan, and Peter J. Deutsch at McGill o Designed to index FTP archives, allowing people to find specific files o Word's first internet search engine o Downloaded directory listings of all files located on public anonymous FTP servers: creating a searchable database of file names - 1991: "Gopher" - by Mark McCahill, Frahad Anklesaria, Paul Linder, Dan Torrey, and Bob Alberti of University of Minnesota o Gopher is a distributed document (shared by computers) search and retrieval network protocol designed for the internet o Its goal was similar to that of the world wide web, but now become obsolete - 1991: World Wide Web developed at CERN - Tim Berners-Lee (Geneva, Switzerland) o Problem: data difficult to access and exchange due to differing encoding formats and networking schemes o Several criteria: system must be flexible, compatible with numerous languages and operating systems, system must be capable of recording random links between objects; entering and correcting information is easily performed - 1995: April - Yahoo - David Filo, Jerry Yang - more than 10,000 employees -1998: September - Google (search engine): Larry Page and Sergey Brin - more than 10,000 employees, management team most experienced technology professionals in the industry

Digital cameras became fairly accessible and affordable to the public in

1996

BROWSER SAFE PALLETE

216 colors honoured between MAC & PC browsers, operating systems, and computer platforms o If image uses color hues outside browser safe palette automatically dithers displayed image into browser-safe image o Juxtaposes coloured pixels from browser-safe palette in order to simulate any color which is not in palate oCan reduce number of colors in a GIF and choose options to control the way colors dither in application or browser

Movies or film

24

Each still frame is

250kb (10 frames = 2.5mb, 30 frames = 7.5mb)

SEO: Search Engine Optimization

3 Components you should look at when you are trying to make your site more visible are: o Text: § STEP 1: IDENTIFY THE CRUCIAL KEYWORDS § STEP 2: PUT KEYWORDS IN BEST LOCATIONS (Title; Property Title; Visible Body Text around and in links; Text that is above the fold (first screen)) § Keyword density o Links: No broken links o Popularity: Link-popularity and click-through popularity

TV required FPS

30

how many mins to decide to go beyond first impression

4 mins

How did the original TV display work?

A process called interlacing • Our eyes see phosphor dots on the screen • An electron beam (gun) activates the dots, scans through dots horizontally • Complete scan: starts at the top left then scans several times horizontally til it gets to the bottom right • The scan only draws every other line then starts back at the top and draws the even lines • Thus two passes • Each pass is called a field • Cheats the eye— while the phosphor dots are disappearing, it is drawing the lawn underneath

ARPANET

Advanced Research Projects Agency Network, 1969 Discussed in 1962 - First packet switching network and predecessor to the internet o Objective: a network technology to allow researchers at various locations across the country to share information o 4 locations in 1969 - UCLA, Stanford, UC Santa Barbara, University of Utah o1970 - East coast

How is bitrate/data rate measured?

Answer: file size / length of video in seconds

- Text design - readability, visual appeal (compliment graphics, position), mood creation (headings sans-serif, body serif),

Avoid exotic fonts for consistency on different systems o Use a max of 2-3 different types of fonts o Use a max of 2-3 different colours in a document/website oNEVER use underlining in a webpage

Editing of Video

Before digital video — had to copy from one tape to another tape, had to load up tapes on a machine to copy, loss of quality after each copy made Now — can easily move clips around, no loss of quality, slight compression in the camcorder Things to think about before exporting • Where will I be putting my video? • Who is my audience? • Will I need to edit it later on? Should I compress it at all?

Types of Graphics

Bitmap or vector - effects how graphics are displayed on a computer screen: Quality, file size, time to display graphics

Finding IP address of any website

Command prompt type ping and the website

TCP/IP (for standard data transmission

Does a few things: ◦ At the sending end: Take a large chunk of data (such as a webpage, email message, etc) and breaks it into small packets Sends the packets out on to the Internet ◦ At the receiving end: Detects lost packets, packets with errors because of network congestion, traffic load balancing, or other unpredictable network behaviour, and requests the packet to be resent from the source Rearranges and reassembles the packets back into the webpage, email message, etc on the receivers machine

- How to improve ranking of website in a search engine:

Ensure pages have full meaningful titles § The most important tag, heading people will see in search engines <title> xxx<title> § DW = the property title - important: UNIQUE property title attribute for every page o Add a meta 'description': description of the site (1-2 lines) which sometimes appears along with the title in the search results page of some search engines § <meta name="Description" content ="xxx"> o Add meta "keywords": words that your customers would enter to search to find site § Keywords NOT a major factor search engines consider when ranking sites because of abuse § <meta name="keywords" content="x,x,x,x,x"> § TIPS: single words, do not repeat more than 3-5 times, use plurals, use important words in different forms, keep length between 200-500 characters (10-15 words) § List of occurances of each words on a page more important § Special weight to keywords that appear: placement (high vs low), beginning of sentence vs embedded, proximity, headings, in title, metatag description, alt tags for graphics, generic metatags keywords, in link text for inbound links, in the URL o Add your page to the actual search engine site § Search engines: robots used to index sites, use meta tags keywords, title, and alt fields § Directories: robots not used, human editor reviews, therefore, meta tags etc DO NOT help with ranking - best to describe site accurately - make sure site completely done before submission o Get sites that score highly on the search engine results to link to your site § Integrate a blog into your website, press release, submit into social network sites, comment on other people's blogs o Check your competitors web pages - determine why theirs ranks higher than yours - Using Statistics - knowing what visitors like and dislike about website o ISP - web servers keeps logs of all visitor activity - records requests for files on site, date, time etc § # of visitors: Number of users to your site § Files: number of files retrieved from a web site § Pages: Number of distinct html files/pages looked at (stickiness) § Hits: Number of files sent to a user after a page results (includes graphic files)

website folder structure

Folder Structure • All names lowercase, no spaces • Home page index.html • Other pages appropriate names, no spaces, .html extension • Subfolder called images with all images • Stylesheets should be grouped in a folder called "css" or "styles" • Javascript or other script should be kept in a subfolder • HTML files can generally be stored in the main directory but there are no restrictions to using subfolders for some of the pages • Designers of complex sites usually inclined to have several levels of folders with subfolders • Benefits of storing individual files in separate subfolders is they can all be named index.html and then accessing them would not require any filenames provided in the URL • Files must be linked with relative file paths Links for the Simple Structure If domain name is arcticanimals.org, website would be http:// www.arcticanimals.org To get to polar bear site you could type http://www.articanimals.org/polarbears OR http://www.arcticanimals.org/polarbears.html More Complicated Site Many submenus, lots of webpages, more complicated folder structure One main folder with subfolders that contain "sub websites" Each sub website is a sub folder that contains its own index.html and images subfolder

- Emphasis can be added by varying text attributes

Font type - Arial, times new roman § SERIF - tails, script, body paragraphs (times, courier new, century schoolbook, palatino) àTails = easier to read on paper § SANS-SERIF - no tails, block-oriented, headings, titles (arial, verdana, Helvetica, comic) àEasier to read paragraphs on websites, short headings o Style - regular, bold italics o Kerning - space between pairs of letters, measurement expressed in "em" (emphasis) - negative, 0, positive values § Helps align multiple lines o Tracking - space between all the letters horizontally o Text Leading - vertical space between lines of text, measured in positive, 0, or negative points § lower value - closer together; higher value - further apart o Size - pts vs. pixels o Colour - red, blue, black... o Special effects - underline, shadows, superscript, subscript

Earliest drawings/paintings by humans discovered in

France

GIF VS JPEG

GIF -attributes file format -compression -color resolution -dithering -interlacing -transparency -supports a max of 8-bit color scheme (8 bits/pixel = 256 colours) - good for clip art, not photos -best for large areas of solid, flat color -uses: illustrations, logos, text as graphics, cartoons, buttons **tiny file size and limited colors "LOSSLESS" compression - no data discarded during compression à QUALITY KEPT WHEREAS JPEG -attributes file format -compression -progressive jpeg **distorts edges where there is sharp contrast ARTIFACTS: noise/specs around the image -stores full color information - max 24 bits/pixel (16 million colors) -best for: blends of color, softer shadow effects and subtle changes in color -NOT for well defined lines or sharp contrasts between colors -uses: photos, computer games, screenshots, stills from a movie **larger file size but full color scheme "LOSSY" compression - data is discarded each time file compressed àQUALITY DEGRADES

1998

GOOGLE search engine operates by Larry Page & Sergey Brin

Effective Website Design

Good features: o KISS Principle (Keep it simple, stupid) o Consistency o Color o Balance o Easy to navigate

Headers

H1 largest, should use pixels rather than points for text size, use Ems or % when audience might need to enlarge text

Text colour

Hexadecimal code o Represented as a number of 6 hexadecimal digits - Made up of decimals (0-9) and letters (A-F) o Represents RRGGBB o Red = #FF0000, White = #FFFFFF, Black = #000000, Western = #660099

We rely on images for

Information, explanations, entertainment

2000s

Integration of computer, memory storage, digital data, camcorders, MP3 players, Ipods, speakers, telephones HD TV and other technologies

- Color can be expressed in:

RGB Code Each pixel is represented by 3 values -ie: light yellow = <255,255,127> <R,G,B> Syntax: Each value ranges from 0-255 256 color shades = 28 bits -16 million colors in the spectrum (2563) Red: <255,0,0> Green: <0,255,0> Blue: <0,0, 255> Hexadecimal Code -consists of 16 unique symbols: 0,1,2,3,4,5,6,7,8,9,E, and F -color represented by 6 digits: ie, #FFCC66 Red: #FF0000 Green: #00FF00 Blue: #0000FF -Web-safe colors: only 1,3,6,9,C,F RGB does not = Hexadecimal, need converter o Cathode ray tube devices (such as computer monitors) can only display colour with red, green and blue light - this is the color system of the web o Note: equal amounts of red, blue and green make gray

File Format

Sources of Graphics graphics must be in DIGITIZED form to use in multimedia application o Digitized cameras, camcorders: captures images and digitizes them into computer images through its software § Megapixel: how many millions of pixels you can capture in a photograph on your digital camera o Scanners: digitizes drawings, illustrations, and 3D objects into computer images using its software § The scanner or the camera determines how many samples to take - measured as dpi (dots per inch o Internet sites: free clipart, on-line stock photo library ($$)

The first full length movie with synchronized dialogue (talkie) was

The Jazz Singer

One of the first full length movies to use colour was

The Wizard of Oz

1991

WORLD WIDE WEB is finished and debuts (Tim Berners-Lee)

Web Server

When your website is complete you need to move it to a web server

SUBDOMAIN

a domain that is part of a larger domain, two or more parts (labels) separated by "."s o http://www.en.wikipedia.org - domain name: Wikipedia.org, Subdomain: "en" o Used to organize website content http://year2005.mycorvettes.mycars.com .com is the first level domain (top level domain à TLD) Mycars is the second level domain àmycars.com is the DOMAIN mycorvettes is the third level domain - subdomain of the domain "mycars.com" year2005 is the fourth level domain - subdomain of "mycorvettes.mycars.com" o Rules: § Max of 127 labels (each level is a label) § Each label max 63 characters long, min 3 characters § But whole domain cannot exceed 255 characters, including TLD

Container File Format:

a file format that stores both the data (the frames) and how to play the data (which codec to use) —> avi, flv, ogg, mp4

Website

a collection of related webpages stored in a folder connected through hyperlinks • Should always contain a folder called images to hold image files Each webpage is an html file • Home page should be named index.html • Berners-Lee invented notion of publicizing the WWW rather than keeping it closed like the ARPANET

HOST

a computer on the internet that provides services such as web pages, emails, web storage

Retina display

have a pixel density high enough so that your eyes cannot detect pixels at a normal viewing distance. Consider pixel density and viewing distance • At a viewing distance of 10+ feet, 480p, 720p, 1080p, 4k all appear equivalent

High-pitch sounds

high-frequency vibrations; cycles are tighter and closer together in waveform

CACHED

highlights where searched words are

Interlacing technique

how images downloaded to your screen (applies to GIF files) o Process by which image is drawn in a series of passes rather than all at the same time (file size bigger) - see full image, gets clearer as downloads

Uptime

how long does server stay up

TLD

identifies the type of organization that is associated with the domain o .com (commercial organization, business, companies), .net (internet administrative site, network providers), .org (non-profit organizations), .edu (educational institutions), .gov (government agencies), .info (information), .biz (business), .ca (Canada), .us (united states).... - Choosing domain name - pay on a per year basis, must re-new o search: mydomain.com, yahoo.com, godaddy.com, register.com...

Loop parameter

indicates whether animation should repeat itself and how many times, or indefinitely