Showing posts with label kaleidoscope. Show all posts
Showing posts with label kaleidoscope. Show all posts

Sunday, January 10, 2010

Orbituary

I had finished creating my BSB Squarial font on December 16th. It was now the December 17th, the event was on January 9th, Rory hadn't yet received any BSB material from Kaleidoscope and time was getting short.

So, to make sure I had a fighting chance of getting an ident ready in time for Rory to use, I turned to the ever reliable TV-Ark site. I found some wonderful scans of BSB promotional material that I could use as source material. I started putting as much of this as I thought would useful into Inkscape.

The first thing I did were the channel logos - Movies, Now, Sport, Galaxy and Power Station. Due to the good quality of the source material I ended up being able to produce nice vector versions of these logos in Inkscape.


Five Inkscape BSB channel logos

I also used Google Image Search which sucessfully came up with some other source material I thought may be handy. At the fascinating Vintage Broadcasting site I found a fantastic IBA breakdown caption, which I recreated in Inkscape.


Inkscape IBA/BSB breakdown caption

...and a test card used for engineering tests. Again I recreated it in Inkscape.


Inkscape BSB Engineering Card

Another thing I found was the caption that was broadcast when BSB transmissions on the Marco Polo satellite ceased. Again here's my Inkscape recreation.


Inkscape BSB Closure caption

It was interesting that they used Friz Quadrata rather than the BSB corporate font for this. I suppose they must have been past caring by then!

Once I'd done all this I sent it all off to Rory in Inkscape SVG format so that he could use or edit any of the files I created if he needed to.

The good news was that Rory had received the BSB material from Kaleidoscope. The bad news was that it seemed to be mainly third generation VHS stuff. This is a nightmare source material for recreation because the VHS format chucks away so much picture detail and colour information that recreating anything from grabs of VHS material is slow, frustrating and largely down to guesswork.

However, Rory did send back ident grab of a BSB logo which was very handy, and which I duly recreated in Inkscape. The letters are a bolder weight of the BSB font than the one used in the caption below it, so I drew them from scratch.


Inkscape BSB logo

The coloured ring in the BSB logo is quite interesting. To do this I created a coloured background that was made of a red, yellow, green and blue fills overlayed on top of each other and grouped into a single object.


Inkscape BSB logo with the ring mask unset

Then I created the shape of the ring, and used that as a mask over the coloured background.

My final port of call was Mike Brown's excellent mb21 site. The mb21 site contains an extensive library of scans historical documents related to UK Broadcast transmission. What I was after was the famous BSB testcard complete with the girl who won the newspaper "be a the satellite test card girl" competition.

I created the testcard with a green circle in the centre in place of a photograph and a Kaleidoscope logo in place of a channel logo. The green circle was so that Rory could key in whatever he wanted.


Inkscape BSB/Kaleidoscope test card

Once I had done this, and sent it to Rory I had done about all the still images I usefully could so I couldn't delay doing the animated ident in Flash any longer. I still had no audio too, but I decided I'd start creating an ident anyway and hope for the best.

After Channel 4 burst onto the scene in 1982 with its famous CGI blocks logo there had been a glut of shiny plastic and metallic 3D shapes whizzing about the screen in television presentation. That meant that by the time BSB came along just seven years later that sort of thing was all old hat. What was now in vogue was creating lots of soft fluttery layers of images on top of each other with subtle lighting changes.

This actually suited me, as I don't have my copy of Swift 3D here in Hungary with me, so I couldn't have created something very three dimensional anyway (although if I had had Swift 3D my finished BSB ident would have been much nicer).

The brief from Kaleidoscope was to create an ident with the BSB logo and the legend "The Quest Continues..." underneath it. Obviously thoughts of space and Star Trek and Dr. Who came to mind.

"The Quest Continues..." text would be easy - I'd simply zoom it into view with a trail Tyne Tees 1979 stylee. Clichéd, naff and typical of me...


Tyne-Tees style text zoom

For the background I used a nice picture of Pleiades star cluster that I found on Wikipedia. I'd used this before for a Rediffusion Christmas ident that I'd recreated for Transdiffusion. You can see it below, behind the Rediffusion ad astral logo - you'll probably have to click on the image below to see it.


Flash 8 Rediffusion Xmas recreation

One of the things I wanted was to make a nice form-up of the diamond shape around the BSB logo that represented the BSB "squarial" receiving dish. I also wanted to make this a bit kaleidoscopic, in honour of the fact that the ident was being done for Kaleidoscope.

I decided on the simple device of making the sides of the box zoom in with coloured trails using Flash motion tweens.

