Designing Repton’s Lost Realms

If you’ve been here before, you’ll probably already know that this year is Repton‘s 25th anniversary. And, as part of the celebrations, Retro Software is releasing Repton: The Lost Realms for the BBC Micro and Acorn Electron.

I’ve already blogged about creating the cover artwork and the loading screen for the game. However today is the 6th November and Repton: The Lost Realms is being officially launched at R3PLAY in Blackpool. That means I can at last talk about creating the graphics for the game itself.

My cover artwork

I was first approached by Dave Moore about contributing to Repton: The Lost Realms in mid 2008. Peter Edwards had just recovered a load of my old Repton 3 and Repton Infinity screens from some of my 5.25″ floppies and the graphics in them had impressed Peter and Dave enough for them to ask if I would be interested in creating some screens and graphics for Repton: The Lost Realms.

Like Repton 3 before it, Repton: The Lost Realms is a game that allows you to not only edit its levels, but also redefine its graphics. That means that it’s possible to provide a selection of different screens and graphics for players to load into the game.

Lost Realms as I first received it

At this stage, the Repton: The Lost Realms came with only one set of screens. As you can see above, it used the Repton 3 graphics with a few additional graphics for the game’s new elements designed by the game’s original programmer Paras Sidapara.

As there were to be four sets of six screens included in the game, my first idea was to theme each set of graphics around the existing Repton releases. In other words, have a Repton 1 set…

Repton 1 Lost Realm

…a Repton 2 set…

Repton 2 Lost Realm

…a Repton 3 set…

Repton 3 Lost Realm

…and a new set for the final set of screens.

I quickly hacked about and transferred the graphics from these games into Repton: The Lost Realms. At this stage I was designing new characters in the Repton Infinity graphics editor (Film Strip) and then transferring them over to Repton: The Lost Realms by transferring blocks of data between files using the BBC BASIC command line.

Film Strip – An excellent graphics editor

The reason why I preferred Film Strip was that it was designed for use with a keyboard. I didn’t have a real BBC Micro to use so I was using these programs via the excellent emulator BeebEm. In fact, as at that stage there wasn’t a native GNU/Linux emulator for the BBC Micro at the time, I was using BeebEm via WINE.

The Repton 3 and Repton: The Lost Realms editors had adopted the then very fashionable WIMP paradigm. However, using a WIMP interface with a keyboard is very hard going and I found the AMX Mouse option tricky to get working in BeebEm. That meant I couldn’t use these editors with my mouse.

Another problem I had with Repton: The Lost Realms’ editor was the awful yellow and black colour scheme used for the editor’s pointer. It was probably the worst colour scheme you could have picked if you want to design graphics precisely – the outline of the pointer gets lost against black, but most of the graphics have black backgrounds or outlines!

Repton: The Lost Realms’ Editor

After I had designed Repton 1 and Repton 2 themed graphics it soon became obvious that this approach would not work. There were various new elements in Repton: The Lost Realms that were not present in previous Repton games. I wanted to redesign these in each set to match the style of previous Repton releases. However Dave wanted to keep the new game elements that Paras had designed looking the way Paras had designed them. However this would have looked out of place, particularly in Repton 1 which is quite abstract and geometrical in design.

Therefore, after talking it over with Dave and Paras we decided it would be best if I design four completely new sets of graphics for the game, bearing in mind the need to keep the original design of Paras’ new game elements in each set. We would also only vary the game characters that varied in the sets of screens supplied with Repton 3: namely the walls, eggs, monsters and crowns.

I had a few ideas for the graphics having got used to playing the game. I didn’t think that the inverted cage colour scheme for the anti-clockwise spirits worked at all. I needed to find a way to make these cages look a little less incongruous. I wanted to make the graphics look 1988-ish – so I used the style of later BBC games like Richochet and Star Port as inspiration. And I wanted to use stippled colours as much as possible to make the apparent colour palette seem more than the four colours that the game was limited to.

