Fork me on GitHub

Project Team SBN4: Connecting Members of SBN, DS 4200 S20

Jack Baxter, William Conti, Xuyang Li, Ken Ma

Service-Learning Course Project as part of DS 4200: Information Presentation and Visualization, taught by Prof. Dylan Cashman, Data Visualization @ Khoury, Northeastern University.

Motivation

The Sustainable Business Network (SBN) is a non profit organization aiming to create a community capable of sustainable local production and demand. This visualization will showcase the current members of the network, including types of members and a geographic representation of member distribution. It will assist in connecting not only local food buyers and vendors, but also members in fields such as financial services or energy and utilities within SBN.

This page will assist SBN in informing potentially interested people and help them learn about the members of SBN. As a local business network, SBN provides venues for a complex group of local businesses, ranging from commercial services to clean energy. When browsing through the visualizations we present, the user would be able to examine what kind of business are there, as well as where are they located if they have a physical location. They could also retrieve contact information of the business, such as a phone number or a directory to their websites.

Visualization

Interactive Visualization

Filter Treemap, Map and Table by selecting Map zip code and/or business type

Filter Treemap and Map by using Table and highlighting rows

Demo Video

Embedded MP4 demo video using the HTML5 <video> tag:

Visualization explanation

Final visualization screenshots (PNG images), design justifications, UI walk-through, and linked presentation slides.

Treemap

treemap

The treemap serves as a demonstration of categories of services available from members of SBN. A user could click a specific area of interest to show businesses from that category, such as members involved within the legal services industry; the main map will then filter to show only businesses of that type, and the table will be filtered to show only this category of businesses.

Geographical Map

map

The geographical map of massachusets will allow the user to see the location of a vendor, if it has one. The map used is a map of MA centered around Greater Boston Area, since this is where the majority of SBN's members located.

Initially, location of all SBN members will be presented on the map. If the user select a category from the treemap, the locations where a vendor of that type is located in will be highlighted. If rows of the table is selected, location of those vendors will also be highlighted. This map will provide the user an impression of where the members of SBN are located.

Table

table

The scrollable table shows a detailed collection of all information for a vendor, including the specific product or service, the address and the zip code, the phone number as well as the website. The table will serve as a directory for users to visit or contact the vendor of their greatest interest. The user could also select rows of table in order to view the location of the vendors on the map.

Static Example: Selecting all shops for one category

static ex1

As the user click on a category (Light blue - Food Product for this case), areas with this category will be highlighted on the map, table will also be filtered to all vendors of this category.

Static Example: Selecting shops for a location

static ex2

If the user click on the map (the circled area), the table will be filtered and show members located at that area. The categories of members will also be hightlighted on the treemap.

Static Example: Selecting shops from table

static ex3

When the user select rows from the table, the locations of members selected will be highlighted on the map. This will allow the user to quickly get an impression of the members' geographical information.

Data Analysis

Task Analysis

Design Process

Conclusion

The above visualizations allows the users to achieve several domain tasks, such as identifying informations of a member providing certain type of service; it also allows the potential members of the SBN to examine the current network presented, both the geographical connection as well as the categorical diversity. It could also provide the SBN with a platform to showcase the members within the network. We employed ample amount of multi-directioned brushing and linking, allowing the users to interact with the visualization, carry out searches based on their needs.

For future work, the interaction could be enhanced. For instance, it would be helpful if the user could zoom into a specific area of MA. With a dynamic geographic map, the user could avoid certain obstacles, such as the location of the vendor is sometimes too small and might be hard to see from the bigger map. Furthermore, the map could be more specific, providing more detailed representation down to street address or present the density of members in an area with chromatic color.

Acknowledgments