Case Study · Natives Desktop · Tauri 2 · Solo + KI

EngiBoard.

Ein Desktop-SaaS für Ingenieure. In 4 Wochen ausgeliefert. Erfassen, annotieren, verfolgen – ein Binary.

Keine Neueinstellungen. Öffentlich auf GitHub.

ProduktUX / UITauri 2 · RustNext.js · Supabase

Gespräch buchen Alle Cases

Annotationseditor mit Pfeil, Rechteck und Text auf einer Lüfterschaufel-Zeichnung

EngiBoard-Hauptaufgabenliste mit Vorher-/Nachher-Screenshots pro Aufgabe

Releasesgetaggt, jedes öffentlich

Cmd + Shift + GAufnahme

6Tage, 7 Stunden

44getaggte Releases

98Commits

4Installer, Mac + Windows

18Oberflächen, ein Binary

0Neueinstellungen

Zusammenfassung in 20 SekundenStudio-Build · im Einsatz bei 2 Kundenteams

Was: Ein nativer Desktop-Tracker für Vorher-nachher-Fotoberichte von Ingenieuren, unter Mac und Windows.
Warum: Baustellenberichte liefen über vier zusammengeklebte Apps (Kamerarolle → Telegram → Word), und bei jeder Übergabe ging Kontext verloren.
Meine Rolle: Produkt, UX/UI und Engineering, solo mit KI: Tauri 2, Next.js, Supabase.
Ergebnis: 44 getaggte Releases · 4 Installer · 0 Neueinstellungen

Case entdecken ↓

Überblick

Ein nativer Tracker für Ingenieure, die Vorher-nachher-Fotoberichte auf Baustellen und in der Produktion erstellen.

Tauri 2Native ShellmacOS · WindowsInstallerv0.1.44Live

ProjektEngiBoard Desktop

StackTauri 2 · Next.js · Supabase

Zeitraum28. Apr → 4. Mai · 4 Wochen, 7 Std.

Statusv0.1.44 · live in Produktion

Die ganze Story lesen

Tauri 2 + Next.js + Supabase. Installer für macOS und Windows. 44 getaggte Releases. 98 Commits. Keine Neueinstellungen. Öffentlich auf GitHub.

Ein nativer Desktop-Tracker für Ingenieure, die Vorher-nachher-Fotoberichte auf Baustellen und in der Produktion erstellen. Zuerst für den Gründer selbst gebaut – dann für zwei echte Kunden, die ausschließlich Windows nutzen, in der Produktions-QA.

Alle Screens

18 Oberflächen. Ein Binary.

Oberflächenhell + dunkel, Mac + Windows

Alle 18 Oberflächen

Jede Oberfläche ist für genau eine Sache gestaltet, die der Ingenieur gerade tut. Keine Konfiguration, keine Setup-Seiten, kein „Erweitert“.

01 · Login
02 · Hauptboard
03 · Projektauswahl
04 · Dashboard
05 · Slideshow + Pins
06 · Annotationseditor
07 · Vergleichs-Wipe
08 · Dark Mode
09 · Dashboard dunkel
10 · Auswahl dunkel
11 · Login dunkel
12 · Out-of-Scope-Dialog
13 · Leerer Zustand
14 · Profil
15 · Sniper-Overlay
16 · Einfügemodus
17 · Statusmenü
18 · Mehrfachauswahl

Problem & Lösung

Kamerarolle → Telegram → Word. Erledigt.

Jeder Baustellenbesuch verlor Kontext: Fotos gingen in Chats unter, Annotationen lagen weit weg von der Aufgabenliste.

Kamerarolle›Telegram›Tabelle›Word›PDF→EngiBoard

01 · Aufgabe

Erfassen, markieren, anhängen.

Native Screenshot-Geschwindigkeit, Aufgaben im Linear-Stil.

02 · Problem

Vier zusammengeklebte Apps.

Jede Übergabe verliert Kontext.

03 · Lösung

Ein Binary.

Einen Kommentar an einen Pixel heften – nicht an einen Zeitstempel.

