wie wir Woven Inc gebaut haben

Die benutzerdefinierte Kleidung Legende bekommt die Harpers Verjüngungskur

Wer ist Woven Inc?

Woven Inc ist einer der führenden Anbieter von Maßkonfektion im Vereinigten Königreich und bietet nur die höchsten Standards für Siebdruck, Stickerei, Transfers und Konfektion.

Ihr Team verfügt über umfangreiche Erfahrung in kundenspezifischer Kleidung, einschließlich Siebdruck und Stickerei. Sie verwenden einige der neuesten Techniken, um ein unvergleichliches Finish auf ihrer Kleidung zu bieten.

Es liegt an diesem hohen Standard, dass Woven Inc der Anbieter geworden ist, wenn Unternehmen ihre Kleidung mit Markenzeichen versehen müssen.

Was war der Auftrag?

Harpers wurde gebeten, die bestehende Website neu zu gestalten, um sie benutzerfreundlicher zu machen, um ihr SEO-Potenzial zu maximieren.

Uns wurde gesagt, dass wir uns eng an das ursprüngliche Farbschema und Branding halten und die Produktlinien verbessern sollten, die den Kunden zur Verfügung stehen.

Es war auch notwendig, Kataloge von Drittanbietern zu importieren, damit Produkte und Daten bei Bedarf einfach aktualisiert werden können.

Wie haben wir das gemacht?

Wir haben uns dafür entschieden, dies zu einem Material-Layout mit erhöhten Kanten und Schatten auf Produkten und Tasten zu machen.

Da Woven Inc. eine große Anzahl an Produktlinien und Variationen dieser Produkte (ca. 5000 Produkte mit jeweils 10 bis 50 Variationen) hatte, benötigten wir ein umfassendes Kategorisierungs- und Filtersystem.

Darüber hinaus mussten wir uns in verschiedene Social-Media-Konten wie Instagram einklinken und Bilder bestehender und vergangener Arbeiten anzeigen.

Das Endergebnis

Die Startseite

Wir haben die Dinge auf der Homepage mit Intros, Call to Actions und einigen schnellen Links zu den Produktbereichen einfach gehalten.

Wir haben ein paar Bounce-Effekte vom elastischen Typ für das Anzeigen von Schaltflächen und für das Rendern von Text auf dem Bildschirm entwickelt.

Benutzerdefinierte Kategorien

Die Kategorieseiten sind aufgrund des Filtersystems auf der linken Seite jeder Seite leicht zu navigieren. Besucher können schnell nach Kategorie, Farbe, Marke, Preis und mehr filtern.

Produkte selbst enthalten Bewertungen, die von früheren Kunden und Käufern dieser Artikel vergeben wurden.

Tablet-Seiten

Wie bei allen Websites musste Woven Inc sich gut an verschiedene Auflösungen und Gerätetypen anpassen. Vor allem die Wirkung der Bilder mit hoher Auflösung sollte genau so gut sein, egal welches Gerät Sie gerade betrachten.

Mobile Ansichten

Über 50% des Browser-Marktes sehen sich jetzt Websites auf mobilen Geräten an. Wenn Ihre Website nicht reaktionsfähig ist (passt sich an alle Arten von Lösungen an), verlieren Sie Ihr Geschäft.

Wir haben Dinge wie Seitenmenüs und Suchfunktionen vom Bildschirm entfernt, bis sie vom Benutzer aktiviert wurden, und das Layout für Smartphones vereinfacht.

Das Nerdy-Zeug

Statistiken

Wir haben diese Website im Wesentlichen von Grund auf erstellt, aber die vorhandenen Produktdaten und Informationsseiten importiert. Hier sind einige der Dinge, die wir gemacht haben…

E-Commerce-Funktionalität mit Live-Filter und Suche

Wir haben das System von WooCommerce in die Engine der Site integriert, um die E-Commerce-Funktionalität zu ermöglichen, die dann freigelegt wurde, sodass nur die Funktionen aktiviert wurden, die wir benötigten. Auf Kundenwunsch wurde die Warenkorbfunktion erst später im Quartal deaktiviert, als sie sich bereit fühlten, Bestellungen online zu bearbeiten.

Wir haben auch ein Live-Filtersystem entwickelt, so dass die Besucher die verfügbaren Produkte anzeigen können, um nur das zu zeigen, wofür sie sich interessieren. Dieses Filtersystem basiert auf Marke, Kleidungstyp, Farbe, Größe und verschiedenen anderen Parametern.

DevOps

Wir haben die Woven Inc-Website von ihrem langsamen Shared Hosting auf ein dediziertes VPS umgestellt und das System so optimiert, dass es wie ein Blitz läuft. Wir haben die Datenbank auch aus Geschwindigkeitsgründen in MariaDB und den Webserver nach NginX migriert.

Skripte

Wir haben WordPress auf den Kern reduziert und die GSAP-Animationsbibliothek für ein paar funkige Effekte wie das Verschieben in Panels, das Scrollen von Seiten und die elastischen Effekte auf Knöpfen integriert. Wir haben auch eine Menge Header-Bloat deaktiviert, die mit WordPress wie API-Endpunkten geliefert werden.

Optimierung

Wir haben (wie immer) sehr kleine Plugins verwendet und stattdessen unsere eigenen Funktionen für die Website programmiert. Dies erlaubte uns, den Code auf ein Minimum zu reduzieren und nur Routinen auszuführen, die die Site benötigte. Wir haben auch spezielle Web-Server-Regeln für ngx_pagespeed geschrieben und die Site auf Cloudflare verteilt, so dass sie sofort geladen wurde, egal wo auf der Welt der Benutzer sie sah.