Skip to content

Commit

Permalink
image and styling updates to policy and discotech research pages
Browse files Browse the repository at this point in the history
  • Loading branch information
@skristyn
skristyn committed Jan 11, 2017
1 parent ef81f58 commit 03732e2
Show file tree
Hide file tree
Showing 15 changed files with 104 additions and 61 deletions.
55 changes: 32 additions & 23 deletions content/research/discotechs.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@
<div class="col-lg-offset-2 col-lg-8 col-md-offset-1 col-md-10">
<h1 class="toph">Research Method: Data DiscoTechs</h1>
<div class="h1-graphic"></div>
<img src="../../images/discotech-painting.jpeg" />
<p>Coined by the Detroit Digital Justice Coalition back in 2010, <a href="https://www.alliedmedia.org/ddjc/discotech" target="_blank">the term "DiscoTech"</a>, short for "discovering technology," defines a replicable model for a multimedia, mobile neighborhood fair. DiscoTechs feature interactive, multimedia workshop stations that are designed to help participants explore the impacts and possibilities of technology and communication within our communities.</p>
<p>In 2015, the DDJC adapted the DiscoTech model to specifically address ideas of open data, as the City of Detroit had just launched its first open data portal. The mission of “Data DiscoTechs” is to demystify, engage and inform residents about open data in Detroit.</p>
<p>Through organizing these Data DiscoTechs, we’ve found successful strategies for identifying relevant host organizations and developing popular education methods for teaching communities about open data. Our strategies can offer important lessons for the City and other data stewards to craft open data engagement plans.</p>
Expand All @@ -57,24 +58,6 @@ <h1 class="toph">Research Method: Data DiscoTechs</h1>
</div>
</div>

<div class="row">
<div class="col-lg-offset-2 col-lg-4 col-md-offset-1 col-md-5">
<img src="../../images/discotech-room.jpg" style="margin-top: 20px;">
</div>
<div class="col-lg-4 col-md-5">
<h2>The hosts</h2>
<p>We set out with the goal to bring Data DiscoTechs to each District in Detroit. We approached local recreation centers, community computer labs and libraries to inquire about hosting the Data DiscoTechs. Host organizations agree to provide a physical space and, most importantly, help do outreach and advertise our event to their members. This helps us reach diverse communities and folks who aren’t necessarily familiar with open data.</p>
<p>So far, Data Discotech’s have been held in:
<ul>
<li>District 4 at the Samaritan Center in Sept. 2015</li>
<li>District 6 at Grace in Action in April 2016</li>
<li>District 3 at the Boggs School in June 2016</li>
<li>District 7 at the Butzel Community Center in Oct. 2016</li>
</ul>
Data Discotechs hope to travel to the remaining Districts throughout 2016-2017.</p>
</div>
</div>

<div class="row">
<div class="col-lg-offset-2 col-lg-8 col-md-offset-1 col-md-10">
<h2>The stations</h2>
Expand All @@ -87,35 +70,41 @@ <h2>The stations</h2>
<div class="row cards">
<!-- recommendation 1 -->
<div class="col-lg-offset-2 col-lg-4 col-md-offset-1 col-md-5 rec-card left-card">
<img class="disco-graphic" src="../../images/data-sheet.png" />
<h3>Detroit Open Data</h3>
<p>introduces the open data portal and asks participants what they want to know about their neighborhood that the City may have the answers to. Then, participants learn to access information related to public safety, transportation, education and other categories to gain a better understanding of activity conducted by the City and how it affects their neighborhood.</p>
<p>introduces the open data portal and asks participants what they want to know about their neighborhood that the City may have the answers to. Then, participants learn to access information related to public safety, transportation, education and other categories to gain a better understanding of activity conducted by the City and how it affects their neighborhood.</p>
</div>

<div class="col-lg-4 col-md-5 rec-card">
<img class="disco-graphic" src="../../images/padlock.png" />
<h3>Getting Data: FoIA and Public Databases</h3>
<p>walks participants through the concrete steps of making a Freedom of Information Act ( FoIA) request and shares tips, advice and general knowledge about what types of data we’re entitled to under FoIA laws.</p>
</div>
</div>

