Datengetriebenes Training für Athlet:innen und Coaches

Das Startup-Unternehmen StrengthLab360 revolutioniert das Krafttraining, indem mit wissenschaftlich fundierten Prozessen individuelle Bedürfnisse und Trainingspläne dynamisch angepasst werden, um optimale Ergebnisse erzielen zu können. Wir unterstützen StrengthLab360 bei ihrer Vision mit der Konzeption und Ausgestaltung ihrer Webapp.

Project Scoping

Research & UX

Interfacedesign

Webentwicklung

Als Antwort auf die steigenden Anforderungen an digitales Coaching und Training haben wir eine Webanwendung entwickelt, die sowohl Coaches als auch Athlet:innen optimal unterstützt. Unser Kunde war äußerst ambitioniert und verfolgte eine klare Vision für die Plattform. Deshalb war eine enge und agile Zusammenarbeit essentiell, um Ideen schnell zu validieren und weiterzuentwickeln. Gleichzeitig durfte die Nutzerperspektive nicht vernachlässigt werden. Die Webapp sollte nicht nur leistungsstarke Funktionen für Sportler:innen und Trainer:innen bieten, sondern auch eine intuitive und benutzerfreundliche Erfahrung gewährleisten.   <h2 dir="ltr">Herausforderung</h2> Ein besonderes Merkmal dieser Webapp ist, dass sie sich von herkömmlichen Anwendungen unterscheidet: Dabei liegt der Fokus nicht auf der Nutzung der Webapp selbst, sondern auf ihrer Rolle als unterstützendes Tool während des Trainings. Ein zentrales Feature ist das Logging, also das Protokollieren von Sätzen, Gewichten und Wiederholungen, um den Trainingsfortschritt zu messen. Da die App in diesen Momenten nur kurz genutzt wird, muss sie extrem intuitiv und schnell bedienbar sein, um den Trainingsprozess nicht zu stören. Dies stellte besondere Anforderungen an das UI/UX-Design. Die Anwendung sollte sich demnach nahtlos in den Trainingsprozess einfügen und den Nutzer:innen ermöglichen, ihre Workouts effizient zu dokumentieren, ohne sie dabei abzulenken.   <h2 dir="ltr">Unsere Rolle</h2> StrengthLab360 setzte auf unsere Expertise in Strategie, im Design und der Entwicklung, wodurch wir durch folgende Leistungen bei der Umsetzung des digitalen Coaching- und Trainingserlebnisses unterstützen konnten. <ul> <li dir="ltr" aria-level="1"> Project Scoping Workshop  </li> <li dir="ltr" aria-level="1"> UX Design / Research </li> <li dir="ltr" aria-level="1"> Interfacedesign </li> <li dir="ltr" aria-level="1"> Technische Beratung </li> <li dir="ltr" aria-level="1"> Frontend-Entwicklung </li> </ul>

Project Scoping Workshop

Umfangreiche Apps können trotz vorbildlicher Vorarbeit unkontrollierbar werden und unvorhergesehene Kosten verursachen. Durch einen professionell durchgeführten Project Scoping Workshop werden die Projektrisiken frühzeitig verstanden, um Gegenmaßnahmen abzuleiten. Wir konnten den Funktionsumfang in aufeinander aufbauende Versionen unterteilen, um durch frühe Usertests kontinuierliches Feedback zu erhalten und die Entwicklung nutzerzentriert zu gestalten. Wir priorisierten Features gezielt nach Nutzerbedürfnissen, um den größten Mehrwert zu bieten.

UX Design/Research

Um die spezifischen Anforderungen und Arbeitsweisen der Zielgruppen, Coaches und Athlet:innen zu verstehen, erstellten wir unterschiedliche konzeptionelle Designansätze, , um eine optimale Lösung für jede Nutzergruppe zu entwickeln. Ergänzend dazu analysierten wir den Markt und den Wettbewerb, um Stärken und Schwächen bestehender Lösungen zu identifizieren und innovative Ansätze abzuleiten. Durch die Auswertung von Best Practices aus dem digitalen Coaching- und Fitnessbereich stellten wir sicher, dass unsere Lösung sowohl funktional als auch benutzerfreundlich ist. Bestehende User Flows, wie das Onboarding-Verfahren, Trainingsplanung und das -logging, wurden überarbeitet, um eine reibungslose und intuitive Nutzung zu ermöglichen. Anschließend wählten wir ein geeignetes Designsystem. <h3 dir="ltr"> </h3> <h3 dir="ltr">Welche Vorteile bringt ein geeignetes Designsystem?</h3> Ein Designsystem gewährleistet Skalierbarkeit, Konsistenz und Benutzerfreundlichkeit. In unserem Projekt sorgte es für eine intuitive und einheitliche Nutzererfahrung – von der Workout-Planung bis zur Interaktion mit Trainer:innen. Klare Gestaltungsrichtlinien und wiederverwendbare Komponenten reduzierten die kognitive Belastung, erleichterten die Navigation und beschleunigten die Entwicklung. Die Nutzung von ShadCN sicherte eine wartbare, skalierbare Codebasis für zukünftige Erweiterungen.

