A Showcase for creative projects

Landing

Becoming an explorer

Navigation, layout and structure of the website

We have tried to use the same layout and structure throughout the website.

Each page uses the same basic set of zones: The Header Banner; The Page Body; The Footer Banner. When the page first loads, all three zones are visible. However, visitors using smaller screens might notice that the two banners retract after loading (more on this later). This helps keep the Page Body clear to show as much content as possible at one time.

The layout of the body always follows the same pattern. On the left is a large Flash Card that displays the current page content. When the page first loads it shows a brief introduction and explains what else is available. We call this the Intro. Card. Text in blue always indicates some kind of link to related content. This might be internal or external. External links open in a new window or tab whereas internal links generally open in the same tab. At the bottom of each Flash Card is almost always a right justified link. Following this link takes you to the next Flash Card in sequence.

Shortcuts

Taking shortcuts

For when you need to 'cut them off at the pass!'

Excellent! If you are reading this then you have successfully navigated here from the previous Flash Card. A lot of the website can be navigated in this manner. As far as possible each section is laid out like a story. A quick glance at the bottom of this section shows that there is also a left justified link. This back links to return you to the previous Flash Card. Like this you can just keep clicking on the 'next' and 'previous' links to move forwards and backwards to your heart's content.

Nevertheless, there are times when a more direct route is needed. For this we have the colourful Tile Cards which offer a quick route to other Flash Cards. Depending on your screen size the Tile Cards might either be stacked up to the right hand side of the Flash Card or, if you are using a smaller screen or window size, be arranged across the screen underneath the Flash Card. On occasions it is a bit of both.

A look at each Tile Card shows it has a graphic and a label. Together these should give a good idea of where that Flash Tile links to. If you have a mouse pointer you can give them a tickle. This brings up a preview of the link destination in the Flash Card. If a particular preview catches your eye then simply click or tap on that Flash Tile to jump straight to the Flash Card. Obviously, once there you can either use the next and previous buttons again or pick a different Flash Tile and jump somewhere else instead.

Practice makes perfect so,

Parking

Parallel Parking

How to un-banish the banners

Whenever the page is re-loaded two banners pop-up to say hello. However, they don't want to overstay their welcome and so, especially on smaller screens, they withdraw and park out of sight to let you enjoy an uninterrupted panorama of the Page Body. However, they are a little bit cheeky and always stay sticking out a little bit.

To get one of them to pop-up on demand just give it a tickle with your mouse pointer. However, if you stop tickling it and move the pointer away it just withdraws again. To keep it visible for a little longer simply click or tap on it. Now you can study the contents at your leisure.

To send the banners back to their withdrawn positions again use the parking buttons at the far right. On the Header Banner this has an up-arrow on it and on the Footer Banner it's a down-arrow. Clicking or tapping on these should send the banners back to their respective parked positions.

It is worth pointing out that this is only relevant on smaller screens. If you are using a sufficiently large screen and a modern browser then the banners might not retract at all. In this case even clicking the park buttons won't hide them. Now all that is left is for us to find out what each banner can do for us.

Header Footer -