I designed the set of graphics for the final set of levels (PRESTO) first. My inspiration for these were the full-page adverts for Repton 2 and Repton 3 that Superior Software used to run in Acorn magazines at the time. In particular, I wanted to design a set with light mortar between distressed bricks. I’m very proud of this set and I think it’s actually my favourite.

Presto – not for the faint hearted

I got a bit carried away, and I also redesigned Repton to look like he did in Superior’s adverts – this was very quickly and firmly rejected, and rightly so!

My Redrawn Repton went down like a cup of cold sick

I had one set down, three more in front of me and even using FilmStrip on a BBC Micro emulator seemed like very hard going. I really wanted to use The GIMP to design the graphics and suddenly it dawned on me that I could.

I could design the graphics in The GIMP and then transfer them to the BBC Micro emulator using the BBC Micro Image Convertor by Francis G Loch. This is an application written in PureBasic that takes image files (bmp, jpg, etc.) and downconverts them into the native screen display formats of the BBC Micro.

The process has a few stages. First I design all the graphics as separate files in The GIMP:

Completed graphics designed in The GIMP

Then I use the GIMP to slice them up and put them in rows:

Sliced and Diced in The GIMP

And finally I convert the graphic into BBC Micro format using the BBC Micro Image Convertor:

And converted to BBC Micro format

So, I fired up The GIMP and the next set I designed was for the LARGO set. This is the default set that loads when the game or editor loads, and the levels in this set were the original six levels designed by Paras Sidapara back in 1988.

Largo – the Realm of the Exile

Because I knew Paras was a huge fan of the game Exile, I decided to base the design of the walls on the walls found in Exile. This set looked very nice and thanks to The GIMP I was able to design them very quickly.

Adagio – Exile crossed with Repton 2

The third set I designed was a set for the ADAGIO screens. This set was a kind of cross between the walls found in Exile and the walls found in Repton 2 (my favourite Repton release). It didn’t work as well as I would have liked and I wish I’d done something a bit different.

Allegro – juicy, apparently…

The final set I designed was the ALLEGRO set. It was loosely based on the graphics for the game XOR, which my children were madly into playing at the time. This set has been described as looking “juicy”, whatever that means! Dave Moore accused me of taking a little more care over these graphics than some of the others because I knew I was designing all six levels to go with them. How very dare he!

The work on the graphics Repton: The Lost Realms was very straightforward. I did very little rework once we decided on what we were doing and there were only two real debates about the game characters. The first concerned earth, the second concerned fungus.

As far as the earth is concerned, I wanted to experiment with some dense Ravenskull style earth, whereas Dave Moore preferred the very sparse earth used in the Toccata level set of Repton 3. Dave got his way on that one!

Now that’s what I call fungus!

The fungus debate concerned my preference for fungus that looked like a toadstool rather than the amorphous mould that was presented in Repton 3. In the end, I redesigned the fungus to look slimy rather than mouldy but it’s probably the graphic I am least happy with.

Now that’s what I call fun, Gus!

We also had a discussion about the “freeze pill”. This was a green pill that froze monsters temporarily. What with absorbalene pills and time pills I thought Repton’s drug habit had gone far enough.

Freeze pills – just say no.

 
I wanted to replace it with a Citadel style snowflake. Everyone agreed, and that also involved making changes to the editor and game map graphics which I did by hacking the code about. But, although my snowflake was a good idea, I think the graphic I designed was horrible.

Snow flake – just say yuck.

Once I’d designed all four sets, I thought that that was that – only it wasn’t. By this stage Tom Walker (someone for whom the word genius seems utterly inadequate) had joined the project, and had started work coding an Acorn Electron version.

The Acorn Electron is cruelly afflicted in many ways, but one of the worst is that it has no hardware scrolling. That is terrible news for a game like Repton which relies on scrolling. Acorn Electron scrolling has to be done in software, which eats up the memory available for the game – and its graphics. The graphics in Acorn Electron Repton: The Lost Realms are 12 x 24 instead of 16 x 32 for the BBC Micro version.

Skull (Acorn Electron)

