Mashing Up Google Maps

To better support our users in finding free food, we are attempting to integrate Google Maps into the event view, which will let users find directions to events easily. Each Facebook network has its own map with a unique geographic point and zoom level. When a user is creating an event or importing an event to Moocher for a network, they will be prompted with the option to pinpoint the building/location of the event with a Google Map box that is automatically zoomed to their campus. Moocher stores the latitude and longitude of the mouse-click for reference.

When users are viewing an event with location data, the page will display a Google Map centered at the location of the event with a link to receive further directions from Google Maps. To enable the use of Google Maps within Facebook , we nested the scripts that Google Maps uses inside of an iFrame. Using PHP’s get() and set() methods, we are able to pass variables between our database, Google Maps applet, and the Moocher Application. The API is located at http://code.google.com/apis/maps/ and contains useful tutorials and code examples.

Organization

Our team meetings are extremely organized for efficiency. When we all arrive, we all go around and discuss what each person has done so far as well as what needs to be done, and I (Amritha) take detailed notes for that particular meeting. All the notes from every meeting go into our digital dropbox folder labeled "Meeting Notes," so group members can access the minutes from any meeting we've had in the past. For every meeting we make sure to book a meeting room so we can take advantage of whiteboards so we can map out remaining tasks and clarify requirements.

Wireframing with Omnigraffle

We created the wireframes for phase 2 with OmniGraffle, a diagramming application available exclusively on macs. The advantage of using OmniGraffle over other wire framing applications such as Visio and Illustrator is that it has a greater variety of stencils that contain premade drag and drop-able image elements. This makes the wireframing process much easier because you do not have to actually design most of the elements. There are also a lot of custom made stencils available online in addition to the presets that came with the program. For our wireframes, we used a set of Facebook stencils from Graffletopia as well as several other stencils containing various common UI elements.