I did an early test with solid colours - and this looked all wrong. It looked like a 1970s cel animated ident.


Rather 70s...

However, with some gradient fills and some alpha transparency it suddenly looked all right.


What a difference a fill makes...

Rory sent some audio and a genuine BSB Galaxy ident - this was handy because I hadn't actually seen any real BSB presentation at this point.

I realised that I needed to make the ident longer, and I also needed to add some more elements to layer it a bit more and make it a bit more "Lambie-Nairn" than "Lamey-Dave". I came up with some ribbons accompanied by Galaxy-style five-pointed stars.


Animating the ribbons in Flash

These were simply animated using shape tweens (shape morphs) in Flash. As well as tweening the shape of the ribbons, I anmated the gradient fill inside them to simulate the lighting effects. I used primary and secondary colours rather than the subtler shades that Lambie Nairn used as I wanted to get over the idea of "television".


Completed ribbons layer

Again, drawing the ribbons in Macromedia Flash 8 was a horrible job and every second of doing it made me miss Inkscape terribly. Using Bézier handles in Flash 8 is fiddly and unintuitive and I can't believe how much work I actually did using them!

I could have used Flash 8 Professional filter effects in my ident, which would have allowed Gaussian blurs, compositing effects etc. and made the end result both more pleasant to look at and created an effect more faithful to the genuine BSB idents. However I decided against this as if I had relied upon them and Rory couldn't import them his end we would have been stuck. I didn't have time to post him a DVD of an exported video file from Flash.

Rory, as always, immediately spotted what was wrong with my ident and added some beautiful stars that slowly moved towards the viewer, which made all the difference to the finished product. And here it is:


The finished BSB "Quest" ident

I'm really, really pleased with the way the finished ident turned out. My comfort zone is doing material from the 50s, 60s and 70s so I was really dreading doing a job that was supposed to evoke the late 80s. So to get anything approaching half-decent was a huge relief.

It's hip to be Squarial

Kaleidoscope is a non-profit making organisation that researches vintage British television. Their publications are essential reading for anyone seriously interested in British television history. It also holds regular fund-raising events for the RNLI, where rare archive gems are screened and auctions of memorabilia are held.

I've done various graphic items for Kaleidoscope events in the past thanks to my friendship with the multi-talented Rory Clark. Rory recovers many of the domestic videotape recordings that Kaleidoscope discovers, and also compiles the videos and documentaries that are shown at their fund-raising events.

A bit of my past Kaleidoscope work

The last Kaleidoscope event was held jointly with the British Film Institute at NFT1 at the BFI Southbank, London on January 9th. Part of the event was a showcase of recently recovered programmes from the ill-fated BSB (British Satellite Broadcasting) service. Two of the main programme providers for BSB were Noel Gay TV and John Gau Productions. Sadly, nearly all of their programmes for BSB were junked. However Kaleidoscope has been busy helping track down domestic video recordings of lost BSB programmes to return them to the archives.

BSB corporate identity

Rory asked if I would like to contribute some graphics to help him out with the BSB segment, and I was delighted to be asked. The corporate look for BSB was designed by Martin Lambie-Nairn, and I think it was very nice indeed.

One of the key parts of the BSB corporate identity was a specially designed typeface. My first impression was that it looked similar to Albertus and Friz Quadrata. On looking at printed examples of the face, I decided it was an adaptation of the typeface Friz Quadrata, but I could not find a perfect match for in digital form. Therefore I decided it might be nice to make one.

To do this, I thought I'd go my usual route: I'd create glyphs in SVG format in the free software vector graphics package Inkscape, then I'd import my glyphs into the free software font design program FontForge 2.0 to create a truetype font file.

The first thing I did was think up a name - Squarial, which is a pun on the name of the Arial typeface and also the name of the distinctive square dish that you needed to receive BSB programmes.

The easy part being done, I then set to work. The first letter I looked at was the letter B. There were various differences I could see between this B and the B in Friz Quadrata. It was lighter, it had no flared serif at the base, the top loop was larger and there was an angled cut between the main vertical stem and the halfway line of the B.

Click to enlarge

The next letter I wanted to look at was the R, as this was another key letter to get right. As you can see, it is almost Agfa Rotis Semi Serif in appearance.

The other two letters I wanted to do were the S and the G. Once I'd got these right, I could use them as the basis for the rest of the alphabet.

I had to guess how some of the upper case glyphs would look, as I had no printed example, so I used the shapes found in Friz Quadrata as a base and modified them to match the letters I did have.

Click to enlarge

