Interactive Map Project Final

http://mlc104.csumb.edu/classes/borgmorganl/deploy-to-web/Main.html

I found the user testing to be a very useful process. All of the feedback I got was constructive and helped make my project that much better. Beginning with the first test done by Gary, he suggested that I change the appearance of the states that are not interactive buttons. He also thought I should add a title to the project. When he tested it I had a polaroid box that pops up and another box pops up next to it if you click a “read more” button. He suggested I turn this into a scroll box instead to make it more user-friendly. The second user was Aaron and he also had good suggestions. He also thought I should expand the text so I don’t have two separate boxes. He also advised to make a legend for the colors of the states so people knew what the theme was. There were a few other suggestions that could have potentially been good, but I did not have enough time to do this.

To begin, I used Illustrator’s pen tool to trace the map that I would be using. I selected colors with the eyedropper tool that I wanted to use for the states. I then imported that into Flash Catalyst. I used an app on my iPhone to turn my images into a polaroid. After emailing them to myself, I used the text tool to add the name and title. I also used the text tool to add facts onto another blank polaroid directly below the picture polaroid. In Illustrator I also used the pen tool to design my scrollbar. I pasted the pictures into Flash Catalyst for their respective states. Then I used the component tool to make the scroll bar and scroll box work. I also use the component tool to turn states into buttons. I used the pen tool in Illustrator to create a legend. For this I had to use the eyedropper tool. Lastly, I added a drop shadow to each scroll box and the title.

Finished Illustrator Map in Flash Catalyst

Beginning adding some states and their boxes.

All states done, title, and legend


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s