Skip to content

ImSwitch-OS Onboarding: first-run flow, networking, Tailscale, config & landing page #172

@beniroquai

Description

@beniroquai

This project is tracked on Notion at https://www.notion.so/First-Time-FRAME-Customer-Onboarding-UX-iter-1-2774e612c78a8086a5b6ff70cf8bfff9?source=copy_link


Together with @ethanjli and @gokugiant we have been discussing the best strategy on how to interact with the microscope the first time. Based on valuable feedback from @Mikrodoktor we have probably identified a rough first milestone for our project: See an image through the webinterface and change necessary configurations on the way
Below I formulate the issue and/or necessary steps to reach this goal. It's all very vaguely formulated. The Drawio file for the graph can be found here.

The documentation could/should live here? https://github.com/openUC2/openUC2.github.io/blob/master/docs/05_ImSwitch/01_Quickstart.mdx

So, we want tomplement the end-to-end onboarding for new customers unpacking a FRAME microscope. Users should reach a landing page via LAN or Wi-Fi, configure networking, Tailscale, ImSwitch, updates, and file presets with safe rollback.

Diagram

Scope & Owners

  • Frontend/Backend (ImSwitch UI + API, config wizard, update UI, presets, firmware trigger) => I guess @gokugiant
  • OS image, networking stack, captive portal, DHCP/DNS, Tailscale, services, persistence, security => I guess @ethanjli
  • Testing and complaining: @Mikrodoktor

...but we will learn on the way ;-)

I think the Configuration is shared: @gokugiant you probably provide the schema/UI + API from the ImSwitch/React side and @ethanjli provides storage location, defaults, docker integration, updates through forklift and systemd services.. ?

User flow

I can imagine to have the following pathways:

  1. LAN => discover device => open IP => Landing Page (discovery either our installer imswitchinstaller/main.js at main · openUC2/ImSwitchInstaller or something like angryipscanner?)
  2. Wi-Fi => see SSID => connect with PW (youseetoo) => captive portal opens automatically (?) (fallback to IP) => Landing Page

Landing Page cards: Open ImSwitch, Network, Computer, Updates, Files, Tailscale. (@ethanjli you have started that already in the pallet repo https://github.com/openUC2/pallet/

Deliverables

These are some random points that we should discuss! Please complain/change anything :)

App (ImSwitch) @gokugiant

  • Config Wizard (first-run + re-run)
  • Connect to nearby Wi-Fi (via API to OS) (=> WifiController.py)
  • Restore config from file / Fallback
  • Show current config + validation in the GUI maybe through the ConfigWizard
  • “Safe apply” with auto-rollback on failure - maybe check config for validity/integrity?
  • ImSwitch settings pages for:
    • API/backend settings (host, ports, HTTPS off/on, tokens)
    • Camera, stage, modules; persist via common config store => I think this would be a dreamm..have a page of any of the components in the microscope and have a dropdown to customize the settings - maybeintegrated via the youseetoo.gihtub.io/configurator at one point :) Some inspriation here https://www.nature.com/articles/s41592-021-01315-z (Actually REACT based)
Image
  • Files UI (already existing - mostly for images/videos captured with microscope, no OS stuff - has to be served through docker mounts)
  • ImSwitchConfig rework
    • “Single source of truth” indicator (which node stores master config); how is it loaded, CLI vs python main.py vs. Docker - where do we store it?
    • Sideload config via USB drive?
  • Error handling: toast + details, retry, copy diagnostics.
  • Telemetry/logging: structured logs for onboarding steps.
  • Docs: short first-run guide with screenshots.

OS/Networking @ethanjli

  • Landing Page (web) with cards linking to modules below.
  • Base image with services (systemd) and health-checks via forklift
  • Networking modes
    • Wi-Fi STA connect (from API)
    • AP fallback with captive portal + local DNS (opens landing page)
    • LAN discovery (mDNS/LLMNR + DHCP reservation hints)
    • Optional tethering (USB↔Ethernet) and LAN↔Wi-Fi bridge mode
    • USB to LAN compatibility?
  • Captive portal: intercept + redirect to landing; HTTPS-blocking bypass note.
  • Device discovery: mDNS inswitch.local (and variant) with proper firewall settings
  • Config store
    • Location + format (e.g., /etc/inswitch/config.yaml + /data/…)
    • Transactional write with rollback on network loss
  • Tailscale
    • Preinstalled client; first-run auth flow (QR + URL shown in portal)
    • Status JSON for UI; persistent state; ACL docs
  • Security
    • Firewall defaults (allow LAN portal/API; block WAN where needed)
  • Updates UI (maybe through landing page instead?)
    • Read versions and display in landing page for OS/app/docker/forklift
    • Trigger app/container updates; progress + logs via landing page?
    • Firmware updater hook (OS hook?)

...there is probably a lot missing ;)

Acceptance criteria

@Mikrodoktor please add your expectation here :)

  • From factory reset, user reaches landing page via either LAN or Wi-Fi in ≤2 min.
  • Wizard connects the device to a protected Wi-Fi and keeps access (no lock-out).
  • AP fallback works if STA fails; portal opens automatically.
  • Tailscale shows “connected” after auth; status visible in UI.
  • Config changes are atomic; rollback works on failure.
  • Updates show progress and final status; device remains reachable.
  • Support bundle downloadable from UI.
  • Can connect to nearby Wifi
  • Need to be able to update the device in offline-only mode somehow

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions