Back to the Futuresplash! Adobe’s web technology reboot/

Adobe’s recent transition to w3 web technologies has produced an exciting wave of new development applications and technologies. One, in particular, has already made a positive impact on our development processes here at Great Fridays.

Adobe Shadow/

Adobe Shadow is a lightweight web development tool for efficient cross platform testing, debugging, remote inspection and DOM manipulation. Shadow synchronises Android and iOS devices, via WiFi, with your desktop computer; streamlining the preview process. Connected devices mirror your desktop computer browser, replicating navigational clicks and therefore eliminating the need to interact with each device individually.

The Shadow utility consists of:

• Desktop helper – installed on your desktop computer, it needs to be open to keep the connection with devices. (Bonjour is required to provide auto discovery for devices – this is enabled by default on OS X).
• Chrome browser extension – to control interactions (debugging, cache management, inspection, etc) with devices from your desktop computer
• iOS App – used to preview on device iOS devices
• Android App – used to preview on device Android devices

Adobe have been continuously making improvements to Shadow, listening to feedback from its users and responding to feature requests by developers. Last week Adobe released version 3 of Shadow, with infrastructure updates and some useful new features, including:

• Device screenshots – simultaneously taking screenshots of all connected devices, saving them to your desktop computer’s hard drive
• Cache management – clear the cache and refresh page for individual devices with one gesture or even clear all the connected devices caches with a single click from your desktop computer
• SSL support - new support for local development workflows with https, accepting self signed certificates on all devices
• location.hash – all URL changes trigger updates to connected device

What we think/

Our frontend developers have been using Shadow since it’s beta and candidate releases earlier this year, it quickly became an indispensable development tool and formed an important part of their daily workflow. Helping to streamline the multi-device testing and debugging of responsive sites and mobile web apps; which in the past had been time consuming and, at times, a tedious process.

Shadows remote inspection tool uses a Weinre server, hosted externally with Adobe. In the earlier releases our developers frequently experienced periods of downtime, probably due to maintenance and/or updates to the service. Recently it has become much more stable, however it can, at times, seems a little slow.

Most of our development is done locally, using either IIS or MAMP and, despite what a large number of App reviews say, Shadow does fully support local development. Although, not surprisingly it will not load local files browsed via file:/// as none of the files actually exist on the connected devices.

Our suggestions/

We asked frontend team what features they would like to see in future releases of Shadow, here’s what they thought:

• Single authentication - for sites that require authentication (e.g. an account login), we should be able to enter these details just once for all devices. At the moment each devices needs authenticating separately.
• Wider device support – as Shadow is currently only available on iOS and Android devices. Support for Windows 8 phones and BlackBerry would be useful.
• More browser support – currently Shadow only works with Google Chrome, an extension for Firefox and even IE 9/10 would be nice for those who are more familiar with those browsers and dev tools.
• Better script debugging – access to the Script tab, for more advanced JavaScript debugging with breakpoints.
• Edit as HTML – although it is possible to manipulate CSS and HTML from the elements tab, it would nice to be able to right click and edit HTML, as text as you can with the Chrome tools.

What’s next for Shadow?/

Currently Shadow is released through Adobe Labs, and free to use, while Adobe improves and develops it further. It is likely that Shadow will become part of the Adobe creative cloud subscription service later this year. We highly recommend giving it a try for yourself (while it’s free!). And keep a close eye on Shadows development team, on Twitter and their blog, for more up to date information on future releases.