Die ganze Story lesen

Die bestehende Toolchain bei jedem Baustellenbesuch war verlustbehaftet und langsam. Fotos verschwanden in Chats, Annotationen lagen in einer anderen App als die Aufgabenliste, Berichte verloren ihren Kontext, sobald sie weitergeleitet wurden.

01 · Aufgabe – ein Desktop mit einem Zweck. Erfassen, markieren, anhängen. Native Screenshot-Geschwindigkeit, Aufgabenstruktur im Linear-Stil, am Bild verankerte Diskussionen. Ingenieure bleiben in einer App – statt über vier hinweg zu kleben.
02 · Problem – vier Apps, zusammengehalten mit Screenshots und Hoffnung. Kamerarolle → Telegram → Tabelle → Word → PDF. Jede Übergabe verliert Kontext. Annotationswerkzeuge liegen woanders als die Aufgabenliste.
03 · Lösung – ein Binary. Erfassen, annotieren, verfolgen. Ein Tauri-natives Overlay erfasst jeden beliebigen Bereich. Editor mit sechs Werkzeugen. Aufgaben nach Projekt gruppiert, acht farbcodierte Status. Einen Kommentar an einen Pixel heften – nicht an einen Zeitstempel.

EngiBoard-Hauptboard: nach Wochen gruppierte Aufgaben mit Vorher-/Nachher-Screenshots und Inline-Chat

„Das erste Tool, das genau den Ablauf abbildet, den ich vor Ort tatsächlich durchlaufe – statt dreier halber Tools, die ich zusammenkleben muss.“

Alex Stepikin · Gründer, Designer, Engineer

Aufnahme-Flow

Bereich. Annotieren. Anhängen.

Cmd+Shift+G löst von überall ein transparentes Overlay aus. Aufziehen, annotieren, im Vorher-/Nachher-Slot speichern.

Aufnahme

Native Bereichsaufnahme unter macOS / Windows.

Sniper-Overlay: einen Bereich über ein beliebiges Fenster ziehen

Annotieren

Sechs Werkzeuge, immer im Vordergrund.

Anhängen

Zurück zur Aufgabe, vorher oder nachher.

Einfügemodus: Slot „Vorher“ oder „Nachher“ wählen

PfeilRechteckStiftTextWeichzeichnerMarkierung

Die ganze Story lesen

Cmd+Shift+G löst von überall ein transparentes Vollbild-Overlay aus. Rechteck aufziehen. Native Aufnahme unter macOS / Windows. Der Editor öffnet sich mit dem fertigen PNG, sechs Werkzeuge sind sofort aktiv – Pfeil, Rechteck, Stift, Text, Weichzeichner, Markierung. Speichern legt das annotierte Bild in den gewählten Vorher-/Nachher-Slot.

Das Board

Wo die Arbeit lebt.

Aufgaben nach Projekt gruppiert, direkt eingetippt – kein Dialog, kein Doppelklick, kein Umweg.

Board mit mehrfach ausgewählten Aufgaben und schwebender Aktionsleiste

Statusfarbcodiert

01
Inline-AufgabeneingabePro Gruppe, ohne Umweg.
02
Mehrere ScreenshotsMehrere Bilder pro Aufgabe.
03
Umbenennen, neu ordnenOhne das Board zu verlassen.

Die ganze Story lesen

Die Sidebar gruppiert Aufgaben nach Projekt. Inline-Aufgabeneingabe pro Gruppe – kein Dialog, kein Doppelklick, kein Umweg. Acht farbcodierte Status. Mehrere Screenshots pro Aufgabe. Umbenennen und neu ordnen, ohne das Board zu verlassen.

Bildverankertes Review

An einen Pixel heften, nicht an einen Zeitstempel.

Reviews leben im Bild. Pixel anklicken, Pin setzen, schreiben – als Thread, mit mehreren Reviewern.

Lightbox · Pins

Lightbox-Slideshow mit Kommentar-Pins auf einem Bild einer Lüfterschaufel

Pins pulsieren orange, solange sie ungelesen sindDanach werden sie blau, mit Zahl.

