IntroductionWhois a mobile developer?Who knowswhatAdoe Shadow is?Who used Shadow?
So what is Adobe Shadow?I will actually answer this question by telling you the problems it solves. So when you develop mobile websites you are still doing this on your laptop or desktop. Right? So you will be using your favorite text editor or IDE, your favorite browser and developer tools or firebug and so forth.
But at some point you have to test the page on mobile devices. And this is where the “fun” part starts. So you pull out your first device and using the tiny keyboard you start typing the URL. Sometimes this URL is not short – you may use a local server so part of the URL is your computer’s IP address. Then you test on your second and third device. So more fun.Then maybe you change something in the code and you are not sure if the browsers from the device are using the cache or the latest assets.How about screenshots? You may need screenshots for documentation or design and in truth it is a pain in the ass to take screenshots on mobile devices. Like on iOS you have to email it to yourself an so forth.What about debugging the code that runs on the device?Now, it may look that I am over exagerating but my point is that all these stuff takes time and it shouldn’t. You should spend this time developing and not trying to get to the point when you can actually test.What are the solutions? To some extent weinre and Chrome for Adroid alleviate some of these issues but not all of them.
And this is what Shadow brings to the table. It streamlines the whole process and gives you back this lost time. How?First of all it offers something called synchronized browsing. Once you installed the product and paired your mobile devices with your computer, all you have to do to test a page is to type in the URL on your computer and your mobile devices will magically display the same URL without you doing anything. As you navigate on your computer, the devices will be kept in synch displaying the same URL as your computer.
But this is not all. Shadow supports remote web inspector sessions. You can start a session with any of the connected mobile devices, one at a time. So the web inspector running on your computer is connected to the mobile browser. And you can check the DOM, CSS properties, or use the JavaScript Console.
How it works? Adobe Shadow have three different parts. First there is the desktop application that acts like server between the mobile devices and the desktop Chrome browser. Then there is the Chrome extension. And finally the mobile Shadow apps.
Let’s see Adobe Shadow in action. Script:Pairing a device.Loading a remote website and navigate to different URLs. Bostonglob maybe?Loading a localhost website localhost/atabsplitter/Refresh GestureDebugg session
Shadow works on Windows and Mac OS. It works for iOS and Android devices. Here are some of the features and want to highlght the support for LiveReload, HTTP authentication, and one page apps.
Finally make sure you check these resources if you want to get the product. For now it is beta and it is free.