show and tell for hackers in DC.

Round 61 Sound Sombrero

16 Oct 2018

Notes copied from the hackpad!

Angela Ambroz, @angelaambroz

Created a toy programming language, triestin.

Once you’ve cloned the library, go into repl. It follows the order of operations in math:

dimmi "tell me" (print)

ecco f(x) x**2 fin (define a function)

f(10) fin (invoke the function) Output: 100

x é 1 fin # assign 1 to variable x

anzi 2 fin # re-assign 2 to x

What’s going on under the hood?

Lexer -> Parser -> Compiler

Tokenize, parse into an abstract syntax tree into your source language

Why do this? Sapir-Whorf hypothesis is that language determines reality.

Programming languages are dominated by English and we ought to smash the hegemony.

It was a fun exercise to think of words that don’t really exist in English, like “anzi”, i.e. “actually” or “scratch that”.

CS50 is Harvard’s intro to computer science class, it’s free and lots of fun

Destroy all software has a 30-minute video that shows you how to build your own compiler.

Benjamin Ortiz Ulloa, @plzbeemyfriend

Make an animation that tweens between multiple picture state!

Learning Statistics with R - this book was great! It pre-dates Tidyverse but was amazing at the time, and the author is a hero to me! (Danielle Navarro)

On Twitter, she was advertising: Summer school on complex systems, an animated advertisement. This was so cool! Can I replicate this?

Danielle made a matrix of figures, and it was a lot of work. Is there an easier way?

Can I steal the locations of a photo and pull the (imager, which is useful for creating ASCII art from an image, could be used to do it for pixels instead of ASCII) – turns a photo into a matrix of points.

But in the three frames, the number of points was all off: satRday had 1900, GWU had about 2100, but the flag had 9500. How instead to transfer that information to flatten it out?

Create reasonable places to add new pixels. Had to use Brownian motion in order to animate in a way that was helpful.

Anna Petrone

I made a website for my dance team! It’s mobile friendly and lets you register and pay for classes and events. In the process I learned about static website hosting on AWS S3, and a super easy way to accept Paypal payments on a static site.

I’m calling this an art hack because the hardest part was the design, making it look nice and have it convey the personality of team.

We have a Facebook and Instagram, but wouldn’t it be nice to have a website to advertise classes, have booking for our classes, sell tickets to our events? Super professional!

She started out using Wix, which helped her test out different options quickly, especially with a parallax scrolling effect and experimenting with different options.

But when she deployed it, it looked terrible on mobile. It would load the top of the page, but nothing would appear underneath. And it looked like a problem across the board with Wix. So since most people would be looking on mobile, that was a deal-breaker. Also, you had to buy a paid Wix plan if you wanted your own custom URL.

Amazon S3 sites could be way cheaper and easy to use.

Behind the scenes, the URL is

But the public-facing URL is:

And it’s mobile-friendly!

The parallax scrolling looks great, the photos were fantastic, the classes are available and you can register on there.

Sites hosted on S3 must be static, but using a little bit of JQuery we could pull URL parameters to populate a form.

The PayPal button – if you had a free PayPal business account, you can build a button that will take you to PayPal and handle all of the details. They’re really well documented and have lots of custom information that you can add. So you could add information about the class and it would show up in the receipt.

Chrome’s browser on mobile “forces me to write absurd hacks” because the URL bar resizes dynamically.

It’s also like 0.01 cents per month!

Eric Haengel

I built a device which converts the sensor data from an accelerometer into lighting via a string of LED’s. I’ll talk about this project and how the whole thing works.

Travis gave a talk about a wearable sensor that could detect motion, and built a prototype last year that was housed in a backpack and pretty large! It even needed a laptop.

A rock climber came to Hack and Tell a few months back talking about how she wanted a LED sensor she could wear while rock climbing

Sensor is an IMU, acceleration data from IMU goes into an MCU (similar to an Arduino but more powerful).

