Soundscapes Worksheet

Brief

Recreate a journey through the following environments

  • Industrial
  • City
  • Jungle

The listener should become immersed in the environment you have created, try to make them feel like they are actually there.

Guide

Each journey should be around  60 seconds long

Source material from a site like freesound.org and record your own samples when possible.

Try to create a rich texture of sounds using multi-track production software.

Fade each piece in and out

Mix down, normalise and export a final master in WAV format

Upload to Soundcloud and link through to your blog

References

The British Library

The British Library’s extensive collections of unique sound recordings, which come from all over the world and cover the entire range of recorded sound: music, drama and literature, oral history, wildlife and environmental sounds.

http://sounds.bl.uk

Freesound

Freesound is a collaborative database of Creative Commons Licensed sounds. Browse, download and share sounds.

 http://freesound.org

Sound Map

Brief

Create a simple sound map of an agreed area, say the center of a town or city.

Cover 8 to 12 locations.

Output options

 

Interactive

Put them on Google Maps

Present them as an interactive video on youTube

Installation

Create a short video with images and sound recordings from the locations

 

Example

http://sounds.bl.uk/sound-maps/

Digital Landscapes

Activities

  • Investigate
  • Develop
  • Produce

Landscapes

  • Urban
  • Industrial
  • Managed countryside

Media

  • Photography
  • Video
  • Audio
  • Graphics
  • Software generated

Form

  • Representational
  • Virtual
  • Abstract

Output

  • Large scale projections for an exhibition installation
  • Simple projection mapping for an exhibition installation
  • Small screen variations as apps or ebooks

 

 

audioPlayer

Audio Player Worksheet

<audio controls>

 

Before HTML5, there was no standard for playing audio files on a web page.

Audio files had to be played with a plug-in such as flash. However, different browsers supported different plug-ins causing compatability problems for both developers and users

HTML5 defines a new element which specifies a standard way to embed an audio file on a web page: the <audio> element.

The control attribute adds audio controls, like play, pause, and volume.

audioPlayer

 

 

 

Note, you should also insert text content between the <audio> and </audio> tags for browsers that do not support the <audio> element. There are still compatability issues.

This new <audio> element allows multiple <source> elements. <source> elements can link to audio files in different file formats (codecs).

Supported Audio Formats

Currently, there are 3 supported file formats for the <audio> element: MP3, Wav, and Ogg:

Format MIME-type
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav

The browser will use the first recognized format. Note the differences between some of the main browsers

Audio Formats and Browser Support

Currently, there are 3 supported file formats for the <audio> element: MP3, Wav, and Ogg:

Browser MP3 Wav Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox NO
Update: Firefox 21 running on Windows 7, Windows 8, Windows Vista, and Android now supports MP3
YES YES
Safari YES YES NO
Opera NO YES YES

Activity

Create a webpage that plays an audio file using html 5.

Here is the basic page for you to work with in Notepad ++ or similar

 

<!DOCTYPE html>
<html>
<body>

<audio controls>
<source src=”horse.mp3″ type=”audio/mpeg”>

Your browser does not support the audio element.
</audio>

</body>
</html>

 

Save the page along with the audio file into the same folder in your project

Prototyping techniques

A prototype is a real but partial representation or implementation of a design concept.It can be used to demonstrate and evaluate a concept at different stages in the design process. It could be something simple like paper and cardboard or a complex piece of coding. Prototypes are the main way of involving potential users and clients in evaluating your design ideas.  There are two main kinds of prototypes

 

  1. Low fidelity; lo-fi
  2. High fidelity; hi-fi

 

Hi-fi prototypes

 

Very similar in look, feel and functionality of the final design output

  • Useful for detailed evaluation of the main design elements
  • Can be a crucial stage in client giving go ahead for final version
  • Generally developed late on in design process

Lo-fi prototypes

 

  • Focus on the broad ideas underlying the design
  • Can be produced quickly and cheaply
  • Capture early design thinking and can form the basis for generating new ideas

 

 

 

Simple Magazine Cover

It may seem like a simple thing to do, but a lot of thought goes into the design of a magazine cover.

Covers compete for attention next to dozens of other magazines on the rack.

In this tutorial, we’ll not only take you through the process of creating a cover, but also reveal techniques that designers use to make their covers stand out.

 

http://vector.tutsplus.com/tutorials/designing/how-to-create-a-music-magazine-cover-in-indesign/

success-ometer

Success-ometer Project

Brief

As part of a new student support project the College is looking to develop an interface for students to rate their success or failure according to different parameters.

http://www.bounceback.com.au/

User responses to be captured and displayed as a group.

Visual style based on instrument gauges; industrial feel

