Web Production / Audio Engineering

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

     This course provides a theoretical and applied academic Web Audio Room foundation to use digital media in graphic and traditional art along with audio engineering. Students create and design CSS, Flash and Javascript web pages, graphics, podcasts, animations, audio slideshows, and music videos as a basis for developing skills in visual communications. The class focuses on basic design, layout and construction, setup and maintenance of a web site. Students also create audio projects for developing skills in audio communication with basic audio recording techniques inside and outside the recording studio using industry recording tools. Course work is fully integrated with the other courses at Freestyle ACAT (Digital Photography + Graphic Design, Digital Film Production, and Society, Politics, and Literature). Software applications used in the first year class will include Adobe Dreamweaver, Flash, Photoshop, Illustrator, After Effects, Microsoft Word, Apple Garageband, Propellerheads Reason and Digidesign Pro Tools. Students will also learn HTML debugging, the use of Cascading Style Sheets (CSS) and Javascript insertion/modifcation for web design. Second year students will delve deeper into previous applications and will also receive an introduction to XML, Waves Plug-ins, and McDSP Plug-ins. Contact the instructor Leo Florendo by email at leo.florendo@mvla.net

 

More course information regarding Expected Learning Results for the 21st Century, Assessment, Grading, Late/Make-up Policies, Attendance, Classroom Rules, how to get help and Daily Agenda are available on these documents:
Year 1 WebAudio Course Info Year 2 WebAudio Course Info
Year 1 WebAudio Daily Agenda Year 2 WebAudio Daily Agenda

Web/Audio Project Specifications

The following links describe in detail the projects for each year students are enrolled in Web/Audio. Applications to be used in this class are:

DW = Dreamweaver
PS = Photoshop

IL = Illustrator
FL = Flash

AE = After Effects
GB = Garageband

PT = Pro Tools
RN = Reason

Year 1 Students

Year 2 Students

Project 1. Self-Portrait Project Specs

  • CSS Website (DW, PS, IL) < Main Focus
  • Podcasts (GB, PS)

Project 2. Narrative Project Specs

  • CSS Website (DW, PS, IL)
  • Photonarrative (GB, IL)
  • Narrative Animation (FL, GB, PS, IL) < Main Focus

Project 3. Documentary Project Specs

  • CSS Website with Javascript (DW, PS, IL)
  • Documentary Audio Slide Show (FL, PT, RN) < Main Focus

Project 4. Experimental Project Specs

  • One page website
  • Music Production (Live recording or MIDI Composition) (PT, RN)
  • Animated Poem (FL, PT, RN, PS, IL)

Project 5. Combined Film + WebAudio Students Fortune Cookie Project

  • Collaboration to create an original film < Main Focus

Project 6. Narrative 2 Project Specs

  • Simple Flash Website (FL, PS, IL, RN, PT)
  • After Effects Animation (PT, RN, AE) < Main Focus

Project 7. Senior Project Specs

  • Own choice - Flash Website (DW, FL, PS, IL, AE)
  • Own choice - Audio Component (GB, PT, RN)

Project 8. More Experimental Project Specs

  • Own choice - one page website (FL, PS, IL, RN, PT, AE)
  • Motion Graphics Compilation (PT, FL, PS, RN, AE) < Main Focus

 


Y1 Tutorial Login

Y2 Tutorial Login

Year 1 Student Website Links

Year 2 Student Website Links

Alexandra
Beatriz
Camille
Carlo
Connor
Dahlia
Devan
Devon

Dominick
Emily
Francis
Hannah
Jerry
Josh
Julia
Kateryna

Luis
Mathew
Maxine
Maya
Pierre-Henri
Rahul
Rida-hareen
Robert

Sam
Sheilah
Sophie
Susannah
Taura
Teresa
Zachary B
Zachary Wi

Alejandro
Allyson

Ames
Brian
Carl
Danielle

ErinL
Eve

Jacqueline
Jesse

JessicaW
Johan
John
Jozza
Julie
Kamron

Katrina

Lizette
Marjorie
Matthew

MelissaS
Mike
Miller
Nathan

Nicholas B

Nicholas G

Nicole
Phoebe
Rayna
Stefano
Zachary W
Zoe

WebAudio Archives for previous students' projects 2006 - 2010

Web Design Resources

Local vs Remote Concepts

 

CRAP - Design Concepts
  Contrast
    Repetition
     Alignment
      Proximity & Usability

More about CRAP

CRAP Examples

 

Interactive Frequency Chart

Tables vs Layers
Paper Prototyping 1
Paper Prototyping 2
Paper Prototyping 3

 

Various page sizes

980 x 600 | 980 x 625

980 x 650 | 980 x 680

1000 x 700 |1000 x 750

1024 x 768

Color Schemes 1 - Kuler
Color Schemes 2
Color Schemes 3

 

Font Symbols

 

Scrolling Divs

 

Matting Images

Webby Awards
Flash Forward
Fav. Website Awards

Comment Boxes

Layers Mag Tutorials

 

Pro Tools