{"id":9856,"date":"2018-07-15T02:52:05","date_gmt":"2018-07-15T06:52:05","guid":{"rendered":"http:\/\/studentwork.prattsi.org\/infovis\/?p=9856"},"modified":"2019-01-11T00:07:14","modified_gmt":"2019-01-11T05:07:14","slug":"the-62-dolphins-network-visualization","status":"publish","type":"post","link":"https:\/\/studentwork.prattsi.org\/infovis\/labs\/the-62-dolphins-network-visualization\/","title":{"rendered":"The 62 Dolphin&#8217;s Network Visualization"},"content":{"rendered":"<div class=\"page\" title=\"Page 1\">\n<div class=\"layoutArea\">\n<div class=\"column\">\n<p><strong>Introduction<\/strong><\/p>\n<p>&#8220;Networks are not the same thing as &#8220;networking,&#8221; or actively using a network to make connections to further one&#8217;s personal goals. A network is simply a set of rela\u00adtions between objects which could be people, organizations, nations, items found in a\u00a0<span style=\"font-size: 1.0625rem\">Google search, brain cells, or electrical transformers. Transformers do not &#8220;network.&#8221;In this book we are concerned with social networks, and what passes through <\/span>this networks-friendship<span style=\"font-size: 1.0625rem\">, love, money, power, ideas, and even disease.&#8221; \u00a0<\/span><\/p>\n<p>&#8212;-Kadushin<\/p>\n<p>To visualize\u00a0a network is not only visualizing data but also visualizing the relationships\u00a0between objects. How to make the visuals clear and communicative? Can we make the visual interactive?<\/p>\n<p><strong>3 Inspirations<\/strong><\/p>\n<p>1,\u00a0Game of Thrones discussions for every episode, visualized<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9858\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?resize=471%2C295\" alt=\"\" width=\"471\" height=\"295\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?resize=300%2C188&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?resize=768%2C482&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?resize=1024%2C642&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?w=1898&amp;ssl=1 1898w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?w=1680 1680w\" sizes=\"auto, (max-width: 471px) 100vw, 471px\" \/><\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"7tVwT30ZBN\"><p><a href=\"https:\/\/flowingdata.com\/2016\/06\/03\/game-of-thrones-discussions-for-every-episode-visualized\/\">Game of Thrones discussions for every episode, visualized<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" src=\"https:\/\/flowingdata.com\/2016\/06\/03\/game-of-thrones-discussions-for-every-episode-visualized\/embed\/#?secret=7tVwT30ZBN\" data-secret=\"7tVwT30ZBN\" width=\"600\" height=\"338\" title=\"&#8220;Game of Thrones discussions for every episode, visualized&#8221; &#8212; FlowingData\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>According to this, It is really visual-direct that the designer made the big space between each part. I think it makes the\u00a0network structure very clear.<\/p>\n<p>2,\u00a0Apple vs. Google company structure, as seen through patents<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9860\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Apple-vs-Google.jpg?resize=498%2C249\" alt=\"\" width=\"498\" height=\"249\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Apple-vs-Google.jpg?resize=300%2C150&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Apple-vs-Google.jpg?resize=768%2C384&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Apple-vs-Google.jpg?resize=1024%2C512&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Apple-vs-Google.jpg?w=1680 1680w\" sizes=\"auto, (max-width: 498px) 100vw, 498px\" \/><\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"Iggf97Ra0q\"><p><a href=\"https:\/\/flowingdata.com\/2017\/02\/28\/apple-vs-google-company-structure-as-seen-through-patents\/\">Apple vs. Google company structure, as seen through patents<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" src=\"https:\/\/flowingdata.com\/2017\/02\/28\/apple-vs-google-company-structure-as-seen-through-patents\/embed\/#?secret=Iggf97Ra0q\" data-secret=\"Iggf97Ra0q\" width=\"600\" height=\"338\" title=\"&#8220;Apple vs. Google company structure, as seen through patents&#8221; &#8212; FlowingData\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>This one is a great example of using network visualization to analyze the structure of an object. According\u00a0to this,\u00a0Wes Bernegger, data explorer at Periscopic, came up with the conclusion, &#8221; The most notable difference we see is the presence of the group of highly connected, experienced \u2018super inventors\u2019 at the core of Apple compared to the more evenly dispersed innovation structure in Google,\u201d he continues. \u201cThis seems to indicate a top-down, more centrally controlled system in Apple vs. potentially more independence and empowerment in Google.\u201d<\/p>\n<p>3,\u00a0Shakespeare tragedies as network graphs<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9861\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Shakespeare-tragedies.png?resize=487%2C336\" alt=\"\" width=\"487\" height=\"336\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Shakespeare-tragedies.png?resize=300%2C207&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Shakespeare-tragedies.png?resize=768%2C531&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Shakespeare-tragedies.png?resize=1024%2C708&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Shakespeare-tragedies.png?w=1224&amp;ssl=1 1224w\" sizes=\"auto, (max-width: 487px) 100vw, 487px\" \/><\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"XVYvfxvdsZ\"><p><a href=\"https:\/\/flowingdata.com\/2015\/12\/30\/shakespeare-tragedies-as-network-graphs\/\">Shakespeare tragedies as network graphs<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" src=\"https:\/\/flowingdata.com\/2015\/12\/30\/shakespeare-tragedies-as-network-graphs\/embed\/#?secret=XVYvfxvdsZ\" data-secret=\"XVYvfxvdsZ\" width=\"600\" height=\"338\" title=\"&#8220;Shakespeare tragedies as network graphs&#8221; &#8212; FlowingData\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>I think this shows a good example of using colors. Limited color brings the image a clean and professional impassions.<\/p>\n<p><strong>Materials<\/strong><\/p>\n<p>I downloaded network resource from CASOS Public Datasets:\u00a0<a href=\"http:\/\/www.casos.cs.cmu.edu\/tools\/datasets\/external\/index.php#dolphins\">http:\/\/www.casos.cs.cmu.edu\/tools\/datasets\/external\/index.php#dolphins<\/a><\/p>\n<pre>This resource is the network of \"An undirected social network of frequent associations between 62 dolphins in a community living off Doubtful Sound, New Zealand, as compiled by Lusseau et al. (2003).\"\u00a0<em>D. Lusseau, K. Schneider, O. J. Boisseau, P. Haase, E. Slooten, and S. M. Dawson, The bottlenose dolphin community of Doubtful Sound features a large proportion of long-lasting associations, Behavioral Ecology and Sociobiology 54, 396-405 (2003). Retrieved from: <a href=\"http:\/\/www-personal.umich.edu\/~mejn\/netdata\/\" target=\"_blank\" rel=\"noopener\">http:\/\/www-personal.umich.edu\/~mejn\/netdata\/.<\/a><\/em><\/pre>\n<p>From this resource, I want to visualize the relationship between the 62 Dolphins that living in the Doubtful Sound bay.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9865\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.09-PM.png?resize=602%2C329\" alt=\"\" width=\"602\" height=\"329\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.09-PM.png?resize=300%2C164&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.09-PM.png?resize=768%2C421&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.09-PM.png?resize=1024%2C561&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.09-PM.png?w=1680 1680w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.09-PM.png?w=2520 2520w\" sizes=\"auto, (max-width: 602px) 100vw, 602px\" \/><\/p>\n<p>First, in order to clean up the data, I imported the original data to OpenRefine.<img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9866\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.39-PM.png?resize=604%2C330\" alt=\"\" width=\"604\" height=\"330\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.39-PM.png?resize=300%2C164&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.39-PM.png?resize=768%2C420&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.39-PM.png?resize=1024%2C560&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.39-PM.png?w=1680 1680w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.12.39-PM.png?w=2520 2520w\" sizes=\"auto, (max-width: 604px) 100vw, 604px\" \/><\/p>\n<p>The node list is made by the name list the 62 Dolphins. After cleaned up the data, I imported the data to Gephi.\u00a0I merged the edge list to Gephi by using the same process.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9868\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.32.46-PM.png?resize=605%2C395\" alt=\"\" width=\"605\" height=\"395\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.32.46-PM.png?resize=300%2C196&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.32.46-PM.png?resize=768%2C501&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.32.46-PM.png?resize=1024%2C668&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.32.46-PM.png?w=1564&amp;ssl=1 1564w\" sizes=\"auto, (max-width: 605px) 100vw, 605px\" \/><\/p>\n<p>Gephi first generated the graphic like this below:<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9869\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.23-PM.png?resize=604%2C364\" alt=\"\" width=\"604\" height=\"364\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.23-PM.png?resize=300%2C181&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.23-PM.png?resize=768%2C462&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.23-PM.png?resize=1024%2C616&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.23-PM.png?w=1452&amp;ssl=1 1452w\" sizes=\"auto, (max-width: 604px) 100vw, 604px\" \/><\/p>\n<p>In order to make the graphic more concentrate on the relationships between the 62 \u00a0Dolphins, I deleted the &#8220;Integer&#8221; element first.<img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9870\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.43-PM.png?resize=582%2C367\" alt=\"\" width=\"582\" height=\"367\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.43-PM.png?resize=300%2C189&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.48.43-PM.png?w=766&amp;ssl=1 766w\" sizes=\"auto, (max-width: 582px) 100vw, 582px\" \/><\/p>\n<p>After this, I started to design the visual part. I changed the color palette and label size by using the Nodes and Edges edit panel. Here is one thing I noticed, when clicking the Nodes and Edges panel, the icon of each panel won&#8217;t change, there was no visual clue shows either the current panel is under the Nodes or Edges. The designer has to remember\u00a0which editing panel that he\/she chose, or it might bring some confusion.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-9871\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.50.50-PM.png?resize=300%2C297\" alt=\"\" width=\"300\" height=\"297\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.50.50-PM.png?resize=300%2C297&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.50.50-PM.png?resize=150%2C150&amp;ssl=1 150w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.50.50-PM.png?w=612&amp;ssl=1 612w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/>\u00a0<img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-9875\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.54.10-PM.png?resize=297%2C300\" alt=\"\" width=\"297\" height=\"300\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.54.10-PM.png?resize=297%2C300&amp;ssl=1 297w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.54.10-PM.png?w=616&amp;ssl=1 616w\" sizes=\"auto, (max-width: 297px) 100vw, 297px\" \/><\/p>\n<p>In order to make the graphic\u00a0more visual-directly, I applied a Degree Range\u00a0filter which is under the Filter-Topology panel. And about the pattern, I chose<em> Yifan Hu layout<\/em> to run the graphics first.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9876\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.55.46-PM.png?resize=602%2C351\" alt=\"\" width=\"602\" height=\"351\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.55.46-PM.png?resize=300%2C175&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.55.46-PM.png?resize=768%2C449&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.55.46-PM.png?resize=1024%2C598&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.55.46-PM.png?w=1680 1680w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.55.46-PM.png?w=2520 2520w\" sizes=\"auto, (max-width: 602px) 100vw, 602px\" \/><\/p>\n<p>After this, to make the graphics breath a little bit more, I chose the expansion layout to run again.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-9873\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.53.17-PM.png?resize=248%2C300\" alt=\"\" width=\"248\" height=\"300\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.53.17-PM.png?resize=248%2C300&amp;ssl=1 248w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-7.53.17-PM.png?w=606&amp;ssl=1 606w\" sizes=\"auto, (max-width: 248px) 100vw, 248px\" \/><\/p>\n<p>Because Dolphin is a creature that has a really long history, I changed the original font to Palatino. Palatino is a font that contains long history and humanist feeling, the elegant impression represents Dolphin, not only the font, blue and teal color represent the Doubtful Sound Bay as well.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-9877\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.11.21-PM.png?resize=275%2C300\" alt=\"\" width=\"275\" height=\"300\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.11.21-PM.png?resize=275%2C300&amp;ssl=1 275w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.11.21-PM.png?resize=768%2C837&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.11.21-PM.png?resize=939%2C1024&amp;ssl=1 939w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.11.21-PM.png?w=1616&amp;ssl=1 1616w\" sizes=\"auto, (max-width: 275px) 100vw, 275px\" \/> <img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-9878\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.16.45-PM.png?resize=300%2C239\" alt=\"\" width=\"300\" height=\"239\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.16.45-PM.png?resize=300%2C239&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.16.45-PM.png?resize=768%2C612&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.16.45-PM.png?resize=1024%2C815&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.16.45-PM.png?w=1934&amp;ssl=1 1934w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-12-at-8.16.45-PM.png?w=1680 1680w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/p>\n<p><strong>Results<\/strong><\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9881\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Untitled.png?resize=585%2C585\" alt=\"\" width=\"585\" height=\"585\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Untitled.png?resize=300%2C300&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Untitled.png?resize=150%2C150&amp;ssl=1 150w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Untitled.png?resize=768%2C768&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Untitled.png?w=1024&amp;ssl=1 1024w\" sizes=\"auto, (max-width: 585px) 100vw, 585px\" \/><\/p>\n<p><strong>Future Direction<\/strong><\/p>\n<p>During the process, I wonder if this Network can be interactive and shareable? From Professor Sula, I got the positive answer. I added a plug-in called Sigma JS, Using this plug-in, I exported a folder which included the CSS code and JS code of the network graphic. which allows me to embed in any website. The Sigma JS plug-in definitely brings more possibilities to the graphic.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9904\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.50.39-PM.png?resize=727%2C608\" alt=\"\" width=\"727\" height=\"608\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.50.39-PM.png?resize=300%2C251&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.50.39-PM.png?resize=1024%2C858&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.50.39-PM.png?w=1678&amp;ssl=1 1678w\" sizes=\"auto, (max-width: 727px) 100vw, 727px\" \/><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9903\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.54.33-PM.png?resize=725%2C590\" alt=\"\" width=\"725\" height=\"590\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.54.33-PM.png?resize=300%2C244&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.54.33-PM.png?resize=768%2C625&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.54.33-PM.png?resize=1024%2C834&amp;ssl=1 1024w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-14-at-9.54.33-PM.png?w=1076&amp;ssl=1 1076w\" sizes=\"auto, (max-width: 725px) 100vw, 725px\" \/><\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9905\" src=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-16-at-8.04.11-PM.png?resize=595%2C335\" alt=\"\" width=\"595\" height=\"335\" srcset=\"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-16-at-8.04.11-PM.png?resize=300%2C169&amp;ssl=1 300w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-16-at-8.04.11-PM.png?resize=768%2C433&amp;ssl=1 768w, https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Screen-Shot-2018-07-16-at-8.04.11-PM.png?w=926&amp;ssl=1 926w\" sizes=\"auto, (max-width: 595px) 100vw, 595px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>Gephi is a strong tool to visualize network databases. However, it needs more basic knowledge of database organization than other software. Compare to Tableau Public, It might not be that friendly to designers.<\/p>\n<p>Gephi can be a great tool for a marketing team. It works really well on highlighting the main relationships between each element. For example, for an advertising team, it will be necessary to analyze the network between each platform and products. Also, the interactive and shareable plug-in gives the software more possibilities.<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Introduction &#8220;Networks are not the same thing as &#8220;networking,&#8221; or actively using a network to make connections to further one&#8217;s personal goals. A network is simply a set of rela\u00adtions between objects which could be people, organizations, nations, items found in a\u00a0Google search, brain cells, or electrical transformers. Transformers do not &#8220;network.&#8221;In this book we&hellip;<\/p>\n","protected":false},"author":535,"featured_media":9858,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[149,342],"tags":[206],"coauthors":[362],"class_list":["post-9856","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-labs","category-networks","tag-gephi-network-visualization"],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/07\/Game-of-Thrones-on-Twitter.png?fit=1898%2C1190&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/paBdcV-2yY","_links":{"self":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/9856","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/users\/535"}],"replies":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/comments?post=9856"}],"version-history":[{"count":9,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/9856\/revisions"}],"predecessor-version":[{"id":9906,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/9856\/revisions\/9906"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/media\/9858"}],"wp:attachment":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/media?parent=9856"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/categories?post=9856"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/tags?post=9856"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/coauthors?post=9856"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}