10  mai

Djehouti en 6 étapes

1 . Paramatrez votre projet

  • Rendez-vous dans l’onglet projet (fig. 1)
  • Changez la couleur de fond de page (autour du site) et de fond de scène (le fond de votre site). (fig. 2)
  • Changez la taille du projet, largeur puis hauteur en pixel. (fig. 2)
  • Charger une police de caractère de votre choix, déterminez les feuilles de style de votre projet (quel police, corps, couleur pour les titres, sous-tittre et texte) (fig. 3)

 

2 . Charger vos médias

  • Cliquez sur le bouton parcourir en regard de sa catégorie pour charger un ou plusieurs (maintenir la touche « maj ») fichiers dans la bibliothèque.
    Les médias sont alors automatiquement encodés dans un format optimisé pour le web. (fig. 5)
  • Cliquez  sur la petite flèche en dessous du titre des catégories pour voir l’ensemble des médias de cette catégorie. (fig. 4)

 

3 . Scénarisez

  • Créez des pages en cliquant sur « ajouter une page » (fig. 6)
  • Pour les renommer et y ajouter des boutons vous devez double-cliquer dessus.
    Une fois dans l’éditeur de page, dans « propriété de la page » renseignez le champs « nom » puis validez.(fig. 8)
    Pour ajouter un hotlink (bouton transparent) cliquer sur l’icone le plus à gauche de la barre d’outil (fig. 9)
  • Changez la taille du projet, largeur puis hauteur en pixel. (fig. 2)
  • Pour relier une page à une autre cliquer sur un bouton en dessous d’une page et tout en maintenant le bouton gauche de la souris déplacez le curseur sur la page vers laquelle vous voulez qu’il pointe. (fig. 7)

 

 

4 . Mettez en page

  • Placez vos medias et redimentionnez-les en « drag & drop ».  (fig. 10)
  • Utilisez la barre d’outil pour créer bloc texte, image, vidéo, son, diaporama… (fig. 11)
  • Modifiez le placement, la taille, l’opacité, la couleur de fond, les effets d’ombre et d’arrondi, etc. en passant par la palette propriété. (fig. 12)
  • Gérez la profondeur des calques en les remontant dans la pile pour qu’ils soient au premier plan. (fig. 13)

 

 

5.  Gérez l’interactivité

  • Sélectionnez un élément puis rendez-vous dans l’onglet « Transitions & interactions »
    Vous pouvez assigner une animation d’arrivé de vos éléments dans l’onglet transition. (fig. 16)
    Ou bien définir  une interaction de clic, de survol ou de « roll out » (fig. 17)
  • Dans le cas d’une interaction une fenêtre s’ouvre vous laissant choisir les éléments à animer, la propriété (opacité, position, taille…) à faire varier et sa valeur, la durée de l’animation, le temps avant lequel elle se joue et enfin un paramètre « retour » vous permettant de jouer l’animation à l’envers lors d’un roll-out ou d’un second clic (fig. 15)

 

 6.  Publiez ou exportez

  • Publiez vos pages depuis l’onglet propriété de page de l’éditeur de page (fig.18) ou depuis le scénario en cliquant sur le bouton « publier la page » une fois celle-ci sélectionnée. (fig.19)
  • Vous pouvez aussi intégrer votre projet dans une colonne de votre site, une page facebook ou sur un blog wordpress (c’est le cas du header de ce post).
    Pour cela, dans la partie Projet copiez la ligne du champs « Embed du lecteur Djehouti » puis collez-là où vous le souhaitez dans votre site.