Launch HN: Artemis (YC S22) – Use comments to give code an interactive interface
Artemis was born in a Caltech robotics lab where I saw firsthand how much time and effort it took to create a quality script. Engineers were spending hundreds of hours making slide decks, hybrid Markdown / LaTeX documents, and demo GUIs just to make their tools accessible and usable by others. As someone who has been on the learning end of things, it can be nearly impossible to decipher or use even the smallest scripts if they lack quality documentation and interactive interfaces. Although these methods worked they were an incredible time sink and documentation became stale quickly.
Artemis was devised as a solution to this problem. We wanted a tool that allows developers to create high-quality interfaces and documentation without forcing them to invest substantial time, alter their codebases or make significant changes to their workflows.
The way it works is simple: First add special comments to your codebase; Artemis uses these comments (called “anchors”) to automatically generate a GUI for your code. Then run your program using our command-line utility. Artemis launches in an offline browser window that displays your code on one side and your new interface on the other. To see how this looks, you can watch our demo video here: https://www.youtube.com/watch?v=IDL12DkS2Hc.
This interface scrolls vertically, so as your code runs new GUI elements appear one below another at the relevant time organized into “cards.” For example, if a program takes two numbers and adds them, your interface will first show input fields for the variables in one card. When you enter numbers and press “continue,” a new card showing the result will appear.
There are three types of anchors: inputs, outputs and documentation. Inputs let you change variables in your program via the interface, outputs represent the products of your program as graphs, text, etc. and documentation lets you create interface elements that explain what is happening as your program runs. Documentation can take the form of text, Markdown, LaTeX, syntax-highlighted code snippets, multimedia, and links, and more.
These anchors all follow the same format: you put them in a comment, beginning with “@,” followed by its type— “input,” “output” or “doc.” For “doc” anchors you just proceed to add whatever you would like to appear in the document card. For inputs and outputs, you need to specify which variable they act upon by typing “data=x,” with x being your variable.
We provide a suite of default anchors, such as text inputs, and outputs in the form of text, tables, and graphs—but we also let you create your own, using regular Python. Do you need to create a custom anchor to quickly display your statistical data using Seaborn? Do you want to automatically render advanced 3D plots in Matplotlib? Artemis makes this, and more, easy.
The reason we opted to have anchors work from comments is to avoid requiring you to alter your code or the way you work. You don’t have to toggle between different environments—you stay in your preferred IDE, bringing more functionality to it rather than requiring you to go somewhere else.
For example, we subsume the functionality of Jupyter as a visualization tool without requiring you to use a notebook. In our experience, notebooks are rather constraining relative to a full Python environment— they require you to restructure your code for the notebook, run your programs on an IPython kernel, and often import new third-party libraries or widgets. With Artemis you get the interactivity of a notebook, as well as the display...
30 comments
[ 4.3 ms ] story [ 85.6 ms ] threadWith the moon program ramping up, the news / search will be dominated by space related content. The first launch is slated for Monday iirc
https://www.esa.int/Science_Exploration/Human_and_Robotic_Ex...
I'm curious about your choice of using comments, was there an advantage to using this approach over something like decorators?
As it is currently, commments are often a bit weird to debug / view (grayed out) I'm sure there's some advantages to using them here, just thought I'd ask.
Funnily enough, we actually pursued this approach initially for the same reasoning you provided. I absolutely agree with your point regarding highlighting. However, we pivoted to using purely comments after several realizations:
1. Artemis can be used in contexts beyond simply decoration. For instance, if you want to create a documentation card whose sole purpose is to display some Markdown, LaTeX, or Multimedia, there isn't really something to decorate.
2. By making ourselves comment-based, it ensures that it won't throw off any IDEs or linters, and it ensures that these commands will have absolutely no impact on production code when ran without our command-line utility.
3. If you force the user to use a decorator, it restricts the user to only being able to create inputs or outputs for a particular variable right above that line of code. TLDR; it gives the user more freedom to organize their code however they'd like.
4. It lets us allow users to use our special comments to output more than just simple variables. For instance, if a user wrote "@output table data=<<np.arange(5)>>", this would display a table of np.arange(5). However, if we forced users to use decorators, this would prevent functionality like this, which can often be useful.
5. Artemis will be language agnostic, so we wanted to pursue an approach that could be held relatively consistent across other languages.
Nonetheless, your point about highlighting is absolutely valid. We're actually looking to push out extensions for popular IDEs to correctly detect and syntax highlight our commands to try to remedy this concern.
I tried to do something like this what you have but very rudimentary and instead of comments it was an attempt to make GUIs based off function signatures. A string was parsed containing brackets around names of functions to inspect, those functions' comments parsed for labels/tooltips etc, and for each argument to the function it just did basic duck typing to figure out what kind of widget to associate. A function without any arguments was just a button, a function that took a string and a number turned into a button a text field, and a number input, for example.
Anyway, this particular part I'm trying to get at here, the thing that I was kind of proud of for being a novel way to do dynamic layout, was really only the concept of doing alternating rows and columns based on modulo the nesting depth.
say you had 300x300 pixels to work with and you had defined some functions foo, bar, and baz somewhere, you could build a ui for them like
'[foo,bar,baz]'
to have a row of three buttons or instead if you wanted columns then
'[[foo,bar,baz]]'
I hope you guys have success!
In the code: x = 3 Elsewhere in the GUI: (User sets x to 5)
I understand that this pattern has become popular but to me it always struck me as dangerous. It's scary that in the code I can't trust that x = 3 really means x = 3. Especially if I'm skimming the code quickly and not paying attention to the surrounding comments, I might make incorrect assumptions about flow control (if the value is a bool), or other dangerous incorrect assumptions about what the code is doing.
Do you have any ideas for a safer pattern that could be used instead? Maybe something like one of these?
If you use the third option, GUIINPUT could be defined at the top of the file as something like this:Great idea and tool overall!
I've been using it exclusively for my own reports, but now that I see others think this kind of thing is useful, I might put it up on github or sth.
I loathe jupyter notebooks with a passion ... good to see people working on alternatives!