Better design Better results
Lister Buildings— the next step in efficient and sustainable building
Acknowledge— a fresh new brand for an ict service company
Stratego— an advertising agency specialized in branding
Artiteq— a website for flexible picture hanging systems
Handyfloor— a magento webshop for vinyl floors
Judex— a webportal for legal information and representation

Handyfloor

a magento webshop for vinyl floors

Handyfloor sells PVC floors with excellent quality. Customers can enjoy durable and easy to maintain floors with the look and feel of a wooden or stone floor.

Operating in several showrooms in the Netherlands and Germany, Handyfloor was ready for the next step. They came to me with the request for a brand new webshop that is dependable and fulfils customers’ needs.

  • Deliverables UX & Visual design
  • Project Magento webshop
  • Year2015

The challenge

The main purpose of the design of the webshop is to emphasise the quality of the floors. But at the same time it also needs to speak to the customer. With a focus on e-commerce, Magento was the logic platform choice, though it not the best CMS option for landing pages and additional content.

The project

Inspiration and ambiance are the absolute focal points of this design, much like in a magazine for home interior design. The content is easily adaptable and very accessible. Whether they’re shopping on desktop or scanning the webshop on their mobile device, customers will always find the perfect floor for their home or office.

Handyfloor wireframe homepage
Handyfloor wireframe category
Handyfloor wireframe product

The idea — a flexible block layout

By using flexible blocks, Handyfloor can put a spotlight on some of their most successful and popular floors. And these blocks also have another great benefit. It’s the perfect way to sidestep the inflexible CMS that Magento provides. The flexible blocks make adding new content to the webshop a whole lot easier.

Style choices — crafting the right feeling

When you purchase a floor, you probably have a clear vision of the added value that floor has for your interior design.

That’s why the look and feel of the webshop reminds customers of an interior design magazine, easy to read and full of inspiration. You’ll have no problem imagining that floor in your own home or office.

  • Pastel blue-gray
    • CMYK35 22 20 02
    • RGB137 143 162
    • HEXB0B9C0
  • Pastel green
    • CMYK32 09 30 00
    • RGB180 202 181
    • HEXBCD1BE
  • Pastel pink
    • CMYK01 27 23 00
    • RGB247 195 180
    • HEXF8CBBC

Colors choices

The floors are the real stars of the webshop. By using subtle pastel colours, the design doesn’t take away from the inspirational images and content that Handyfloor provides.

Images

Handyfloor doesn’t just want to sell floor, they want to inspire their customers. The images show the products on sale, but also give the viewer an idea of what the floor could look like in a homely setting. Much like you would find in a magazine for home interior.

  • Source Sans Pro light

    — This is the standard font. It’s sleek, modern and has that magazine look and feel. But it’s also modest and very complementary to the images of the floors.

  • Source Sans Pro bold

    — This font is used for titles, but also to provide additional contrast to specific elements of the webshop.

  • Indie Flower

    — This font is used to emphasize certain elements and for the styling advice of the Handyfloor styling consultants.

Font choices

The chosen fonts are a perfect match with the magazine theme that’s used throughout the whole webshop. By using sleek and subtle fonts and adding a handwritten typeface, the design is playful and still easy to read.

The homepage — easy customizable

The homepage of the webshop needs to grab the customer’s attention. By using flexible blocks the customer has access to many different items and products at first glance.

The design of the homepage is in line with the magazine vibe that is used throughout the entire webhop. The block structure is easy to update and maintain.

Handyfloor productpage
Handyfloor homepage mobile
Handyfloor homepage mobile

Mobile accessibility

Mobile customers can enjoy the same carefree shopping experience that desktop buyers have on the Handyfloor webshop. The flexible blocks give an excellent fit on mobile devices.

Handyfloor mobile wireframe

The product page — focus on inspiring

It even includes recommendations from interior consultants. Handyfloor also allows customers to apply for a sample of their desired floor. After all, before you buy a floor, you want to see the goods.

The webshop’s floor section doesn’t feel like your typical run-of-the-mill product page. It’s designed to inspire customers about the many ways in which their new floor can completely transform their home or office.

Handyfloor productpage

The pages – consistency is key

Handyfloor’s customers enjoy a complete shopping experience on the new website. The design includes landing pages, shopping sites, tips and valuable content. Every single page is consistent with the design, to keep that sleek and inspiring interior design magazine look and feel.

We value working with a web designer that understands our needs. This requires knowledge of web design, UX and front-end development. Marijn has all these qualities. He is very meticulous in his work and hits the mark for any concept, every time.

Guy van OostwaardCo-owner & Marketing director at Fiyo & Handyfloor