With all of the different smartphones, tablets and other devices that sport various operating systems and versions thereof, a Web developer’s job — testing (sometimes virtually) on multiple devices to resolve errors — hasn’t become any simpler. This article suggests how we can manage these tasks without pouring a truck-load of money into actually buying all of these different devices.
A user tests his website on a Blackberry device and takes notes of bugs.
Do You Test On Actual Devices? Link
Whether you develop websites or apps, you face several problems in ensuring that a product runs correctly on as many devices as possible. Emulators for iOS, Android, Opera and the rest can help with that, but they differ from the software that runs on real devices. One of the things you just can’t simulate properly is touch interaction. Without being able to test gestures, there is no way to find out whether your users will understand how to use your interface. Because this is unlikely to change anytime soon, there is no way around testing on real devices.
Testing touch gestures on different devices.
Some errors you would probably never notice because they appear only on devices that are uncommon in your country — but may be common in others. Thus, buying a lot of devices for testing seems to be an obvious solution. But that leads to two major problems: buying all of these devices would become very expensive (and you probably would not use them regularly anyway). Secondly, remote debugging on a wide variety of devices is not that simple. Fortunately, this has become much easier with all of the tools available today, but you still have to deal with it.
Crowd-Sourcing Makes Life Easier Link
This is where crowd-sourcing comes in. No one needs all of these devices every day. In fact, most developers need them only every few weeks.
Instead of every developer buying them all, what if there was a place where people could share devices for testing? If each person purchased a single device, you might already have enough to set up a device lab — which would save you a lot of money. The bigger the community of people contributing to this lab, the larger the variety of devices to test on. Even better, the community could even ask manufacturers to provide their devices to the lab, thus saving you even more money. Thus, access to mobile devices and a great testing space would be made available not just to you, but to everyone.
The Open Device Lab3 initiative aims to do just that. Currently, there are more than 50 locations around the world where a developer can go to test their project on multiple devices (some labs have more than 80 in stock). Most are completely free to use, while a few charge a small fee to cover the cost of running the lab. Because open device labs are meant to be non-profit, this is a fair deal and still much cheaper than buying the devices on your own.
A co-working space can be a nice surrounding for an Open Device Lab.
The people behind the labs range from individual developers who establish labs in their local co-working spaces to agencies that open their doors to share their hardware and knowledge with everyone. Different labs focus on different types of development: some on websites, some on apps, others on operating systems. Most have rules on using the lab. In general, you will want to make sure that installing your own software or wiping a device is OK.
Most sites cover a wide range of mobile manufacturers. In general, open device labs aim to supply at least the devices most used in their area. To check which devices are available in your area, search for a lab5 and check the list of manufacturers.
Many labs also provide development tools, such as Weinre6, Adobe Edge Inspect7, JS Console8 and Remote Preview9, as well as platform-specific tools, such as the Safari Web Inspector10. Remote inspection11 might be set up in some labs so that you can test and debug your websites from your computer, while some labs will have helper tools to enable you to test a product synchronously on all devices and debug individually. Each lab has its own features, so check to see whether the one near you meets your needs.
While Remote Preview will display a website on different devices, JS Console is just a remote console for your website. Weinre and Edge Inspect allow for remote inspection through a WebKit inspector and synchronized browsing, but they only run in the embedded Web view of the OS.
The labs also address Wi-Fi issues12 that occur with normal routers when more than an 40 devices are connected to the network. People have already solved problems that would normally drive you crazy, and they are happy to share their solution with you. And you can do the same by sharing your knowledge with others.
Many labs are built in existing co-working spaces, which makes it easy to maintain and access them. Another advantage of this is that you can schedule your time in the co-working space to coincide with when you will need to test extensively.
A user takes notes about viewing his website on a Blackberry.
Help Yourself And The Community Link
You can benefit a lot from such spaces. When you’re tackling a particularly tricky problem, the lab very likely has people who can assist you.
But make sure to help others when they ask for it. Developing websites together is much more fun and, from my experience, produces better results. And when you deliver great work, other people will notice and will consider hiring you for future work.
Support Open Device Labs Link
Because open device labs are built by the community for the community, it is very important that users give a little back. Doing this is rather simple. Most people have old devices at home. If you do and don’t need them anymore, consider donating them.
Secondly, offer some spare time to maintain a lab or at least spread the word among your colleagues. All of these little things help labs to grow, in turn helping developers like you all around the world.
The Open Device Labs14 website has a map of all existing labs. You can see how many devices are available and from which manufacturers, and you can read and give feedback on each lab. Thus, you can easily find a lab that fits your needs.
Viewing your product on various devices at one place makes it easy for you to identify problems.
Nonetheless, many more labs are needed around the world, as shown in the world map16. The demand is worldwide, but many people don’t know that such labs exist or how easy starting one actually is. Labs flourish with enough supporters, and the more supporters in a region, the better a lab gets. So, help to build these spaces, and tell others about the movement.
An API17 enables easy access to information about all of the labs. To open up your own lab, the non-profit organization LabUp2018 will support you by providing relevant information. You can easily build a website for your lab, and keep basic information about the lab up to date using the API. It is CORS- and JSONP-enabled, so you can access it right from your own domain. The documentation19 describes what kind of data you can access with the API and how to implement it on your website.
Create An Open Device Lab Link
Open device labs are a new movement, so you might not find one near you. But filling the gap is easy. Just search for colleagues in your region, connect with them, build the lab together, and move the Web forward! If you work at a company that owns a lot of devices, creating an open device lab is especially easy. But creating one wouldn’t be much harder for a freelancer. LabUp2018 will be happy to help you establish a lab21 by giving you tips on setting up the technical aspects and by connecting you to device manufacturers.
If you’d like to spearhead a lab in your area, taking care of the following details will give you a good start:
- Make the space open and freely accessible.
- Create a pleasant interior so that people look forward to coming.
- Provide some devices at launch, and invite contributions or sponsorships.
- Make sure the Internet connection is fast and reliable.
- Build rock-solid Wi-Fi.
- Install stands for the devices.
- Secure the devices so that they don’t get stolen.
- Coordinate people to run the lab when it’s open. (And consider keeping it open for long hours).
- Find ways to reduce costs for you and the lab’s users.
In short, seriously consider creating, maintaining or supporting an open device lab in your area.
Open Device Labs often have a lot of different devices to test on.
More Resources Link
- “Establishing an Open Device Lab24,” Viljami Salminen, Smashing Magazine
- “How to Build a Device Lab25” Dave Olsen
- Jay Meissner26 Articles on Jay’s blog related to open device labs
All images by Open Device Lab Nuremberg.
- 1 https://www.smashingmagazine.com/wp-content/uploads/2013/05/odl-nbg-2-4_mini.jpg
- 2 https://www.smashingmagazine.com/wp-content/uploads/2013/05/odl-nbg-2-15_mini.jpg
- 3 http://opendevicelab.com/
- 4 https://www.smashingmagazine.com/wp-content/uploads/2013/05/odl-nbg-2-2_mini.jpg
- 5 http://opendevicelab.com/#find
- 6 http://people.apache.org/~pmuellr/weinre/docs/latest/
- 7 http://html.adobe.com/edge/inspect/
- 8 http://jsconsole.com/
- 9 https://github.com/viljamis/Remote-Preview
- 10 http://developer.apple.com/library/ios/#documentation/AppleApplications/Reference/SafariWebContent/DebuggingSafarioniPhoneContent/DebuggingSafarioniPhoneContent.html
- 11 https://gist.github.com/3816624
- 12 http://klick-ass.com/news/affordable-wifi-access-point-capable-to-support-50-100-clients-wanted/
- 13 https://www.smashingmagazine.com/wp-content/uploads/2013/05/odl-nbg-2-16_mini.jpg
- 14 http://opendevicelab.com/
- 15 https://www.smashingmagazine.com/wp-content/uploads/2013/05/odl-nbg-2-18_mini.jpg
- 16 http://opendevicelab.com/#find
- 17 http://api.opendevicelab.com/
- 18 http://lab-up.org/
- 19 http://opendevicelab.com/api-documentation.php
- 20 http://lab-up.org/
- 21 https://www.smashingmagazine.com/2012/069/24/establishing-an-open-device-lab/
- 22 https://www.smashingmagazine.com/wp-content/uploads/2013/05/odl-devicepark_mini.jpg
- 23 http://lab-up.org/
- 24 https://www.smashingmagazine.com/2012/09/24/establishing-an-open-device-lab/
- 25 http://www.dmolsen.com/mobile-in-higher-ed/2012/06/26/how-to-build-a-device-lab-part-1/
- 26 http://klick-ass.com/tag/open-device-lab/
Hold on, Tiger! Thank you for reading the article. Did you know that we also publish printed books and run friendly conferences – crafted for pros like you? Like SmashingConf New York, on June 14–15, with smart design patterns and front-end techniques.