Second Year Media Design http://loxyreid.posterous.com Lachlan Reid posterous.com Mon, 25 Jun 2012 19:29:00 -0700 Musical Lineation http://loxyreid.posterous.com/musical-lineation http://loxyreid.posterous.com/musical-lineation

Screen_shot_2012-06-26_at_2

My project Musical Lineation is a data visualization of musical scores by New York musicians displayed through a New York skyline. My idea behind it was to display the music of New York through the beauty of New York City.

I used Processing to create a program that takes input from an .xls file. To create these I took .midi files and passed them through another program, MIDIanal, and then converted from .csv to .xls using Microsoft Excel. 

I used the XlsReader library by Florian Jenett to parse the input and read the score. 

With this data I created a skyline in Processing. Each building of the skyline represents one bar of music. The height of the building is worked out due to the number of notes in the bar, complexity of the notes and a few other factors. The width of all the buildings was based on the temp/time signature of the music. Each building was given a roof. These roofs were designed by me and were based off real roofs of New York skyscrapers. 

Once this skyline was created I then took it into photoshop to add all the extra effects. The lights of the buildings were created by taking 3 different aerial images of New York City and filtering them. The first filter was the Glowing Edges filter which highlights the edges of color and removes everything else. This was then accentuated by applying a patchwork texture onto the images. These images were then cut out into the same shapes as the skyline code. I then duplicated these images and applied a Gaussian Blur to the one underneath. This just removes the harshness of the edges of buildings, allowing them to fade into the background, whilst preserving the light boundaries. 

The background color was created by using a gradient from pink to a darker pink, not quite black. The entire image was then dulled down by applying my own texture on top. This texture was created by taking 100 album covers from New York artists and layering them on top of themselves at 1% opacity. This created a really interesting unique texture which symbolized the music industry of New York. Some artists included: The Velvet Underground, The Wu Tang Clan, 50 Cent, The New York Dolls, H20, Anthrax, Yeah Yeah Yeahs and many more. This texture dulled down the background and unintentionally created these cloud/smog looking patterns in the sky. It also dimmed the lights on the buildings and made them look more sporadic and sparse.

The three songs I used for the final composition were Empire State of Mind by Jay Z, Antisocial by Anthrax and You Only Live Once by The Strokes. These songs are very different from each other in genre, style, tempo and structure so they complement and contrast very well.

 

http://www.tima.uk.com/midianal.htm

http://bezier.de/processing/libs/xls/

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Mon, 25 Jun 2012 18:19:00 -0700 Filtering Examples http://loxyreid.posterous.com/filtering-examples http://loxyreid.posterous.com/filtering-examples

Here is two examples of how I created the pattern texture for the lights on my buildings.

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Thu, 21 Jun 2012 18:47:00 -0700 Presentation Composition http://loxyreid.posterous.com/presentation-composition http://loxyreid.posterous.com/presentation-composition

Heres a shot of my composition so far which I will use for the presentation today.

Screen_shot_2012-06-22_at_1

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Wed, 20 Jun 2012 19:26:00 -0700 The color of new york music http://loxyreid.posterous.com/the-color-of-new-york-music http://loxyreid.posterous.com/the-color-of-new-york-music

Wow. Just got really excited about this since it worked perfectly.

To get a nice pattern which was the color of music is a really wierd concept.

This picture here was created by layering 100 new york made album covers on top of oneanother at 1% opacity, therefore creating a unique color which represents new york music.

Not sure if I will use it in my work but I wanted to share as it took me bloody ages to make. oh and its pretty cool.

Screen_shot_2012-06-21_at_2

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Wed, 20 Jun 2012 16:18:00 -0700 Which songs? and what style? http://loxyreid.posterous.com/which-songs-and-what-style http://loxyreid.posterous.com/which-songs-and-what-style

I need to decide what music to use to generate my citites and since I want to use inspiration from New York city I am going to take different famous New York artists.

So far I am looking to use some or all of: The velvet underground, antrax, H20, New York Dolls, The strokes, the yeah yeah yeahs, 50 Cent, or Jay Z. These are all popular famous artists from New York who span a wide area of musical genre.

I will probably take 3 or 4 of these artists and recreate my NY skyline from them.

I also need to decide how the piece will look. After talking to Elle we decided that the simple vector flat colors werent working. She says that the simpler the shape, the more complex the graphics as a general rule. This seems to be a good idea. 

There are a few possiblities of what I can do. Use Art from New York, albums covers, live photos of the musical artist, pictures of places around new york. I will then layer these on top of one another to create a weird complex pattern.

I am interested in doing all of this outside the code in Photoshop.

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Fri, 15 Jun 2012 04:17:00 -0700 Lights or no Lights http://loxyreid.posterous.com/lights-or-no-lights http://loxyreid.posterous.com/lights-or-no-lights

Now added with lights, I'm not sure whether or not I like them.

The lights are effectively the notes of the bar, so if you rotate the image clockwise 90 degrees you should be able to read the notes left to right top to bottom.

The colors of the lights are the same as the colors from the very first score piece I did for p4. However, they are quite bright, not in light but in color intensity. The very obvious primary colors seem to make the city look like a game of tetris. I might contrast this by making the colors very similar in shades of grey or white with a tint of a change of color.

I hope to make the gradient (the purple background) the same color as the most used note in the score. Since a city would illuminate the same color as the most of its own lights.

Screen_shot_2012-06-15_at_11

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Fri, 15 Jun 2012 02:20:00 -0700 New direction for project 4 http://loxyreid.posterous.com/new-direction-for-project-4 http://loxyreid.posterous.com/new-direction-for-project-4

