CINXE.COM
Open Access Tools
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Open Access Tools</title> <meta name="generator" content="Humanities+Design" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link href="http://hdlab.stanford.edu/assets/bootstrap/css/bootstrap.css" rel="stylesheet"> <link href="http://hdlab.stanford.edu/assets/css/main.css" rel="stylesheet"> <!--[if lt IE 9]> <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <link href='http://fonts.googleapis.com/css?family=News+Cycle:400,700' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=Roboto+Slab:700' rel='stylesheet' type='text/css'> <link rel="shortcut icon" href="https://dl.dropboxusercontent.com/s/o0rhoh2bh2xu9uu/favicon.ico" type="image/x-icon"> <link rel="icon" href="https://dl.dropboxusercontent.com/s/o0rhoh2bh2xu9uu/favicon.ico" type="image/x-icon"> </head> <body> <video autoplay loop id="bgvid"> <source src="/img/banners/palladio_background.mp4" type="video/mp4"> </video> <header class="navbar navbar-default" role="navigation banner"> <!--cesta header--> <div class="cesta-header"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div class="navbar-brand"><a href="http://www.stanford.edu"><img src="https://www.stanford.edu/su-identity/images/wordmark-red@2x.png" alt="Stanford University"/></a> <a href="http://cesta.stanford.edu">CESTA</a></div> </div> <div> <!--search--> <div class="col-sm-3 col-md-3 pull-right"> <form class="navbar-form" role="search"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search" name="srch-term" id="srch-term"> <div class="input-group-btn"> <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button> </div> </div> </form> </div> <!--search--> </div> </div> <div class="row" style="margin-top:32px"> <hr> </div> <!--end cesta--> <!-- /navigation banner--> <div id="masthead"> <div class="container"> <div class="row"> <div class="col-md-12"> <h1><strong><a href="http://hdlab.stanford.edu">Humanities + Design</a></strong> <small>a Research Lab at Stanford University</small> </h1> <div class="collapse navbar-collapse"> <ul id="navlist" class="nav navbar-nav"> <li><a href="http://hdlab.stanford.edu"><b class="glyphicon glyphicon-plus"></b></a></li> <li><a href="http://hdlab.stanford.edu/contact/index.html">Contact</a></li> <li><a href="">Tools</a></li> <li><a href="http://hdlab.stanford.edu/projects/">Projects</a></li> <li><a href="http://hdlab.stanford.edu/people/">Affiliates</a></li> <li> <a href="https://twitter.com/hdstanford"> <svg version="1.1" class="twitter-icon-svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="10px" y="10px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path d="M15.969,3.058c-0.586,0.26-1.217,0.436-1.878,0.515c0.675-0.405,1.194-1.045,1.438-1.809 c-0.632,0.375-1.332,0.647-2.076,0.793c-0.596-0.636-1.446-1.033-2.387-1.033c-1.806,0-3.27,1.464-3.27,3.27 c0,0.256,0.029,0.506,0.085,0.745C5.163,5.404,2.753,4.102,1.14,2.124C0.859,2.607,0.698,3.168,0.698,3.767 c0,1.134,0.577,2.135,1.455,2.722C1.616,6.472,1.112,6.325,0.671,6.08c0,0.014,0,0.027,0,0.041c0,1.584,1.127,2.906,2.623,3.206 C3.02,9.402,2.731,9.442,2.433,9.442c-0.211,0-0.416-0.021-0.615-0.059c0.416,1.299,1.624,2.245,3.055,2.271 c-1.119,0.877-2.529,1.4-4.061,1.4c-0.264,0-0.524-0.015-0.78-0.046c1.447,0.928,3.166,1.469,5.013,1.469 c6.015,0,9.304-4.983,9.304-9.304c0-0.142-0.003-0.283-0.009-0.423C14.976,4.29,15.531,3.714,15.969,3.058z"/> </svg> </a> </li> </ul> </div> </div> </div> </div> <!-- /cont --> </div> </div> </header> <!-- container --> <div class="container"> <div class="row wrap"> <div class="row"> <h2>Open source tools for research</h2> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/breve.png" alt="Breve" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Breve</h3> <p>2015 – ongoing <br /> Breve is a meta-visualization for tables with editing built in. Tabular data can be difficult to read. Breve reveals mis-matched values, datatypes, and missing values at a glance. <br /> <a href="https://humanitiesplusdesign.github.io/breve/">Demo</a> <a href="https://humanitiesplusdesign.github.io/breve/">App</a> <a href="https://github.com/humanitiesplusdesign/breve">Code</a> </p> </div> </div><!--breve --> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/palladio.png" alt="Palladio" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Palladio</h3> <p>2014 – ongoing <br /> A visualization platform currently under development (funded by NEH) with an emphasis on data refining and linking combines a map view, node-Link graph view, and multiple filters. Visit hdlab.stanford.edu/palladio-app/ to learn more about the project. <br /> <a href="http://hdlab.stanford.edu/palladio/">Demo</a> | <a href="http://hdlab.stanford.edu/palladio/">App</a> | <a href="https://github.com/humanitiesplusdesign/palladio">Code</a> </p> </div> </div><!--palladio --> </div> <div class="row"> <h2>Interactive Visualizations & Experiments</h2> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/gttchart.png" alt="Grand Tour Timechart" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Grand Tour Timechart</h3> <p>2015 <br /> An experiment in viewing estimated duration cummulatively. <br /> </p> </div> </div><!-- Grand Tour --> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/idiographic.png" alt="Idiographic" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Idiographic</h3> <p>2014 <br /> An experiment in creating and editing graph data through a visual interface. <br /> <!--><a href="http://idiographic.designhumanities.org">Demo</a> |--> <a href="https://github.com/humanitiesplusdesign/idiographic">Code</a> </p> </div> </div><!--idiographic--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/shuffle.png" alt="Shuffle" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Shuffle</h3> <p>2013 <br /> A multi-dimensional facet-filter tool based on Elastic Lists, combined with a timeline and gallery display of results. <br /> <!--><a href="http://shuffle.designhumanities.org/">Demo</a>--> </p> </div> </div><!--shuffle--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/knot.png" alt="Knot" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Knot</h3> <p>2012 <br /> A network exploration tool that brings into play both explicit connections (through correspondence, for example) and possible networks based on collocation and affiliation. <br /> <a href="http://knot-dev.herokuapp.com/investigate.html">Demo</a> </p> </div> </div><!--knot--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/ink.png" alt="Ink" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Ink</h3> <p>2012 <br /> A combination of map, histogram, and flow (alluvial diagram) view highlights the relations between different dimensions of data. <br /> <!--><a href="http://ink.designhumanities.org">Demo</a>--> <a href="https://github.com/humanitiesplusdesign/ink">Code</a> </p> </div> </div><!--ink--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/inquiry.png" alt="Inquiry" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Inquiry</h3> <p>2012 <br /> A tool that emphasizes research questions as a starting point for visualizing data; generating layered maps based on complex queries. <br /> <!--<a href="http://inquiry.designhumanities.org">Demo</a>--> </p> </div> </div><!--inquiry--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/fineo.png" alt="Fineo" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Fineo</h3> <p>2011 <br /> Inspired by the visual model of Sankey diagrams, Fineo allows users to explore how data is distributed between different dimensions. Created by DensityDesign Research Lab, Politecnico di Milano. <br /> <a href="http://fineo.densitydesign.org/mrofl/new/individuals/">Demo</a> <a href="http://fineo.densitydesign.org/">App</a> </p> </div> </div><!--fineo--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/priestley.png" alt="Priestley Timechart" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Priestley Timechart</h3> <p>2011 <br /> Inspired by Joseph Priestley's 'A Chart of Biography' (1763), this chart displays the length of stay of visitors by city on a brushable timeline allowing scholars to see who was in the same city at the same time. <br /> </p> </div> </div><!--priestley--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/corrispondenza.png" alt="Corrispondenza" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">Corrispondenza</h3> <p>2010 <br /> This point to point map visualization was developed to show 'missing' data. It was the first in a series of experiments in visualizing uncertainty and complexity in data. <br /> </p> </div> </div><!--corrispondenza--> <div class="media col-md-4 col-md-offset-1"> <a class="" href="#"> <img src="http://hdlab.stanford.edu/img/rplviz.png" alt="RPLVIZ" width="300" class="img-rounded"> </a> <div class="media-body"> <h3 class="media-heading">RPLVIZ</h3> <p>2009 <br /> The first visualization experiment for Mapping the Republic of Letters. Built by Jeff Heer's students in CS448b. <br /> <a href="http://stanford.edu/group/toolingup/rplviz/rplviz.swf">Demo</a> </p> </div> </div><!--rplviz--> </div><!--end row --> </div><!-- end row wrap --> <footer> <hr> <div class="row"> <div class="col-md-12 text-center"> <h4> For news and updates, <a href="http://twitter.com/hdstanford">follow us on Twitter</a>. Visit us on the 4th floor of <a href="https://www.google.com/maps/place/Wallenberg/@37.428264,-122.169017,17z/data=!3m1!4b1!4m2!3m1!1s0x808fbb2a0218824f:0xc6ff87b15d5675ba">Wallenberg Hall at Stanford University, Stanford, California.</a></h4> </div> </div> <hr> <div class="col-md-12 text-center"> We are a <a href="http://cesta.stanford.edu" title="CESTA, Stanford University">CESTA</a> lab.<a href="http://cesta.stanford.edu" title="Center for Spatial and Textual Analysis"><img src="/img/cesta_logo.png" class="img-responsive center-block" width="60"></a> </div> </footer> </div><!--end container--> <!-- /container --> <!-- scripts--> <script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> <script type='text/javascript' src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> <!-- JavaScript jQuery code from Bootply.com editor --> <script type='text/javascript'> $(document).ready(function() { }); </script> <!-- /scripts--> </body> </html>