This meant I had to create cut down versions of all of the games’ graphics for the Acorn Electron version, and doing this took as long as it took to create the original graphics. In fact, I put in so much effort I actually prefer some of the Acorn Electron graphics.

Largo – All ready to transfer to Elkulator

Probably the most interesting thing about doing this was the lack of an Acorn Electron editor – or indeed an Acorn Electron version of the game itself! I had actually finished the graphics and put them in game files before Tom had finished coding the Acorn Electron version of the game.

It was quite some time after I had finished the graphics that I was actually able to play with the graphics in the game itself via Tom’s excellent Acorn Electron emulator Elkulator.

 Acorn Electron version

Keen eyed Repton fans will notice that Acorn Electron Repton: The Lost Realms reintroduces Tim Tyler‘s Repton sprite from Repton 2. I think this has much more personality than the one used in Repton 3.

I knew that there was a keen interest in the Repton: The Lost Realms from Acorn Electron enthusiasts so I put an enormous amount of effort in the graphics for the Electron version – I just hope they like them!

And finally –  a word about the design of the crowns. I spent many years living in my wife’s home-town of Mélykút, the birthplace and home of the legendary restorer Szvetnik Joachim. He was famous for supervising the return of the Holy Crown of Hungary from the USA in 1977. I went to his workshop in Mélykút to translate for some tourists from New York State, and enjoyed my visit so much I decided to make the crown in ALLEGRO look like the Holy Crown.

Allegro Crown (BBC Micro version)

The other crowns in Repton: The Lost Realms are also based upon real crowns – I wonder if you can work out which ones?

Simulated PAL

One of the many mysteries of having a home computer as a teenager was why the picture looked so much better on colour monitor than it did on a domestic television. And indeed, why the image on a domestic television looked sharper if you turned down the colour.

Later on, I discovered it was due the PAL system that the BBC Micro used to send pictures to the television. PAL ingeniously chucks away loads of colour information in order to keep the bandwidth of analogue colour television pictures down to a level that made broadcasting them practical.

After reading an excellent article on the subject by Alan Pemberton, I thought I’d have a go and see if I could simulate what PAL does to an image in The GIMP.

As a starting image, I used a CEEFAX page I’d made in Teditor (by Jim Notman, The Micro User, Volume 2 Issue 6) on the BBC Micro emulator BeebEm. Obviously teletext looked nothing like as good as this on a domestic television.

My starting image – click to enlarge. It never looked this good on a telly!

To begin with I added a Gaussian Blur to the image. I broke the link between the horizontal and vertical blur radii so that I blurred more horizonally (2.2) than vertically (1.2). It’s worth playing with this.

This button breaks the link between the radii

The next thing I needed to work out was how to split the image up into three different images – one containing red, one containing blue and one containing green. I discovered the Levels dialog box in The GIMP would do this for me.

To make the Red channel I created a duplicate of my original image with Ctrl+D. Then I brought up the Levels dialog box and then:

  1. selected blue channel from the Channel combo box
  2. dragged black pointer below the input levels graph to far right
  3. selected green channel from the Channel combo box
  4. dragged black pointer below the input levels graph to far right

The Red channel

To make the Blue channel I created a duplicate of my original image with Ctrl+D. I brought up the Levels dialog box and:

  1. selected red channel from the Channel combo box
  2. dragged black pointer below the input levels graph to far right
  3. selected green channel from the Channel combo box
  4. dragged black pointer below the input levels graph to far right
The Blue Channel. Sounds a bit rude…

Finally, I made the green channel from my original image. To do this I:

  1. selected green channel from the Channel combo box
  2. dragged black pointer below the input levels graph to far right
  3. selected blue channel from the Channel combo box
  4. dragged black pointer below the input levels graph to far right

That meant I had three images – one which was the red channel, one which was the blue channel and one which was the green channel.

The green channel was finished – I didn’t need to touch this as the PAL system relies on a high resolution green image and adds a low resolution red and blue image to this.

The finished Green channel. It will not be scaled like Red and Blue.

