Adobe Edge Inspect (Shadow): travailler sur plusieurs supports visuels

Adobe a mis en place un outil gratuit pour contrôler le rendu de votre design sur de nombreux appareils mobiles (smartphones et tablettes). Voici une explication rapide pour le mettre en place.

Installer Adobe Edge Inspect (anciennement Adobe Shadow)

Pour commencer vous aller devoir installer IN sur votre poste et l’extension sur le navigateur Chrome. Vous trouverez le logiciel IN sur le site d’adobe (applications et extension Chrome) : http://forums.adobe.com/docs/DOC-2495

Vous trouverez aussi les liens pour les applications IOS, Androïd et Kindle.

Installer les applications sur les mobiles

Ensuite vous devrez installer les applications sur tous vos mobiles. Nous avons fait des tests sur un tablette Samsung (Androïd) et sur une tablette iPad1 et cela fonctionnait.

Connecter vos applications à votre ordinateur

Vous lancer le logiciel sur votre ordinateur, ainsi que les applications sur les mobiles. Vous allez ensuite sur Chrome où vous ouvrez la page à tester. Vous devriez voir une icône bleu avec « Sd » apparaître dans la barre de Chrome :

icône de Adobe Shadow

Vous allez sur votre appareil mobile et vous ouvrez l’application. Vous devriez voir apparaître le nom de votre ordinateur. Nous avons tester avec un PC sous Windows 7 et sous un Mac et les deux apparaissent bien alors qu’ils sont sur des connections internet différentes.

Vous choisissez ensuite l’ordinateur, l’application va vous fournir un code qu’il faudra recopié dans l’extension Chrome de votre ordinateur.

Code pour la connection

Affichage du code avec l’application sous Androïd

Saisie du code dans l’extension Sd sur Chrome

Affichage de la page web de votre navigateur dans la tablette

Si votre CSS utilise via des media queries (soit avec des switch soit en responsive des spécificités) d’affichage pour les tablettes et les mobiles, l’affichage sur l’application les prendra en compte.

Les temps de latence entre les modifications faites sur l’ordinateur et l’affichage sur le mobile sont relativement court.

Voir la vidéo (Anglais)

[iframe http://tv.adobe.com/embed/877/12009/ 515 296]

Lire aussi :

Vous pourriez aussi aimer...

Une réponse

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *