Ctrl V Website Redesign

Analysis/inspiration

The first step was to look to the industry and see what the best people were doing. The best websites related to VR, family oriented LBE(location based entertainment), and video game were taken and dissected for the content they carried and the way it was displayed.

User Journey Mapping

User journey is extremely helpful for coming up with solutions and for designing products. It seems simple but it forces you to go through all the steps your user goes through and sometimes helps highlight which parts of the path that can be improved, removed or replaced for a better experience. It’s a great starting point for the analysis of a industry/ to figure out what product to build to fill an unmet need.

Gathering stakeholder data

The executives of Ctrl V and the franchisees were all asked to sort out the information they felt was most important to their users. This served to show what they valued as well as what they thought our customers valued based on their experiences running the arcades.

Gathering user data

Users were given surveys to complete about what they were looking for on our site and what it was missing to help decide what needed to be included in the redesign as well as what needed emphasis. The surveys were combined with the following methods of observation and analysis.

Heat maps.

I added heat maps to our site to gather data on actual users with the added benefit of scale and less bias. I was able to use it to see where users were clicking and what pages they went to. By observing screen recordings common patterns emerged that helped to establish the new user flows.

Screen recordings

Screen recordings were invaluable as the user didn’t feel “watched” and used the product freely, the example above was one of many that demonstrated users spending more time reading blocks of text directly under art with parallax while spending less time on regular blocks of text.

Google analytics

Taking the information from the heat maps and pairing it with the data from the behavioral flow as well as live the user test results helped to paint a clearer picture of what the user needed.

Information Architecture

After taking all of the information and observations from the sections above. I was ready to start laying out the information architecture of the new site.

Deep Information Architecture

  • + Faster Navigation: better for getting where you need to quickly (requires intent i.e looking for the address)
  • – Doesn’t make full use of game content for landing page

Shallow Information Architecture

  • + More chance for keywords on the homepage to trigger search results.
  • + Better for the wandering user, less focus on navigation and more focus on converting the viewer.

The shallow one is better for showing more information to the viewer, In addition to allowing us to use the games and games content to drive more sales once we have people on our site.

Contrast

The original site had blue on black text that didn’t pass accessibility standards so the text was changed to white.

Birthdays and EventsBirthdays and Events

This is a sample of what one of the screens looked like before (left) and after (right).

UX Changes

Originally a photo had to be clicked to reveal what the specific event was about, and then clicked again to be taken to a separate page. Now the information is visible upon the first glance and when clicked, it will expand with a description of the event, along with videos and pictures of what the customer can expect.

This has allowed for the faster consumption of information, lower bounce rates, and more cohesive experience.

 

 

Share Project :

  • Categories:
  • Share Project :