So I have taken a new direction with project four. Whilst being similar to ones in the past I am taking it back to a more literal representation of music rather than an abstract, which was getting a little ridiculous. 

So new idea. I draw a city skyline which seems random at first but is actually built by the musical score that is inputted, as before.

Each building represents a bar of music from the score and the building is generated from this bar. The height is based upon how many notes are included in the bar, the number of windows representing different notes in sequence (so you should be able to read it bottom to top, left to right, though it might be very tricky). Rooftops are, at the moment, randomly generated but I'm sure I can get them generating from the octave of the notes easily or other similar musical effect. Colors of buildings and windows are yet to be implemented and the width of the building has yet to be made. These are things that will be done in the next week.

However, the real tie between the music and the city is the choice of music, and the choice of city. To bring both parts together, to make a truely musically generated city I have used inspiration and real images of skyscrapers of New York as my buildings, and as an accompaniment I have chosen the music of Swing Jazz, the music invented and thouroughly inspired from New York. The decision to use this city and this music was just coincidental. I could effectively create a village scape similar to an African village and put in African music. However, the music of Swing Jazz and Bebop was the music I had wanted to work with as it is my definition of pure musical art, and I wanted to take this further and create a piece of generated art from the music.

Here is a screenshot of the current project from the music "Night and Day". I hope to develop and improve on the graphics, increase the generative aspects and try different muscial pieces to see how it all falls together.

Screen_shot_2012-06-15_at_9

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Wed, 13 Jun 2012 18:37:00 -0700 Wavy Lines http://loxyreid.posterous.com/wavy-lines http://loxyreid.posterous.com/wavy-lines

This one now includes wavy lines. The image indicates where different midi channels / instruments are used in the piece. Along the middle is a timeline of the music and colored lines are pulled from this to seperate nodes. Each node is seperate for different instruments.

 

Screen_shot_2012-06-14_at_1

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Wed, 13 Jun 2012 04:02:00 -0700 Ooh Colorful Lines http://loxyreid.posterous.com/ooh-colorful-lines http://loxyreid.posterous.com/ooh-colorful-lines

Some p4 development. Now with nice neon colors!

Screen_shot_2012-06-13_at_11

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Sun, 10 Jun 2012 03:40:00 -0700 It's the Thrill of the Fight http://loxyreid.posterous.com/its-the-thrill-of-the-fight http://loxyreid.posterous.com/its-the-thrill-of-the-fight

Here's a more complex track than Ode To Joy: Eye of the Tiger.

I really like what is happening on the right half of the screen. All sorts of interesting patterns are emerging.

Screen_shot_2012-06-10_at_10

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Thu, 07 Jun 2012 23:40:00 -0700 242 Lines http://loxyreid.posterous.com/242-lines http://loxyreid.posterous.com/242-lines

Changed the code so it creates lines of different colors for the octaves.

Here's one where they are placed on top of one another:

Screen_shot_2012-06-08_at_6
And another where they are combined into one easy to manage loan, I mean image. This is how I had originally intended the piece to end up and will now need to adjust to suit all types of midi files.

Screen_shot_2012-06-08_at_6

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Thu, 07 Jun 2012 20:36:00 -0700 Comparison of code and original score http://loxyreid.posterous.com/comparison-of-code-and-original-score http://loxyreid.posterous.com/comparison-of-code-and-original-score

Just a quick pic of the code and score. The similarities are obvious so we can see how the code takes the score and places it on screen. Next up: making that s*** look sick.

Ode_to_joy

Screen_shot_2012-06-08_at_3

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Thu, 07 Jun 2012 20:27:00 -0700 242 Development 8/6 http://loxyreid.posterous.com/242-development-86 http://loxyreid.posterous.com/242-development-86

Managed to split the notes according to their octave. this allows no overlapping (vertically) of notes. This makes it easier to read. 

Also added a check for Note On and Note Off functions and only draws on Note On functions. This stop the score doubling up.

Screen_shot_2012-06-08_at_3

I also have begun to play around with how it be displayed visually. This one is with low opacity rects rther than ellipses. The overlapping effect is really nice.

Screen_shot_2012-06-08_at_1

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Thu, 07 Jun 2012 17:44:00 -0700 242 Beginnings http://loxyreid.posterous.com/242-beginnings http://loxyreid.posterous.com/242-beginnings

I have got the XLSreader working which will read in the midi values once they are converted to XLS format. This is done through a program I have downloaded.

 

Here is a quick tester for Ode To Joy. Colors are very basic but distinguish between note differences. Timing is also shown through spacing.

Screen_shot_2012-06-08_at_12

Like I said, very basic tester but now that this is working it should only be a matter of mucking around with the visuals.

One problem I have already seen is that unless the midi file differs between bass and treble notes then they just get overlayed.

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid
Mon, 04 Jun 2012 19:43:00 -0700 242 - Project 4 Concpects http://loxyreid.posterous.com/242-project-4-concpects http://loxyreid.posterous.com/242-project-4-concpects

Concept_1a.pdf Download this file
Concept_1b.pdf Download this file
Concept_2a.pdf Download this file
Concept_2b.pdf Download this file
Concept_3a.pdf Download this file
Concept_3b.pdf Download this file

Permalink | Leave a comment  »

]]>
http://posterous.com/images/profile/missing-user-75.png http://posterous.com/users/lC03gVtXbgMYO Lachlan Reid loxyreid Lachlan Reid