Internal R&D Project #1: Netflix-O-Matic

screenshot of the home page

Netflix-O-Matic is our very first project to go public. Woo! Strictly speaking, the project began very informally in December last year, but really came to a head just yesterday, when Frankie Roberto, Dan Williams and I built the front end for it. In a day. That was satisfying, and the form part in our name, which is so important otherwise you’re just waving your hands about.

Why Netflix-O-Matic?

I’ve planted a flag in the sand with Good, Form & Spectacle. It’s declaring my territory of interest in the world of cultural heritage. To me, that’s a helpful constraint and context for work-making (libraries, museums, archives), but also a juicy remit (save world, support open data, promote open access, help the humans, etc). It might be slightly odd to call Netflix-O-Matic a cultural heritage project, but let me explain why I think it is.

  • Netflix is a repository of objects that happen to be movies
  • Each movie has a bunch of metadata about it (directors, actors, genres etc)
  • Movies are collected together in genres and their variants (Slapstick Comedies; Feel-Good Slapstick Comedies). (Alexis Madrigal wrote an interesting article in The Atlantic Monthly about How Netflix Reverse-Engineered Hollywood, well worth a read. His work in December actually spurred my interest in making something with Netflix genres.)

This sounds a bit like a library. It’s a library.

It’s a bit hard to find new movies to watch using the default Netflix UI, or at least it is for me. None of this entertaining ‘micro genres’ are exposed, and it’s tricksy to engage when you just sort of feel like watching something slapstick-y but you don’t know what yet. When you feel like that, you need to ‘wander the stacks,’ and wait until something pops out at you. That’s the feeling that Netflix-O-Matic is trying to respond to. A search box isn’t great when you feel like that. This toy is about trying to remove that particular ‘I don’t know what I want’ cognitive load entirely, and get people moving in the content as quickly as possible.

User Interface

I enjoy designing bone simple, clicky clicky, lie back-type interfaces, particularly to look around giant datasets. I mean, we can all read a spreadsheet, I guess, but I like to throw in some randomness, and intentionally make it so people might not remember how they got to where they are.

In the case of the fantastic Netflix genres, I knew pretty early on that I wanted to play with the idea of compounding and splitting them in the UI. Often with faceted search, you’re just drilling, drilling, drilling, and it’s difficult to move sideways, across a search. In this UI, you can either split out into a component of a genre, or drill into the full genre listing. The UI isn’t perfect, but hopefully functional.

Click on a single element, in this case, Australian:

netflixomatic-split

Or the whole genre, Australian Dramas Based on Contemporary Literature:

netflixomatic-compound

To help people use the split / sideways movement effectively, we spent quite a bit of time yesterday (mostly Frankie) configuring some regular expressions, or regex. That makes it so you can click on some phrases that make more sense to us than single words. Some examples are kung fu or hopeless romantics or hong kong or based on books or the old classic featuring a strong female lead. Both Frankie and I felt that we could have made the regex file about ten times as detailed, but, we wanted to release the thing in a single day and be done with it.

You can sort of get the gist of some of the others here, in the regex code:

 def words
  name.scan(/(?:
    (?:from\sthe\s[\d]+s) |
    (?:\sby\s[^\s]+\s[^\s]+) |
    (?:for\sages\s[\d]+\sto\s[\d]+) |
    (?:about\s(?:Trucks,\sTrains\s&\sPlanes|[^\s]+\s\&\s[^\s]+|[^\s]+)) |
    (?:(?:(?:directed|created)\sby|starring)\s[^\s]+(?:\s[^\s]+)*) |
    (?:[^\s]+\s\&\s[^\s]+) |
    (?:on\sBlu\-ray) |
    (?:set\sin\s(?:the\s)?[^\s]+(?:\s(?:Times|Era|Ages|America))?) |
    (?:Kids'\sTV) |
    (?:(?:North|East|South|West|Southeast)\s[^\s]+) |
    (?:Kung\sFu) |
    (?:Hidden\s[^\s]+) |
    (?:Best\s[^\s]+) |
    (?:for\sHopeless\sRomantics) |
    (?:Road\sTrip) |
    (?:Golden\sGlobe) |
    (?:[Ff]eaturing\s(?:a\s)?(?:[Ss]trong\s)?(?:[Ff]emale\s)?[^\s]+) |
    (?:Film\sFestival) |
    (?:[\d]+th\s[^\s]+) |
    (?:Hong\sKong) |
    (?:Fairy\sTales?) |
    (?:based\son\s
        (?:a\s)?
        (?:[Rr]eal\s)?
        [^\s]+
        (?:\s(?:[Bb]books|[Ll]iterature|[Gg]ame))?
        (?:\sby\s[^\s]+(?:\s[A-Z][^\s]+)*)?
    ) |
    (?:[^\s]+)
  )/x)
end

Making exploratory interfaces without a search box is useful for me because it helps me think through how to explore. If we'd wanted to take more time, to really embellish this toy we'd probably add one... I can definitely see some kind of auto-complete being useful. It's a useful exercise to think through what Dan called the mental model of the UI without a search too. It makes exploring the data feel a bit more organic, or kaleidoscopic or something. It definitely also helps you come across stuff you'd never search for, and I really enjoy that sensation. You're guided instead by words that appeal to you (in this case), and they expose the filigree in the system without you having to do much work.

Skills / Tools

I'd guess that, over the course of about ten months, the total time my collaborators and I would have work would probably only be about two weeks total effort. It's a bit of a guess, but I don't think it's much more than that. Frankie, Dan and I built the front end in a day, yesterday, which was great fun. That moment when you start seeing actual data in your designs is always a thrill.

If you had to describe the team - me, Frankie, Dan, Nick and Paul - it's a mötley crüe of UX design, ops, web crawling, DBA-ish, programmer-y something something. We mostly did research, scraping, emailing across the USA, planning, designs, data munging, Heroku/Ruby/Postgres setup, front-end development, tweaking, and a bit of publicity at the end. I also made use of a handy responsive CSS library called Skeleton and implemented it yesterday in about 15 minutes.

Working in Public / R&D

Even before this firm existed, I knew I wanted to be public about the behind-the-scenes noodling we're doing, and why we're doing it. Netflix-O-Matic is an example of the sort of simple toy I love to build. It's also useful because it helps me think about things like kaleidoscopic interfaces. I am not quite sure what that means just yet. Hence the toy.

Advertisements
5 comments
  1. Hey George,

    I really like this and used it to find some new films to watch 🙂 We don’t really have Netflix in Sydney, but this browsing system is really useful for finding films generally.

    I had an idea for adding other ways to follow up with the films you find and wanted to contribute a pull request (issues don’t seem to be turned on the repo). Managed to get the application running on my local machine, but it isn’t obvious how to load the data as it seems to be a python thing. Maybe you could add a sentence or two in the readme on the commands to run to load the data in—would be much appreciated 🙂

    Thanks for writing all this up, it’s very interesting to follow.

    Best wishes,

    Luke

    • Hi Luke,

      Thanks! Glad you like it. Yes, I saw that No Issues issue too… No idea why that’s the case. Actually, loading the data in was @iamdanw’s job. I’ll see if he can make a couple of notes for you.

      Cheers,
      george

      • Thanks Dan, I just managed to get it going with the import task you added. Nice one 🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: