SiliCoDraw

Draw scientific figures in silico, together with your AI assistant.

A small, local, open editor for scientific figures: poster figures, graphical abstracts, pathway diagrams, workflow figures, timelines, teaching material. One HTML file plus a tiny server. Your figures are plain JSON files in this folder, so an AI coding assistant can draw and revise them with you, and you can drag things around by hand. Nothing leaves your computer.

What you can make

All of these are in examples/ and open from File ▾ → New figure → Example: …, so you can take them apart.

Install and start

SiliCoDraw runs on your own computer and opens in your web browser. It is free, and it does not need an account.

Mac

The easy way: one line in Terminal (about one minute).

1. Open Terminal: press ⌘ Command + Space, type Terminal and press Return.

2. Copy this line, paste it into the Terminal window (⌘ V) and press Return:

   curl -fsSL https://raw.githubusercontent.com/Alex-D-C/SiliCoDraw/main/install.sh | sh
   

3. SiliCoDraw is downloaded into a folder called SiliCoDraw in your home folder, and the editor opens in your browser. That folder is also where your figures are saved.

4. Leave the Terminal window open while you work (you can minimize it). To quit SiliCoDraw, close it (if macOS asks whether to terminate the running process, click Terminate).

Next time, start it like any app: press ⌘ Command + Space, type SiliCoDraw and press Return. You can also double-click Start SiliCoDraw.command in the SiliCoDraw folder.

If Terminal says that SiliCoDraw needs Python 3, a window also asks to install the "command line developer tools". Click Install, wait until it says the software was installed (5 to 20 minutes), then paste the same line into Terminal again. If no such window appears, install Python 3 from python.org/downloads and paste the line again.

If a window asks whether Terminal may access a folder, click Allow.

1. On this page, click the green Code button, then Download ZIP. Safari unzips it into a folder called SiliCoDraw-main in your Downloads folder (otherwise double-click the ZIP file).
2. Open Terminal (⌘ Command + Space, type Terminal, press Return).
3. Type sh followed by a space. Do not press Return yet.
4. Drag the file start.sh from the SiliCoDraw-main folder into the Terminal window, then press Return. If macOS asks whether Terminal may access your Downloads folder, click Allow.
5. SiliCoDraw offers to move its folder out of Downloads into your home folder, where it is safe from clean-ups. Press Return to accept.

After that, start it with ⌘ Command + Space, SiliCoDraw, Return, as above.

Why not just double-click a file in the ZIP? macOS blocks programs from the internet that are not from the App Store, with a message such as "Apple could not verify…" or "could not be executed because you do not have appropriate access privileges". Starting SiliCoDraw once from Terminal as above removes that block for this folder. If you already double-clicked and saw such a message, click Done or OK (not Move to Trash) and continue with step 2.

Windows

1. On this page, click the green Code button, then Download ZIP.
2. Open your Downloads folder, right-click the ZIP file and choose Extract All…, then Extract. SiliCoDraw does not run from inside the ZIP file. You can move the extracted folder to Documents.
3. Open the extracted folder (if it only contains another SiliCoDraw-main folder, open that one too) and double-click Start SiliCoDraw.bat.
4. If Windows shows "Windows protected your PC", click More info, then Run anyway. Windows shows this once for files downloaded from the internet.
5. The editor opens in your browser. Leave the black window open while you work (you can minimize it). To quit SiliCoDraw, close it.

Python is not needed on Windows: the start file uses Python if it is installed and Windows' own PowerShell otherwise.

Linux

The Mac line works on Linux too, or download the folder and run sh start.sh. It needs Python 3.7 or newer (sudo apt install python3 on Ubuntu).

Good to know

The editor lives at http://localhost:8770/ while SiliCoDraw runs; bookmark it if you like. It works in any current browser (Chrome, Edge, Firefox, Safari). On a Mac the shortcuts use ⌘ where this README says Ctrl and ⌥ Option where it says Alt (Redo is ⌘⇧Z or ⌘Y). Tablets work too: one finger moves, two fingers zoom and pan, tap a text twice to edit it, press and hold for the menu.

Phones get a layout of their own (in windows under 700 px wide, and on a phone held sideways): the canvas fills the screen, a toolbar at the bottom holds Add, Layers, Select several, Sketch and Page (with something selected: Edit, Style, Duplicate, Arrange, Lock, Delete), and the panels open as sheets. A tap selects, a drag on a selected element moves it, a drag anywhere else pans (a flick goes on for a moment), two fingers zoom, press and hold for the menu; a stylus works as a finger does, and draws in Sketch. At a phone's opening zoom a small element simply moves when dragged (zoom in for its ends and points). Export makes a PNG and Share… sends it to Photos, Files or a message; several figures go into one .zip. A link opened inside an app (LinkedIn, Facebook…) lands in that app's built-in browser, where exports may not save and figures may not last: the editor says so, and the page is better opened in Safari or Chrome. ⋯ → Help lists the gestures; Appearance → Phone layout turns it on or off (Off still keeps it under 560 px wide, where the side panels would leave no canvas; ?phone=1 / ?phone=0 in the address force it for one visit).