1Amped

Einführung

Bevor ein Ingenieur eine physische Leiterplatte fertigt, was das Löten realer Bauteile erfordert und Zeit und Geld kostet, erstellt er eine digitale Version in SPICE (Simulation Program with Integrated Circuit Emphasis). SPICE ist die branchenübliche Software zum virtuellen Testen und Analysieren elektronischer Schaltungen. Die Software verwendet komplexe mathematische Modelle, um das elektrische Verhalten in der Schaltung präzise vorherzusagen.

So funktioniert es:

• Eingabe: Sie zeichnen den Schaltplan (Verbindung von Widerständen, Kondensatoren, Chips und anderen Bauteilen).
• Verarbeitung: SPICE berechnet die physikalischen Gesetze (unter Verwendung von Gesetzen wie dem Ohmschen Gesetz) für jede Komponente.
• Ausgabe: Es erzeugt Diagramme, die genau zeigen, was Spannung und Stromstärke zu jedem Zeitpunkt verhalten.

Es ermöglicht Ingenieuren, Fehler zu erkennen, die Leistung zu optimieren und Konstruktionen Stresstests zu unterziehen (z. B. zu überprüfen, was passiert, wenn die Temperatur zu hoch wird), ohne teure Hardware zu zerstören.

Diese branchenüblichen Tools sind jedoch oft notorisch komplex und vermitteln Lernenden abstrakte Daten statt intuitiver Erkenntnisse. Sie können insbesondere für Anfänger überfordernd wirken. Unser Kunde 1Amped wollte dies ändern und entwickelte einen zugänglichen, webbasierten Simulator, der die Lücke zwischen trockener Theorie und praktischem Verständnis schließt.

Herausforderung

1Amped wandte sich mit einer ambitionierten Vision an uns: die Art und Weise, wie Elektrotechnik gelehrt und praktiziert wird, zu verändern. Sie wollten einen webbasierten, interaktiven Schaltungssimulator entwickeln, der die professionelle Leistungsfähigkeit branchenüblicher Ingenieursoftware mit der intuitiven, visuellen Natur von Lernplattformen verbindet.

1Amped hatte sich zum Ziel gesetzt, eine Lösung zu entwickeln, die Universitäten, Hochschulen und Hobbyisten ein sicheres virtuelles Labor bietet, in dem sie ohne Konsequenzen experimentieren können, und die komplexe Physik von einschüchternden Formeln in interaktive, visuelle Erlebnisse verwandelt.

Die Entwicklung eines funktionsfähigen Softwareprodukts aus einer theoretischen Idee erfordert jedoch mehr als nur gute Ideen. 1Amped wandte sich an uns aufgrund unserer umfassenden Expertise in der ganzheitlichen Produktentwicklung und Geschäftsanalyse. Ihr Ziel war es, das Konzept zunächst gründlich zu prüfen, Risiken zu identifizieren und einen klaren Weg zur Markteinführung zu entwickeln.

Unser Hauptprojekt begann mit einer gründlichen Analysephase. 1Amped benötigte eine detaillierte Strategie, bevor auch nur eine Zeile Code geschrieben wurde, um die Marktfähigkeit, Skalierbarkeit und Wettbewerbsfähigkeit des Produkts sicherzustellen. Unser Leistungsumfang umfasste:

• Anforderungsanalyse: Erstellung eines umfassenden Anforderungsspezifikationsdokuments, einschließlich User Stories, Scope-Definitionen und Risikobewertungen.
• UX/UI-Prototyping: Erstellung erster Skizzen und Wireframes zur Visualisierung der Benutzeroberfläche. Wir mussten eine intuitive UX/UI entwickeln, die es auch Anfängern ermöglicht, Komponenten per Drag & Drop zu platzieren, ohne überfordert zu werden, und gleichzeitig komplexe Schemata, Kontextmenüs und Tastenkombinationen für fortgeschrittene Benutzer unterstützt.
• Systemarchitektur: Entwicklung einer sicheren, skalierbaren technischen Architektur und Auswahl des passenden Technologie-Stacks. Wir mussten die Datenbank und die Backend-Logik bereits heute so konzipieren, dass sie morgen komplexe Benutzerrollen, Berechtigungshierarchien und Content-Management-Funktionen unterstützen. So vermeiden wir eine komplette Neuentwicklung, wenn der Kunde bereit für die Skalierung ist.