I've included some of my "guesses" above - hopefully they make some kind of coherent face when used with the other glyphs. Incidentally, I drew all the vector shapes in Squarial from scratch in Inkscape - the vector information in the truetype versions of Friz Quadrata I had was too messy and irregular to be of any use.

Due to the contraints of time, I didn't want to create lower case glyphs for the Squarial face, but I did want to add a small range of punctuation and some numerals so that Rory could use the finished font to caption the various clips that would be shown at the Kaleidoscope event.

One thing I thought would be nice would be to include Squarial-style squares as the points in the punctation. You can see some examples below.

Click to enlarge

Once the punctation was done I had a set of individual glyph .svg files all ready to import into FontForge.

The glyphs imported into FontForge with no problems at all. One of the things that saved me a lot of time when designing this font was keeping all of my Bézier control points on integer co-ordinates in Inkscape. I am now also much better at knowing where to put the control points so that FontForge will not need to add additional ones.

Sterling glyph in FontForge 2.0

And, after spending some hours kerning glyph pairs, I had a finished truetype font.



The finished font

The finished font, Squarial, is licensed under the SIL Open Font Licence (OFL) 1.1 and is available to download from here. Microsoft Windows users may need to use the free software tool 7-Zip to unpack the .tar.gz file.

The music accompanying the Kaleidoscope ident in this post is an excerpt from "The Iceman Cometh" from the album Grim by Maestoso. You can get hold of a copy on the Maestoso compilation "Uneasy Listening" which is available here.

Saturday, October 31, 2009

Left a bit...

Unfortunately, whilst I was working on the odds and ends for the Kaleidoscope "Bob's Full House" event my wife became ill and was taken to hospital. This meant I didn't have the time or, to be honest, the right frame of mind to finish all the jobs I wanted to do for Rory.

The thing I'm most disappointed about is that I didn't get the chance to finish off the title sequence for "Bits and Bobs", the compilation of continuity clips taken from Bob's collection.

This is the sketch I did that to show Rory roughly what it would have looked like:


Click to enlarge

Friday, October 30, 2009

The Bob Monkhouse Collection

The documentary "The Bob Monkhouse Collection" documents how the Kaleidoscope organisation catalogued and archived the incredible archive of films, video tapes and sound recordings collected by the late Bob Monkhouse.


Charles Wheeler, apparently

The documentary was presented by Liz Barker, the Charles Wheeler of Blue Peter presenters, and was put together by my friend Rory Clark, the Lord Derby of Farcical Films. Rory asked me, the David Blunkett of graphic design, whether I wanted to put together a title sequence for it.

As time was getting short before the event, I thought the best thing to do was do dig in my bag of animations and see if I could adapt something I had already done. The Bob Monkhouse collection encompassed television, radio and cinema. So my main concern was finding something that could evoke all three media.

I remembered an animation I had done some time ago for another archive organisation, Transdiffusion. Chris Bowden-Smith of Transdiffusion had asked me to recreate an ABC Television start-up sequence from the late 50s, and I thought this could be just the thing I needed.

ABC Television was the weekend television contractor in the Midlands and North in the 1950s and 60s. They were set up by the Associated-British Picture Corporation, who were a company that both owned cinemas and made films. Their 1950s start-up sequence had radio waves, a cinema projection effect, and had a logo that would have been very familiar to television viewers tuning in to programmes such as "Oh Boy!".



Much more fun than Granada

I simply replaced the "ABC" lettering with "BOB", added the word "Monkhouse" in my B12JP typeface and added "The" and "Collection" in the face Forte.



Much more fun than Norman Vaughan

Rory was very happy with how the sequence worked, and thought the logo was so nice he wanted it as a badge for the end credit roller. Therefore he needed just the logo on a transparent background.



Much more fun than Charlie Williams

I exported it the logo from Macromedia Flash 8 as an Adobe Illustrator file, then converted that to an Inkscape .svg file using the uniconvertor tool method I explained in a previous post.

Thursday, October 29, 2009

You Have Been Watching...

As you probably know if you come here often, recently I've been helping out my friend Rory Clark by doing some graphical odds and ends for three documentaries he was making for the "Bob's Full House" Kaleidoscope event at BAFTA.

One of the things Rory asked me over the phone was whether I could knock him up an endcap for the documentaries that would credit his company "Farcical Films". Rory was quite firm over the phone that he wanted something very, very simple and didn't want any animation.

I was equally firm that I wanted him to have some animation as I thought he was being far too modest and thought he needed to blow his own trumpet a bit more.