RGB LEDs controled by TLC.

There are three directions possible that you can move the accelerometer: x, y, z – and these were mapped to R, G, B

Original purpose was to record motion in real-time and process it in real-time.

Acceleration data can be recorded to flash memory for post-processing

Nathan Epstein

digital 3d interactive sculpture

A few months back, Nathan presented on an art project called SpiralToy. He was interested in the idea of “latent space”:

Latent space has a vector as an input for some kind of generator, but all of the inputs are continuous and you get different outputs.

What about working with shaders? Turns out the 3D stuff ended up being easier to use.

There’s a whole field of inputs: x and y, and mousing over or clicking will change how the image works.

For this project, having round corners was important to not having jagged animation.

In 3DJS, the camera can be moved around to get a different perspective, and you could scroll-zoom to see it more zoomed in.

You can have up to ten waypoints, and if you like the parameters you’ve set you can save them into a URL to save the state and share it with friends! Victor Morrow Software hack Been working on a project called The Owner Free File System. It is a p2p filesystem that allows legal data sharing activity over its network through the use of its ingenious data storage mechanisms. The storage mechanism does not store whole files but random data blocks which contain large randomly generated numbers. These blocks have no discrete mapping to any single file but instead are instead shared by infinite combinations of data representations that are created arbitrarily by users. This creates a universal public storage cloud that immune to censorship and that never divulges the privacy, intent, or security of its network participants. It also host websites….

Aditya Jain - @whaleandpetunia

I finished a personal project, a prototype of which I showed in this meetup a couple of months ago. The final visualization depicts the rampant sexual violence in India and the systemic failures of the Indian justice system:

A few months ago, Aditya visualized a set of points that represented the numbers of reported sexual violence in India. But he wanted to improve the visualization.

Researched dozens of articles and how rape and consent are defined. Of course, dividing the map by state poses problems since each state has a different level of population.

Controlling for population by state leads to a better map, but the largest problem is that most sexual violence goes unreported.

Just under half of all reported rape victims are minors.

Some states have zero reported minor victims; this doesn’t seem correct either.

Who is being accused in these crimes? This is also reported in the national statistics. About ⅓ of the offenders promise to marry the victim.

The police response to reported crime and the justice system:

Indian court systems are completely overloaded and survivors are waiting for justice. The visualization shows the outcomes of a court case – showing that court cases can languish for decades.

A surprising finding in the data: if you were both raped and murdered, your case would not show up in this data set because your case would only count as a murder.

Library called regl used to create the data visualization – it’s a webGL wrapper.

Created a “report card” of each of the states with conviction rates and other statistics pulled from non-public data found via a RTI (essentially a FOIA).

This project is nominated for an Information is Beautiful award, the voting is open till the end of the week. I’d appreciate your vote (no registration necessary):

Travis Hoppe

Deep Optimizers

Experiments with the artistic side of deep learning optimizers

What is an optimizer? Deep learning is about finding the best solution by figuring out how to take the next step.

What problems can we solve? Let’s visualize how the optimizer tries to solve the roots of a quadratic equation.

Shape of convergence depends on the optimizer – how the algorithm attempts to

A tenth-order polynomial - ten roots on a complex plane, you get something that looks a little like a lithograph. Randomly chose the coefficients with a Gaussian distributions. But a complex coefficients breaks the symmetry.

Polynomials naturally have x, y – real and complex are the dimensional space.

And you get different images based on the different ways of solving it: Adam, gradient descent, RMS Prop. The momentum depends on the path the optimizer took.

The entire thing - including the visualization - is all done in Python. And Matplotlib is not built to do this!

So he used cv2, which is also a really good backend to build shapes.

RMS Prop has “highways”.

In the animations, the convergence is how they find the roots of the polynomials.

Step sizes were chosen ad-hoc to give a good solution rather than the speed at which they converge. Instead: what is the speed at which things look pretty?