<div class="row cards">
<div class="col-lg-offset-2 col-lg-4 col-md-offset-1 col-md-5 rec-card left-card">
<img class="disco-graphic" src="../../images/policy-map.png" />
<h3>Land Data</h3>
<p>demonstrates a mapping web app that highlights land speculators, including their names and how many properties they own, and sheds light on property ownership in a new way that is community-focused. Participants are invited to explore the data near their neighborhoods, ask questions and give feedback.</p>
<p>demonstrates a mapping web app that highlights land speculators, including their names and how many properties they own, and sheds light on property ownership in a new way that is community-focused. Participants are invited to explore the data near their neighborhoods, ask questions and give feedback.</p>
</div>

<div class="col-lg-4 col-md-5 rec-card">
<img class="disco-graphic" src="../../images/data-body.png" />
<h3>Mapping Your Data Body</h3>
<p>demystifies the relationship between our lives and the electronic data that circulates about our experiences and daily activities online by creating maps of all the electronic data stored about us. Then, participants have conversations about who collects that data, how it’s stored, who makes decisions about it and practical steps we can take to protect our “data bodies.”</p>
<p>demystifies the relationship between our lives and the electronic data that circulates about our experiences and daily activities online by creating maps of all the electronic data stored about us. Then, participants have conversations about who collects that data, how it’s stored, who makes decisions about it and practical steps we can take to protect our “data bodies.”</p>
</div>
</div>

<div class="row cards">
<div class="col-lg-offset-2 col-lg-4 col-md-offset-1 col-md-5 rec-card left-card">
<img class="disco-graphic" src="../../images/dataviz.png" />
<h3>Data Visualization</h3>
<p>helps participants draw meaning from a dataset by learning methods to analyze and visualize it, showing how data visualization can make data easier to digest and more engaging. The station prepares sample datasets, utilizes open source tools and sets up mini “challenges” that let participants test out different approaches.</p>
<p>helps participants draw meaning from a dataset by learning methods to analyze and visualize it, showing how data visualization can make data easier to digest and more engaging. The station prepares sample datasets, utilizes open source tools and sets up mini “challenges” that let participants test out different approaches.</p>
</div>

<div class="col-lg-4 col-md-5 rec-card">
<img class="disco-graphic" src="../../images/phone.png" />
<h3>Detroit Apps</h3>
<p>offers tutorials about different civic-data driven apps available in Detroit, ranging from transit apps that track bus arrivals to the See-Click-Fix Improve Detroit app for reporting neighborhood issues like potholes or broken streetlights. Participants learn to download and use the different apps that are most relevant to them, both on their own phones or by accessing them through a desktop computer.</p>
</div>
Expand All @@ -124,11 +113,31 @@ <h3>Detroit Apps</h3>
<div class="row">
<div class="col-lg-offset-2 col-lg-8 col-md-offset-1 col-md-10 left-card">
<p>After each Data DiscoTech, we circle back with our station managers, the folks who volunteer to prepare content and facilitate the individual stations mentioned above, to hear feedback. This feedback helps to make future Data DiscoTechs more accessible and relevant to participants of all different ages and skill-levels.</p>
<p class="bottom">Beyond Data DiscoTech station examples, the <a href="detroitcommunitytech.org/teachcommtech">Teaching Community Technology Handbook</a> is a valuable resource for strategizing a community engagement plan around open data. The handbook serves as a guide for popular education and teaching technology methods for community organizers.</p>
<p>Beyond Data DiscoTech station examples, the <a href="detroitcommunitytech.org/teachcommtech">Teaching Community Technology Handbook</a> is a valuable resource for strategizing a community engagement plan around open data. The handbook serves as a guide for popular education and teaching technology methods for community organizers.</p>
</section>
</div> <!-- end column -->
</div> <!-- end row -->
</div> <!-- end dt-cards div -->


<div class="row">
<div class="col-lg-offset-2 col-lg-4 col-md-offset-1 col-md-5">
<img src="../../images/discotech-room.jpg" style="margin-top: 20px; margin-bottom: 20px">
</div>
<div class="col-lg-4 col-md-5">
<h2>The hosts</h2>
<p>We set out with the goal to bring Data DiscoTechs to each district in Detroit. We approached local recreation centers, community computer labs and libraries to inquire about hosting the Data DiscoTechs. Host organizations agree to provide a physical space and, most importantly, help do outreach and advertise our event to their members. This helps us reach diverse communities and folks who aren’t necessarily familiar with open data.</p>
<p>So far, Data Discotech’s have been held in:
<ul>
<li>District 4 at the Samaritan Center in Sept. 2015</li>
<li>District 6 at Grace in Action in April 2016</li>
<li>District 3 at the Boggs School in June 2016</li>
<li>District 7 at the Butzel Community Center in Oct. 2016</li>
</ul>
Data Discotechs hope to travel to the remaining Districts throughout 2016-2017.</p>
</div>
</div>

