M&S Your School Uniform

About M&S Your School Uniform

The M&S your school uniform website is an ecommerce website for embroidered uniform, accessories and PE kits. Parents can order M&S quality items pre-branded from partnered schools.

Project Requirements

M&S wanted to launch a new business specifically for selling uniforms. Our task was to build and populate a brand new website for their project. This also included ongoing site updates to content, images and products.

The Solution

When the project initially landed with the design team I was tasked with creating some basic wireframe concepts in Photoshop for each page. This included the homepage and categories through to product lists and detail pages. The lead designer then used my wireframes to produce full mockups using M&S branding. Once the mockups were signed off by the client the design was transferred to our in house ecommerce system. I spent a lot of time creating batches of images for the first set of products. Unfortunately this meant I didn’t get the opportunity to do much of the build. At the end there were some small areas of the site that needed tidying which I took on in between image editing.

The homepage contains list of counties each linking through to display a list of schools within that county. There are also sections here where specific sale adverts can be uploaded either manually or on a set date/time.

After selecting your school, the user is presented with school information as well as contact details. Further sub sections are divided into boys or girls uniforms.

On the product list page each product displays a single image, title, price (including offers/discounts) as well as any colour variations for that particular product.

Every product image used had to be edited in Photoshop with the schools logo and colours. For the school below two different variations of logo were provided, a red for blue colour clothing and blue for red coloured clothing. The provided logos also matched up with clothing of a certain material to give a more seamless blend between logo and template.

After the site launched requests came in for new product images to be created in batches as well as designs for promotional banners which I undertook regularly and uploaded to the site.

Key tasks

• Mocking up the original wireframes
• Design implementation into an in-house ecommerce platform, non-responsive
• Ongoing image creation for new products

Displayed here are the final implementation screenshots on the in-house ecommerce platform at RHP