For the mobile screens at Browns Shoes, responsive web design is the perfect fit.
With its customers stepping more and more into mobile commerce—and accounting for 20% of all shoppers on BrownsShoes.com—the retailer knew it had to take new steps to better cater to shoppers on mobile devices. But how to best design a mobile presence for smartphones and tablets while also supporting desktops?
It found the answer in responsive web design. Working with its e-commerce platform provider, Demandware Inc., and web design firm Le Site, Browns Shoes used responsive web design techniques to construct a new e-commerce site that renders differently depending on the type of device the consumer is using. All site content, features and functions are the same, but they are displayed in a fashion that best suits the dimensions of the screen of the device, be it a computer monitor, a tablet, a smartphone or even a television via a game console Internet connection.
"We needed a great web site in line with the great experience we provide in our stores," says Richard Sejean, director of e-commerce. "Responsive web design seemed the logical way to do it so we didn't have to develop all these different apps and silos."
Le Site developed wireframes—the foundational design schemes—for desktop, tablet, smartphone and large-screen versions of the web site. Demandware personnel helped with the programming.
"Responsive design didn't present a barrier, it wasn't too complex for the team to implement," Sejean says. "From a design perspective, you just have to make sure you are paying attention to the experience in all these different views."
The approach was less expensive than building a mobile site or app, he says. He adds, however, that the technique took more time to design and test than it would have to create stand-alone versions for each device.
The work has paid off, he says. The retailer's bounce rate on mobile—where a consumer lands on a single page and then leaves—has decreased while time spent on site has increased, Sejean says.