</div> <!-- end container -->
<!-- end main content div -->

Expand Down
68 changes: 31 additions & 37 deletions content/research/policies.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,13 +33,15 @@
<!-- START MAIN CONTENT -->
<div class="container-fluid main_content_wrap">
<div class="row">
<div class="col-sm-offset-2 col-sm-8">
<div class="col-lg-offset-2 col-lg-8 col-md-offset-1 col-md-10">
<section id="main_content">
<p class="breadcrumb"><a href="../../index.html">Home</a> / <a href="../research.html">Research</a> / Data Policy</p>
<h1 class="toph">Research Method: Data Policies</h1>
<div class="h1-graphic"></div>
<p>Open data – a process of making non-personal, public information broadly accessible and usable by people and computers, free of any constraints - is a fast-growing movement within government. Detroit’s new data portal, generously donated by the <a href="https://socrata.com/newsroom-article/socrata-foundation-established-unleash-power-open-data-improve-world/" target="_blank">Socrata Foundation</a>, is accessible at <a href="https://data.detroitmi.gov/" target="_blank" style="font-weight: bold;">data.detroitmi.gov</a>.</p>
<h2>Background on Open Data in Detroit</h2>
<div class="row">
<div class="col-md-7">
<h3>Initiation</h3>
<ul>
<li>The GO DATA (Government Open Data Access To All) initiative was established in February 2015 by Executive Order 2015-02</li>
Expand All @@ -48,59 +50,51 @@ <h3>Initiation</h3>
<li>The goal, according to Mayor Mike Duggan, is to create a more open, collaborative and accountable relationship between the City government and the people it serves.</li>
<li>The cornerstone of this major shift in City policy will be that data and information, unless exempt from disclosure under State or federal law, will be available to the public.</li>
</ul>

<h3>Growth</h3>
</div>
<div class="col-md-5">
<img src="../../images/detroit-portal.png" class="border" />
</div>
</div>
<div class="row">
<div class="col-md-6">
<h4>At portal launch</h4>
<div class="col-lg-12">
<h3>Growth</h3>
<ul>
<li>75 individual datasets</li>
<li>9 participating departments and agencies:
<li>Portal started with 75 individual datasets, now holds about 140</li>
<li>Started with 9 participating departments and agencies, now at least 15:
<ul class="departments">
<li>Detroit Police</li>
<li>Buildings</li>
<li>Safety</li>
<li>Engineering and Environmental Department</li>
<li>Detroit Land Bank Authority</li>
<li>Planning and Development</li>
<li>Recreation</li>
<li>Public Works</li>
<li>Assessor</li>
<li>DDOT</li>
<li>City Clerk/Elections</li>
<li>Detroit Police, Buildings, Safety, Engineering and Environmental Department, Detroit Land Bank Authority, Planning and Development, Recreation, Public Works, Assessor, DDOT, City Clerk/Elections, Detroit Building Authority, Department of Neighborhoods, Detroit Fire Department, Detroit Public Schools, SMART transit, SeeClickFix/Improve Detroit App</li>
</ul>
</li>
</ul>
</div> <!-- end column -->

<div class="col-md-6">
<h4>Measurable Changes</h4>
<ul>
<li>Now holds nearly 140 individual datasets</li>
<li>At least 6 additional participating departments and agencies:
<ul class="departments">
<li>Detroit Building Authority</li>
<li>Department of Neighborhoods</li>
<li>Detroit Fire Department</li>
<li>Detroit Public Schools</li>
<li>SMART transit</li>
<li>SeeClickFix/Improve Detroit App</li>
</ul>
</li>
</ul>
<p>These gains can be referenced in detail through the <a href="https://data.detroitmi.gov/Government/Public-Dataset-Inventory/pacb-jr36" target="_blank">Public Dataset Inventory</a>, which describes all datasets included in the portal to date.</p>
</div> <!-- end column -->
</div> <!-- end row -->