However, to both the red and blue channels I needed to lower the horizontal resolution quite drastically. Therefore I scaled both images to be 197 x 576. Then scaled them both back to 788 x 576 – their original size – again.

The Red channel after being scaled

Next I copied both the red and blue images into the green image as new layers. I used the Addition blend mode in the Layers, Channels, Paths dialog box to blend the images together.

Here is the low resolution red image added to the high resolution green image.

Red and Green images on separate layers blended using “Addition”

Here are the low resolution red and blue images added to the high resolution green image.

The end result – click to enlarge.

Well, it’s not perfect, but it was nearly what I was after and I was over the moon.

With a bit of playing around with the way you scale the channels it’s possible to get a fairly realistic PAL effect. The image below has various filters added to it, and I think it looks like an almost passable knock off of an off-screen photo.

Click to enlarge. Needs a bit more work, I think.

What I want to do next is to turn this into a filter in Python to automate the process and allow it to be fined tuned.

Repton Thru Time

Back in the 1980s, when I had a BBC Model B running Acorn MOS instead of a PC running Ubuntu, I used to be a very keen Repton player.

If you haven’t heard of it, Repton is an engrossing puzzle game that also contains arcade elements and it seems to appeal equally to people of all ages. My youngest daughter Mary is 6 years old and a particularly keen player.

In 1986 the third Repton game was released and it was my Christmas present from my parents that year. Although Repton 3 wasn’t my favourite Repton game (that was always Repton 2) it did allow you to design your own screens and, even better, redesign the game characters.

I soon became a keen Repton character designer, and this obsession held when I received into Repton Infinity. But I never showed my screens to anyone else at the time. I didn’t even know another BBC user with Repton!

The Repton 3 Editor

I used to particularly look forward to summer holidays and half terms when my Dad would bring home a BBC Master 128 which meant I could flip between the editor and game by pressing the break key. This small improvement speeded up designing Repton screen sets enormously.

In the middle of last year, on the Stairway To Hell forums, Acorn enthusiast Andrew Weston announced that he was putting together a website of all the non-official Repton levels that people had designed over the years. I mentioned that I had some but they were on 5.25″ floppy disc and I had no way of transferring them to a BBC Micro.

One of the forum administrators, “Samwise”, offered very kindly to transfer my discs to Emulator disc images that I could run on my PC. And, by return of post, I had my Repton 3 levels (and many other things beside) working on BeebEm on my PC.

Not all of my levels were on the discs I sent to Samwise, but the three sets with the best graphics were (some of my better level designs will have to wait for another time).

I sent the levels off to Andrew and he added them to his website and, after that, things seemed to take on a life of their own.

First came the offer from Dave Moore of Retro Software to design graphics for their forthcoming release “Repton: The Lost Realms“.

After that the person who is undoubtedly the world’s best Repton player, “Michael S. Repton”, reviewed my levels and was very kind about them indeed. Not only that, but he produced videos of him completing some of them and added them to his YouTube channel.

My aim, back in the late 80s was to design a “Round Britain Whizz” set of Repton 3 levels, with 5 sets set in different locations around the country. I designed three of the sets.

First there was a farming set based on the farm I grew up on in Somerset.

There’s the old BP oil can we had in the shed, my goat Timmy, the farmhouse, the Dutch barn, lots of barbed wire, fixing broken bails with binder twine and chasing errant cows into the right fields.

The next set was London – based on the Palace of Westminster. I always enjoyed visiting London as a child, I loved the tube and Oxford Street and the sights.

It contains lots of clichés of London – rain, American tourists, bobbies on the beat, portraits of the Queen and mugs of tea. The fungus in this set was supposed to be “the growing unemployed”.

And finally there was Rovers – based on Coronation Street.

Rovers, running in BeebEm

Again, a lot clichés in this one – whippets, terraces, dark satanic mills, Hilda Ogden, Keir Hardie’s cap and tellies tuned to Granada.