Vergleichs-Wipe

Linie ziehenDen Unterschied sehen – ohne Umschalten.

Die ganze Story lesen

Reviews leben im Bild, nicht in einem separaten Thread. Screenshot in der Lightbox öffnen – beliebigen Pixel anklicken – orangen Pin setzen – Kommentar schreiben. Mehrere Reviewer, als Thread. Wipe-Regler für Vorher/Nachher, zum Aufdecken ziehen.

Lightbox · Pins – Pixel anklicken, Kommentar schreiben. Pins pulsieren orange, solange sie ungelesen sind, und werden nach dem Ansehen blau, mit Zahl. Die rechte Leiste listet jeden Kommentar mit Autor, Uhrzeit und Löschen. Mehrere Reviewer, vollständig als Thread.

Vergleichs-Wipe – Linie ziehen, Unterschied sehen. Zwei Screenshots übereinander, ein einziger Ziehgriff. Kein Flackern, kein Umschalten, kein „Tab wechseln“ – reines Muskelgedächtnis. Funktioniert bei jeder Aufgabe, an der Vorher und Nachher hängen.

Tracking

Acht Status. Zwei Ansichten.

Jede Farbe hat zehn Ablehnungen überstanden – keine ist Dekoration.

ErledigtProblemIn ArbeitReviewInfo erforderlichAnstehendNicht relevantInfo

Dashboard: Projektzahlen und Statusverteilung

Klickum eine oder mehrere Aufgaben zu verschieben

Die ganze Story lesen

Erledigt, Problem, In Arbeit, Review, Info erforderlich, Anstehend, Nicht relevant, Info – acht Status, und jeder hat sich seine Farbe verdient. Das Dashboard fasst Summen über alle Projekte zusammen; im Statusmenü ändern Sie eine oder viele Aufgaben mit einem Klick.

Dashboard – Überblick statt Appell. Projektzahlen, Statusverteilung, größte Blocker. Ein Screen beantwortet: Wo hängt das Team? Kein Drill-down, bevor Sie das ganze Feld gesehen haben.

Statusmenü – ein Klick, um alles zu verschieben. Rechtsklick auf eine Aufgabe, Status ändern. Zeilen mehrfach auswählen und alle auf einmal ändern. Acht Farben, die zehn Ablehnungen überstanden haben – jede hat eine Bedeutung, keine ist Dekoration.

Hell – Baustelle in der SonneDunkel – Büro, Abend, OBS

Plattformübergreifend

Gleiche UX, jede Plattform.

Mac M-SerieMac IntelWindows EXEWindows MSI

Die ganze Story lesen

Mac M-Serie, Mac Intel, Windows EXE, Windows MSI. Gemeinsames HTML/CSS/JS-Frontend, native Tauri-2-Shell. Der Dark Mode lässt sich pro Oberfläche umschalten, nicht pro App. Beschwerden der Tester fließen in den nächsten Release-Tag zurück.

Helles Theme – Sonne auf der Baustelle. Standardoberfläche. Höherer Kontrast auf Fotos, angenehmer bei realem Licht. Die Druckvorschau entspricht dem, was Sie sehen.

Dunkles Theme – Büro, Abend, OBS-Overlay. Gemacht für Triage spät am Abend und bildschirmaufgezeichnete Walkthroughs. Gleicher Inhalt, tieferer Canvas, die Statusfarben behalten in beiden Themes ihre Bedeutung.

Designsprache

Geist fürs Produkt. Mono fürs System. Sky, Amber, Tiefschwarz.

Schrift

{ }

Geist 400–700 für die UI; Geist Mono für Zeitstempel, Versionen, Hotkeys.

Palette

Sky#0EA5E9

Sky Light#7DD3FC

Amber#FFC940

Schwarz#0A0A0C

Regel

Amber gehört einem einzigen Status – „In Arbeit“ –, weil er es sich verdient hat.

UI-Kit

Schrift und Palette im Detail

