Roland UK

Making beautiful music together

Roland is a world leader in the design, manufacture and distribution of electronic musical instruments. Living with a website that didn’t respond to modern devices was becoming a problem and they initially asked fffunction to help them work their existing website into a responsive product. After meeting with the Roland team, we quickly established that more than a responsive design was necessary. We established that Roland needed to look at their website as a customer focussed project rather than what it was then, a product led website.

View the pattern library

Tree Jacks and Card sorting FTW!

During the process of creating a new information architecture and site structure we made use of tree jacks to test our thinking for the navigation, card sorting for labelling as well as performing user testing on the existing site to gauge the biggest problem areas.

Rapid prototyping

Having an agreed information architecture we moved directly into creating a fully responsive interactive prototype. The prototype was quickly built up around a data model using Mixture & Firebase. It allowed us to make really quick iterative changes and perform tests based on our initial user thinking and journeys across desktop, mobile, tablet and other devices.

A Customer and User centred approach

We worked closely with the Roland team in the initial workshops. We worked on creating personas and user journeys as well as starting to consider the new information architecture. Using this research we than began to consider how we could turn Roland around from being product focussed to entirely customer and user centred.

The personas were so successful within Roland UK, they had a printed document designed that explained our thinking and backed up by analytics this was distributed around the Roland group globally.

Fully responsive approach

Roland used our prototype to allow their internal design team to start work on the new visual designs.

Working closely with fffunction, Roland created the visual look and feel which we then worked up into complete responsive templates, delivering the HTML, CSS and JavaScript.

This project was one of our first projects to use a pattern library approach to design and build, all the way back in 2013 no less!

Designed in a pattern library

We designed and developed almost exclusively within the framework of a pattern library. This library formed a central point of reference for the project, allowing the whole project team to see what we were working on as we progressed.

This allowed us to design and iterate quickly, as well as allowing for modules to be developed independently from templates and the site as a whole.

View the pattern library

A vision of the future

Browser Roland UK

Take a look

We had already started to adopt an end-user led approach to our marketing but fffunction have taken this forward ten-fold with a truly user centric design aimed at optimising the customer journey.

Helen Whitten. Marketing Director Roland UK
View the pattern library