TWiki
> Main
>
UsingImagesInAMediascape
Using images in mediascapes
Images are handled in a similar way to audios when creating a mediascapes.
Image size and format
Mscape mediascapes use images in the following formats
| jpg*/*jpeg |
This format is excellent for photographic imagery is generally recommended |
| gif |
Line drawings tend to come out looking best in this format |
| bmp |
This format is uncompressed, so the file sizes are large. It's not recommended to use BMP |
The mscape maker and the mscape player will ensure that the image will always be fitted to the size of the screen and shown in full, however it is best to try and match your images to the size of the screen of your mobile device. The usual screen size is
320 by 240 pixels for screens in a landscape or
240 by 320 for a portrait.
 Do not directly import large images into your mediascape. mscape will helpfully fit images to the size of the screen, but large images (such as those straight out of a digital camera) may be slow to load, or in some cases may not load at all on your mobile device even if the image appears without issue when using mscape tester. We recommend using a program (such as the excellent free Photoshop alternative Paint.NET) to scale down your images to the size of the mobile device screen (usually 320x240) before importation into mscape. |
Other considerations
Legible text - If you are making your mediascape available to others, for example through the mscapers.com web site, then they may be using them on hardware that is somewhat different to yours. In particular the screen could be smaller. So if you are using images that incorporate text make sure that the text is very legible as it may get shrunk down. Alternatively consider using HTML for doing the text as this will have less text shrinking issues (see the section ‘Using HTML in mediascapes’)
Screen format - Also bear in mind that the dimensions of the screen may be different. In particular it may be a square screen which will mean that the image will get shrunk. By default it will stay the same shape and there will be black space around it. You can change this by using the properties of the Images object.
Using hotspots in an image
Very often designers of mediascapes want the user to be able to click on a button. While there are many ways of doing this with HTML and Flash and so on, there is an extension to the image object that offers a very simple solution.
A hotspot is an invisible rectangular area of a displayed image that can generate an event when the user taps on it on the screen. The event script associated with this event can then be used to perform various operations (such as playing audios, showing other images etc.).
You add a hotspot to an image by right clicking on an image in the left hand panel. Then you select the 'Add Hotspot' menu option. This adds an invisible clickable area to the image. The X and Y coordinates and the width and height can be adjusted in the properties panel of the hotspot object. However, they are set by default to cover the whole image so that the hotspot is triggered wherever the user taps on the image.
In the event script associated with this hotspot (bottom right panel with 'OnTapped' event showing) you can add actions to be performed. For example you could add the line 'myimage.Show();' to show the image in the mediscape called 'myimage'.
Creating a Mediascape Using Mscape Maker explains how to import images and show them when the user enters a real-world area. 