December 20, 2017

How Do You Test a Site on Multiple Devices?

Travis Johnson • Developer

Jay Buys • Chief Executive Officer

You Should Know

  • Making sure your website works on various different mobile devices, tablets, etc. is a difficult process that we prioritize highly.
  • We have many different devices as well as special software so that we can do proper testing and deliver superior projects.

This post was originally published in July 2016 as “Mastering the Growing Digital Landscape with Our Device Lab” but has been updated to reflect how our lab has grown and changed since then.

Over the past decade, our digital experiences have evolved from the screens of desktop computers, to laptops, smart phones, tablets, watches and more. We are now in an age of the Internet of Things, and the majority of internet use is through mobile devices.

This poses an interesting challenge for web designers and developers because we want to make sure the sites we build for our clients are accessible, functional, and beautiful across as many screen sizes and digital contexts as possible. So how do we manage it?

The Device Lab

Here at Visceral we created a device lab, which is an array of different mobile devices used for testing our products before they go live. When we are developing sites for clients we need to account for different screen dimensions, browsers, hardware, operating systems, and more. As you can imagine, going through an entire website on each device and browser can be very time consuming!

Traditionally, multiple people would test sites one device at a time making sure everything is functioning properly and looking right. With the device lab, all the devices can be viewed at the same time. We have also coupled our device lab with software called Ghostlab which syncs the scroll position, events, and pages across all devices simultaneously. This allows our quality assurance (QA) testers to audit all of the devices simultaneously, making the process even more efficient. It’s like magic!

We currently have the following devices (Named after famous fictional intelligent machines of course):

  • Dell Inspiron 11 (Rosie from the Jetsons)
  • iPhone 4S (R2-D2)
  • iPhone 5 (Johnny 5 from Short Circuit)
  • iPhone 6 (Agent Smith from The Matrix)
  • iPad 2G (Iron Giant)
  • iPad Mini (Voltron)
  • iPod Touch (WALL-E)
  • Galaxy S4 (Bishop from Aliens)
  • Galaxy S6 (Deckard from Blade Runner)
  • Nexus S5 (Ava from Ex Machina)
  • Nexus 7 Tablet (T-1000 from Terminator)
  • Amazon Fire Tablet (Optimus Prime)
  • Droid Charge (HAL-9000 from 2001: A Space Odyssey)
  • Google Pixel 2 (KITT from Knight Rider)

We also have several repurposed laptops and desktop machines capable of running virtual machines (an emulated machine). With these devices we can now test the following:

  • Browsers: Chrome, Firefox, Opera, Internet Explorer 11, Microsoft Edge, Safari, and Android Browser
  • Operating Systems: Windows 10, Windows 8 (virtual machine), Windows 7, OSX 10, iOS (multiple versions), Android (multiple versions), and FireOS

Why We Love the Device Lab

We are always looking for ways to improve our process, and the device lab has really advanced our QA testing efforts. Here are some main reasons why we love our device lab:

  • Makes testing more efficient and comprehensive
  • Takes less time and human resources
  • Makes it easier to find and squish bugs
  • Has a wide range of the most popular devices, browsers, and operating systems
  • Uses real devices rather than emulators which don’t always have perfect fidelity
  • Because “It looks fine on my machine” is not a good enough answer

Looking Ahead

Since the design is modular, we can easily add new devices or remove old devices as the mobile market transforms in the future. We are really excited about this latest development at Visceral, and we look forward to happy QA testing and totally awesome websites in the future!

In this post

Categories: / / /

Share