<div class="row">
<div class="col-lg-12">
<h3>Gaps, issues, and questions to inform future data releases and initiatives</h3>
<p><ul>
<li><strong>Financial datasets about City contracts and grants have yet to be released</strong>, despite initial announcements for its forthcoming release in summer 2015, and an updated publishing timeline remains unknown.</li>
<li><strong>The first open data Advisory Committee has only been recently convened</strong>, even though the nomination process began at the portal’s launch. Will objectives and notes from this working group of residents be shared through the portal or elsewhere?</li>
<li><strong>Many datasets on the portal still lack well-documented metadata</strong>, like field definitions or a data dictionary that describes that dataset. We think that DPD’s Citizen Complaints dataset is an effective example of useful documentation as it includes a description, field definitions and contact information for learning more about the data, but unfortunately datasets documented as thoroughly as that one seem to be the minority of those available through the portal.</li>
<li><strong>The first open data Advisory Committee has only been recently convened</strong>, even though the nomination process began at the portal’s launch. Will objectives and notes from this working group of residents be shared through the portal or elsewhere?</li>
<li><strong>Many datasets on the portal still lack well-documented metadata</strong>, like field definitions or a data dictionary that describes that dataset. We think that DPD’s Citizen Complaints dataset is an effective example of useful documentation as it includes a description, field definitions and contact information for learning more about the data, but unfortunately datasets documented as thoroughly as that one seem to be the minority of those available through the portal.</li>
</ul></p>

<h2>Open Data in Other Cities</h2>
<p>Releasing data through the City’s data portal is a first step of the GO DATA Initiative. We see our data justice recommendations as meaningful strategies for continuing to implement open data in Detroit in ways that focus on greater access and accountability, and engage a more diverse community of users to generate policy provisions for greater government transparency. </p>
<p>To vision our dream open data ecosystem in Detroit, we’ve looked to the transparency policies, data portals and open data practices and tools in place in other cities around the U.S. for inspiration. Members of the DDJC and DCTP have also investigated other cities data portals and civic data-driven applications to find inspiration. Our favorite discoveries that could be meaningfully adapted to Detroit data are described below.</p>
</div> <!-- end column -->
</div> <!-- end row -->

<div class="row hide-small">
<div class="col-md-6">
<img src="../../images/chicago-justice.png" class="border" />
<span class="caption"><caption>SmartChicago’s Crime and Punishment app</caption></span>
</div>
<div class="col-md-6">
<img src="../../images/anti-eviction.png" class="border" />
<span class="caption"><caption>San Francisco's Anti-Eviction Mapping Project</caption></span>
</div>
</div>

<h3>Data Policy</h3>
<p>The <a href="https://sunlightfoundation.com/policy/opendatamap/" target="_blank">Sunlight Foundation’s Open Data Policy Map</a> has been a key resource for comparing and contrasting policy language and initiatives across cities. We learned that many cities first launch their open data portals through Executive Orders, City Council Resolutions or Mayoral Directives like Detroit, but that cities who have adopted full open data legislation often adhere better to <a href="https://sunlightfoundation.com/opendataguidelines/" target="_blank">Sunlight’s Best Practices</a> for policy.</p>
Expand Down
Binary file added images/anti-eviction.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/chicago-justice.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/data-body.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/data-sheet.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/dataviz.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/dc-foia.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/detroit-portal.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified images/discotech-painting.jpeg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified images/discotech-room.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/padlock.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/phone.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/policy-map.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
42 changes: 41 additions & 1 deletion styles/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -279,7 +279,15 @@ blockquote {
div#sharable-container {
min-width: 400px;
height: 520px;
max-width: 820px;
max-width: 1000px;
}

.highcharts-plot-background {
width: 100% !important;
}

.highcharts-background {
width: 100% !important;
}

.percents {
Expand Down Expand Up @@ -672,6 +680,18 @@ p.rschcell {

/**** GRID END ****/

img.border {
border: 2px solid #ccc;
}

.disco-graphic {
float: left;
margin-right: 10px;
margin-top: 30px;
margin-bottom: 40px;
display: inline-block;
}

.textblocks li {
margin-bottom: 30px;
}
Expand Down Expand Up @@ -701,6 +721,20 @@ div#findings-bg {
background-color: #f1f1f1;
}

.caption {
font-size: .9em;
color: #aaa;
}

.scenario h4 {
margin-top: 7px;
margin-bottom: 10px;
}

article.accordion {
margin-bottom: 25px !important;
}

/*******************************************************************************
Small Device Styles
*******************************************************************************/
Expand Down Expand Up @@ -799,7 +833,13 @@ Small Device Styles
padding-top: 10px;
margin-top: 0;
}

/*
.hide-small {
display: none;
}
}
*/

@media screen and (min-device-width: 320px) and (max-device-width: 480px) {
.main_content_wrap { padding-left: 20px;}
Expand Down

0 comments on commit 03732e2

Please sign in to comment.