So what I came up with was a bit of a compromise - I would do him a little silent animation in muted BBC Co-Production endboard style.

In actual fact I already had an animated ident for Farcical Films that goes back many years that never actually got used for anything and I thought it was about time it got dusted off and used.

In the distant past I was living in the village of Mélykút on the Hungarian/Serbian border and watched an awful lot of Croatian (HRT) and Serbian (RTS) television. This was because they showed many English programmes with subtitles whereas in Hungary they dub everything - badly. I got quite familiar with their presentation, and one of the RTS idents back then started off with EBU colour bars and resolved into the RTS logo. As a television presentation fan I thought this was fantastic idea, and definitely worth pinching.

So I created a "Farcical Films" ident using this idea for Rory. It was also an learning exercise for me in Swift 3D, which I had just started using for the first time. Swift 3D is an incredible program that creates vector 3D, and can export in .swf format. It also features a number of nice features to make very small 3D images which are excellent for web work, and also a number of options for "cartoony" 3D for 2D animation use. I used it for many jobs over the years and if you've never used a 3D program before it's an excellent one to start with due to its ease of use and high quality of its documentation.

I started with what looked like colour bars, but were the Farcical Films letters arranged in a line end on.



I then animated the letters into place, whilst making them white.



I finally faded on the word "FILMS" to produce the Farcical Films logo.



As Rory obviously wanted something more muted, and so that Kaleidoscope got their credit too, I created something a bit more BBC.

K logo starts formed, Farcical films logo starts as bars.



The bars animate.



And the logo is revealed.



I speeded the ident to double speed so it would run at 50fps. This meant that both the animation was short and sweet (under 3 secs) and that Rory could interlace the animation to get smoother movement, which is something he is always keen to do when possible.

Wednesday, October 28, 2009

G Spots

While I was producing a title sequence for the "A Shower Of Shot" documentary, Rory Clark asked me if I would also produce some little animations that would appear in the documentary itself.

Rory had decided to break the documentary into sections, with the title of section being a word beginning with the letter g. He asked me if I would produce a few seconds of animation that would introduce each of the sections. He gave me a list of words "girls, gifts, gags, gaffes, etc." and let me get on with it.

I started by creating all the words Rory gave me in Inkscape, and exported them all for import into Macromedia Flash 8 as .eps (Encapsulated Postscript) files.


Why don't you build yourself a word...

My first idea was a bit too elaborate; I got carried away, which I often do! I produced an apple on a gradient background...



...that gets hit by a bolt coming out of a crossbow...



...smashing the screen...



...and revealing the name of the section underneath.



Rory gave me a bit of much needed direction and said he simply needed the word "golden..."...



...which would then be hit by a bolt...



...you'd see a flash...



...and with a quick shudder...



...the title of the section would be revealed.



Another thing Rory asked me to do was a breakdown caption. One of the things he remembered about watching "The Golden Shot" as a child were the breakdowns caused by technical difficulties, strikes or IRA bomb threats. These were the joys of live television in the 70s.

Obviously there was no argument about the style - Rory wanted an HTV holding transparency in the style we both remembered from the seventies which was handy as I would have probably given him one of those anyway! I selected a suitably naff publicity shot of Bob from a selection Rory sent to me and recreated in Inkscape what we would have seen in Wales and the West in the case of one of the aforementioned catastrophies.



The polyester clad stars of Wednesbury Co-op cheese counter...

Another thing Rory asked me to do was to add, for technical reasons, a few seconds of grey onto the beginning of the ATV Colour Zoom. Whilst I was happy to oblige, I suggested that he might also like to add this:



A fitting place to finish, I think.

I created it by tracing the caption that appears on the front of a telerecording of the last Golden Shot Bob presented in 1972 after he had been sacked for no reason whatsoever by Francis Essex. I used Inkscape to create the entire caption -  I couldn't face drawing something as fiddly as this in Flash anymore! I must be getting old...

And with that, my work on the "A Shower Of Shot" documentary was done.

Tuesday, October 27, 2009

A Shower of Shot

Now I'd produced my "Monkhouse" font, my next job was to produce a caption using it. The Monkhouse font needs to be used very large to be legible, so the ATV graphic designers merged the letters together to give themselves enough room.


I also love the fact that the words are not centred.

I looked at the example above and noticed that the outer two outlines were fused together. By putting my letters over the ones in the screen-grab I worked out that the fourth outline of each letter should overlap the third outline of the letter to its left.

To do this letter fusing I used Inkscape and the letter outlines I'd drawn to import into FontForge. I used them rather than the true-type font simply because they were already the right size. I did this fusing a letter at a time, left to right. First of all I'd overlap the letters.


