Mediator 7

Mediator, outil de création de présentations multimédia mêlant textes, images,

vidéos, sons, effets d’animation et de transition.

Prise en main et utilisation simples et rapides

(la connaissance des trois outils de base suffit
pour utiliser le logiciel et produire un projet)

Environnement de mise au point intuitif

(les différents outils sont clairement
agencés et illustrés)

Nombreuses possibilités de publication

(CDROM avec ou sans installation sur le
disque dur, disquettes, site Web
compacté en EXE ou non, document
Flash, document Flash exécutable, (Mediator inclut un logiciel FTP)
.EXE)
Tous les objets ou les comportements ne s’exportent pas dans tous les modes de publication.

Réal. Joël Leporcq CDDP des Zardennes

 Mediator 7
Cliquez sur "Créer un document" pour créer un document vide. Si vous avez désactivé l'affichage de la
boîte de dialogue Bienvenue, vous pouvez créer un nouveau document en cliquant sur Fichier dans le
menu principal, puis sur Nouveau.

Mediator vous propose une page vide sur laquelle vous

Acceptez les paramètres par défaut allez pouvoir déposer des objets. Vous pouvez aussi en
jusqu'à ce qu'une page vide de déposer à l’extérieur (c’est le cas lorsque la position
document s'affiche initiale d’un objet doit être hors de la page).

C’est grâce à la Boîte à outils que

vous pouvez déposer les objets sur la
page :

Astuce : utilisez la touche Ctrl pour déplacer la zone

visible de la page.
 Mediator 7
La Boîte à outils
Description rapide des outils

Sélection (sélection multiple par tracé ou avec la touche Ctrl)

Rotation (Image, Vidéo, Titre, Polygone, Rectangle, GIF animé, Tracé d'animation)
Titre (une ligne de texte s’adaptant à son contour)
Texte (texte formaté, saisi, importé ou collé) dans lequel on peut créer des liens hypertextuels
Rectangle
Bouton (aspects normal,survolé,enfoncé et texte)
Image (importation d’un grand nombre de formats) sur laquelle on peut définir des zones sensibles
Relief 3D (superposition d’un effet de relief sur un objet ou une partie d’objet)
Vidéo (crée un lecteur capable de diffuser des vidéos AVI et MPEG)
GIF animé (crée un objet destiné à afficher un GIF animé)
Polygone (permet de créer polygones, courbes, lignes, flèches, etc.)
Tracé d'animation (identique à Polygone pour tracer le trajet suivi par un ou plusieurs objets)
Flash (permet d’afficher un objet Flash, depuis un fichier externe)
Active Document (fenêtre affichant le contenu d’une page Web externe)
Windows Media Player (diffusion de son ou vidéo en streaming avec synchronisation éventuelle)
Entrée (saisie de données par l’utilisateur mais aussi présentation de données par le logiciel)
Zone de liste (crée des listes dans lesquelles l'utilisateur peut effectuer des choix)
 Mediator 7
La Liste des pages

Il s'agit d'une liste répertoriant toutes les pages contenues

dans le document. Pour l'instant, ce dernier n’en contient
qu'une seule, nommée "Page1" par défaut.
Si la liste des pages n'est pas encore ouverte :
Choisissez Vue dans le menu principal.
Choisissez "Liste des pages" dans le menu Vue.

Toutes les modifications de la liste des pages s'effectuent par

le biais de son menu contextuel. C’est ainsi que l’on peut
ajouter, supprimer, renommer les pages de la présentation.
Ajoutons deux pages.

Mediator recommande de n’utiliser que

les caractères a..z, A..Z, 0..9 et _ dans
les noms (y compris les noms de
fichiers) afin d’éviter tout problème lors
d’une éventuelle publication vers les
formats HTML ou Flash.
 Mediator 7
Ajout d’un objet

Il est facile de se rendre sur une page donnée en la sélectionnant dans la liste des pages, puis,
en cliquant sur le bouton Image de la Boîte à outils, d’ajouter une image sur cette page …

La boîte de choix d’une image intègre

l’aperçu et les propriétés de l’image.
Ainsi qu’une liste historique très
pratique des dossiers déjà utilisés.

On peut ensuite déplacer et déformer le cadre image. S’il est pris par l’un de ses coins il
conservera ses proportions.

Procédons de même pour charger 2.JPG et 3.JPG comme images de fond des pages 2 et 3.

Propriétés d'un objet

Tous les objets disposent d'une boîte de dialogue Propriétés dont vous pouvez modifier les
paramètres selon vos exigences. Si la boîte de dialogue Propriétés n'est pas ouverte, choisissez
Vue | Propriétés dans le menu principal, ou cliquez avec le bouton droit sur l'objet et
choisissez Propriétés dans son menu contextuel.
 Mediator 7
La boîte des Propriétés

Cette boîte de propriétés regroupe tout ce qui est nécessaire

pour contrôler l’apparence de l’image. Non seulement ses
dimensions, mais aussi son mode de transparence, définir un
masque, demander qu'elle remplisse son rectangle en
mosaïque, son défilement éventuel, son ombre, …

Le volet Notes, présent dans toutes les boîtes de propriétés,

permet au concepteur de la présentation de déposer des
remarques liées à l’objet.

La boîte de dialogue Propriétés se réfère toujours à l'objet sélectionné. Si aucun objet n'est
sélectionné, elle se réfère à la page en cours.

C’est dans le volet Général

des boîtes de propriétés que
l’on trouve par exemple la
case à cocher qui permet de
décider si un objet sera visible
ou pas.
 Mediator 7
Ajout d’un objet Bouton

Posons un bouton sur la page 1, dont le rôle sera de permettre à l’utilisateur de passer à la page
suivante. Il suffit pour cela de se placer sur la page concernée et de cliquer sur l’outil Bouton
avant de le poser à l’endroit souhaité.

Dès que le bouton est posé, la page s’obscurcit

afin de ne laisser que la zone de saisie du texte du
bouton.

Ce n’est que lorsque nous quitterons cette zone de saisie

que Mediator nous restituera l’écran habituel, afin par
exemple de revenir, par la boîte des propriétés du bouton,
sur ses couleurs, la police employée …

Il faut donner aux objets des noms plus

Nous doterons la page 2 d’un bouton « page évocateurs que leur nom par défaut ce
précédente » puis, nous programmerons ces boutons … qui permettra à l'avenir de les distinguer,
comme par exemple ces deux boutons …
 Mediator 7
Ajout d’un comportement à un objet

Programmer un objet c’est le doter de réactivité, le rendre réceptif à certains évènements en lui
associant un ou plusieurs comportements Les évènements auxquels un bouton peut se révéler
sensible sont, par exemple :

L’utilisateur a cliqué avec le bouton gauche de la souris sur l’objet

La souris est entrée dans le périmètre de l’objet

La souris est sortie du périmètre de l’objet

L’utilisateur a cliqué avec le bouton droit de la souris sur l’objet

À chacun de ces évènements le concepteur de la présentation peut associer une action, comme
par exemple :

Aller à telle page Pour doter un objet de la réactivité

Jouer un son
Changer le pointeur de la souris
Faire apparaître tel objet
désirée, nous ferons appel à la boîte de
dialogue Évènements. Pour ouvrir cette
dernière :
Cliquez sur l’objet avec le bouton droit
de la souris et choisissez Évènements
dans son menu contextuel.
Évènements Mediator 7
Le côté gauche de la boîte de dialogue
Événements répertorie tous les événements actions
auxquels est sensible l'objet sélectionné. Un
évènement est une opération effectuée sur un objet.
L'objet peut par exemple recevoir un clic gauche
ou droit de la souris, le pointeur peut être amené
sur sa surface, et ainsi de suite.

événements
Le haut de la boîte de dialogue présente la liste de
toutes les actions disponibles pour l'objet
sélectionné. Une action est l'effet recherché lorsque
l'évènement correspondant est déclenché. Nous
pourrions par exemple vouloir afficher une autre
page, diffuser un son, lancer une animation, etc.

Ici, pour que notre bouton affiche la page 2, il convient d'associer l'événement "Clic souris" à l'action
"Aller à la page".

Cliquez sur l'événement "Clic souris" et faites-le glisser

dans le grand champ vide (appelé "champ actif").
Cliquez sur l'action "Aller à la page" et faites-la glisser
dans le champ actif à droite de "Clic souris".
Lorsque vous déposez l'action "Aller à la page", la boîte de dialogue "Aller à la page" s'affiche et
vous permet de préciser sur quel page il faudra aller et comment …
Évènements Mediator 7
Cette boîte de dialogue vous permet de sélectionner la page que
vous souhaitez afficher à la suite d'un clic sur le bouton.
Chaque fois que vous déposez une action "Aller à la page" dans
le champ actif, une liste de pages s'ouvre automatiquement dans
la boîte de dialogue "Aller à la page".
Cette liste de pages est identique à la liste des
pages standard, mis à part la présence de 7
pages supplémentaires spéciales, les pages
"@" qui désignent des pages ayant une
position donnée par rapport à la page courante.
Vous pouvez maintenant sélectionner la page que vous souhaitez afficher lorsque le bouton reçoit un clic.
Sélectionnez "Page2" dans la liste des pages et cliquez sur OK au bas de la liste.

Le nom "Page2" apparaît maintenant dans le champ Page dans

l'angle supérieur gauche de la boîte de dialogue "Aller à la page".
Et vous pouvez, dans le cas de cette action, choisir un des effets de
transition disponibles, ainsi que choisir sa durée et son
accélération.
Il vous sera toujours possible de
revenir sur ces paramètres, dont la
page cible, au moyen du bouton Page :
 Ajoutez de même un bouton "Page précédente" sur la page 2.
 Mediator 7
Test de la présentation
Afin de vérifier le fonctionnement et l'apparence des choix que vous avez faits concernant les objets
présents sur vos pages, vous pouvez lancer le projet comme le verra l'utilisateur de votre présentation.
Vous disposez pour cela du menu Test et de ses raccourcis clavier.

F5 lance la présentation comme

elle s'exécutera hors de la
présence de Mediator, tandis que
Esc la refermera et vous fera
revenir au mode de création.

Vous pouvez ainsi vous placer dans la position de l'utilisateur final et voir et utiliser les boutons que
vous avez définis ainsi que les éventuels effets de transition par exemple.

"Exécuter page" permet de lancer la présentation directement sur la page choisie.

"Vérifier document" parcourt toute la présentation à la recherche d'erreurs, comme fichiers ou liens
manquants, sauts de page non valides, etc. Ce que "Vérifier page" fait pour la page courante.
 Mediator 7
Pages maîtresses
Si nous souhaitons définir sur nos pages des boutons permettant de les feuilleter, il nous est possible de
définir ces boutons en un seul endroit, une page maîtresse, et d'associer celle-ci aux pages devant
recevoir les boutons.

Les pages auxquelles on associe une page maîtresse héritent automatiquement de ce que contient celle-
ci. Dans l'exemple des boutons, cela permet donc de n'en définir que deux, qui serviront pour autant de
pages que nous le souhaiterons. Une page maîtresse est une page désignée en tant que couche de fond
(maîtresse
. arrière) ou de premier plan (maîtresse avant) d'une ou de plusieurs autres pages.
Les objets placés sur une page
Les modifications apportées à une page
maîtresse arrière apparaissent
derrière les objets de la page en maîtresse seront donc automatiquement
cours. Une page maîtresse arrière est reportées sur toutes les pages qui sont
donc utile pour définir un arrière-plan associées à celle-ci.
ou une maquette de Les
page. objets placés sur une page
maîtresse avant apparaissent devant D'une manière analogue aux styles de
les objets de la page en cours. Une Word, par exemple, les pages maîtresses
page maîtresse avant est donc utile ne font pas seulement gagner
pour définir boutons et menus énormément de temps, elles assurent
aussi une cohérence dans le projet.

Vous pouvez définir autant de pages maîtresses que vous le désirez, ce qui
signifie que vous pouvez articuler votre présentation en différentes sections,
chacune d'entre elles disposant de son propre arrière-plan et de boutons et menus
distincts.
Création d'une page maîtresse
Mediator 7
Créons une nouvelle page par le menu contextuel de la liste des pages :
Et nommons-la par exemple "PremierPlan" (souvenons-nous des règles
d'écriture des noms dans Mediator).

Transférons (Couper/Coller) les boutons des pages 1 et 2 vers cette nouvelle page "PremierPlan".
Et profitons-en pour les aligner correctement

Fonction "Aligner" :
Sélectionner les objets à aligner (avec la touche Ctrl pour les
sélections multiples)
Utiliser le raccourci-clavier F2 pour faire apparaître la boîte
d'alignement
Choisir l'alignement désiré pour les objets

Modification du comportement des boutons de

la page maîtresse
Ces boutons sont maintenant censés être génériques, et
déclencher l'action "aller à la page suivante", et non à une
page d'un rang précis. Retournons dans les évènements
associés au bouton "Page suivante" et là, remplaçons "Page2"
par une des valeurs gérées par le logiciel : @Next, qui
désigne la page suivante, quelle qu'elle soit. Ce bouton,
lorsqu'il apparaîtra sur une page, pointera donc
automatiquement sur la suivante. Opérer de même avec "Page
précédente" et @Previous.
Association d'une page maîtresse
Mediator 7
Définition d'une page maîtresse pour une page isolée en
utilisant les onglets en bas de la fenêtre :
Cliquer sur l'onglet de gauche permet de définir une
page maîtresse arrière et cliquer sur l'onglet de une page
maîtresse avant. Si elles sont déjà définies, l'onglet
l'affiche.
Cette méthode permet d'ailleurs
de la créer au passage.

Les onglets permettent donc de créer, puis d'afficher une page maîtresse, et enfin d'en occulter
temporairement l'effet sur la page courante
La page maîtresse La page maîtresse
arrière est affichée avant est désactivée

Définition d'une page maîtresse pour plusieurs pages :

Lorsque plusieurs objets sont sélectionnés

(avec la touche Ctrl), la boîte des Propriétés
affiche leurs propriétés communes. Vous
pouvez donc ici facilement définir une même
page maîtresse pour tout un ensemble de
pages.
Hiérarchiser la liste des pages
Mediator 7
Lors du test de la présentation, l'une des remarques qui peuvent être faites est que la page PremierPlan
s'affiche elle aussi, de façon indésirable. L'appel à @Next et à @Previous fait que les pages cibles sont
celles qui précèdent ou suivent la page qui est au même niveau que la page courante.
De même que dans l'Explorateur de Windows, il est possible de créer un dossier en-dessous d'un autre,
il est possible dans Mediator de ranger une page "sous" une autre.
La liste des pages permet de créer, de supprimer, de renommer, mais aussi de
déplacer les pages, les unes à la suite des autres ou à des niveaux différents.
Vous pouvez en effet créer des sous-pages mises en retrait sous des pages de
plus haut niveau, ce qui vous permet d'organiser votre document en chapitres,
sous-chapitres, pages de titre, et ainsi de suite, afin d'en visualiser la structure
plus aisément.
Les commandes @Next, @Previous etc. de l'action "Aller à la page" se réfèrent
toutes à cette structure de la liste des pages
Un document Mediator démarre toujours en
affichant la page située en haut de la liste des pages.

Le fait de décaler la page maîtresse dans la hiérarchie des pages la fera donc
échapper à l'enchaînement des @Next et @Previous.
Programmation conditionnelle (1) Mediator 7
Lors du test de la présentation, une autre remarque est que le bouton "page précédente" s'affiche même
sur la première page, tandis que le bouton "page suivante" s'affiche même sur la dernière.
Nous allons, pour corriger ceci, programmer la page maîtresse avant pour qu'elle teste le n° de la page
courante lors de son chargement …Et pour cela nous intéresser aux évènements de la page.
Cet événement se produit à la suite d'une action
"Aller à la page", dès que tous les objets visibles
de la page sont affichés. Il n'est disponible que
dans la boîte de dialogue Événements de la page.

Cet événement se produit dès qu'un objet ou une

page est démarré. Il survient par exemple dès que
Mediator opère un saut de page (à la différence de
l'événement Page prête, qui n'est activé qu'une fois
tous les objets affichés).
Ici, nous allons utiliser l'événement "Démarré" afin de ne pas afficher le bouton indésirable lorsque la
page courante n'en a pas l'utilité. Si nous utilisions l'événement "Page prête", l'utilisateur verrait le
bouton non souhaité s'afficher, puis être masqué une fois seulement que la page aurait fini de
s'afficher.

Glissons l'événement "Démarré" dans le champ actif.

Programmation conditionnelle (2)
Mediator 7
Le volet "Programmation" des actions possède une structure
Si-Alors-Sinon tout indiquée ici pour tester le n° de la page
courante et masquer soit le bouton "précédente" si le n° de la
page est 1, soit le bouton "suivante" si ce même n° est égal au
nombre total de pages …
Faisons glisser Si-Alors-Sinon dans le champ actif.
Écriture de la condition à tester :
On est allé chercher la désignation
"@PageNum" dans les variables
proposées par le logiciel.
Si cette condition est remplie, il faut cacher le bouton
"précédente"
D'où l'importance ici, par
exemple, d'avoir nommé
correctement les boutons,
autrement que Bouton01,
Bouton02, …
Programmation conditionnelle (3)
Écriture de la condition à tester :
Lancer la présentation (F5), pour voir …
Mediator 7
Nous allons maintenant ajouter notre deuxième
condition, toujours sur l'événement "Démarré".
Faisons glisser un autre "Si-Alors-Sinon" dans
le champ actif.
Chaque fois que la page PremierPlan sera
appelée, la page courante sera testée au regard
de ces deux conditions.
Les variables proposées par le logiciel, toujours,
où @PageName désigne le nom de la page. Ayant
renommé la dernière page "Fin" (pour plus de
clarté) la condition ne sera vraie que pour elle.
Si cette condition est vraie, cacher
le bouton "suivante".
Une animation en page 2 (1) Mediator 7
À l'aide de l'outil GIF animé, allons chercher le
fichier Bird.GIF pour le déposer sur la page 2.
Le but étant de faire traverser le ciel par
l'oiseau dès que la page 2 sera chargée …
Dans ce but, il faudrait que l'oiseau
soit initialement en dehors de la
Création du tracé de l'animation : page, à gauche par exemple …

L'outil "Tracé d'animation" permet de définir les points successifs que parcourra une animation.
Comme lors de la définition d'un bouton, l'écran de Mediator s'obscurcit et ne laisse que les
outils relatifs au tracé :

Sélection de Suppression Grille Courbe Rétablit Valide le

point(s) de point(s) sans les lignes tracé
angle brisées

Ajout d'un Annulation Ouvrir une Courbe Affiche l'aperçu

point courbe discontinue de l'objet en ce
fermée point
Une animation en page 2 (2) Mediator 7
Programmation de l'animation

L'événement déclencheur de l'animation sera la fin du chargement de la page que nous allons donc
amener dans le champ actif des évènements de la page (F9 ou menu Page) :

Et c'est l'action "Animer" du volet

"Multimedia" qui sera glissée à la
suite de "Page prête".

Apparaît alors la boîte de dialogue

qui offre tous les paramètres de
réglage de l'animation :

Normal : L'objet suit le tracé d'animation à l'emplacement d'origine du tracé

Utiliser l'objet en tant que point initial du tracé : L'animation commence à la
position actuelle de l'objet. Il en résulte que le premier point du tracé
d'animation devient en fait le deuxième point de l'animation proprement
dite.
Terminer tracé à l'objet : Le tracé d'animation est déplacé de telle sorte que
l'objet termine son parcours à sa propre position d'origine.
Démarrer tracé à l'objet : Le tracé d'animation est déplacé de telle sorte que F5 teste la présentation
l'objet débute son parcours à partir de sa propre position d'origine CTRL F5 teste la page
Évènements Dedans et Dehors Mediator 7
Lorsque la souris entre dans le périmètre d'un objet, ou en sort, elle crée un évènement que Mediator
peut traiter. Utilisons cet évènement pour modifier le curseur des deux boutons.

En associant à "Dedans" l'action "Curseur" nous

modifions le curseur de toute la présentation dès que la
souris survole l'objet concerné, ici "BoutonPrec".

Il faudra donc le rétablir lorsque la souris sortira du

périmètre du bouton, avec l'événement "Dehors". De
même lorsqu'en, étant au-dessus du bouton, l'utilisateur
cliquera dessus.

Un évènement peut être coupé, copié

et collé, en passant par le Presse-
Papier, ou plus simplement avec la
souris (ici, pour le dupliquer, en
gardant la touche Ctrl appuyée …)

Nous pouvons copier ces modifications sur le bouton "Suivant".

Jouer un son Mediator 7
À la fin du chargement de la page 2, où nous avons déjà inséré l'animation de l'oiseau, nous pouvons
ajouter la lecture du son censé être le cri de l'oiseau.

Les deux actions démarrent simultanément. Leur ordre d'insertion dans le champ actif ne signifie pas
que l'un devra être terminé avant que l'autre ne commence. Mais ici c'est justement l'effet désiré.
Toutefois, si l'on souhaite s'assurer d'une telle succession dans le temps (tel action joue, puis une
autre, puis une autre, à des intervalles de temps déterminé), alors il faut employer l'action "Ligne
temps"
La Ligne temps (1) Mediator 7
Afin de faire apparaître un bouton qui permettrait à l'utilisateur de revoir passer l'oiseau, nous allons
ajouter à l'évènement "Page prête" une action qui ne se déclenchera qu'au bout des 7 secondes que
dure l'animation.
La Ligne temps est l'outil qui permet de programmer l'exécution d'actions selon une
séquence particulière ou en observant certains délais.

Comme toute action, une Ligne temps est démarrée par un évènement, tel un clic souris. Vous
pouvez faire appel à une Ligne temps pour obtenir un saut de page après quelques secondes (ce qui
est utilisé dans les diaporamas automatiques) ou pour réaliser des tâches plus complexes, comme
afficher certains objets ou en cacher d'autres tout en diffusant de la musique par exemple.
Sur la page 2, créer un bouton "Revoir", invisible, qui re-déclenchera l'animation et le son.
Tandis qu'à l'évènement 'Page prête" de cette page, nous allons ajouter une action "Ligne temps" :

C'est à l'intérieur du
paramétrage de cette Ligne
temps que nous déciderons
quelles actions doivent être
jouées, et précisément quand …
La Ligne temps (2) Mediator 7
Le champ horizontal du haut contient les
mêmes actions que la boîte de dialogue
Évènements.
Le grand champ blanc du bas représente la
ligne temps. Plusieurs pistes y sont prévues
pour une meilleure vue globale des actions
qu'elle contient. Pour afficher plus de quatre
pistes ou visualiser une plus grande partie de la
ligne temps, il vous suffit de tirer sur les angles
ou sur les côtés de la boîte de dialogue.

Réglez le zoom de la ligne temps (largeur totale, en s) pour mieux voir

l'agencement des actions chronométrées.

L'insertion d'actions dans la ligne temps s'effectue en les faisant glisser à partir du champ des actions.
Comme dans le cas de la boîte de dialogue Évènements, la plupart des actions ouvrent leur propre
boîte de dialogue.
Une fois que vous aurez testé l'apparition du bouton
Revoir au bout des 7 secondes, ajouter à son
évènement clic une Ligne temps pour qu'il se cache
dès que cliqué, et qu'il ne réapparaisse qu'au bout des
7 secondes de l'animation.
Liens hypertextuels Mediator 7
Un objet hypertexte est un mot ou une phrase d'un texte qui est muni des mêmes fonctionnalités
interactives que tout autre objet. Un objet hypertexte ne peut être créé qu'en mode d'édition de texte,
et est défini en tant que sous-objet de l'objet texte auquel il appartient.

Le texte sélectionné est converti en hypertexte à l'aide du bouton des outils d'édition

Le texte mis en évidence est maintenant converti en hypertexte, ce qui l'habilite à

recevoir des évènements. Dès que vous quittez le mode d'édition de texte, l'objet
hypertexte se comporte comme tout autre objet Mediator. Vous pouvez cliquer sur
lui avec le bouton droit pour accéder à sa boîte de dialogue Évènements et le doter
d'interactivité comme tout autre objet.

Cliqué : déclenche un lien Web

Survolé : change de curseur et affiche un commentaire