Michael also pointed out something I didn’t know – my screens had been converted to PC Repton 3 format by Richard Hanson of Superior Interactive no less! Incidentally, if you’ve never seen them, the Superior Interactive PC versions of Repton are really quite something, and are well worth anyone’s money.

The interesting thing about all this to me is that once you make your work available to others it takes on a life of its own that’s wonderful to see.

Obviously other interests and schoolwork got in the way and I never actually completed my level sets but I’m hoping that one day I’ll get the chance to go back and finish them all off. Maybe even for “Repton: The Lost Realms”.

Teletext

The Acorn World show is taking place on 12-13 September 2009 and I’ve done several of bits and pieces for it. One run of the mill job was that I recreated the Acorn World logo as an .svg as organiser Dave Moore only had it as a small bitmap.

My svg vector Acorn World logo

However, after that I was asked to do something a bit more unusual. Dave wanted to have a real BBC Micro show a selection of pages of information to people arriving at the show, and asked me if I could do something in teletext Mode 7.

Creating teletext graphics is quite fiddly as there are numerous limitations you have to be aware of – if I hadn’t done a lot of teletext work back in the 80s on my Beeb (mainly lame mickey takes of Ceefax and Oracle) I would have found this job tricky.

The teletext mode consists of 25 lines of 40 characters. As far as graphics work is concerned each character space is made up of a grid of 2 x 3 pixels. That gives you an effective resolution of 80 x 75 pixels. You are limited to 8 primary and secondary colours. However, each character square can only hold two colours (foreground and background) and if you want to change one of the colours (either foreground or background) you need to have a blank square to hold the colour change.

The first thing I did was take export my Acorn World logo from Inkscape as a bitmap. I imported it in The GIMP and convert it to an indexed palette consisting of black, red, green, yellow, blue, magenta, cyan and white. I already had this palette handy as it’s the standard one I use when creating BBC/Electron loading screens.

Next I reduced the size of the image to 80 pixels in width. After that I then created a grid using guides on the image spaces two pixels apart horizontally and three pixels apart vertically. This corresponded to character squares on the image, which is very important. You need to see easily where the character boundaries are in order to work out where you have blank squares in which to change colour. It also helps you create the artwork on a BBC Micro.

The first character space had to be black, as that would be where I would change the graphics colour to white. I also had to make sure that the green Acorn did not overlap any character square used by the black writing – this would have been impossible to render in a teletext mode.

All ready to enter on a BBC Micro Emulator?

One special difficulty of this screen is that you cannot do black graphics on a white background in teletext mode on a BBC Micro (although teletext enabled TV sets can do this). You can only do white graphics on a black background. This may sound odd, but only being able to do the latter makes it much more difficult to change colours.

For instance, I had no white background when I came to do the green on white acorn, as the background for the “Acorn” text was black. This meant I needed two colour changes (one for the foreground and one for the background) and this takes two character squares. The Acorn in the picture shown above needed to be shifted right by a character square to allow room for this.

Next I needed to get my design into a BBC Micro. I’m not lucky enough to have a real BBC Micro here in Hungary, so I use the excellent free software BBC Micro Emulator BeebEm. Sadly, on Ubuntu Linux, I have to run the Windows version under Wine as the GNU/Linux port has been rather neglected.

Back in the 1980s I used to use a teletext editor called “Teditor” by Jim Notman that I typed in from a program listing in The Micro User (Volume 2, Issue 6). However, these days I use a program imaginatively called “Teletext Screen Editor” that I got from a link in a thread on The Stairway To Hell forum. It’s a particularly good editor as it has something called “Graphics Mode”. This means that the letters QW, AS and YX act as toggles for individual teletext pixels in a character square. This is a huge help.

When using a BBC Micro utility you really miss modern niceties like auto-saves and multiple undos! Therefore, in case of accidents I use the BeebEm “Quick Save” save state function to save my work regularly.

The finished result in the editor

All I have to do in the teletext editor is “type” the screen in using my GIMP image as a guide, and send off a BBC Micro disc image to Dave to load onto a real BBC Micro.