Tiphys: a visual workspace for Argo Workflows

Design visually. Run on Argo.

Start with a blank canvas: drag components from the left-hand library, configure them, and draw connections. Or copy a YAML example from the official Argo repository, paste it into Tiphys, and start from the imported graph.

Tiphys puts the graph, YAML, templates, and run details in one open-source workspace. It connects to your existing Argo installation, where Argo orchestrates the jobs on Kubernetes. The name comes from the helmsman of the Argo. Tiphys is an independent project.

Drag components, configure tasks, draw connections, then paste an official Argo example.

The walkthrough uses the compiled app with sample services and dummy credentials. No workloads were executed.

Build a workflow without writing YAML

Open Library on the left and drag a Container, an HTTP Request, and a Suspend component onto the empty canvas.

Select each node to configure it in the inspector. Here, prepare uses busybox:1.37 with the default echo hello command. check-api sends a GET request to https://example.com. approve leaves the duration empty to wait for approval.

Draw connections between the output and input dots: prepare → check-api → approve. Use the layout controls to arrange the graph. The inspector also exposes inputs, outputs, retries, and conditions.

Library on the left, three connected components on the canvas, and the container settings in the inspector.

Start from an official Argo YAML example

Open dag-diamond.yaml in the official Argo Workflows repository and click Copy raw file. Return to Tiphys, click an empty area of the canvas, and paste with Cmd+V or Ctrl+V.

Choose Open in New Tab in the import dialog. The four-step diamond appears: A branches into B and C, then both join at D. Your other draft stays open. Select a node to adjust its settings, or open YAML to inspect and edit the generated manifest.

Argo’s official diamond example after pasting, with the generated YAML beside the graph.

Tiphys serves Monaco, its language workers, and the Argo schema locally, with validation feedback before you apply YAML edits.

Visual editing supports a subset of Argo. Importing advanced YAML and regenerating it can drop unsupported fields or simplify constructs. Check the resulting manifest and set its namespace to match your Argo connection before submitting it. Argo performs the final validation.

Run it, inspect it, reuse it

Click Execute to submit the workflow through the gateway. Submitted means Argo accepted the request. Open the run to see its actual phase and logs. You can also suspend and resume workflows.

Get Toufic Hajj’s stories in your inbox

Join Medium for free to get updates from this writer.

Remember me for faster sign in

For repeated work, publish a WorkflowTemplate and reuse it from the template library. Tiphys stores these resources in Argo, and updates include the current resource revision so Argo can reject conflicting changes.

In production, Tiphys saves drafts for each signed-in user and keeps recovery copies in the browser. If a save fails, the editor tells you.

AI help when you want it

The optional Gemini integration can draft a workflow, analyze an existing one, or help edit a node. Use AI Ask for a starting manifest and Analyze with AI for feedback. Administrators configure the key and model on the server; access follows editor permissions.

AI Ask with a prompt for a separate four-step pipeline. This capture uses a sample Gemini service.

Review the images, commands, resource requests, dependencies, and permissions before running generated code. The graph, YAML editor, templates, and run views all work without AI.

Try it locally

Install Node.js 24 and pnpm 10.29.3, then run:

git clone https://github.com/thajj/tiphys.git
cd tiphys
pnpm install --frozen-lockfile
cp .env.example .env.local
pnpm dev

Open http://127.0.0.1:3000. You can explore the editor without a cluster. To connect development requests to Argo, set ARGO_ENDPOINT, ARGO_NAMESPACE, and ARGO_TOKEN in .env.local, then restart. For local AI assistance, also set GEMINI_API_KEY and GEMINI_MODEL to a model available to your Google project. Keep credentials in server-side variables.

Development mode uses in-memory resources and can simulate successful runs when Argo is unreachable. Dry run also simulates the graph without running containers. Use the compiled production gateway when checking execution against a real cluster.

Start with the repository’s hello workflow. Match its namespace to your configured Argo namespace before submitting it. Built-in patterns need your own images, commands, and environment settings too.

Deploying for a team

The Kubernetes deployment guide uses an OIDC login proxy and a Node.js gateway. The gateway keeps Argo credentials on the server and enforces editor permissions, namespace scope, and same-origin writes. The deployment serves a trusted team in one namespace, with shared workflows, templates, and logs.

Draft storage has one filesystem writer. The example runs one replica with a recreate strategy, so updates cause brief downtime. Scaling requires shared persistence. Editors can submit executable workloads, so keep Kubernetes RBAC and admission policies in place.

The automated tests cover browser flows, gateway permissions, container behavior, and an OIDC proxy fixture. Before deploying, verify login roles, workflow execution, logs, templates, and draft recovery with your own cluster and identity provider.

Try a workflow you know

Tiphys is licensed under Apache 2.0. The repository and v0.1.0 release include setup instructions, deployment guidance, tests, and contribution notes.

Tiphys is a proof of concept, and I plan to keep developing it. I’d welcome feedback on what works, what gets in your way, and what you’d like to see next. Ideas, bug reports, and real workflow examples will help me decide what to work on.

Share feedback or a reproducible example on GitHub. Please remove credentials and sensitive workflow data before posting.