About Andrew Pogany

Graduate, Masters in Library & Information Studies; Informatics.

Week 10: Launching GeoStories

It’s with great pleasure that we announce the quasi-official public launch of GeoStories!

GeoStories-Home Page

GeoStories is an easy-to-use and versatile story-mapping platform that enables users to create personal narratives around the places they’ve been and the experiences they’ve had there.

The site’s simple, streamlined interface allows users to pair their personal thoughts with meaningful images or videos pulled from the media site(s) of their preference (Picasa, Flickr, YouTube, Vimeo, etc.), almost instantly transforming the ubiquitous digital map into a personal memoir, descriptive genealogy, historical non-fiction, or lighthearted travel journal.

Audience
GeoStories can be used by a broad swath of the academic and civilian population–anyone looking to connect, contextualize, and share the many remarkable moments and memories of their lives. The GeoStories site represents a small but important step in making the educational mapping tools of academia available to a larger public, and yet, can still be used in developing the kind of rich historical narratives needed for research purposes.

Team
GeoStories is a start-up funded by E.Y. Ventures and founded by Uyen Ngo and Andrew Pogany. As Chief Experience Officer, Ngo has dedicated her considerable time and expertise to the design and programming of the entire GeoStories site. She also created two instructional videos. As Senior Story Teller, Pogany has contributed to the site’s concept and content. He also created a video, and led the integration of Google Places.

Design History
The GeoStories interface began as a slightly highfalutin concept, one that sought to use an ornamental frame as the border of our central map.

GeoStories-First Interface Concept

After recognizing the limits of our time, funding and technical know-how, we simplified the interface, stripping it of any excessive aesthetic concerns and focusing primarily on functionality.

GeoSories-- Beta Story Board Interface

Feeling as if this was a solid base to build upon, we did just that: focus on adding functionality and increasing usability until whipping the GeoStories site into its present form.

GeoStories--New Story Board Interface

How It Works
You begin creating your geostory from the GeoStories Story Board. Upon entering the Story Board page, the user is greeted by a pop-up window of useful instructions.

GeoStories-- Instructional Modal

The Story Board consists of three functional tabs: Story Board, Table of Contents, and Related Places.

Each geostory is built of chapters; each chapter represents a different location; and each location can be detailed with personal thoughts and narrative text, as well as imagery or video.

As each chapter is completed, you’ll see a numbered icon representing the chapter appear in the GeoStories map display. Clicking on the icon will reveal the full, multimedia description of your experience.

Additionally, as each chapter is completed, GeoStories creates a corresponding button underneath the Table of Contents tab.

Each chapter can then be enriched by clicking the Related Places tab, which will display those Google Place categories related to the chapter’s location. These can be toggled on and off.

Once all the desired number of chapters has been written, and the user hits the Publish button, the map display zooms out to reveal all chapter icons, numbered and linked—a narrative constellation that can be explored and shared.

Likewise, the Table of Contents tab will then contain buttons for all chapters, providing an additional way of manually navigating back and forth within the geostory.

And additional navigation is provided by “Next” and “Previous” buttons within the chapter info windows.

Key Functions and Technical Documentation

1. User-Generated Map: GeoStories is ultimately a tool by which users can quickly become authors of personalized, multimedia, map-based narratives. Fundamental to this function is the use of the Google Maps API, as well as the Google geocoder, which enables a non-specific location entered in the Address input to be almost instantly translated into latlong coordinates and mapped.

2. Media Upload: Popular online media management sites such as Flickr, YouTube, Picasa, and Vimeo provide image and video links for content owned by the user or deemed available for public use. Presently, GeoStories users must copy and paste the appropriate image or video link into the Pictures/Video input on the Story Board. They also have the option of including the embed codes of images and videos in the Description input.

3. Navigation: Users can navigate through the stories they’ve created using chapter buttons in the Table of Contents or “Next” and “Previous” buttons in the chapter’s info window. Table of Content buttons were coded with the help of Bootstrap; info window buttons uses the same Modal as the Instructions Pop-Up referenced below (#5). Both the Table of contents and InfoWindow buttons allow a user to move seemlessly (and non-linearly) through the story chapters.

4. Google Places: Along with Google Maps, GeoStories utilizes the Google Places API to populate the “Related Places” tab on the Story Board page.Users can search for different places of interest related to each individual chapter and its corresponding location, thereby enriching the narrative and providing GeoStories with additional functionality that widens its potential uses.

5. Useability: User experience is of utmost importance to GeoStories. That why created several instructional videos (using iMovie), a FAQ page, and an Instructional Pop-Up that appears each time the Story Board page accessed. The Instructional Pop-up was created using code for a standard modal, a “child window” that requires users to interact with it before they can return to operating the primary application.

6. Design: The GeoStories site was programmed using HTML, CSS, and Javascript. Our design code was aided considerably by BootStrap, as well as the friendly technicians at EY Ventures.

Challenges
It’s been a sharp learning curve for this 2-person team. A lot of the brainwork/coding was from Yoh. Because of the unique nature of our website, we weren’t able to always work off what we learned in class and had to rely on the genius of Yoh/Erin/Ryan. We’re very grateful for that, but wish we had more tools ourselves to do more of the foundational work.

Future Changes

1. Social Media Connection: The next iteration of the GeoStories site will necessitate a user to sign in with either their Google, Facebook, or Twitter accounts before being able to create or open stories. This will in essence set the user up with a GeoStories account. after acquiring an account, users will be able to enter the Story Board page and create, open, or share a geostories. T

2. Saving Stories: Once an account is established, users can also store their stories. Saved stories would appear in the Library page of the GeoStories site, from which the user can choose to share(via social network), delete, or edit their stories. Establishing such a library requires advanced server-side scripting.

Week 9: GeoStories — Final Update

We are pleased to announce that GeoStories is proceeding according to (most of) our plans.


GeoStories is still all about connecting—and contextualizing—our many remarkable moments and memories. The site’s simple, streamlined interface allows users to pair their personal thoughts with meaningful images or videos pulled from the media site(s) of their preference (Picasa, Flickr, YouTube, Vimeo, etc.), almost instantly transforming the ubiquitous digital map into a personal memoir, descriptive genealogy, historical non-fiction, or lighthearted travel journal.

    How It Works

GeoStories still works the same way, except we’ve added several functions that improve navigation and user experience.

As before, you begin creating your story chapters from the GeoStories Story Board. However, you’ll notice that the Story Board is now one of three functional tabs.

Each geostory is built of chapters; each chapter represents a different location; and each location can be detailed with personal thoughts and narrative text, as well as imagery or video.

As each chapter is completed, you’ll see a numbered icon representing the chapter appear in the GeoStories map display. Clicking on the icon will reveal the full, multimedia description of your experience.

Additionally, as each chapter is completed, GeoStories creates a corresponding button underneath the Table of Contents tab.

Each chapter can then be enriched by clicking the Related Places tab, which will display those Google Place categories related to the chapter’s location. These can be toggled on and off.

Once all the desired number of chapters has been written, and the user hits the Publish button, the map display zooms out to reveal all chapter icons, numbered and linked—a narrative constellation that can be explored and shared.

Likewise, the Table of Contents tab will then contain buttons for all chapters, providing an additional way of manually navigating back and forth within the geostory.

    Key Functions

1. User-Generated Map: GeoStories is ultimately a tool by which users can quickly become authors of personalized, multimedia, map-based narratives. Fundamental to this function is the use of the Google Maps API, as well as the Google geocoder, which enables a non-specific location entered in the Address input to be almost instantly translated into latlong coordinates and mapped.

2. Media Upload: Popular online media management sites such as Flickr, YouTube, Picasa, and Vimeo provide image and video links for content owned by the user or deemed available for public use. Presently, GeoStories users must copy and paste the appropriate image or video link into the Pictures/Video input on the Story Board. They also have the option of including the embed codes of images and videos in the Description input.

3. Connecting The Dots: GeoStories does not present individual locations as separate entities of no (explicit) relation. Its Story Board interface allows for users to attach text and media to specific locations, and then connects those locations using numbered icons and lines, thereby guiding the reader to consider each location, or chapter, as part of a larger sustained narrative. Each chapter is also now represented as a button within the Table of Contents tab, allowing for additional navigation controls.

4. Google Places: Users can now search for different places of interest related to each individual chapter and its corresponding location, thereby enriching the narrative and providing GeoStories with additional functionality that widens its potential uses.

    Notable Challenges

1. Table of Contents Design: The coding necessary to automatically create buttons within the Table Of Contents tab each time a chapter is created was complex.

2. Google Places: Making the Google Places checkboxes and markers appear took much massaging; making them clear and reload each time a chapter changed was even more difficult. Learned a lot in the process…

3. Saving Stories: It seems we may not be able to implement this prior to final presentation…

    Future Improvements

1. Navigation Buttons Within InfoWindows.
2. Transition from Story Board to Table of Contents upon hitting the “Publish” button.
3. Additional introductory instructional videos.

GeoStories Week 8 Update

Here at GeoStories, we’ve taken the constructive feedback we’ve received from our peers and EY Ventures and are moving forward by addressing the following issues:

1. Creating a “Table of Contents” : A form that consists of buttons that represent the chapters a user has created in the “Story Board” section of the site. Yoh has courteously set us on the path towards creating the necessary function.

2. Navigation Buttons Within InfoWindows: Advancement in this area requires that Issue 1 first be resolved.

3. Saving the Story: The way to save individual stories so that they can be accessed, edited, and shared later apparently requires the use of Server-Side Scripting, which, we have been advised, is presently beyond our pay-grade. And so we search for a way to capture a story via its URL.

4. How-To: We want to create instructions on how to use the site.

5. Angling the Brand: Is their a unique way to position GeoStories so that it stands apart from its most obvious competitors (HistoryPin, TripLine); is it necessary to do so, or is the generic, stripped down nature of GeoStories an advantage?

Till next time…

Introducing… GeoStories !

We are pleased to announce the beta launch of GeoStories.com, a social story-mapping platform that enables users to create personal narratives around the places they’ve been and the experiences they’ve had there.



GeoStories is about connecting—and contextualizing—our many remarkable moments and memories. The site’s simple, streamlined interface allows users to pair their personal thoughts with meaningful images or videos pulled from the media site(s) of their preference (Picasa, Flickr, YouTube, Vimeo, etc.), almost instantly transforming the ubiquitous digital map into a personal memoir, descriptive genealogy, historical non-fiction, or lighthearted travel journal. The GeoStories Introductory Video gives a colorful and concise overview of the process. It should also be noted that much of the information included here is available at the GeoStories FAQ page.

    How It Works

You can begin creating your story chapters from the GeoStories Story Board.

Each geostory is built of chapters; each chapter represents a different location; and each location can be detailed with personal thoughts and narrative text, as well as imagery or video.

As each chapter is completed, you’ll see a numbered icon representing the chapter appear in the GeoStories map display. Clicking on the icon will reveal the full, multimedia description of your experience.


Once all the desired number of chapters has been written, and the user hits the I’m Done button, the map display zooms out to reveal all chapter icons, numbered and linked—a narrative constellation of your own making, ready to be explored and shared.

    The Team

GeoStories is a start-up funded by E.Y. Ventures and founded by Uyen Ngo and Andrew Pogany. As Chief Experience Officer, Ngo has dedicated her considerable expertise to the design and programming of the entire GeoStories site. She also created the awesome Introduction video. As Senior Story Teller, Pogany has contributed to the site’s concept and content.

    Key Functions

1. User-Generated Map: GeoStories is ultimately a tool by which users can quickly become authors of personalized, multimedia, map-based narratives. Fundamental to this function is the use of the Google Maps API, as well as the Google geocoder, which enables a non-specific location entered in the Address input to be almost instantly translated into latlong coordinates and mapped.

2. Media Upload: Popular online media management sites such as Flickr, YouTube, Picasa, and Vimeo provide image and video links for content owned by the user or deemed available for public use. Presently, GeoStories users must copy and paste the appropriate image or video link into the Pictures/Video input on the Story Board. They also have the option of including the embed codes of images and videos in the Description input.

3. Connecting The Dots: GeoStories does not present individual locations as separate entities of no (explicit) relation. Its Story Board interface allows for users to attach text and media to specific locations, and then connects those locations using numbered icons and lines, thereby guiding the reader to consider each location, or chapter, as part of a larger sustained narrative.

    Notable Challenges

1. Interface Design: Coding of the input page was moderately complex, especially when trying to figure out how to add imagery or video to the same pop-up window as the text included in the description box. Also, understanding how to connect map icons with a visible line required assistance.

    Future Improvements

1. Saving Drafts: The GeoStories team will be looking for a solution that will allow for the saving and editing of incomplete stories.

2. Library Upgrade: Every story, once completed and fully mapped, should automatically be saved to the GeoStories library. The GeoStories team will look to allow story authors to obtain links for each of their stories, or share directly through the social network of their choosing.

3. Additional APIs: GeoStories presently incorporates the Google Maps API. Future manifestations of the site will potentially incorporate the APIs of various online media management sites such as Flickr, YouTube, Picasa, and others to facilitate enhanced uploading capabilities. Additionally, GeoStories will look to potentially incorporate the APIs of relevant social networks, such as Facebook and Twitter, to enable sharing.

Week 2: Website Asssignment – Andrew

5 new Metro Rail locations — beginning from Wilshire/Highland and running along Wilshire until Wilshire/Lincoln — creating a train that can take a passenger from Hollywood to Santa Monica. Fixed the styling of text within the pop-up windows, and played a little with adding text in the side panel. Would like to have figured out how to give each business a distinct graphic node, or at least how to size the different nodes so that the Metro Rail location nodes (red) don’t completely overshadow the business nodes (blue); looking forward to playing with Google Earth some more, as the “Tour” function seems especially promising for creating narrative…

http://www.yohman.com/students/2012/andrew/Assignment%202/maproom2.html

Week 1: Website Assignment

5 Nodes representing 5 new stops for the Metro Rail line. These 5 nodes (light red) run East to West along Wilshire, from Wilshire/Highland to Wilshire/Lincoln, ostensibly representing the Metro Rail’s expansion from Downtown to the Sea, which, in reality, would certainly be useful. If you mouse over these 5 nodes, it should say “New Metro Rail Stop,” allowing you to tell the difference between my nodes and that of the KML layer of all existing Metro stops.

Site Review: HyperCities Egypt

I’ve always really enjoyed the concept and execution of HyperCities Egypt, which connects the content of individual tweets to their specific location within a designated geo-spatial area. HyperCities Egypt allows for the real-time display of tweets, and also allows a user to review past tweets of a specific date in time.

By locating real-time tweets (and tweeters) within a geo-spatial construct, the map (Google Map API) acts as a multidimensional social news feed, connecting people and commentary with a particular location in a particular time. By allowing one to search through past tweets of a past date,  the site acts as a historical archive of social, born-digital commentary.

Not sure, but I think HyperCities Egypt was created to provide access to the tweets of those activists during the Tahrir Square protests; ostensibly, a real-time tweet-map could be quickly established for events/epochs of public uprising in any given city, providing the local community and global info industry with the means to gather nuanced details from people on the ground and in the action. In this model, news “trickles up” from citizen journalists, rather than trickling down from media punditry—a powerful reversal of the dominant news media paradigm.

Site Review: “Digital Harlem”

Digital Harlem: Everyday Life, 1915-1930” is a web-based project that aims “to produce an ethnographic study of everyday life in Harlem as it became the black capital of the world.” The research project of four University of Sydney historians— Stephen Robertson, Graham White, Stephen Garton, and Shane White—the project has garnered critical praise throughout the scholarly community. “Digital Harlem” is the recipient of the American Historical Association’s 2010 Roy Rosenzweig Prize for Innovation in Digital History and the 2011 ABC-CLIO Online History Award.

Through a dynamic, multifaceted search interface, Digital Harlem provides an engaging, user-oriented research environ through which scholars and enthusiasts alike can access the project’s archive of ethnographic data. I believe the success of Digital Harlem is largely due to the simplicity of its layout, the ease and specificity of its search query form, and, of course, the unique implementation of its geo-spatial overlays. The site was created by the Arts eResearch team of the University of Sydney, programmed in XHTML and CSS and utilizing the Google Maps API.

At the  center of the Digital Harlem site is a reference map of present day Uptown Manhattan. The boundaries of 1915-1930 Harlem, shown in purple, appear as a large region within the central map. This is in fact a vintage map overlay of individual buildings made up of plates from the “Atlas of the City of New York, Borough of Manhattan,” Vol. 4 & 5, published by G.W. Bromley & Co. in 1932 (detail shown below). The actual boundaries are based on maps in Gilbert Osofsky’s, “Harlem: The Making of a Ghetto” (1971) and James Weldon Johnson’s, “Black Manhattan” (1930). The overlay’s function, in a sense, is to provide a historically accurate portrait of the neighborhood; it also juxtaposes the historical boundaries of Harlem (as evidenced in the vintage map) with the present-day boundaries of the neighborhood (as evidenced in the Google-provided basemap), bringing to light spatial insights that might not otherwise have been recognized.

Perhaps the most interesting function of the Digital Harlem site lies in its faceted search query form whose three top level categories—Events, People, Places—can be searched across using a variety of inputs, including date, occupation, race, gender, and street intersection. Before the search results display on the map, the user is asked to name the layer. Upon doing so, graphic nodes representing the queried data appear on the map. Each map layer is temporarily saved, and able to be toggled on and off in the “Layers” viewer (shown below), housed in the Content Sidebar on the right of the central map. This unique function of the search query form allows for the almost instant creation of overlays specific to the user’s queries, in essence allowing users to finely curate their own nuanced data sample from the larger dataset and potentially glean insight into previously invisible relations amongst people, events, and places.

However, a map can only ever be as accurate, effective, or useful as the data it represents. Digital Harlem’s creators have utilized a wide variety of sources, though criminal records and legal files from the Manhattan District Attorney’s office comprise the majority of the information in the database. I strongly question the site’s considerable use of criminal records to describe African-American life in Harlem, as it problematically frames the people of Harlem in terms of their legal standing or criminality. The cultural activities or impact of a community cannot be determined by that community’s crime rate; thus, the map unintentionally skews our understanding of the community and its constituents.