Mr.Tools Re-styling

Mr.Tools ist das führende Unternehmen in Spanien für den Verkauf von Werkzeugen und Maschinen

Strategic design
UX/UI
Mr.tools
Branding
Web design
E-commerce

Kunde

Mr. Tools

Datum

02-05/2025

Kategorie

Branding, Webdesign

Rolle

Designer

The re-styling of Mr.Tools aimed to modernize its identity without losing its essence, improving both visual perception and navigation experience.

🧠 Projektübersicht

Mr.Tools ist ein auf den Verkauf von Werkzeugen und Maschinen für die Schmuckherstellung spezialisiertes Unternehmen mit nationaler Präsenz und bemerkenswertem Wachstum innerhalb der Branche. Seine Stellung als Marktführer in Spanien machte es notwendig, das visuelle Erscheinungsbild und die digitale Erfahrung zu aktualisieren, da diese nicht mehr die aktuelle Solidität, Spezialisierung und Geschäftsentwicklung der Marke widerspiegelten.

Dieses Projekt für visuelles und funktionales Re-Styling hatte als Hauptziel, eine durchdachte, vollständige und kohärente Kundenerfahrung zu schaffen – vom ersten Eindruck bis zur Navigation und Interaktion mit dem Online-Katalog. Durch dieses Redesign wollten wir eine Marke schaffen, die Professionalität, Struktur und Modernität vermittelt, ohne ihre Authentizität zu verlieren.

bodegon pack premium

👨‍💻 Meine Rolle

Meine Arbeit bei Mr.Tools war ganzheitlich und umfasste sowohl die strategische Neuausrichtung als auch die grafische Umsetzung und Koordination mit technischen Bereichen. Zu meinen Hauptaufgaben gehörten:

Visuelle und UX-Audit der vorherigen Website

Redesign von Logo, Farbpalette und visuellem System

Gestaltung der neuen Web-Oberfläche mit Fokus auf Skalierbarkeit

Adaption der visuellen Identität für digitale Medien (Website, Banner, Etiketten, visuelle Kommunikation)

Captura%20de%20pantalla%202025 06 03%20a%20las%2015.43.46

🎨 Redesign der visuellen Identität

Das frühere Erscheinungsbild von Mr.Tools wies zahlreiche Inkonsistenzen auf: eine generische Ästhetik, wenig Harmonie zwischen den visuellen Elementen und eine mangelnde Übereinstimmung mit der tatsächlichen Qualität des Unternehmens und seiner Produkte. Es war offensichtlich, dass die Marke eine Weiterentwicklung brauchte – keinen Bruch.

Mein Vorschlag war ein nüchternes und zeitgemässes Redesign, das die visuelle Sprache modernisiert, ohne das DNA des Unternehmens zu verlieren. Das neue Logo wurde mit klaren Linien und ausgewogenen Proportionen gestaltet, was zu mehr Vielseitigkeit und Wiedererkennungswert in verschiedenen digitalen Umgebungen führte.

Captura%20de%20pantalla%202025 05 13%20a%20las%2023.09.07Captura%20de%20pantalla%202025 05 13%20a%20las%2023.09.07

Es wurde eine Farbpalette mit hohem Kontrast definiert, bestehend aus lebendigen, aber funktionalen Farben, die das Produkt hervorheben, ohne die Benutzeroberfläche zu überladen. Dunkle und neutrale Töne bringen Ausgewogenheit in das Gesamtbild und schaffen eine solide Basis, auf der wichtige Informationen klar hervorgehoben werden können.

Die neue Typografie vermittelt ein Gefühl von technischem Professionalismus und Zugänglichkeit – entscheidend für eine Marke, die zwischen industriellem und handwerklichem Umfeld operiert. Es wurde ein modulares und skalierbares visuelles System entwickelt, das auf kontinuierliches Wachstum des Katalogs und der Marke ausgelegt ist.

Captura%20de%20pantalla%202025 05 13%20a%20las%2023.10.06placeholder imageplaceholder image

👨🏻‍💻 Redesign des Online-Shops

Das Webdesign stellte eine der grössten Herausforderungen des Projekts dar, da die Plattform über 3.000 aktive Produkte und eine komplexe PHP-Datenbankstruktur umfasste. Obwohl es ideal gewesen wäre, die Inhalte neu zu strukturieren und den Katalog umzubauen, liess die Grösse und Fragilität des bestehenden Systems keine tiefgreifende Umstrukturierung zu.

Angesichts dieser Herausforderung entschied ich mich für eine neutrale, klare und funktionale Benutzeroberfläche, die keine visuelle Komplexität hinzufügt, aber die Lesbarkeit, Navigation und Nutzerwahrnehmung verbessert. Es wurde mit stabilen Layouts, wiederverwendbaren Komponenten und einer optimierten Informationshierarchie gearbeitet, um das Kundenerlebnis im Shop zu erleichtern.

Trotz technischer Einschränkungen ermöglichte das neue Design ein zeitgemässes digitales Erscheinungsbild von Mr.Tools und legte eine visuelle Grundlage, die mit der Marktführerschaft des Unternehmens übereinstimmt.

mbp screen

📚 Persönliche Reflexion

Dieses Projekt war eine hervorragende Gelegenheit, eine umfassende und strategische Designvision anzuwenden, bei der Branding, UI-Design und visuelle Leitung in einem durchgängigen Arbeitsfluss vereint wurden. Da ich alle Dimensionen des Projekts koordinieren konnte, war es möglich, eine starke Kohärenz zwischen Markenbotschaft und visueller Darstellung sicherzustellen.

Gleichzeitig stand ich vor technischen Herausforderungen, insbesondere in Bezug auf die Datenstruktur und die technologische Altlast in PHP, die die Umsetzung einiger Reorganisationsideen einschränkte. Diese Erfahrung ermöglichte mir, pragmatische Lösungen zu entwickeln, die auf einen komplexen Kontext abgestimmt sind, und stärkte meine Fähigkeit, visuelle Entscheidungen mit Mehrwert zu treffen – auch wenn man nicht in das gesamte System eingreifen kann.