Fwd.Us Immigration Hackathon: Report

Screen Shot 2013-11-24 at 1.06.34 PM

This past week, I was invited to serve as a Design Mentor for the Fwd.Us DREAMer Hackathon. The event featured a group of 20-some immigrants, most of them without documentation, leading up small teams of designers & coders. Each team was tasked with coming up with an idea to help immigrants, or the immigration reform movement.  We would work for 2 days at the LinkedIn headquarters in Mountain View to come up with a working demo of our idea.

I was mentor to team NoblePaths.

Fwd_us DreamerHack 2013-11-21 16.44.30

Our goal was to create a visualization app that would empower immigrants to tell their personal story in a share-able, if not viral way.  The point was to make the complicated (if not, outright broken) immigration system visible, and in human terms rather than in cold, formal, legalistic ways. (like the immigration roadmap below)

immigration-flowchart-roadmap-to-green-card

Our original vision was to create a visualization app using the D3 javascript library, that would let an immigrant enter in their own personal timelines. We would then provide them with a gorgeous image file of their immigration journey. They could share this visual on social media, and make it visible to other people on the site as well.  We would compile the various personal timelines into a larger database of immigration journeys, to use to make a larger set of general visuals about Immigration options, waiting times, and common paths.

Concept: Personal Storyline visuals

I mocked up some possible personal Storyline Images, that our app would create.  I hand-coded these, based on interviews with immigrants about their personal journeys.  Then I created vector color maps of their journeys. The goal was to create viral, gripping, emotional images out of a personal story.

Jorges Immigration Visual Lifen 1000 Kursats green Visual Life 1500 w So Immigration Lifeline 11 x 14

I also made less minimalistic versions, with annotations on the color map — including the stories that went along with each phase.

Jorges Immigration Lifeline with notes - smaller

For times-sake, though, the team decided to use an existing Javascript tool — the Knight Lab’s Timeline JS, to allow users to create their own personal timelines as a browsable interactive web page.  See an example of a personal, visual Immigration Timeline here.

Our Demo product

The first, semi-functional version of NoblePaths is available here.

We made up a website & intake section, for people to enter their timeline information. Here are some of our screenshots of the demo site that we built:

Screen Shot 2013-11-24 at 1.06.34 PM Screen Shot 2013-11-24 at 1.06.54 PM Screen Shot 2013-11-24 at 1.18.41 PM

Next Steps

Our team won honorable mention for Best Design, and even more importantly, we had a great time working together & imagining how we can use visualization & personalization to improve the immigration system. Can we help people understand their options better by showing them others’ stories? Can we crowdsource an immigration dataset, that shows trends in what pathways are possible, and how timely & expensive they are, and for which nationalities?  Can we show the public how complicated & burdensome the current system is — how people who arrive here perfectly legal can end up as undocumented.

Photo Log

Here is a photo log of our event — from dinner on Tuesday night, where we met in person for the first time & talked about our ideas over dinner — through Wednesday’s launch, sketches, consultations with Mark Zuckerberg, Jose Antonio Vargas, Andrew Mason, Drew Houston, and Reid Hoffman — and Thursday’s crazy rush to get our demo ready.

2013-11-19 19.37.33 2013-11-19 20.55.16 2013-11-20 15.06.24 2013-11-20 15.14.01 2013-11-20 15.47.02 2013-11-20 15.49.42 2013-11-20 16.23.03 2013-11-20 17.11.08 2013-11-20 19.02.01 2013-11-20 20.03.55 2013-11-20 20.04.10 2013-11-20 22.46.21 2013-11-20 22.46.24 2013-11-20 22.46.29 2013-11-20 22.52.44 2013-11-20 22.52.52 2013-11-20 22.52.57 2013-11-20 22.53.03 2013-11-20 22.53.10 2013-11-20 22.53.21 2013-11-20 22.53.39 2013-11-20 22.53.46 2013-11-20 22.53.55 2013-11-20 22.54.59 2013-11-20 22.55.05 2013-11-21 14.37.40 2013-11-21 16.44.22 2013-11-21 16.44.30 2013-11-21 16.44.41 2013-11-21 16.44.44 2013-11-21 17.58.55 2013-11-21 18.16.50 2013-11-21 18.43.49 2013-11-21 18.43.55 2013-11-21 18.44.01 2013-11-21 19.12.05 2013-11-21 19.13.36 2013-11-21 19.20.05 2013-11-21 19.32.07 2013-11-21 19.52.49 2013-11-21 19.53.00 2013-11-21 19.59.08 2013-11-21 19.59.19 2013-11-21 20.38.31 2013-11-21 20.40.15 2013-11-21 20.45.57 2013-11-21 21.00.33 2013-11-21 21.00.36 2013-11-21 21.00.40 2013-11-21 21.00.42 2013-11-21 21.01.51 2013-11-21 21.01.55 2013-11-21 21.01.58

2 Responses

Leave a Reply

Your email address will not be published. Required fields are marked *