Inspiration. Quick.

Inspired by Brian Eno and Peter Schmidt’s work to prevent creative blocks… try this widget out when you are facing the wall.

Full of sage like quotes and abstract commands, the Oblique Strategies are a series of cards designed to be pulled out when you need to shake things up creatively.

I have tried to keep these cards as accurate as possible (even down to the 10 point sans-serif font!) to the real thing. The further you click away from the card, the more inertia you spin it with, and the angle of spin is entirely dependent on where you are clicking. It features all the original 4 versions – you can select between them using the controls in the lower left corner – the original version is still available from Eno’s shop. The only thing really missing from this virtual version are the 6 blank cards that came with the original. I will leave that for you create.

Try it out and tell me what you think!
Oblique Strategies : V5

Find out more about the original Oblique Strategies and order your own :

1. The Oblique Strategies Fansite
2. Buy your own

Surround Sound Chillage

Ever feel you just need a bit of harmony in your day, a few moments of clarity and calm? Find yourself battling with noise? Now you can relax online with the 3D Buddha Machine! Load it up and click until happy… if you feel it is too loud, scroll the mouse wheel.

What is it?

Based on the world famous Buddha Machine by FM3 (Zhang Jian and Christiaan Virant), this is an authentic online replica. Coded using the incredible Papervision libraries and my own personal Media Framework, the Buddha Machine 3D features all 9 original sounds from each the Buddha Machine I and II – kindly released under creative commons. Thanks to the magic of the internet, Christiaan popped by to offer his support. Thanks!
.

What does it do?

Put on some headphones, click to find the sound for you, use the mouse wheel to set your volume, and relax. If you need a portable version, consider buying the original product – it fits in your pocket!

How does it work?

The Audio system reacts to the position of the 3D object, decided by the mouse, and considers one face as a speaker. As the object rotates this pans and fades the audio according to the trigonometry formulated from the angle between the user and the normal of the speaker faced plane. The volume is also reactive to clipped faces, and by that I mean speakers that are pointing away from the user, the further a speaker turns away from the user, the less it can be heard.

Sounds are loaded as mp3s from an xspf playlist and streamed, whilst the next track is pre-fetched to prevent gaps and loading delays when changing sounds.

How was it made?

I decided to avoid Flash entirely and instead use the free FLEX compiler from the Adobe site. This was mainly to see how using the FLEX compiler affects the size and performance of swf files compared to compiling through Flash, but also to see if I could avoid non OSS software. Process wise, using this development system, along with swc files for symbols, it is possible to create amazing web apps absolutely free of charge. As I am saving up for the next Flash, but in the meantime this lets me test out new features in the player right now! I see a synthesizer on the horizon next

Once you perfect your workflow, and don’t mind creating libraries of swc files, this is probably the most integrated and fastest method for Flash development. There are many tweaks and hacks that you have to apply to the commandline if you want to use a preloader, or don’t need all the FLEX libraries, or want to set a player target version, but thankfully, my development system of choice, FlashDevelop, has all of these as options preset in the GUI.

On the negative side, using the FLEX compiler does seem to add quite a few extra bytes to the runtime code, so at least consider a preloader!

Check it out

Buddha Machine 3D I.

We See the Stars And We Want Them

