Voici les différentes possibilités de RacontR que nous allons aborder :

  • Télécharger le Script .JS
  • Photoshop, préparation de votre maquette
  • Lancer le script .PSD
  • Importer le .ZIP dans RacontR

Télécharger le script (schéma ci-dessous) : 

Pour importer vos PSD dans RacontR, vous devez exécuter un script dans Photoshop.

Rendez-vous dans la partie Scénario de votre projet.

  1. Cliquez sur le bouton « PSD »,
  2. Une pop-up s’affiche.
  3. Cliquez sur « Script PSD et documentation »
  4. Un fichier au format zip se télécharge sur votre ordinateur,
  5. Récupérez-le et « dézipper » le fichier.
  6. Dans le dossier vous trouverez le fichier « racontr.jsx »


Photoshop, préparation de votre maquette (schéma ci-dessous) :

Avant de lancer le script sur votre maquette, il faut respecter certaines règles, et s'assurer que le fichier .PSD est propre : 

Vous avez réalisé votre maquette Photoshop. Travaillez votre maquette à la taille réelle, en 72 Dpi et en mode calorimétrique RVB.

  1. Pour que l’export vers RacontR soit optimal, assurez vous de n’avoir aucun dossier ou sous dossier dans la fenêtre des calques.
  2. Évitez d’avoir trop de calques dans votre maquette. Par exemple si vos pictos ou image de fond sont composés de plusieurs calques, fusionnez-les pour n’avoir qu’un seul calque.
  1. Voilà le script est terminé (schéma ci-dessous) 
  2. Un dossier à été crée à l’emplacement de votre « psd ». Dans ce dossier vous trouverez un dossier « image » et un fichier « elements.xml »
  3. Sélectionnez le dossier à la racine, et zippez-le.

Une fois fait, retournez dans la partie Scénario de votre projet Racontr, nous allons importer notre « psd ».

Lancer le Script PSD

Votre maquette PSD est maintenant préparée et prête à être exportée, nous allons maintenant exécuter le script.

  1. Pour lancer le script, allez dans fichier
  2. puis dans « Script »
  3. Allez chercher le fichier que nous avons précédemment téléchargé : racontr.jsx.

L’opération peut prendre un peu de temps, attendez que le script se termine : une fenêtre pop-up doit apparaître à la fin de l’opération.

Importer le  « Zip » dans RacontR (schéma ci-dessous): 

  1. Cliquez sur PSD puis dans la fenêtre pop-up, cliquez sur « Drop files » puis allez chercher le fichier que vous venez de zipper.
  2. Vous pouvez aussi cliquer-déposer votre fichier zippé dans cette zone.
  3. L’opération peut prendre un peu de temps. Quand la page apparaît dans votre scénario, l’opération est finie. Cette page porte le nom de votre PSD.
  4. Double cliquez sur cette page, et voilà, les calques de votre PSD ont été importés. Dans l'éditeur de page, ils sont tous disposés dans le bon ordre et la mise en page des éléments a été respectée.

Vous pouvez maintenant animer votre page !

Did this answer your question?