When you look at technology today, you probably group things into categories such as “Relevant to me” or “Not something I’ll ever use”. However, there are things that you come across as “What is this?” or “What’s the big deal?” where you are unsure as to whether this new thing you are encountering will be a distraction or a possible new source of benefit to you. You hear about things like blockchain, AI, Augmented Reality, and new languages like Rust or GO and you struggle to find a way to make it relevant to your day to day work.
I had that same experience when I was coming across a site called Observable. I saw some interesting posts by folks - mostly dataviz folks creating interesting procedurally generated images - and I simply dismissed the site as a curiosity and moved on.
But then, there was a watershed post by Lionel Radisson called “Observable & Creative Coding”. The article was in Observable, yet it was self-referential in that it walked the reader through the process of discovery that he had been through with Observable himself. Many things resonated with me with that article - especially since I was a “creative coder” myself and it looked like you could do much more than make pretty procedurally generated images on the site. You could do actual work?
People were not writing whole complex applications. They were working on visualizing data in new ways that allowed the reader to explore the idea they were trying to convey in dynamic ways. Instead of having some static chart about COVID-19 cases, you could interact with the visualization and that process would allow you to more fully understand the information the author was trying to bring across. But, also, there was an air of “back of the napkin” kind of notebooks. Folks would “fork” other notebooks that kinda sorta did what they wanted, and adapt them to what they themselves needed. But they didn’t spend days trying to learn D3 or trying to shoehorn React into a notebook. Instead they were just “getting things done.”
It took me several re-reads and lots of dead ends in my own notebooks to finally get this. And it opened the door for me finally realizing the answer to that question I posed at the beginning of this article : “Is this something useful for me or just some novelty and distraction?” I realized that I had been fighting against the core ideas behind Observable notebooks - and just had been trying to use it as an awkward jsFiddle or CodePen replacement. It’s not like that at all.
- Gather information from remote resources like .csv or .json data.
- Upload images, source files, and data into your notebook and share it.
- Generate amazing visualizations of data and put reactive hooks into your view so that the user can manipulate ( “reactivity” ) aspects of the data and see changes in real time.
- Fork existing notebooks and modify your own version to get to a solution quickly (or use a template built for this purpose). Import cells between notebooks and pull directly into a new notebook (“importing”). This feature alone is fantastically powerful - imagine if you came across some functionality in a notebook you viewed, but didn’t want to cut and paste the code? Just reference the cell in the other notebook!
- Leverage Observable’s dataviz roots and natively create D3 or Vega-lite charts.
- Create interactive tutorials that not only explain a concept, but give your students the tools to interact with the concepts “live”.
- Display any notebook into its own stand alone site.
- Embed any cell into another site and all the context is carried over as well!
Now that I understand this, I now think of Observable as an exciting NEW tool that I can leverage in my own projects. I am starting to use some notebooks for the work I do at eBay where I am visualizing the workload for my team and helping make our sprints more effective. You can even create private Notebooks that have more functionality like utilizing secrets for API calls, or shared notebooks that you can co-edit like a Google Doc.
I hope that I’ve given you some food for thought! Observable is a site that is a new kind of interactive concept on the web. Before now we had “sites” that featured mainly static information - best for reading and moving on, “apps” which are primarily interfaces to help us do some task like banking or buying a Playstation 4, and now “notebooks” which are a fusion of both, yet more than that because they allow in one location the learning, practice, and application of a concept. And its ecosystem of capabilities keeps growing every day! What will YOU build there? Let me know!
(Note: Disclaimer. My opinions stated here are my own. No endorsement is implied or explicit from my employer. It's just me gushing about this cool site! )