1. Mr Fingers – Stars
2. Jeff Wayne – War of the Worlds
3. NASA – Symphony of the Planets 2
4. Vangelis – Blade Runner Blues
5. Arthur C. Clarke – Interview
6. Cybotron – Clear
7. Geinoh Yamashirogumi – Dolls’ Polyphony – Akira OST
8. Procul Harlem – Strangers in Space
9. John Carpenter – Darkstar OST
10. 2001 – HAL 9000 (Excerpt)
11. NASA – Symphony of the Planets 4
12. Jeff Noon – Needle in the Groove
13. Ceephax Acid Crew – Northern Spirit
14. The Vulcans – Journey into Space
15. Sun Ra – Journey Through the Outer Darkness (part I)
16. Ry Cooder – El U.F.O Cayó
17. NASA – Symphony of the Planets 5
18. DJ Spooky – Twighlight Fugue
19. Sun Ra – Journey Through the Outer Darkness (part II)
20. Baby Mammoth – Moonburn
21. Marshall Chess – Interview
22. Kevin J Anderson – Hidden Empire
23. Symarip – Skinhead Moonstomp
24. Cowboy Bebop OST – Radio Free Mars Talk 1
25. Mike Ladd – Starship Nigga
26. Sun Ra – Journey Through the Outer Darkness (part III)
27. ESG – UFO
28. William Shatner – Rocket Man
29. The Time & Space Machine – The Trip
30. Death in Vegas – Neptune City (Concrete Funk Mix)
31. The Hitchhiker’s Guide to the Galaxy – Heart of Gold
32. The Halle Orchestra – Mars, the Bringer of War
33. Jerry Goldsmith – Metropia – Logan’s Run OST
34. Lonnie Liston Smith – Floating through Space
35. Kraftwerk – Spacelab
36. Dark City (Excerpt)
37. The Seatbelts – Cats on Mars (DMX Crew Remix)
38. Aliens (Excerpt)
39. RZA – Afro Droid Showdown II (Rap Suite)
40. Echospace – First Point of Aries
41. Killah Priest – Temple of the Mental
42. Scientist & Prince Jammy – Storming the Death Star
43. Basic Channel – Mutism
44. BBC Recordings – Daleks
45. Kool Keith – I’m Seeeing Robots
46. NASA – Symphony of the Planets 1
47. Brian Eno – Stars
48. Langley Schools Project – Calling Occupants of Interplanetary Craft
49. Acid Mother Temples – Ange mzcanique de saturn
50. NASA – Original Moon Recordings
51. Farm Fresh – Space
52. NASA – Symphony of the Planets 3
53. David Bowie – Space Oddity
54. Cowboy Bebop OST – Radio Free Mars talk 7
55. Stereolab – Space Moth
56. Kevin J Anderson – The Ashes of the World
57. She Satelites – No Satellites
58. Anti-Pop Consortium – Tron Man Speaks
59. BattleStar Galactica (Excerpt)
60. Silver Apples – Oscillations
61. Add (N) to (X) – Robot New York
62. Alec Empire – Dreaming is a Form of Astrotravel
63. Cabaret Voltaire – Earthshaker
64. Brave New World – Saga of the Seven Suns
65. Vienna Philharmonic Orchestra – Also Sprach Zarathustra
66. Sun Ra – Journey Through the Outer Darkness (part IV)

Here are some examples with text

1. Example 01 : Red Links, Blue Text (set as individual RGB colours), Maximum font size is 96 points, baseline set at 22 pixels, paragraph set to 14pts
2. Example 01 : Red Links, Blue Text, Maximum font size is 96 points, baseline set at 22 pixels, Headlines in Capitals
3. Example 01 : Red Links, Brown Text (set as individual RGB colours), Maximum font size is 72 points, baseline set at 18 pixels
4. Example 02 : Blue Links, Maximum font size is 46 points, Minimum is 4 points, baseline set at 22 pixels, Headlines are in capitals
5. Example 03 : Green Links, H1 set as 56 points, p set to 18 points, baseline set at 34 pixels
6. Example 04 : Blue Text, H1 set at 100 points, H2 set at 90 points, H3 set at 80 points, H2 set at 40 points, blockquote set at 24points
7. Example 05 : Double size deafults
8. Example 06 : This site!

All of the output CSS is w3c valid, cross browser compatible, scales neatly and is commented and laid out readably.

If you are interested in the inner workings of the script, I am more than happy to release it under a GNU license which would mean that you could use it for any reason you liked, so long as any improvements you do – I have access to! Everyone wins.

You can currently access the latest version in the SVN at Google Code.

Note :  the query sent to the test page is identical to the query sent to the dynamic CSS file.

By simply including the type.css file, you automatically reset and normalize the presentation of HTML elements.
The process creates a level playing field upon which to author your layout CSS. The most common elements are automatically created with sufficient vertical spacing so as to fit onto any sized grid

Typograhpy is handled internally so that all text is easy to read (even at the smallest sizes) and sticks to the specified baseline.
Kerning and Leading is added to all small fonts, and margins to all larger ones in keeping with the vertical rythmn that you can specify as part of the query string.
The current baseline is set at 22 pixels and the source code CSS can be viewed here.

The idea for this script came from various sources, most notably webtypography.net, and css reset by Eric Meyer.
Its main goal is to ensure that web principles for good typography are followed automatically for all type sizes, and that all elements flow vertically along a measured rythmn.
Almost all elements are affected by the CSS, from H1 through H6, to more obscure elements such as ABBR and KBD – each is reset so as to remove any existing styles imposed by certain browsers.
All code is fully cross platform and complies with W3C standards for web accessibilty.

CSS Source Code : type.css

Options :

Headings :

1. 
   

   Toggle Capitalisation of Headlines

2. 
   

   Toggle to SERIF Typefaces

3. 
   

   Print Mode

   Sizes :

4. 
   

   Increase Maximum Font Size by +1 (to 37 points)

5. 
   

   Decrease Maximum Font Size by +10 (to 46 points)

6. 
   

   Increase Maximum Font Size by -1 (to 35 points)

7. 
   

   Decrease Maximum Font Size by -10 (to 26 points)

8. Max Size : 36 points | 40 points | 48 points | 96 points

Grid :

9. 
   

   Increase Baseline by +1 (new size : 23 pixels)

10. 
    

    Decrease Baseline by -1 (new size : 21 pixels)

11. Baseline : 18 pixels | 20 pixels | 22 pixels | 24 pixels | 32 pixels

Colour :

1. 
   

   Black Text

2. 
   

   Brown Text

3. 
   

   Red Links

4. 
   

   Green Links

5. 
   

   Blue Links
6. Text Colour :
   (You can use Hex or RGB Values)
7. Link Colour :
   (You can use Hex or RGB Values)

Examples :

1. Example 01 :
   Red Links, Blue Text (set as individual RGB colours), Maximum font size is 96 points, baseline set at 22 pixels, paragraph set to 14pts
2. Example 01 :
   Red Links, Blue Text, Maximum font size is 96 points, baseline set at 22 pixels, Headlines in Capitals
3. Example 01 :
   Red Links, Brown Text (set as individual RGB colours), Maximum font size is 72 points, baseline set at 18 pixels
4. Example 02 :
   Blue Links, Maximum font size is 46 points, Minimum is 4 points, baseline set at 22 pixels, Headlines are in capitals
5. Example 03 :
   Green Links, H1 set as 56 points, p set to 18 points, baseline set at 34 pixels
6. Example 04 :
   Blue Text, H1 set at 100 points, H2 set at 90 points, H3 set at 80 points, H2 set at 40 points, blockquote set at 24points
7. Example 04 :
   Double size deafults

Renegade Web Radio

Bored of the charts? Looking for sounds to keep you occupied? Look no longer with music and mixes from around the world in one simple interface – combining a podcast, blog and mix aggregator – held together with AJAX magic

check it out @ nomadradio.fm

Features

• Cross Fading between tracks
• Prefetching of the next track so that there aren’t any gaps between songs
• A fast visualiser that reacts onbeat as well as to the frequencies
• Saved volume and a rotary dial
• AJAX backend so that you can browse around without losing audio
• Flash <-> Javascript bi-communication

Get involved and send over your mixes!

Tracklisting :

01. Sam Cooke – Love Me
02. Nusrat Fateh Alleh Khan – Taa Dem
03. Zdzisław Piernik & Piotr Zabrodzki – Reorganizacja
04. Sahib Shihab – Om Mani Padme Hum
05. Shizuo – Sweat
06. New Strangers – Duelin’ Banjos
07. Cobra Killer – Lambretta Does it Better
08. The Fucking Champs – Lost
09. Tom Waits – Everything Goes To Hell Anyway
10. Gustav Holst – Uranus
11. Brathanki – Brathanki w Dyskotece
12. Scout Niblet – It’s All For You
13. DJ Scotch Egg – No Beats
14. Ilmaa Virtaa – Paavoharju
15. Бабслэй (Babslei) – Dear Sun
16. Jeff Mills – The Hacker
17. Kongar Ool Ondar – Fast Words
18. Aphex Twin – Didgeredoo
19. The Magic IDs – Loopstück
20. Nicolette – Nervous
21. Rachmaninov – Flight of the Bumblebees
22. NASA – Symphony of the Planets
23. Broke’n’English – Machester Shit
24. Jim Backus & Dennis Farnon – Magoo in HiFi
25. The Perceptionists – Let’s Move
26. Gene Coleman & Raed Yassin – A Funny Day in Moore
27. Es – Maailmankaari i
28. Chailla Babu OST – Pyar Chaiye Keh Paisa
29. Die Like A Dog Quartet – Little Birds have Fast Hearts
30. Dwayne Sodahberk – Partying Without Inhibition and Dignity
31. The Bug! vs The Rootsman – Killer feat. He Man
32. C-Mone – Stan Bak
33. Goretex – Earth Rot
34. Reefer Madness – Opening Fanfare
35. Betty Davis – This is It
36. Incredible Bongo Band – In A Gadda Da Vida
37. William S. Burroughs – Kill The Badger
38. Praxis – Animal Behaviour
39. Alarm Will Sound – Logon Rock Witch
40. DethKlok – ThunderHorse
41. Charles Bukowski – The Strongest of the Strange
42. The Andrew Sisters – Sabre Dance

Ever evolving portfolio

Hi, my name is Zen. Ths is my website full of stuff! Read how the site was made by following the blog posts.

Inbox excitement

In this modern day revolution, it is nice to see the mediums using each other, rather than competing. Here are a few newsletters used in campaigns designed to promote magazines and their online homepages.

Emailed every Sunday :

Mpora Streaming Media (biggest push)
RIDE : UK Cycling Magazine
OnBoard Snowboarding Magazine
Surf Europe Magazine

Gentle Flash Banners

Promotional Campaign for a new car by Form Motors. As the car is targetted at the active individual, Ford wanted lots of people having fun with the suggestion that it could be you having all this fun.

Leaderboard
Sky scraper

Panda on a dirt bike

Printed magazine advert for DIRT magazine featuring a panda riding a bike. Lots of photoshop fun to be had, and strict brand guidelines so that it fit part of a series. It is quite attention grabbing and colouful and hopefully brought along some punters.

Printed in Nov 2007