I’m looking for a flash expert to build an interface to navigate a large map. All artwork will be supplied as a high-res layered photoshop file – a low-res sample image is attached to give you an idea of what you’ll be working with.
1. The default view will be zoomed right out and cropped to 605×330, so you can see the whole map (no panning). There will be two zoom levels, shown in the attachment. The cursor will either be a magnifying glass with a ‘+’ or a ‘-’ depending on the zoom level. Clicking anywhere on the map (except a location title) will zoom in or out.
2. When zoomed in, the map will pan depending on the mouse position (eg pan left if the mouse moves near the left edge of the screen, or pan up when the mouse is near the top.
3. There are approx 15 locations on the map – you will need to define ‘hotspots’ for these areas, and when the mouse moves over them, the relevant title graphic displays, and bounces up and down slightly. All title graphics will be supplied, so you just need to make it interactive. Each title will link to a url when clicked on.
4. There is also a night-time version of the image. Is it possible to detect the user’s time of day, and then display either the night or day version accordingly? There would need to be a small button that toggles between these versions – they should fade into each other when clicked. Eg if you are viewing the day time version, and you click the toggle button, it slowly fades into the night version.
5.Full screen version – I’m not sure how this works so let me know in your bid or private message. Ideally it would be a button, and when clicked the map expands to full screen. The same way you can view a youtube video fullscreen by clicking a button on the viewer.
6. Additional animation – we would love to have some subtle effects such as clouds moving, trees swaying, water rippling or waterfall moving – let me know in your bid if this would be possible, or how much extra it would cost.
Other details:
- The full source image will be approx 3500x1800px and around 1-1.2MB when optimised.
- Whenever loading is required, show a suitable loading animation
- The whole thing needs to be 605x330px.
- An MP3 file will be provided which will need to loop in the background
When you hover over icon
- The image will be in the website header, and displayed on every page in the website, so it is important that the user doesn’t have to download the whole thing each time – it needs to be cached somehow. Perhaps initially just load a jpg of the zoomed out version, along with an overlayed message saying ‘click to get started’. So it only loads the big image when the user wants to. Once the big image is loaded the whole thing should run smoothly as possible.
- You will need to have a good understanding of jpeg optimisation, it needs to have the perfect quality vs file size balance.
- I will need to be supplied with the source .fla file
I look forward to hearing from you – this will be a great project for your portfolio!