This was my second time using Articulate Storyline, and I like the result much better.
My original plan was to take the scanned paper map of Disneyland on its opening day — July 17, 1955 — and make it interactive by recreating the exact color and shape of the numbered squares used to point to various attractions. The idea of bringing a mundane object to life appealed to me, as it meshed thematically with the concept of “Disney magic”.
When I was first deciding how to approach the map, Storyline’s “marker” feature seemed perfect. I had already set up a lot of them before realizing they were a legacy feature lacking a lot of the flexibility I had come to expect from Articulate’s programs. I couldn’t resize them at all, so the numbers were too small to read. I also couldn’t change the shape to square (to match the original map) or even teardrop “location marker” shaped, which seemed ridiculous, as that was actually their icon on the Storyline UI. The preview boxes also were difficult to work with — they could only “snap” into place in a limited number of angles, which meant they couldn’t be resized freely. It also made positioning the text in each bubble a nightmare.
I considered redoing each marker as an icon, with the photos on a separate layer brought up by clicking them, but that would have been a considerable amount of extra work for very little reward, considering I was completing this as a portfolio piece and wasn’t being paid. Instead, I decided to stick with the markers and remove the numbers, and make the best of the image box limitations. Because I couldn’t change the shape of the markers, I added the map-marker icon on them instead.
I downloaded two free fonts, one based on the old Disney shorts and the other based on the Disneyland Resort logo, as well as a song played on the Main Street USA area music playlist. I picked the colors and their locations on the map to be reminiscent of Mickey Mouse — red shorts with white buttons and yellow shoes. I thought about making the map grayscale to add to that effect, but I was honestly fascinated by the fact that the map was teal — a color that, as far as I know, has never really been associated with Disney — and decided to keep it based on that. I did, however, lower the brightness and saturation of the map to make the markers stick out more to the eye, while keeping the map itself legible.
I staggered the entrance of the markers and added a “pop” sound effect to make them aesthetically pleasing. I had to mess with the sound effects a bit to make sure each marker had a sound, as a sound won’t start again till it’s already finished, and the markers popped into being in intervals shorter than the length of the sound. I ended up duplicating the sound and alternating the files so they could overlap.
The aerial view had to be widened a bit in order to roughly fit the dimensions of the map, which wasn’t at all to scale. This meant a lot of the attractions I was marking didn’t line up in the map and the photo. It took some finagling to position the markers in a place where they could plausibly be pointing to either the map or the aerial location of each point of interest. I used cue points to replay the “popping” animations of the markers every time a user switched between the map and aerial views.
The problem with this was that going back to that point in the timeline also jumped back to the corresponding point in the background music, which was jarring, to say the least. I ended up moving everything except the music to another layer so that they could operate on independent timelines.
Getting the music to loop correctly was one of the hardest parts. Because the zoom effect used when navigating to the map isn’t a built-in transition or animation, I had to actually make it part of the timeline, and that meant that restarting the timeline to loop the song would restart the entire slide, including the zoom effect. To fix this, I added another copy of the song to the base layer with a cue point after the intro, and added a command to start that song from that point when the original song reached the end of its timeline.