Zum Inhalt springen
Manuel García-Llera Añón / Product Designer · Design EngineerKontakt

Fallstudie

TheUXUnion

Ich erkunde eine Design-Community, in der Reputation durch Projekte, Lernen und Beiträge im jeweiligen Kontext verständlich wird.

Fallstudie in Entwicklung

Die dreidimensionale Bildsprache von TheUXUnion
TheUXUnion

Weniger gesammelte Kontakte. Mehr Projekte, Leistung und sinnvolle Verbindungen.

Kontext
Eigenständiges Produkt · professionelle Design-Community · MVP in Entwicklung
Beitrag
Produktvision, visuelle Ausrichtung, Erlebnisarchitektur und MVP-Entwicklung
Technologien
FigmaReactNext.jsTypeScriptTailwind CSS
Jahr
2026
0 → MVP
vom visuellen Vorschlag zum Produkt
Next.js
implementierte modulare Architektur
Responsiv
Hierarchie für Desktop und Mobilgeräte

Zusammenarbeit: Ein iterativer Prozess mit KI-Unterstützung für visuelle Erkundung, Architekturbewertung und schnellere Implementierung; die endgültige Ausrichtung und Auswahl bleiben menschlich

Das aktuelle MVP zeigt den Vorschlag und die visuelle Ausrichtung. Authentifizierung, Backend sowie vollständige Reputations- und Chancenabläufe befinden sich noch in Entwicklung.

Das Projekt, Schicht für Schicht

Kleine Entscheidungen bilden das System.

01 / 06Mobil · Entdecken

Die mobile Startseite bündelt Projekte, Chancen und Gespräche in einer kompakten Hierarchie, mit dauerhaft verfügbarer Navigation und erkennbaren Zuständen.

02 / 06Mobil · Knoten

Knoten machen aus Verbindungen und Beiträgen sichtbare Aktivitätssignale innerhalb der Community.

03 / 06System · Identität

Das System dokumentiert die Beziehungen zwischen Wortmarke, Symbol, Netzwerk und Anpassungen für unterschiedliche Kontexte.

04 / 06System · Komponenten

Schaltflächen, Zustände und Navigation werden als wiederverwendbare Elemente aufgebaut, um ein konsistentes Erlebnis zu unterstützen.

05 / 06Implementierte Desktopversion

Das MVP bündelt diesen Anspruch in einer modularen, responsiven Architektur, die einen leistungsbasierten Zugang erproben soll.

06 / 06Präsentation · Knoten

Die Präsentation übersetzt den Reputationsvorschlag in eine visuelle Geschichte: Jeder Knoten steht für eine bestätigte Fähigkeit und einen nachvollziehbaren Werdegang.

Problem

Ich begann mit einem Unbehagen: Viele berufliche Netzwerke sammeln Kontakte, zeigen aber wenig darüber, wie jemand arbeitet, was er gelernt hat oder zu einer Community beiträgt. Ich wollte untersuchen, ob diese Informationen als Werdegang statt als Zähler verständlich werden können.

Die Hypothese lautet, dass Reputation auf kontextbezogenen Signalen — Projekten, Bildung, Rückmeldungen und Beiträgen — beruhen kann, statt nur von Reichweite oder Kontaktzahlen abzuhängen. Das ist eine Produktfrage, die das MVP noch nicht vollständig beantwortet.

Methoden:Wertversprechen · Stakeholder-Übersicht · Reputationssignale · Nutzerweg: Einstiegsseite → Zugang → Profil.

Mobil · Entdecken

System

Ich entwickelte eine Identität auf dunkler, technischer Grundlage und reservierte Farbe für Inhalte und wichtige Zustände. Struktur, Text und Bedienelemente mussten zurückhaltend bleiben, damit das Erlebnis lesbar bleibt.

Die Entwicklung führte von offeneren grafischen Erkundungen zu einem disziplinierteren Produktsystem: wiederverwendbarer Navigation, Modulen, Karten und responsiven Anpassungen.

Mobil · Knoten

KI im Prozess

Das Konzept verbindet sich entwickelnde Profile, Affinitätsknoten, Portfolios, Ressourcen, Coworking, Veranstaltungen und Chancen. Das MVP konzentriert sich darauf, dieses Ökosystem zu erklären und einen leistungsbasierten Zugang vorzuschlagen.

