Skip to content

tooobening/northern-palette

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

73 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

20_g575_northern

Team Members

  1. Shujin Wang
  2. Yuning Liu
  3. Tambre Hu

Final Project Proposal

  1. Persona/Scenario

    1. Persona
      • A photographer is working for the National Geographic. He has been always interested in spectacular landscape around the world in the nature. The special column he is currently working on is about the diversity of northern lights. Before heading off a trip chasing for lights, it would be better if some patterns of northern lights have been explored. He would like to delve into some data which is present-to-date. For example, which places is closest as well as most popular for him to have the chance to collect the photos of the northern lights, where is most travellers are going to take the photos of the unique pink northern lights and which months most photos of the northern lights are taken by people. These interesting questions are some of the topics he may want to figure out. That is, he needs to rank and compare several sites where these spectacular images are clustered geographically. By using this interactive map, he also might inspect the trend of the northern lights happening, such as which month presents the peak of people taking those photos and posting on social media.
    2. Scenario
      • Scenario: Upon entering the website, the user reads an introduction to the northern lights and he is encouraged to explore the distribution of northern lights close to a user specified location in North America. He becomes curious about what could be watched nearby home so he types in Madison. After clicking on the search button, he jumps to a map and flies to Madison. He identifies some clusters where the photos of northern lights were taken close to Madison by Flickr users. On the side panel for advanced options, he finds two statistical graphs. The first one is a donut chart that shows the frequency of each dominant color of northern lights within the extent. The user learns that green is the most frequent color. The donut chart is actually a filter controlled by attribute (the dominant color). The user clicks on green and blue to turn them off on the map. The second graph is a histogram showing the total number of photos taken in each month within the extent. The user finds the trend of the northern lights frequency throughout the year. The histogram also works as a filter controlled by time (binned by month). The user clicks on all bars except for March so that only photos taken in March remain on the map. He clicks on one cluster to retrieve the photos in a new side panel. He checks on the options of sorting the photos by views (from most to least) and dates (from newest to oldest), and gets amazed at a stunning photo on the top. He clicks on the photo to zoom into the location on the map and pans to find it very close to Mackinaw City in North Michigan, a good place to stay overnight if he goes for the beautiful blue northern light during the spring break. He clicks on the location and then the navigate button to open directions in Google Maps to calculate the route from his home to the destination.
  2. Requirements Document

    1. Representation/Interaction

      Image of Representation

  3. Lo-Fi Wireframes

    1. Webpage Wireframe

    Scenario #2 Wireframe

    1. Mobile Wireframe

    Scenario #2 Wireframe

About

Interactive search map - help you find the northern light near you @2020

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 98.5%
  • Other 1.5%