Skip to content
Zhao, Xuan edited this page Dec 4, 2020 · 32 revisions

Description

Map tab provides an overview of the whole campus. User can see basic information of every building on the map. Users can customize their searches through 4 inputs selection. Based on the user's selection, the main panel will display a map with different markers or a table with just data. The map tab appears when first opening studysafe website. It can answer users several questions, like: Where is safer place to go right now?

Functionality

Interface Overview

  • When opening the website, the Map tab appears first. However, if user is on the other tab, hamburger (red circle) can be used to navigate between tabs.
  • There is a short tutorial (red rectangle) to teach users how to use map tab, and user can hide the tutorial anytime by clicking "-" in the upper right corner.
  • A selection panel (blue rectangle) is used to let users customize their inputs selection so that they can see different result map according to their needs. Map interface

Input Selection

Users customize their searches using the following 4 selections:

  1. Choose a display: Map or Table
    • Map: Show the map with markers with different colors.
    • Table: Show just data which has features: Total number of users, Max number of users, and Percentage of max.
  2. Choose a date: Select a date that you want to see the information on.
  3. Choose a time: Select a time that you want to see the information at.
    • User can also click "NOW!" to update date and time to latest automatically
  4. Choose a Building: Select a specific building, and then the marker corresponding to that building will change to star on the map.
    • This input selection is designed for users who cannot find the position of building they want to go on the map.

After selecting all inputs, user need to click "Update Graphs" to update the map unless user click "NOW!" to update date and time to latest.

Map display

  • The map has lots of markers with different colors, so there is a color legend (red rectangle) to show the meaning of colors. The percentage means how much the number of people in the building at this time compare with max users of the building through the semester. In the formula, (number of users/max number of users)*100%.
  • Users can zoom in or out to find buildings using "+" and "-" (blue rectangle) or just using mouse.
  • Users can click a marker to see the basic information of that building. After clicking a marker, there is a pop up (magenta rectangle) to show the info. Map