MSH Montagen

Projektkontext

Handwerk digital neu gedacht

Dieses Projekt hat mich über zwei Semester und bei meiner Zertifizierung als UX-Professional begleitet. Die Aufgabe: Die digitale Präsenz des Montagebetriebs „MSH Montagen“ ins Hier und Jetzt zu holen. Im Sommersemester lag der Fokus auf streng nutzerzentrierter Konzeption nach dem ISO 9241-210 Standard. Im darauf folgenden Wintersemester wurde das validierte Konzept als WordPress-Seite zum Leben erweckt. Das Resultat ist eine klare, zielgruppenorientierte Plattform, die das Handwerk in den Mittelpunkt stellt.

UX & UI Design Human-Centered Design WordPress-Entwicklung Custom Website Usability Testing
Umfang UX-Research & -Design, Testing, WordPress-Umsetzung
Zeitraum Februar 2025 - Jänner 2026
Ziel Nutzerzentrierte Website gestalten & umsetzen

Der Gedanke dahinter

MSH Montagen liefert seit 2005 erstklassige Tischlermontagen. Die bestehende Website war jedoch ein Reibungspunkt, der eine Weiterentwicklung benötigte. Einerseits war die Pflege der Inhalte im TYPO3-Backend wartungsintensiv, andererseits haben sich die digitalen Ansprüche und Erwartungen der Kunden geändert.
Meine Motivation für den Relaunch war es, eine Struktur zu schaffen, die die hohe Qualität der Maßanfertigungen widerspiegelt und die Kontaktaufnahme so intuitiv wie möglich gestaltet. Die Mission: Ein nahtloses Erlebnis von der ersten Inspiration bis zur konkreten Projektanfrage.

Zwei Zielgruppen, ein klares Ziel

Die größte konzeptionelle Herausforderung bestand darin, dass MSH Montagen zwei stark unterschiedliche Zielgruppen bedient: Privatkunden, die Inspiration für ihre neue Terrasse oder Küche suchen, und Firmenkunden, die harte Fakten, gewerbliche Referenzen und überregionale Kapazitäten prüfen müssen. Das Konzept baut darauf auf, beide Nutzergruppen direkt auf der Startseite abzuholen, aber die Möglichkeiten für individuelle Bedürfnisse offen zu lassen.

  • Getrennte Bereiche für Privat- & Firmenkunden
  • Eine filterbare Galerie für mehr Ordnung
  • Reduktion der Sitemap auf die Kernbereiche
01
Maß­geschneiderte Kontakt­aufnahme

Statt eines generischen Kontaktformulars habe ich getrennte Formulare für Firmen- und Privatkunden entwickelt. Dies liefert MSH Montagen gleich richtig strukturierte Anfragen.

02
Evidenz­basiertes Design

Jeder Designentscheidung lag eine genaue Analyse des Nutzungskontextes zugrunde, um sicherzustellen, dass die Seite echte Probleme der Nutzer löst.

03
Ein starkes Backend

Durch den Wechsel auf WordPress wurde ein System geschaffen, das SEO-freundlich ist und dem MSH-Management eine spielend leichte Verwaltung der Projektgalerien ermöglicht.

Vertrauen durch Klarheit

Das visuelle Konzept ist von der Präzision des Handwerks selbst inspiriert. Klare Linien, strukturierte Inhalte und der absolute Fokus auf hochwertige Bilder der Tischlermontagen. Es sollte eine seriöse, moderne Atmosphäre entstehen, die Vertrauen schafft – ein entscheidender Faktor, besonders für gewerbliche Großprojekte, bei denen es um große Budgets und Verlässlichkeit geht.

Methodisch zum perfekten Erlebnis

Designprozess

Nutzer im Fokus

Zu Beginn definierte ich detaillierte Personas – „Maria“ (Privatkundin) und „Dr. Leon Fischer“ (Arzt) – und erstellte User Journey Maps. So konnte ich genau identifizieren, an welchen Punkten die Nutzer zögern, unzufrieden sind und wo sie Unterstützung brauchen.

Von Skizzen zum Proto­typ

Mit Low-Fidelity-Skizzen und ersten Wireframes testete ich die Platzierung der Kern-Elemente. Die Struktur wurde bewusst einfach gehalten, um die kognitive Belastung zu minimieren. Daraus wurde dann ein funktionaler Prototyp in der Desktop-Version, der das erste Look & Feel präsentierte.

WordPress Umsetzung

Im Wintersemester folgte die technische Realisierung in der neuen WordPress Umgebung. Das einfache Projektmanagement und der modullare Aufbau der Elemente vereinfachen das Backend, ohne visuelle Einbußen des Designs. Das Design wurde voll responsive umgesetzt, um das Konzept in die Realität zu überführen.

Herausforderungen im Prozess

Spagat der Zielgruppen

Wie spricht man eine Firma und eine Privatperson auf derselben Startseite an, ohne jemanden zu vergraulen?
Die Lösung holt beide Zielgruppen mit neutralen Informationen und ersten Projekten auf der Startseite ab und führt die Nutzer in der filterbaren Galerie effizient zu spezifischen Projekten.

Informations­dichte vs. Ladezeit

Eine hochwertige Projektgalerie benötigt viele Bilder, was die Ladezeiten stark beeinträchtigen kann
Technische Optimierung in der Umsetzung schaffen Abhilfe durch Bildkomprimierung und Lazy-Loading, kombiniert mit einer intelligenten Filterfunktion im Frontend.

Kompromisslose Mobile-UX

Meine wichtigste Erkenntnis: Gerade bei einer bildlastigen Handwerks-Website dürfen bei der mobilen Optimierung absolut keine Kompromisse gemacht werden. Die Ladezeiten und die flüssige Bedienbarkeit auf dem Smartphone sind heute oft der entscheidende Faktor für oder gegen eine Terminanfrage. Die Nutzerforschung konsequent in eine technisch saubere und schnelle WordPress-Lösung zu übersetzen, war das fehlende Puzzleteil, das aus einem schönen Design ein hochfunktionales, konvertierendes Produkt gemacht hat.

Weitere Projekte

projects
Nach oben