Sigh. Yet another form of responsive design to figure out. But contact lens e-retailer AC Lens is glad it did, because using responsive delivery to optimize its site for smartphones yielded a 150% increase in time on site, a 78% jump in page views, and a 25% increase in conversions, the merchant says. 

Yes, yes. Feel free to vent your frustration on hearing yet another term and technique under the responsive design umbrella. Things are getting rather confusing. But many retailers are turning to responsive design, in one form or another, as the answer to serving consumers on an increasingly varied array of computing devices, especially tablets and smartphones. And many vendors and design firms are adopting responsive design as the technique of choice.

Retailers today basically have no choice but to at least have some basic understanding of what responsive design is because it is dominating mobile design discussions. Plus, early results from responsive pioneers look quite promising.

Contact lens e-retailer AC Lens is quite happy it learned more about responsive design, the technique that adapts a single set of web site content and code to  the screen size of the device the consumers is using, including desktops, tablets, smartphones, smart TVs, and other devices and monitors. The web-only merchant’s 2011 in-house first crack at a mobile commerce web site was disappointing, the retailer says. The standalone mobile site was a stripped-down version of the desktop site that only took orders from repeat customers. The site facilitated a modest boost in mobile sales, but was very limited, offering few of the features and functions on the desktop site, the merchant says.

AC Lens, No. 329 in the 2013 Internet Retailer Top 500, concluded it needed a mobile site that was more robust and a bit more in line with the desktop site. In late 2012 the e-retailer selected mobile commerce technology vendor Moovweb to help it take mobile commerce to the next level. Moovweb has 75 retailer clients, including Chico’s FAS Inc., General Nutrition Centers Inc. and Macy’s Inc. Chico’s is No. 340 in the 2014 Internet Retailer Mobile 500, GNC is No. 90 and Macy’s is No. 26.

Work began in early 2013, and less than 10 weeks later, in March, the e-retailer was serving shoppers on smartphones a mobile-optimized version of its desktop site using Moovweb’s Responsive Delivery Platform. Shoppers on smartphones now can access most of the features and functions of the desktop site. And since the switch from the stripped-down mobile commerce site to responsive delivery, time on site on smartphones soared 150%, page views on smartphones jumped 78%, and the conversion rate for shoppers on smartphones increased 25%, AC Lens reports.

advertisement

“Our basic strategy is pretty simple,” says Brian Frank, AC Lens vice president of business development. “Provide a streamlined interface for placing orders on mobile devices.” AC Lens retains and highlights the most important desktop features (including product image, price, prescription selections and the Buy button) while leaving lower-priority features (including product reviews and security information) to scroll-down menus, Frank explains.

“It’s now easier to order your contact lenses through our mobile site than it is via our desktop site because we removed clutter and made it a streamlined experience,” Frank says. “Even though the code base was unified, the Moovweb platform made it easy to tailor the mobile experience to our vision.”

That’s where the so-called “responsive delivery” comes into play. When a customer on a smartphone requests a page from ACLens.com, Moovweb, which also builds mobile commerce apps, splits the front end of the AC Lens desktop site from the back end of the desktop site and sends the front-end code and content through what the vendor calls its ‘transformation engine,” which, using responsive design techniques, optimizes pages for display on smartphones and sends the optimized pages to shoppers’ mobile devices.

The transformation engine is a server that takes the HTML, Cascading Style Sheets (CSS) and JavaScript from the desktop site and transforms it into different HTML and CSS that is rendered in a consumer’s mobile web browser. Nothing changes for the back-end systems, such as order management software; they receive customer orders from mobile transactions just as they would from a desktop session,  explains Moovweb.

advertisement

“A retailer does not have to modify its desktop site in any way to use responsive delivery,” says Mitch Bishop, chief marketing officer at Moovweb. “In the case of AC Lens, its in-house front-end developers used HTML5, CSS and bit of Tritium, an open source script language from Moovweb, to inform the transformation engine in the Moovweb cloud how to translate the front-end of the desktop site into a customized experience for smartphones. This keeps the best of responsive design, namely a single code base, but solves the challenges with responsive while being able to take advantage of specific mobile device features.”

Bishop points to a January 2014 Forrester Research Inc. report, commissioned by Moovweb, entitled “Improving Enterprise Mobility: Meeting Next-Generation Demands for Development, Delivery and Engagement,” which spells out responsive design challenges Forrester analysts identified. Among 146 U.S. information technology managers from various industries surveyed by Forrester, 63 are managing responsive design sites and identified challenges they’ve faced going responsive. Challenges include, according to Forrester:

  • The need to rewrite the consumer-facing pages of a site, which takes months of time and effort, and money if paying a vendor to do the build.
  • Performance of responsive design sites on smartphones over wireless networks is poor.
  • Web site experiences delivered to mobile devices are by responsive’s nature compromised. For example, it is difficult to make use of innate mobile device functionality such as GPS.
  • The majority of development time is spent rewriting existing business logic and rules in the back-end code.

Moovweb’s approach to responsive design, “responsive delivery,” solves these problems, Bishop contends.

“Through servers in the cloud that leverage a retailer’s existing infrastructure, without rewriting any part of a site, we reshape the front end to be fully responsive while maintaining the business logic, e-commerce engines and content from the desktop site; there is no new back-end programming required,” Bishop says. “Also, there is minimal development time. And mobile page load performance is great because our transformation engine is only sending what is needed to render the site for that device type; further, we cache data that’s used repeatedly in mobile browsers, and in the cloud we optimize images and use a content delivery network to speed content to devices.”

advertisement

AC Lens and Moovweb decline to reveal the cost of going mobile the Moovweb way, but Bishop says the cost is about one-tenth the cost of building a full responsive design site. Based on its research of mobile commerce solutions, AC Lens says building a responsive design site or building a new standalone m-commerce site much more powerful than its previous version would have been more costly than Moovweb’s responsive delivery.

“Basically,” AC Lens’ Frank says, “anything we’ve wanted to do on the mobile site, we’ve been able to do.” He adds that AC Lens is beginning work on using the Moovweb technology to deliver a tablet-optimized site.

Favorite