Adobe Edge Inspect – Quick Test Responsive Design On Mobile Devices

So you have built a responsive website and it is time to test it out. Generally, we can test responsive website by minimizing the browser window width or simply using a responsive bookmarklet.

But, there is actually no better substitute than to test the website directly in an actual mobile device. Browsers in mobile devices have slightly different quirks than the desktop versions, so you can find and investigate glitches that may occur only in mobile browsers.

Furthermore, if you implement particular features that use touch interaction on your webpage, you can also immediately see how it performs. In this post we will show you how to do it with Adobe Edge Inspect. Let’s check it out.

Check out: 50 Useful Responsive Web Design Tools For Designers

Install Adobe Edge Inspect

First you need to install the Adobe Edge Inspect application, which can be downloaded from Adobe Creative Cloud with an account.

After installing the App, open it and enter your Adobe Creative Cloud credentials. Then, install the Adobe Edge Inspect Extension for Google Chrome, and the App for mobile device, for iOS and Android device (at the time of this writing).

Connecting to Mobile Device

Once all the requirements have been set up, you can connect your Computer to your mobile device – in this example my iPhone. Ensure that your devices are in the same wireless connection, and the Chrome Extension is on the ON state. It will then detect your computer and give you a 6-digit passcode to connect.

Enter the passcode within the Chrome Extension.

Testing Website

Once the code has ben verified and the two devices are connected, every time you open a webpage in Google Chrome (when Adobe Edge Inspect is running), it will instantly be displayed on your connected mobile device. With a Adobe Cloud Creative Pro account you can connect to multiple devices.