Overlap the letters

Then I'd merge the two outer outlines using the Inkscape Path Union feature. After that I deleted the areas of the merged path I didn't want. The quickest way to do this was simply to draw a rectangle over an area of the overlap...


Rectangle over the overlap

...and then use the Path Difference feature....


Path Difference

...and then tidy up the paths using the Nodes tool.


And Bob's Your Uncle

Then I'd do the same thing again for the second outline in.

Here's the finished caption in Inkscape:


The end result.

After Rory OK-ed the end result he asked if I wanted to have a go at animating a title sequence for him. I said I would, provided I could get Macromedia Flash 8 to behave on Ubuntu GNU/Linux (I don't have a copy of Windows). WINE is a very clever piece of free software that allows programs written for Microsoft Windows family of operating systems to run on the GNU/Linux operating system.

I already had WINE installed so I tried installing my copy of Macromedia Flash 8 and it worked perfectly. The only problem was the lack of anti-aliasing on some of the smaller fonts used on the interface and some of the keyboard short-cuts I liked using not working.

The next problem I had was how to export my Inkscape design into Flash. After doing a few tests the best format to use for the Inkscape to Flash 8 transfer seemed to be Encapsulated Postscript or ".eps".

Now I was sure I could do something useful in Flash I got back to Rory and asked him which music he wanted to use. Rory quite rightly sent me back a copy of the late sixties/early seventies theme that was used for the longest amount of time. However, there was something missing - I wanted the "left a bit, right a bit, fire" that I remembered from my childhood. I suggested Rory cull it from the start of the final season's title sequence.

I wanted to include this because I wanted to add the iconic ATV Colour Zoom logo at start of the sequence and have Bob smash it to pieces with a crossbow.

First of all I traced the bolt and bow from the final season titles - this was a very easy job as the shapes were quite simple. I layered a few gradient fills on top of each other to get a kind of "airbrushed" effect.


Running on GNU/Linux? That's Flash...

Then I needed to smash the ATV logo to pieces. The first thing I needed to do was break apart my ATV logo in Flash so that it was all one symbol on one layer with no groups. Then I drew a "crack" shape on top of it. Finally, I turned the pieces inside each bit of the "crack" into separate symbol so I could animate them.


Lady Plowden did this too...

Although it's very simple it worked quite well. As far as the titles themselves were concerned I wanted to copy the final season titles with the bolt setting off on a journey with concentric rings of airbrushed items giving an impression of movement.


This is what I wanted to copy...

One of the items I needed to borrow from those original titles was, naturally, an apple. Tracing the apple in Flash was an absolutely horrible job, and reminded me how lucky I am to be able to draw things in Inkscape most of the time. I decided not to draw the apple in Inkscape as I had no way of getting the gradient fills from Inkscape into Flash - they come across as bitmaps in all the formats I tried. This was no good as all of the objects I drew had to change size dramatically in the finished animation so they really had to be totally vector shapes.


Looks sweet, but rotten to do.

If you've never watched "The Golden Shot" you may not know that over the theme music an announcer says "...Live, from Birmingham...". To illustrate the "from Birmingham" part I wanted a ring of ATV logos to appear. That was simplicity itself. But for the "...Live..." part I wanted to show the reason for the program being live - a telephone. "The Golden Shot" was a program where viewers at home could phone in and play.

In the later seasons of "The Golden Shot" a gold plated Trimphone was used, and I just had to have a trimphone in the titles as they are the essence of Britain in the seventies. I found a website with pictures of trimphones and I'm sure you'll be delighted to know the trimphone I used as reference material was one of the series designed by Lord Snowden.


Something beginning with T: Trimphone - lovely!!!!!

Finally, I wanted to have a postcard, as viewers writing-in was an important part of the programme too. I used my Queen's head and stamp perforations I'd designed many moons ago to use on a recreation of an ITV Schools and Colleges interval transparency. Anyone familiar with Bob's life story will understand the significance of what's actually written on the card.


And I want them served on that nice silver cake stand...

Sadly I currently don't have access to the fantastic Swift3D here in England - I left my serial number in the UK and you can't export without it. If I had, I would have used it to realise one of Rory's original concepts for the title sequence.

What he asked me to do was to make the "O" rotate when it is hit by a crossbow bolt so that it looked like an "i" when it was on its edge so we got a shit/shot gag on the main title card. In fact, if I had had Swift3D I would also have recreated the wonderful psychedelic silver tube effect from the 1972 title sequence as well - it truly has to be seen to be believed.