Uses must be able to rate themselves from 1 to 5 either in terms of success or failure.

Has to work on a mobile device

See sketch for details

success-ometer

 

 

 

 

 

 

 

 

Approach

You can work at any of 3 levels:-

  1. Visual design – using Photoshop.
  2. Visual design and interaction using Flash.
  3. Visual design and interaction using javascript.

Deliverables

Develop your design using the level you feel is best suited to you.

Take it to hi-fi prototype level.

Evaluate your work in a structured manner

Timescale 2 to 3 weeks

Abstract Video Project L5

bm-pf107There are many techniques to create abstract video ranging from computer generated graphics (cameraless) to video synthesis with existing material as a base.

In this project we are going to use a simple video synthesis technique to produce a short abstract sequence.

The key concept here is to relate the basic visual components to filters in Premier Pro

Remember, visual components include

  • Line
  • Shape
  • Colour
  • Space
  • Movement
  • Size
  • Texture

and these can be organised in different ways to tell different stories

http://www.oberlin.edu/amam/asia/sculpture/documents/vocabulary.pdf

Before you begin research and give an example of a similar technique.  Post it on your blog.

You are going to investigate and apply effects in Premier Pro to a short video sequence

  • Create a project folder
  • Start a new Premier project and save it into the folder
  • Shoot or source a 90 second clip and save it into your project folder
  • Use a piece of music as your idea to work with
  • Try and express aspects of the music using the filters
  • Export a final mix and post on your blog along with a short description of how did the project and what you felt about the results.

 

 

Abstract Video Introduction

There are many possible ways to approach this area.

In this case, lets look at it in terms of how abstract art developed around 100 years ago.

 

The treeness of a tree

In this example we will look at the development of the work of the painter Mondrian.

What makes a tree a tree?

The work of Piet Mondrian is a good example of the development of visual ideas relevant to this project, in a move from representational art to more abstract forms, he can be shown to investigate techniques related to Significant Form.

Abstraction can be thought of as a process where, say, a landscape painter could arrive at a finished piece through a process of abstraction from the landscape. It could still be regarded as a landscape painting though.
Have a look at this site where these ideas are expanded upon.

Visual Components

So what have we got to work with?

Think of it all in terms of a film

 

Actors, locations, props, costumes, and scenery are visual components. A visual component communicates moods, emotions, ideas, and most importantly, gives visual structure to the pictures.
These components are used in creating any picture. and can be regarded as basic visual components for just about any television, computer, and movie visual.
SPACE
This is not outer space or “giving someone his or her space.” There are three kinds  of visual space:
first, the physical space in front of the camera;
second, the space as it appears on a screen;
third, the spatial size and shape of the screen itself.
LINE AND SHAPE
Line is a perceptual fact. It exists only in our heads. Line is the result of other visual components that allow us to perceive lines, but none of the lines we see are real.
Shape goes hand in hand with line, because all shapes appear to be constructed from lines.
TONE
Tone refers to the brightness of an object in relation to gray scale.  It does not refer to the tone of a scene (sarcastic, excited, etc.), or to audio tone (treble and bass).
Tone is an important factor in black & white and color photography.
COLOR
One of the most powerful visual components, color is also the most misunder-
stood.
MOVEMENT
Movement is the first visual component to attract the eye. Movement occurs using objects, the camera, and the viewers’ eyes as they watch the screen.
RHYTHM
We’re most familiar with rhythm we can hear, but there’s also rhythm we can see. Rhythm is found in stationary (nonmoving) objects, moving objects, and editing.

Cameraless Techniques

Norman McLaren

https://www.youtube.com/watch?v=jiJR1ET715M

Len Lye

https://www.youtube.com/watch?v=T3y1offmJ4Y

 

Computer generated

It is possible to generate similar effects using code

 

Particle Illusion

http://www.wondertouch.com/index_2.asp

 

Processing

http://www.openprocessing.org/

 

Applications

Can you think of examples of when this could be used?

 

Example of these ideas being applied in mainstream TV and Film visual design.

Exercise

 

Produce three 30 second clips demonstrating different visual components using the filters in Premier Pro

Discus how you could do this with your tutor.

 

Mobile Device Research

Some general comments about the mobile device research so far.

Remember they are really an integration of what were mobile phones and computers,so a timeline of this development rather that going way back to just phones would better inform your design thinking.

They have different levels and forms of connectivity to a range of networks – cellular, wifi, gps and local nodes like bluetooth and the emerging NFC capability

Mobile devices are blurring the boundary between these networks. Some do not access them all.

Different screen sizes pose a challenge for graceful flow of your screen design elements

Link at least one aspect of each area of your research to your design, it could be done as a summary at the end.