In the previous article, I have written an account of the different approaches used in paintings showing the story of Daedalus and the fall of Icarus, as given in Ovid’s Metamorphoses. As I was completing that, I was also transforming it into a hypertext document using Eastgate Systems‘ Storyspace 3 app. This article provides a copy of the first version of that hypertext, which you can explore, and explains how I designed and implemented the hypertext version.
I also used Storyspace 3 to generate a graphical analysis of the story of the fall of Icarus, which was included in that article, and shown below, although in the end I decided not to use that structure in the final hypertext.
If you want to learn how to create your own hypertext like this, all the techniques are detailed in the series of tutorials which are listed and indexed in this article.
As with the blog article, the central thread in the hypertext is Ovid’s account in Metamorphoses book 8. I first divided this up into suitable sections, each of which I put into its own writing space. I then grouped these writing spaces into the basic structural blocks of the story, and created a container for each of those blocks. Seen in the Map view, these containers trace the storyline from
Background through to
Death and burial.
In the other axis, I wanted to present my analysis of the structure, the choices open to those painting the narrative, and my short discussion of the results.
These start from a single focal writing space acting as the reader’s
Guide, and result in this layout in the Map view.
Guide then provides text links – from the blue text items – to enter the storyline detailed in the translation of Ovid, a summary version provided by the containers for that narrative, a gallery showing just the paintings, and a little side story about Phaethon. However the normal link from this writing space (if you do not click on one of the blue text links) takes you on to the discussion about the narrative itself, along the vertical path in the Map view.
Each of the containers in the horizontal path, giving Ovid’s account, then has a chain of writing spaces which contain the translated text from Metamorphoses. These are linked in a simple chain which take the reader from the
Guide, through each section in turn, and returns them to the
Guide at the end.
The paintings (which use a similar
painting prototype to those used in other tutorials here) are then placed next to the relevant sections of the text, within each container, according to which part of the story they depict. At present the paintings are not linked in to any of the other writing spaces: the reader can view them as and when they wish. Although the paintings do have an order, they do not have any inherent linkage with one another. The only slight exceptions to this are the pair by Gowy and Rubens, and the landscapes by de Momper and Brueghel.
The containers making up the horizontal path for the storyline each contain the brief summary of the story which I originally gave in my article. These should be useful for a reader who wants to get the gist without stepping through Ovid’s full account. All too often I do not make as full use of containers as I should.
The side story about Phaethon is implemented like one of the containers making up the main story, although it has but a single writing space with my text summary of the story, which refers to the two paintings shown.
In addition to showing the paintings in the relevant sections of Ovid’s account, I also wanted to provide a container for them as a gallery. This is accessed via a text link from the
Guide, and a single red writing space at the bottom left provides an easy way back to the
Guide. The writing spaces here are simply aliases to the originals in each of the containers of the story itself. This is an efficient implementation, of course.
I think the Map view here is gorgeous – who says that hypertext should be just text?
By putting the date of creation for each of the paintings, a feature of my
painting prototype, this means that you can also view a timeline showing all the paintings, with minimal additional effort. I did find that I had to set custom
$TimelineEnd dates for the timeline itself, so ensure that the text was not cropped. That is easily done using the Inspector.
One issue with this Timeline view is that it contains entries not just for the original writing spaces for each of the paintings, but their aliases are also included, doubling the entries up. Hopefully one of the Marks who really know what they are doing will suggest how that can be improved.
How long did it take?
Having already written the text for the blog article, implementing this hypertext document took just four hours, including the time required to scale and adjust images. I am sure that someone who is more adept at using Storyspace could do it more quickly.
One thing that I was particularly careful about in this project was ensuring that the images for paintings were not just resized correctly, with a maximum dimension of 512 pixels, but that their resolution was set uniformly to 72 dpi. One slight irritation in my previous use of scaled images has been that, when dragged and dropped into a writing space, some appear tiny. I think that is due to their having a high resolution, for example of 300 dpi, which results in additional scaling when they are added to Storyspace. It did not happen in this document.
One feature which I will be adding to this hypertext is the ability to click on any of the scaled images and see a full-sized version of that image in Preview; I have previously detailed how to do that, and will add that next. That increases storage requirements, of course, and my preferred solution is to put those larger image files in a separate folder.
It would also be good to add more text links – for example, in the discussion about the narrative success of the paintings, it would help the reader to be able to link out to view each painting as it is discussed. The snag with doing that is providing an easy way to return the reader from the painting to the original writing space. We have considered ways of doing this in previous tutorials here, but the simplest will hopefully be a command built into Storyspace, as there is now in Tinderbox.
I welcome your comments on this, and your responses to using the hypertext document.
If you can spare the time, I would be grateful if you could read my original article here, created using linear HTML in WordPress, and compare your reading experience with that of the hypertext version. It is hard for me to judge, being the author of both, but I think the hypertext version is a much richer and more flexible experience: the sort of document that you enjoy spending some time exploring, and really getting to grips with Ovid’s story, the paintings, and their narrative techniques.