Who is Woven Inc?
Woven Inc is one of the UK’s leaders in custom clothing providing only the highest standards of screen printing, embroidery, transfers and garment finishing.
Their team has a vast amount of experience in custom clothing including screen printing and embroidery. They use some of the very latest techniques to provide a second to none finish on their clothing. It’s because of this high standard that Woven Inc have become the go to provider when companies need their clothing branded.
What was the brief?
Harpers was asked to look at redesigning the existing website to make it more user friendly with a view to maximising their SEO potential.
We were told to stick close to the original colour scheme and branding and enhance the product lines available to the customers. It was also necessary to build in an importation of the third party provider catalogues so that products and data could be easily updated when necessary.
How did we do it?
We decided to make this a material design type of layout with raised edges and shadows on products and buttons.
As Woven Inc had a huge amount of product lines and variations of those products (around 5000 products each with a possible 10 to 50 variations) we needed a comprehensive categorisation and filter system. On top of this we needed to hook into various social media accounts, such as Instagram, and display imagery of existing and past work.
The end result
The Home Page
We kept things simple on the home page with intros, call to actions and some quick links to the product sections.
We created a few elastic type bounce effects for when buttons show and when text originally renders on screen.
Custom Categories
The category pages are easy to navigate due to the filter system on the left of each page. Visitors can quickly filter by category, colour, brand, price and more.
Products themselves contain ratings taht have been awarded by previous customers and buyers of those items.
Tablet Pages
Like all websites Woven Inc needed to adapt well to different resolutions and device types. In particular the impact of the high resolution images needed to be just as good no matter what size device you’re looking at.
Mobile Views
Over 50% of the browser market now views websites on mobile devices. If your site isn’t responsive (adapts to all types of resolutions) you’re losing business.
We moved things such as page menus and search functionality off screen until activated by the user and simplified the layout for smartphones.
The Nerdy Stuff
Stats
We were essentially building this website from scratch but importing the existing product data and information pages. Here is some of the things we did…
E-commerce functionality with live filter and search
We integrated WooCommerce’s system into the engine of the site to enable e-commerce functionality then stripped it bare so only the functions we needed were activated. At the clients request shopping basket functionality was disabled until later in the quarter when they felt ready to start processing orders online.
We also created a live filter system so that visitors could drill down into the available products to only show what they were interested in. We based this filter system on brand, clothing type, colour, size and various other parameters.
DevOps
We moved the Woven Inc website from it’s slow shared hosting to a dedicated VPS and optimised the system to run like lightning. We also migrated the database to MariaDB and the web server to NginX for speed purposes.
Scripts
We stripped back WordPress to the core and integrated the GSAP animation library for a few funky effects such as sliding in panels, scrolling down pages and the elastic effects on buttons popping up. We also disabled a lot of header bloat that comes with WordPress such as API endpoints.
Optimisation
We used very little plugins (as usual) and instead coded our own functionality for the website. This allowed us to keep code bloat down to a minimum and only run routines that the site needed. We also wrote specific web server rules for ngx_pagespeed and distributed the site on Cloudflare so that it loaded instantly no matter where in the world the user was viewing it from.