Lösung

Um die komplexen Visionen von 1Amped zu bewältigen, führten wir eine strukturierte Analysephase durch. Wir erstellten einen konkreten Entwicklungsplan und stellten sicher, dass jede technische Entscheidung mit den Geschäftszielen und den Bedürfnissen der Nutzer übereinstimmte.

Anforderungsspezifikation

Unser erster Schritt bestand darin, das gesamte Projektwissen zu zentralisieren. Wir nutzten Confluence, um ein umfassendes Anforderungsspezifikationsdokument zu erstellen und zu teilen. Dieses Dokument diente als zentrale Informationsquelle für das Projekt und beschrieb detailliert die Vision und Mission des Produkts, die konkreten Ziele, die wir erreichen wollten, sowie eine vollständige Liste der funktionalen Anforderungen, aufgeschlüsselt in User Stories.

Wir haben außerdem eine klare Definition des Projektumfangs bereitgestellt, um genau festzulegen, was einbezogen (und ausgeschlossen) wird, um eine Ausweitung des Projektumfangs zu verhindern, sowie eine Risikobewertung, um potenzielle Fallstricke frühzeitig zu erkennen.

Ein entscheidender Bestandteil dieser Phase war unsere umfassende Benchmark-Analyse. Wir wussten, dass wir das Marktumfeld verstehen mussten, um ein überlegenes Produkt zu entwickeln.

• Wettbewerbsanalyse: Wir haben die acht stärksten Wettbewerber ausgewählt und ihre Stärken und Schwächen analysiert. Dabei berücksichtigten wir unter anderem Faktoren wie die Lernkurve, den Wartungsaufwand (z. B. sporadische oder regelmäßige Weiterentwicklung) und ob sie ein Freemium-Modell anbieten und was dieses genau beinhaltet.
• Funktionsanalyse im Detail: Wir haben ihre Simulationsfähigkeiten untersucht, z. B. ob sie fortgeschrittene Funktionen wie Rauschanalyse oder Monte-Carlo-Simulationen anbieten oder ob sie auf Grundlagen beschränkt sind.
• Interaktivität: Wir bewerteten die Benutzerfreundlichkeit. Beispielsweise stellten wir fest, dass einige Wettbewerber die Benutzer zwingen, Schaltpläne in umständlichen Textformaten (Konsolenmodus) zu erstellen, während eine grafische Oberfläche deutlich überlegen ist. Wir achteten außerdem auf interaktive Elemente wie Schalter, die sich per Klick öffnen und schließen lassen, oder LEDs, die aufleuchten.

UX/UI-Design

Unsere Designphilosophie bestand darin, die Präzision professioneller Ingenieurwerkzeuge mit der Benutzerfreundlichkeit einer modernen Kreativ-App zu verbinden. Das UX/UI-Design wurde von den eleganten, dunklen Oberflächen von Programmen wie Adobe Photoshop und Altium Designer inspiriert. Wir haben einen Look geschaffen, der absolut professionell und gleichzeitig für Studierende leicht zugänglich ist.

Um eine kognitive Überlastung zu vermeiden, haben wir eine klare, intuitive räumliche Logik entwickelt. Der Bildschirm ist in drei verschiedene Zonen unterteilt:

• Komponentenpalette auf der linken Seite (was ich brauche)
• Aktiver Arbeitsbereich in der Mitte (wo ich arbeite)
• Kontextfelder auf der rechten Seite (was ich als Nächstes tue)

Diese Struktur lenkt den Blick des Nutzers intuitiv durch den Arbeitsablauf und stellt sicher, dass sich die Werkzeuge stets genau dort befinden, wo sie erwartet werden. Um die Augenbelastung bei längeren Lernsitzungen zu reduzieren, haben wir die klare Schriftart Inter verwendet.