Drei Handy-Ansichten mit Workout-Plänen.

Interfacedesign

<h3 dir="ltr">Mobile First</h3> Das Interface-Design folgt dem Mobile-First-Prinzip, um sicherzustellen, dass die wesentlichen Inhalte und Funktionen optimal auf kleineren Displays dargestellt werden. Dies ist besonders sinnvoll, da die Web-App trainingsbegleitend verwendet wird und Nutzer:innen, sowohl Athlet:innen als auch Coaches, sie oft direkt während des Trainings auf mobilen Geräten aufrufen. Es gibt keine inhaltlichen Unterschiede zwischen mobilen und stationären Geräten, sodass alle Nutzer:innen denselben Funktionsumfang ohne Einschränkungen erhalten.   <h3 dir="ltr">High-Fidelity Mockups</h3> Für die Gestaltung der Benutzeroberfläche kommt ShadCN als Designsystem zum Einsatz. Dies gewährleistet ein modernes und konsistentes UI-Design mit vordefinierten, anpassbaren Komponenten. Dabei wird auf WCAG-konforme Barrierefreiheit geachtet, um die Nutzung für alle Anwendergruppen zu optimieren. Zudem wird das Interface visuell an das Corporate Identity (CI) der Anwendung angepasst, um eine stimmige Markenpräsenz sicherzustellen. Das Design bleibt dabei vollständig kompatibel mit der verwendeten Technologie, insbesondere mit React, um eine effiziente und performante Umsetzung zu ermöglichen.

Technische Beratung

Durch unsere Expertise konnten wir das junge StrengthLab360-Team vor allem in der Backend-Umgebung technisch unterstützen und beraten. Du benötigst nicht nur technische Beratung, sondern professionelle Unterstützung in Sachen IT? Bei uns kannst du professionelle Programmierer:innen finden, die dich unterstützen, dein digitales Projekt erfolgreich abzuschließen.

Eine Desktop-Ansicht von verschiedenen Kundenprofilen, die auf der App registriert sind.

Frontend-Entwicklung

Durch die Verwendung von ShadCN konnten wir eine konsistente, moderne Benutzeroberfläche schaffen. Durch die vollständige Kontrolle über den Quellcode konnten wir individuelle Anpassungen vornehmen, die über die Standardfunktionen hinausgehen. Zudem haben wir die Barrierefreiheit der Komponenten optimiert, um eine inklusive Nutzung zu gewährleisten.

Unsere Lösungen

<ul> <li dir="ltr" role="presentation">Gezielte Risikoanalyse und effiziente Projektplanung durch einen Project Scoping Workshop</li> <li dir="ltr" aria-level="1"> Nutzerzentrierte und moderne Webanwendung, die sich von Mitstreitern abhebt </li> <li dir="ltr" aria-level="1"> Skalierbare und intuitive Benutzeroberflächen, die zukünftige Erweiterungen ermöglicht und Best Practices abdeckt </li> <li dir="ltr" aria-level="1"> Mobile-First Interface-Design für eine nahtlose Nutzung auf allen Geräten </li> <li dir="ltr" aria-level="1"> Iterative Herangehensweise, um agil mit Veränderungen im Markt umzugehen </li> </ul>

Hast du auch ein Projekt im Sinn, von dem du uns erzählen möchtest?

Zum Kontaktformular

Kundenstimme

Das sagt StrengthLab360 über uns

Working with typedigital was a game changer for us. They truly understood our vision and translated it into a sleek, user-focused design of our App. Their technical expertise and collaborative mindset made the entire process efficient and enjoyable for both the management- and the development team.