Pour télécharger le document Word, cliquez du droit sur le lien et sélectionnez Sauvegarder Objet avec nom.
Ouvrez votre logiciel Scrippy et cliquez sur l'icône représentant une page blanche. Dans la fenêtre qui s'ouvrira, cliquez sur Ok.
La numération que vous verrez ci-dessous correspond à la succession des cases dans Scrippy. Vous noterez que j'ai fait des regroupements, en m'aidant aussi quelquefois d'un Positioned Container pour regrouper différents containers. En effet tous les containers pour créer l'effet que vous avez vu pourraient tranquillement être positionnés vers la gauche, mais puisqu'il y a beaucoup d'éléments parallèles à créer (aux 4 angles, j'ai opté pour le regroupement et donc la création en simultané des différents éléments qui se trouvent aux 4 angles. Voilà pourquoi nous aurons généralement des regroupements de 4 positioned containers sous un positioned container principal.
1) Faites Insert/Background. Cliquez sur Browse pour aller rechercher un background de votre choix. Scrolling: No scrolling. Et ne changez aucune autre option (aucun mot coché dans Advanced options et tout doit rester à 0).
2-14) Insert/Container/Positioned Container. Il servira pour le premier regroupement de 4 positioned containers. Il suffira de mettre 0 dans les cases de la colonne de gauche pour Left, Right, Top et Bottom.
3) Faites Insert/Container/ Positioned Container et laissez-le dans la position où il se trouve et vous complèterez la partie à gauche en mettant les valeurs suivantes:
- Horizontal Layout: Set Position and Width: Position from Left: 30 ; Specified Size: 70
- Vertical Layout: Set Position and Height: Position from Top: 20 ; Specified Size: 10
4) Faites Insert/Background. Cliquez sur Browse pour aller rechercher une tuile de votre choix.
La numération que vous verrez ci-dessous correspond à la succession des cases dans Scrippy. Vous noterez que j'ai fait des regroupements, en m'aidant aussi quelquefois d'un Positioned Container pour regrouper différents containers. En effet tous les containers pour créer l'effet que vous avez vu pourraient tranquillement être positionnés vers la gauche, mais puisqu'il y a beaucoup d'éléments parallèles à créer (aux 4 angles, j'ai opté pour le regroupement et donc la création en simultané des différents éléments qui se trouvent aux 4 angles. Voilà pourquoi nous aurons généralement des regroupements de 4 positioned containers sous un positioned container principal.
1) Faites Insert/Background. Cliquez sur Browse pour aller rechercher un background de votre choix. Scrolling: No scrolling. Et ne changez aucune autre option (aucun mot coché dans Advanced options et tout doit rester à 0).
2-14) Insert/Container/Positioned Container. Il servira pour le premier regroupement de 4 positioned containers. Il suffira de mettre 0 dans les cases de la colonne de gauche pour Left, Right, Top et Bottom.
3) Faites Insert/Container/ Positioned Container et laissez-le dans la position où il se trouve et vous complèterez la partie à gauche en mettant les valeurs suivantes:
- Horizontal Layout: Set Position and Width: Position from Left: 30 ; Specified Size: 70
- Vertical Layout: Set Position and Height: Position from Top: 20 ; Specified Size: 10
4) Faites Insert/Background. Cliquez sur Browse pour aller rechercher une tuile de votre choix.
Scrolling: Right. Pixels per second : 10 ; pixels per move : 2 ; Fast scroll : coché.
Et ne changez aucune autre option (aucun mot coché dans Advanced options et tout doit rester à 0).
5) Faites Insert/frame et donnez lui les valeurs suivantes : Style : groove; width : 1; couleur: noir .
6-8) Cliquez la case 3, faites Edit/copy Positioned Container, placez-vous à la case 5 et cliquez sur l'icône Paste. Déplacez votre positioned container vers la gauche en correspondance de la case 3, puis modifiez seulement Left par Right. Donc vous aurez Right et Top.
9-11) Comme pour la phase précédente et cette fois, cochez Left et Bottom.
12-14) Comme pour la phase précédente et cette fois, cochez Right et Bottom.
15-27) Placez-vous sur la case 2. Faites un copier-coller et mettez cette nouvelle série de cases complètement vers la gauche.
Les nouvelles valeurs à mettre dans chacun des 4 Positioned container internes sont les suivantes :
- Horizontal Layout: Set Position and Width: : Position from Left: 30 ; Specified Size: 70
- Vertical Layout: Set Position and Height: Position from Top: 100 ; Specified Size: 10
Donc si vous avez bien compris, il ne faudra modifier qu'une donnée dans chacun (dans from Top au lieu de 20, mettez 50).
28-40) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre : 30 ; 30; 60 ; 10.
41-53) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 70 ; 30; 60 ; 10.
54-66) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 110 ; 30; 60 ; 10.
67-79) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 20 ; 10; 20 ; 90.
80-92) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 100 ; 10; 20 ; 90.
93-105) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 60 ; 10; 30 ; 70.
106-118) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 60 ; 10; 110 ; 40.
119-131) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 140 ; 10; 60 ; 90.
Et ne changez aucune autre option (aucun mot coché dans Advanced options et tout doit rester à 0).
5) Faites Insert/frame et donnez lui les valeurs suivantes : Style : groove; width : 1; couleur: noir .
6-8) Cliquez la case 3, faites Edit/copy Positioned Container, placez-vous à la case 5 et cliquez sur l'icône Paste. Déplacez votre positioned container vers la gauche en correspondance de la case 3, puis modifiez seulement Left par Right. Donc vous aurez Right et Top.
9-11) Comme pour la phase précédente et cette fois, cochez Left et Bottom.
12-14) Comme pour la phase précédente et cette fois, cochez Right et Bottom.
15-27) Placez-vous sur la case 2. Faites un copier-coller et mettez cette nouvelle série de cases complètement vers la gauche.
Les nouvelles valeurs à mettre dans chacun des 4 Positioned container internes sont les suivantes :
- Horizontal Layout: Set Position and Width: : Position from Left: 30 ; Specified Size: 70
- Vertical Layout: Set Position and Height: Position from Top: 100 ; Specified Size: 10
Donc si vous avez bien compris, il ne faudra modifier qu'une donnée dans chacun (dans from Top au lieu de 20, mettez 50).
28-40) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre : 30 ; 30; 60 ; 10.
41-53) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 70 ; 30; 60 ; 10.
54-66) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 110 ; 30; 60 ; 10.
67-79) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 20 ; 10; 20 ; 90.
80-92) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 100 ; 10; 20 ; 90.
93-105) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 60 ; 10; 30 ; 70.
106-118) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 60 ; 10; 110 ; 40.
119-131) Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 140 ; 10; 60 ; 90.
132-144)
Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 70 ; 70; 140 ; 10.
145-157)
Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 110 ; 30; 100 ; 10.
158-170)
Comme pour le regroupement précédent, et cette fois-ci dans chacun des 4 positioned containers internes, il faudra mettre les valeurs suivantes dans les différents champs (espaces blancs), sans rien changer d'autre: dans l'ordre 100 ; 10; 110 ; 30.
171-178)
Comme pour le regroupement précédent, et cette fois-ci dans chacun des 2 positioned containers internes : on pourra en éliminer 2 de ceux qui s'y trouvent.
De cette manière on va créer la première barre verticale longue.
Dans le premier container interne : l'ordre From Left : 100 ; 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) . Dans le deuxième container interne : From Right 100 ; size : 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) .
De cette manière on va créer la première barre verticale longue.
Dans le premier container interne : l'ordre From Left : 100 ; 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) . Dans le deuxième container interne : From Right 100 ; size : 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) .
179-185)
Il ne vous reste qu'à compléter en mettant un loading message, un ticker et de la musique (sound).
Au total, donc, dans mon scrippy il y a exactement 203 cases. .
Autre variation: si vous voulez, donnez une direction différente (comme j'ai fait) aux backgrounds de droite par rapport à ceux de gauche (j'ai opté pour la direction avec la droite pour ceux de gauche et l'inverse pour ceux de droite) et aux grandes barres qui unissent les angles.
Faites un copier/coller du container du regroupement précédent (case 171) et mettez les valeurs suivantes :
Dans le premier container interne : l'ordre From Left : 140 ; 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) . Dans le deuxième container interne : From Right 140 ; size : 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) .
Dans le premier container interne : l'ordre From Left : 140 ; 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) . Dans le deuxième container interne : From Right 140 ; size : 10 (première colonne); Cochez Set Top and Bottom Edges: Top : 150 ; Bottom : 150 (les deux dernières dans la colonne de droite) .
186-192)
Faites un copier/coller du container du regroupement précédent (case 171) et mettez les valeurs suivantes :
Dans le premier container interne : Set Left and Right Edges (deuxième colonne) :
Dans le premier container interne : Set Left and Right Edges (deuxième colonne) :
From Left : 150 ; From Right : 150 ; Pour Vertical, cochez Set Position andTop and Height: Top : 100 ;
Size : 10.
Dans le deuxième container interne : comme pour le premier interne, mais cochez Bottom, avec les mêmes valeurs que pour le premier container interne (150/150/100/10).
193-199)
Faites un copier- coller du regroupement précédent et maintenant mettez les valeurs suivantes dans les cases:
dans l'ordre 150/150/140/10.
200) Insert Message Area et placez-le complètement à gauche dans la listes des cases. Mettez les marges qui tiennent comptent des positions des positions du motif construit aux 2 bords verticaux. Voici les marges justes : Left: 180; Top: 180; Right : 180; Bottom : 180. Mais vous êtes libres de les varier.
Il ne vous reste qu'à compléter en mettant un loading message, un ticker et de la musique (sound).
Au total, donc, dans mon scrippy il y a exactement 203 cases. .
Autre variation: si vous voulez, donnez une direction différente (comme j'ai fait) aux backgrounds de droite par rapport à ceux de gauche (j'ai opté pour la direction avec la droite pour ceux de gauche et l'inverse pour ceux de droite) et aux grandes barres qui unissent les angles.
Pour cette composition, j'ai mis dans mon message area un cadre fait en partant d'une image de l'artiste Erika Baque. Et j'ai créé un fond en harmonie avec les couleurs du cadre avec le logiciel Universe.
************
Ce tutoriel a été créé le 11 mai 2003 dans le contexte des travaux du groupe Franco-scrippy, fondé par Mario Panone.
***Tut-cadre-tresse-2.................Lorenza, 10/06/03***