Wir haben die Komplexität der verschiedenen Ansichten mit einem flexiblen, modularen System bewältigt. Benutzer können zwischen den Registerkarten „Schaltplan“ und „Ergebnisse“ wechseln, um sich entweder auf den Schaltungsentwurf oder die Diagrammanalyse zu konzentrieren. Die Bedienfelder sind ein- und ausklappbar, in der Größe anpassbar und verschiebbar. Erfahrene Ingenieure können den Bildschirm leeren, um den Arbeitsbereich zu maximieren. Studierende können das Kurs-Bedienfeld geöffnet lassen, um neben ihrer Live-Simulation Schritt-für-Schritt-Anleitungen zu folgen.

Schließlich optimierten wir unseren Workflow hinsichtlich Geschwindigkeit und zukünftigem Wachstum. Wir ergänzten unseren Designprozess um künstliche Intelligenz, um schnell Prototypen verschiedener Interface-Szenarien zu erstellen. So konnten wir ungeeignete Optionen rasch aussortieren und uns auf die Lösungen konzentrieren, die den Nutzern wirklich weiterhalfen. Zudem stellten wir sicher, dass die Interface-Architektur skalierbar ist und Kapazitäten für zukünftige Funktionen wie Leiterplattenlayout und 3D-Ansichten vorsieht, um spätere, kostspielige Überarbeitungen zu vermeiden.

Wir haben alles in Figma erstellt und organisiert, um ein einheitliches Design zu gewährleisten. So können alle die Entwürfe problemlos überprüfen, und die Entwickler haben genau das, was sie für die Umsetzung benötigen.

Architekturdesign

Um 1Ampeds Vision eines professionellen Browsersimulators zu unterstützen, haben wir einen skalierbaren, vierstufigen Architekturplan auf Basis von Microsoft Azure entworfen. Wir schlugen vor, das System in logische Schichten zu unterteilen:

• React.js-Frontend für eine responsive Benutzeroberfläche
• .NET 8.0-Backend für Geschäftslogik
• Eine dedizierte, auf Python basierende Simulatorschicht nutzt NGSpice für komplexe Berechnungen und Azure SQL für die sichere Datenspeicherung

Diese Trennung wurde so konzipiert, dass aufwändige Simulationsberechnungen die Benutzererfahrung niemals beeinträchtigen.

Für die Infrastruktur wählten wir Azure Kubernetes Service (AKS), um eine hohe Elastizität zu gewährleisten. Unser Design beinhaltet Auto-Scaling-Konfigurationen, die bei Lastspitzen automatisch Serverressourcen hinzufügen und in Zeiten geringer Auslastung wieder reduzieren, um Kosten zu sparen.

Um Browser-Einfrierungen während intensiver Simulationen zu verhindern, haben wir die Verwendung asynchroner Verarbeitung mit Nachrichtenwarteschlangen spezifiziert, wodurch komplexe Berechnungen effektiv von Echtzeit-Interaktionen entkoppelt werden.

Sicherheit und Datenintegrität standen im Mittelpunkt unserer Architekturplanung. Wir definierten ein Sicherheitsframework, das OAuth 2.0 und JSON Web Token (JWT) für eine sichere, rollenbasierte Zugriffskontrolle nutzt und Benutzerdaten durch HTTPS-Verschlüsselung schützt. Für die Datenausfallsicherheit entwickelten wir eine georedundante Backup-Strategie. Diese beinhaltet regelmäßig gespeicherte Transaktionsprotokolle, um sicherzustellen, dass die Daten von 1Amped auch im Falle eines regionalen Ausfalls sicher und wiederherstellbar bleiben.

Abschließend skizzierten wir eine robuste CI/CD-Strategie, um die zukünftige Zuverlässigkeit zu gewährleisten. Wir empfahlen eine Blue/Green-Deployment-Strategie, die es ermöglicht, neue Funktionen oder Fehlerbehebungen ohne Ausfallzeiten zu veröffentlichen. Neben der einfachen Automatisierung definierten wir eine strenge Pipeline für Codequalität und -sicherheit, die statische Analyse und Abhängigkeitsscans zur frühzeitigen Erkennung von Schwachstellen umfasst. Diese Roadmap bietet dem zukünftigen Entwicklungsteam einen klaren Weg, um Updates sicher bereitzustellen und so die Stabilität der Plattform für die Nutzer rund um die Uhr zu gewährleisten.