Typografie. Geist Sans in der gesamten App – eine klare, moderne Sans, abgestimmt auf dichte Produktoberflächen. Geist Mono für die Stellen, an denen das System antwortet: Zeitstempel, Dateigrößen, Versions-Tags, Hotkey-Hinweise.

Geist · 400 / 500 / 600 / 700 – primäre UI. Enge Laufweite, neutrales Gerüst. Von Caption (10 px) bis Display (96 px).
Geist Mono · 400 / 500 – Zeitstempel, Versions-Tags, Dateipfade, Kommandozeilen-Hinweise. Überall dort, wo das System präzise ist.
Instrument Serif · Kursiv – redaktioneller Akzent, nur in der Case Study: Hero-Sätze, Zitate, ruhige Momente. Nicht in der App.

Palette. Sky-Blau trägt die Marke und die aktiven Zustände. Amber gehört einem einzigen Status – „In Arbeit“ –, weil er es sich verdient hat. Tiefschwarz erdet den Canvas; alles andere ist System-Weiß auf Rauschen.

Engineer Sky #0EA5E9 – Marke, aktive Zustände, Primäraktionen, Links.
Sky Light #7DD3FC – Hover, Fokus-Glow, dezente Aufhellung in Hero-Verläufen.
In-Progress Amber #FFC940 – eine verdiente Status-Pill. Sparsam eingesetzt – nie Dekoration.
Studio Black #0A0A0C – Canvas. Licht aus. Jeder Screenshot beginnt hier.

Prozess

Sieben Tage, achtunddreißig Tags.

Jedes Release-Tag baut in der CI echte Binaries. Ein Tester beschwert sich morgens, nach dem Mittagessen ist der Fix da.

Tag 1 · 28. AprTauri-Scaffoldv0.1.1 → v0.1.9

Tag 2 · 29. AprSniper-Overlayv0.1.10

Tag 3 · 30. AprAnnotationseditorv0.1.11 → v0.1.12

Tage 4–5Dogfooding durch den GründerFeldtest

Tag 6 · 3. MaiSprint-Tagv0.1.13 → v0.1.24

Tag 7 · 4. MaiFinaler Sprintv0.1.25 → v0.1.44

ÖffentlichLive44 Releases

Tag für Tag

Stündlicher Takt: Jedes Tag löst eine CI-Pipeline aus, die echte, auslieferbare Binaries erzeugt – Mac M-Serie, Mac Intel, Windows EXE, Windows MSI. Ein Tester beschwert sich morgens, nach dem Mittagessen ist der Fix da.

Tag 1 · 28. Apr – Tauri-Scaffold. Skelett, GitHub-Actions-Pipeline. Kurswechsel beim nativen screencapture noch vor Mittag. v0.1.1 → v0.1.9.
Tag 2 · 29. Apr – Sniper-Overlay. Eigenes transparentes Vollbild, Aufnahme per Bereichsauswahl. Native Qualität, unsere Kontrolle. v0.1.10.
Tag 3 · 30. Apr – Annotationseditor. Sechs Werkzeuge – Pfeil, Rechteck, Stift, Text, Weichzeichner, Markierung. Immer im Vordergrund, ohne den Fokus zu stehlen. v0.1.11 → v0.1.12.
Tage 4–5 · 1.–2. Mai – Dogfooding durch den Gründer. Zwei Tage echte Baustellenbegehungen. Konkrete statt vager Beschwerden. Feldtest.
Tag 6 · 3. Mai – Sprint-Tag. Zwölf Versionen in 24 Std. Inline-Aufgaben, mehrere Screenshots, PDF-Export, Dark Mode, RU/EN, Lightbox-Pins. v0.1.13 → v0.1.24.
Tag 7 · 4. Mai – Finaler Sprint. Vierzehn Versionen. Projektauswahl, Inline-Chat, Vergleichs-Wipe, OAuth-Retry, Windows-Kunden an Bord. v0.1.25 → v0.1.44.
Öffentlich – Live. Mac DMG · Mac Intel · Win EXE · Win MSI. Alle öffentlich in den GitHub Releases. 44 Releases.