Soundscapes Worksheet
Mar 4th
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.
Freesound
Freesound is a collaborative database of Creative Commons Licensed sounds. Browse, download and share sounds.
Sound Map
Mar 4th
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
InstallationCreate a short video with images and sound recordings from the locations
Example
Digital Landscapes
Feb 20th
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

Audio Player Worksheet
Feb 10th
<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.
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
Jan 28th
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
- Low fidelity; lo-fi
- 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
Jan 15th
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 Project
Jan 14th
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.
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
Approach
You can work at any of 3 levels:-
- Visual design – using Photoshop.
- Visual design and interaction using Flash.
- 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
Jan 13th
There 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
Jan 6th
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.
Visual Components
Think of it all in terms of a film
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.
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?
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
Dec 10th
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.