In 2013 GamesRadar+ was looking at over 8 million page views per month. Almost half of the users were viewing the site on mobile devices. It was time to provide an experience that served different devices and viewports. We also wanted to improve the experience on mobile while also improving page views and engagement.

Our challenge was to redesign an aging legacy POS system attached with customer information, eyewear contact lens prescriptions, insurance information and promotion. Our goal was to design and build an efficient prescription interface, faster checkout and a stable application.

Our first step was an in store visit to a For Eyes in San Francisco. It was frightening to see an 18 year old application still being used. We needed to understand how the current application worked. Within the first 5 minutes of the demo we knew we had a challenge and bigger opportunity. We logged all the pain-points that the sales associates were facing. Here were a few.

Understanding and mapping out the entire user journey can uncover issues and also create opportunities. We approached this with individual use cases with empathy. Here is where we defined a goal for each journey – eyewear, contact lens, and quick sale order. It was also common to accommodate repeat customers and the ability to edit their prescriptions, redos, address and insurance information.

It was time to go lean and mean. We skipped the wireframing process to save on hours. You could say this was part of the challenge however whiteboard sketches did the trick. In addition, For Eyes provided screenshots of their application and highlighted mandatory input fields. We kicked off visual design with a style tile to set up the framework of our interface.

Design sprints were created on a weekly basis and it was my responsibility to help run the design portion of the kanban board. User stories were graphed alongside each journey. Subtasks were created ensuring we had the correct goals and input fields of each page. We presented each comp followed by a Q&A session with our client to go over changes and concerns.

With a sizable web application as this was, the complexity was often overlooked. We were dealing with stock keeping units, prescription information and customer information that all had to fuse together to form an order. Below is the process of entering a customers insurance information.

Though it was obvious to our clients, it did take some time for our team to grasp. It wasn’t until we were invited to the factory that things became clear. We were taken through the process of how a pair of glasses were made. We were able to represent an input field with a tangible element on the production line. The process was explained to us by an optometrist turned director of production.

From there we were able to synthesize the process of an eyewear order and embody empathy through experience not through a persona. We were able to step back from a screen and experience the product from a different perspective. The visualization activated our creative abilities as designers and developers and influenced our final product. It was the most valuable experience on the project. Sometimes is not about how exquisit an interface functions but how the method you use to create it.

PC Gamer buyers guide initially started from generic article template, 960px fixed on a two column grid, one or two images and whole lot of text. The affiliate links were embedded as standard HTML links. For users, they were not an exciting destination. We were in need of an upgrade. Our goals were to…

Simultaneously we put forth a data driven approach to how we wanted to move forward with product decisions. We had existing data through Google Analytics, CrazyEgg, and ComScore. The analytics tools gave prevailing insight but brought us little knowledge of what a users needs will be in the impending buyers guide. In the spring of 2015, I vetted emerging methodologies and introduced something new to the organization – a system of qualitative user research. We would then generate the data we needed for a certified path to an informed design decision

Several questions came to mind. How do we go about doing a survey with our most engaged users? What types of questions should we ask? What kind of tools were out there? How do we administer the research? What was our budget like? What is this process like? Who and what should we follow?

We were also concerned with they type of answers we would receive. How do we extract the information? How do we avoid one word answers? Will the answers provide us something we already know?

We came across UserTesting.com from our colleagues in the U.K.. After examining best practices we came across a series of questions aimed to create dialog with our users. We also wanted to hear about their purchasing habits and how well PC Gamer’s content informed their decisions. It was imperative that we facilitate a discussion with our users and not lead them to a dead end. We came up with a list of questions.

I generated a report and synthesized the information. After conducting over 20 interviews a pattern started to emerge. Nearly all of the respondents mentioned reading user generated reviews on Amazon and NewEgg. Our findings also included that the majority of our users would also like to see a budget option next to the main pick. I answered the questions and turned them into a list of features for the buyers guide. We also validated our design practices by listing out features the user found helpful. A large product image, price, Amazon score, Amazon link, a TLDR section that had 2-3 pros and 2-3 cons, we all added to our buying guide.

It was a first for our company to have a fully data driven design process. Between our editorial, marketing, sales and internet ops teams, we created a product and process that had complete buy in for all of our stakeholders. The conversion rates exceeded our expectations. Conversion rose 500% over the previous design. The process was shared globally throughout the organization. The information helped with our product roadmap by focusing on the users rather than relying on theory. We emerged with a system that everyone felt good about.