Ich nutze KI, um visuelle Richtungen zu erkunden und Varianten schneller zu erzeugen, doch die redaktionelle Auswahl bleibt bewusst: Ich wähle Bilder wegen der Identitätsidee, die sie unterstützen, nicht als Ersatz für Recherche, Architektur oder Hierarchie.

Werkzeug
Claude · Codex · Werkzeuge zur visuellen Generierung
Phase
Identitätserkundung, Produktbewertung und MVP-Entwicklung
Menschlicher Beitrag
Vision, Wertversprechen, ästhetische Auswahl, Architektur und Produktkriterien
KI-Ergebnis
Visuelle Varianten, vorgeschlagene Strukturen und beschleunigte Komponentenentwicklung
Auswahlkriterien
Markenkonsistenz, Lesbarkeit, Eigenständigkeit, Nutzen und responsive Machbarkeit
Erkannte Grenzen
Ein eindrucksvolles Bild belegt weder einen Ablauf noch eine Hypothese; jedes Artefakt ist nach dem gekennzeichnet, was es tatsächlich zeigt
Endgültige Entscheidung
Mensch: Ausrichtung, Auswahl, Redaktion und endgültiger Umfang

Implementierung

Ich entwickelte die erste statische Version zu einer Next.js-Anwendung mit TypeScript, unabhängigen Komponenten, responsiver Navigation, Theme-Auswahl und einer modularen Einstiegsseite, der ich neue Abläufe hinzufügen kann.

Es bleibt ein MVP: Es zeigt den Vorschlag, die Marke und eine Zugangsstruktur, ist aber noch nicht die vollständige Plattform für Reputation, Authentifizierung und Chancen, die die Vision beschreibt.

System · Komponenten

Nachweise

Ich bewahre die Entwicklungsphasen — frühe Desktop-/Mobilversionen, visuelle Ausrichtung und aktuelle Implementierung —, damit der Prozess nachvollziehbar wird und nicht nur eine fertige Ansicht zu sehen ist.

Die Fallstudie verbindet den detailgetreuen mobilen Prototyp, das Identitätssystem, die Komponentenbibliothek, das Desktop-MVP und die Produktpräsentation durch HD-Exporte aus den Figma-Dateien.

Implementierte Desktopversion

Vom Prototyp zur Komponente

Aufbau des Systems

  • Grundlagen / Marke · Farbe · Typografie · räumlicher Rhythmus
  • Wireframes / Architektur · Zugang · Profil · Knoten
  • Komponenten / Navigation · Karten · Module · Bedienelemente
  • Responsivität / Desktop · Mobilgerät · Zustände · Hierarchie

Nachweise

Die Arbeit, offen zur Überprüfung.

Der Prototyp ist ein Teil des Prozesses: Er dokumentiert das System, die Entscheidungen und die Abläufe hinter dem Produkt.

Öffentliches MVP erkunden

Erkenntnisse

Ich habe gelernt, dass eine starke Identität eine ruhige Struktur braucht, um lesbar zu bleiben, ohne das ganze Erlebnis in Reizüberflutung zu verwandeln.

Für mich ergibt Reputation nur Sinn, wenn jedes Signal seinen Kontext, seine Herkunft und seinen Bezug zu realer Arbeit behält.

Ich finde es ehrlicher, die Entwicklung des Produkts zu zeigen, als ein MVP so darzustellen, als erfülle es bereits die gesamte Vision.

Offene Frage:Welche Signale können berufliches Vertrauen schaffen, ohne die Beliebtheitsmechanismen eines sozialen Netzwerks zu reproduzieren?

Kontakt

Lass uns sprechen.

Wenn du denkst, dass meine Arbeitsweise zu deinem Team passt, oder ein Produkt beziehungsweise ein Forschungsprojekt entwickeln möchtest, würde ich gern mehr erfahren. Erzähle mir, was du brauchst und wo du gerade stehst. Ich lese deine Nachricht persönlich.

Du findest mich auch auf LinkedIn

Deine Adresse wird ausschließlich verwendet, um auf diese Nachricht zu antworten.