Skip to content

Instantly share code, notes, and snippets.

Saman Bemel-Benrud samanpwbb

Block or report user

Report or block samanpwbb

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View gist:965057
SyntaxError: Unexpected token ILLEGAL
at Object.parse (native)
at Object.handleMessage (/Users/saman/tilemill/lib/node/worker.js:140:20)
at Object.handleData (/Users/saman/tilemill/lib/node/worker.js:121:18)
at Stream.<anonymous> (/Users/saman/tilemill/lib/node/worker.js:68:10)
at Stream.emit (events:31:17)
at IOWatcher.callback (net:489:16)

Jeff -

Here are the wires we'll walk you through today.

You'll see we are planning on less maps than expected and do dynamic stack graphs instead. We found this approach to be much better suited as it naturally gives an impression of the situation in the entire US. Animations between graphs will allow for nice comparability between facets. More about that in our meeting at 1 PM today.

This change affects scope but we can still make it work within the budget by just moving the $10,000.- we had allocated for maps and to doing stack graphs. We are planning to still have some maps on the site - on state profiles. We'll use them to situate the state and give a way to laterally browse the site by clicking from neighbor state to neighbor state. Again here: we'll talk more about this in our meeting today.

We call these deliverables "wires" because they talk about communications goals, broad functionality and rough space usage. They do not suggest specific colors, fonts, imagery or icons - we will work on these it

  • state cubes: hover = display tooltip w/ state name, click= highlight selected state

  • title/details in location viz: hover = color highlight over title, click for dropdown

  • policy rankings labels: hover=subtle highlight, click to reveal definition on top of visualization + link to methodology page.

  • grade level key: hover= hide other grade levels besides selected grade level. This could be clickable to show only one grade type at a time

  • global button hover states= double the white, slight change to background color.

View gist:2409754
Hi Team,
We've had a great couple weeks building out the site. After sign-off on the mockups we started on the task of iteratively adapting the creative into the build and we are now at a good resting place to show off the site. Staging is here. Have a look and let me touch on some key components of the build and walk through our process.
We wanted the site to be highly indexable and fast. The exact parameters of the visualizations on the state profile and explore sections are linkable. Should a user want to send a link that targets a particular indicator and year, the URL will automatically reflect those configurations.
** Frontpage
View gist:3416979
.btn {
display: inline-block;
*display: inline;
padding: 4px 14px;
margin-bottom: 0;
*margin-left: .3em;
font-size: 14px;
line-height: 20px;
*line-height: 20px;
color: #333333;
View index.html
<!DOCTYPE html>
<script src=''></script>
<link href='' rel='stylesheet' />
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
View gist:3866893
$('body').mousemove(function() {
View visible.js
var locked = true,
b = $('.branding');
var fadeOut = setInterval(function() {
if (!locked) b.removeClass('visible');
}, 3000); // Change the 3000 value to your liking.
$('body').mousemove(function() {
locked = false;
View gist:3867164
var locked = true,
b = $('.branding');
$('body').mousemove(function() {
locked = false;
setInterval(function() {
if (!locked) b.removeClass('visible');
locked = true;
}, 5000 );
View gist:3895861


  • (John F) Make map more central to the web design
  • (John F) Bring in more map tools, like openstreetbugs

Toggle between two versions, with clear purposes: 1) big map (default if not logged in). 2) activity feed (default if logged in).

Exporting / Extracting:

  • Tools for taking / reusing OSM data and maps (everything from shapefiles to vector shapes)
You can’t perform that action at this time.