Geog 411-Lab 7

Came out nice - Didn't change too much. Added some external links to other sources on the splash screen and a few popups.

Here it is:
Lab 7

Tip: A Few Flash Tutorials

Although these tutorials aren't about doing things on a map, they are basic flash tutorials with cool ideas that can be incorporated into a map.

Keep in mind there are a million ways in flash to do the same things, so these are just some ways of doing things

Changing Colors in flash

Fade-in fade-out - This also has links to a few other cool and simple effects like zooming and masking

Mouse-over effects - pretty simple way for mouse over effects - could be used for showing data somewhere when mouse goes over city/country etc

morphing - a pretty simple way to learn how to morph - video tutorial too.

I'll add more as a find them. Hope it helps a bit

Professional Effects

"Professional Effects" contain an endless amount of tricks and artistic effects that make a map look just that...professional.

With what we've learned in class so far, we are already able to make maps similar to those maps we see published on NBC, CNN, and other great map sources.

Shape Tweens, Motion tweens, timeline control and basic scripting are all we need to make the basics. It is the little details now that turn a map from a basic map, to a professional looking map.

Here are some examples of things that make a map look good:

http://www.nytimes.com/ref/world/20070622_CAPEVERDE_GRAPHIC.html

Starting off with a simple map. This map looks very clean and neat, mainly due to its simplicity. Although it has alot of information, it is very easy to navigate.
One of the things the publisher did for this map to make it look as professional as it does was to simplify everything.
-Lines are thin and neat.
-White space is very balanced.
-Very simple and good looking interactive controls (the tabs at top) - easy and intuitive to use.

---

http://www.nytimes.com/interactive/2008/06/09/business/20080609_GAS_GRAPHIC.html?scp=8&sq=map&st=cse#tab1

The NewYork times loves making simple maps. Little things in this map that add to its professional look include:
-quick fading in and out when switching from dataset to dataset - Easy to do, tweens with alpha changes do the job

---

http://www.eyesondarfur.org/satellite.html

This eyesondarfur map looks very nice.
-The contrasting colors add alot of visual appeal - the way they have boxed in the map, and the layout of the whole scene works very well.
-ZOOMING - the zooming effect is very appealing. It allows you to start with a far view of the land, and zoom in to the a desired level. Tweens (enlarging a base map) make this effect very easy to create.
-Blur Effects - sometimes when switching from one set to another, a different basemap must be used - adding blur effects give an impression of a satellite refocusing, making the map seem more 'real'
- Again, similar to the NYTimes map (and most other good looking maps), objects fade in and out quickly, instead of just appearing on the page.

---

http://www.washingtonpost.com/wp-srv/world/interactives/sudan/?hpid=artslot

I know we already looked at this map in class, but the little details in it make the map look so good. I'll name a few 'artistic' effects that make this look professional, whethere the map be static or dynamic
-Drop shadows on boxes make the objects stand out - gives map depth
-Borders around countries of interest define an area for our eyes to focus - choosing right size, color and alpha make this work!
-Land effects - showing mountains, rivers, etc from satellite imagery or drawn images and make more appealing and again add depth
-Layout, this makes or breaks a map I think. a fluid and well thought-out layout works well, plan this!
-Font - I love typography. The font you select, how you space it, size it, etc does alot to the look of a map (or any other design for that matter). Although the computers in the geog lab don't offer a huge list of fonts, we still have alot of work with.
Some typgraphy hints:
-Use fonts that work with what you are presenting. Somethign old or classical or historical might use some script fonts, or fonts with serifs.
- More modern designs might call for straight fonts. simple and square or rounded
- When using multiple fonts, use fonts that are the same and/or fonts that contrast. Avoid using fonts that are very similar but not. Viewers might think its a mistake.

I guess thats all for now, if I think of other things i'll post them up

Geog411 - Lab 6 - Operation Barbarossa

Flash 6 is finally complete. Although I originally liked how it was coming out, I didn't like the end result. Maybe it was because I looked at it too much. Or maybe not looking at it for most of spring break and coming back to see it didn't help.

Either way, here it is:



Little details make this map look good I think. The faded Country borders on the side. The glow of the borders on the main map. The textured land effect, and small alpha effects throughout make it look smooth. The animations themselves are decent although mapping this was difficult due to multiple data sets and undefined boundaries (Countries were different back then than these borders show).

I Added the question mark button which showed some map info (like on my previous lab) but realized in retrospect that I did not fill it in and is full of dummy text.

GEOG411 LAB: Lab 6 in the works

http://mason.gmu.edu/~jgonzalf/german_invasion_newmap3.html

hints, ideas, questions?

Map Find: Pangea and Continental Drift

Just a google search for maps of Pangea and continental drift brings up a ton of flash-based maps. Most of these maps are very basic and use only motion and shape tweens.

Here's a couple:
http://www.suu.edu/faculty/colberg/Hazards/PlateTectonics/18_Pangaea.html
http://education.sdsc.edu/optiputer/flash/pangea_4.htm

Flash Tip: Easy Timeline Controls

Gotta quick tip for you guys which I also used on the NFL schedule lab also (does it count as cheating?)

Easy way to create timeline controls
now, this trick doesnt work in every situation, especially when you have movies inside movies to make your timeline smaller, but if you have everything on the main timeline (all motions, tweens, etc), here is an easy way to add control to it.

1. Create a layer named TimelineControl.
2. On the first frame in that layer, add buttons that you want to have (stop, play, next, back, rewind, etc)
3. Insert a frame at the very end of your movie (this will make all the buttons span along the whole movie, but only uses 1 'big frame'
4. Now, back to your first frame, and say for example, we want a next button:
-select your next button
-Open the actions window (The diagonal arrow, F9, or Window > Actions)
-Type in this code:

on (release) {
gotoAndStop (_currentframe+5);
}

Thats it. You now have a next button.

This is most helpful if you want your button to move ahead or back a certain amount of frames. If you want just to move a frame forward or a frame back, on click, nextFrame(); would do the job. (and previousFrame(); )

How it works?
Actionscript is a pretty powerful yet simple programming language that follows the idea of most other object oriented programming languages (Java, C++ etc).

"_currentframe" is a flash variable that is updated by flash as the movie plays along, updating the variable to be the current frame that the movie is in. When we do _currentframe+1, we advance the movie by 5 frames, changing this to _currentframe-5 makes us go back 5 frames

Creating play and stop buttons are easy, on click or release, either do "stop();"or "play();"

Hope this helps - if you guys have any questions feel free to comment

GEOG411 Lab5: Invasion of Russia

Here it is in progress. It is still pretty rudimentary information wise, but design-wise its getting to where i wanted it to be. I must say, using CS4 motion tweens really makes it easy to change paths along the timeline quickly.

LAB 5 (IN PROGRESS)
http://mason.gmu.edu/~jgonzalf/lab5.html

Map Find: Iditarod 2008 Trail Map

It seems that I'm all about simple maps that show lots of information outside the mapping area when the map is interacted with. Take this map for example: http://www.iditarod.com/flashmap/

The map itself is very simple. The Iditarod checkpoints can be clicked for more information on them, as well as the legs of the trip. It looks like during the race itself, the map was updated constantly to show the current standings (possibly XML). Again, pretty simple, but full of information.