TUTORIAL - CREATION D UNE VISITE VIRTUELLE AVEC PANO2VR

Transcription

1 TUTORIAL - CREATION D UNE VISITE VIRTUELLE AVEC PANO2VR Ce tutorial va expliquer comment créer en quelques minutes une visite virtuelle avec le logiciel Pano2VR. Avant de créer une visite virtuelle, il faut au préalable avoir assemblé plusieurs panoramas sphériques et disposer pour chaque panorama soit d une image équirectangulaire soit des 6 faces du cube. Pour ce tutorial, nous sommes partis de 3 panoramiques sphériques pris dans l'aitre de Brisgaret à Montivilliers (Seine-Maritime). Pour chaque panoramique sphérique, nous disposons d une image équirectangulaire de taille 5996 x 2998 pixels. 1 ère étape : Ouvrir un nouveau répertoire La première chose à faire est la création d un nouveau répertoire (ou dossier) que nous appellerons aitre_brisgaret Glissons dans ce répertoire, nos 3 images équirectangulaires. Tutorial sur la création d une visite virtuelle avec Pano2VR Page 1

2 2 ème étape : Régler les préférences du logiciel Pano2VR Ouvrir le logiciel Pano2VR et ouvrir les préférences. Vérifier que dans Hotspots la case est décochée Tutorial sur la création d une visite virtuelle avec Pano2VR Page 2

3 3 ème étape : Traitement du premier panoramique sphérique Glisser-déposer la première image équirectangulaire dans la croix Sélectionner comme format de sortie le Flash (si on veut utiliser le format QuickTime : voir annexe) Tutorial sur la création d une visite virtuelle avec Pano2VR Page 3

4 La fenêtre suivante s affiche. Renseigner les différents champs : - taille des faces : pour un affichage en plein écran, mettre une valeur entre 1500 et 1900, - qualité de l image : mis ici à 70 - sous-titres : 3 - taille de la fenêtre : 800 x 600 pixels - modèles : sélectionner un modèle. Ici j ai sélectionné un modèle avec un radar - format : utiliser le format Flash 9 bien meilleur que le Flash 8 Tutorial sur la création d une visite virtuelle avec Pano2VR Page 4

5 Cliquer sur l onglet Paramètres avancés. La fenêtre suivante s affiche Ici peu de choses à régler (les valeurs par défaut vont bien). La seule chose éventuellement à régler est le type de prévisualisation qui permet de déterminer comment s affichera rapidement le panoramique sphérique pendant le chargement. Ici on a choisi de faire une prévisualisation en échelle de gris. On peut choisir un affichage en sépia ou en couleurs. Reste à cliquer sur l onglet HTML. Sur cet écran, il n y a qu à cocher la case Activer le fichier HTML et de choisir le modèle permettant un affichage plein écran fullscreen.ggt. Tutorial sur la création d une visite virtuelle avec Pano2VR Page 5

6 Cliquer sur le bouton OK. Le système affiche le message suivant. Cliquer sur Oui pour lancer la création du fichier Flash. Le système affiche la taille du fichier Flash créé. Il faut que la taille soit autour de 2 Mo sans dépasser 3 Mo pour un affichage en plein écran. Ici la taille est 2,6 Mo ce qui est correct. Si la taille est supérieure à 3 Mo, cliquer sur l icône en forme d outil et diminuer la taille du cube et/ou la qualité. Renseignons quelques informations générales sur le panoramique. En cliquant sur le bouton Modifier, la fenêtre suivante s affiche Tutorial sur la création d une visite virtuelle avec Pano2VR Page 6

7 Il nous reste à créer les hotspots En cliquant sur le bouton Modifier, la fenêtre suivante s affiche. Cliquer sur le bouton Oui : il s affiche alors Tutorial sur la création d une visite virtuelle avec Pano2VR Page 7

8 Créons notre premier hotspot en renseignant les champs - Titre : titre du hotspot Vers la chapelle - Url : nom du script html permettant de lancer le panoramique vers lequel on veut aller (ici le 2ème panoramique de la série) - Cible : mettre toujours _self (avec un tiret de soulignement) Reste à localiser sur l image équirectangulaire la position du hotspot Pour ce faire, il est possible d utiliser divers outils. Ici, on utilise l outil Rectangle au coin arrondi. Tutorial sur la création d une visite virtuelle avec Pano2VR Page 8

9 La position du hotspot est matérialisé par la zone en rouge. Voilà le premier hotspot est créé!! Il faut maintenant créer un 2 ème hotstop pour pouvoir aller vers notre 3 ème panoramique. Cliquons sur l icône permettant d ajouter un nouveau hotspot. Le système affiche alors la fenêtre suivante. Entrons les caractéristiques du 2 ème hotspot Et sa localisation. On utilise ici un second outil permettant de dessiner un polygone. A noter que le premier hotspot n est plus en rouge mais en bleu (cela indique qu il n est pas actif). Tutorial sur la création d une visite virtuelle avec Pano2VR Page 9

10 Dessinons la position du 2ème hotspot Le second hotspot est créé. Il reste à cliquer sur le bouton OK pour revenir à l écran principal de Pano2VR Tutorial sur la création d une visite virtuelle avec Pano2VR Page 10

11 Important : ne pas oublier de cliquer sur l icône Tous crée pour sauvegarder toutes les modifications faites. Cliquer sur le bouton OK. Il ne reste plus qu à sauvegarder le projet (menu Fichier et Sauvegarder ) pour pouvoir faire des modifications éventuelles ultérieurement. Le système affiche la fenêtre. Cliquer sur le bouton Save Tutorial sur la création d une visite virtuelle avec Pano2VR Page 11

12 Dans le répertoire créé au début, 5 nouveaux fichiers ont été créés - aitre_brisgaret1.swf : c est le panoramique sphérique au format Flash - aitre_brisgaret1.html : c est le script html permettant de lancer le panoramique avec affichage en plein écran - aitre_brisgaret1_hs.png : c est le fichier contenant la position des hotspots - aitre_brisgaret1.p2vr : c est l ensemble de la sauvegarde des informations entrées dans Pano2VR - p2q_embed_object.js : c est un utilitaire pour lancer le panoramique en Flash Tutorial sur la création d une visite virtuelle avec Pano2VR Page 12

13 4ème étape : Traitement du second panoramique sphérique Il reste à faire le même traitement pour le 2ème panoramique Création du fichier Flash Création du 1er hotspot Tutorial sur la création d une visite virtuelle avec Pano2VR Page 13

14 Création du 2ème hotspot Ne pas oublier de sauvegarder en cliquant sur le bouton : Contenu du répertoire après la création du 2ème panoramique Tutorial sur la création d une visite virtuelle avec Pano2VR Page 14

15 5ème étape : Traitement du troisième panoramique sphérique Il reste à faire le même traitement pour le 3ème panoramique Création du fichier Flash Création du 1er hotspot Tutorial sur la création d une visite virtuelle avec Pano2VR Page 15

16 Création du 2ème hotspot Ne pas oublier de sauvegarder en cliquant sur le bouton : Contenu du répertoire après la création du 3ème panoramique Tutorial sur la création d une visite virtuelle avec Pano2VR Page 16

17 6 ème et dernière étape : Mise en ligne sur internet Parmi les fichiers du répertoire, seuls les fichiers surlignés en bleu sont à mettre en ligne dans un espace de stockage sur internet En final, dans le répertoire de l espace stockage internet, on doit avoir les fichiers suivants Pour tous questions ou commentaires, laisser un message dans le forum Panophoto.org à cette adresse : voir lien Merci. Gibie 28 Juin 2008 Tutorial sur la création d une visite virtuelle avec Pano2VR Page 17

18 ANNEXE Compléments si on désire une sortie au format QuickTime Pano2VR permet également une sortie en format QuickTime. Dans cette annexe, nous allons voir ce qui change dans le tutorial précédent si on désire une sortie au format QuickTime. Le premier changement porte sur la création du fichier QuickTime (lors de la 3 ème étape) Glisser-déposer la première image équirectangulaire dans la croix Sélectionner comme format de sortie le QuickTime. Tutorial sur la création d une visite virtuelle avec Pano2VR Page 18

19 La fenêtre suivante s affiche. Renseigner les différents champs : - Taille Face cubique : pour un affichage en plein écran, mettre une valeur entre 1500 et 1900, - Qualité Image : mis ici à 70 - Sous-Blocs : 3 - Taille Fenêtre : 800 x 600 pixels - Qualité Mouvement : Haut - Qualité Statique : Max - Type Prévisualisation : Echelle de gris. On peut aussi choisir un affichage en sépia ou en couleurs. Reste à cliquer sur l onglet HTML. Sur cet écran, il n y a qu à cocher la case Activer le fichier HTML et de choisir le modèle permettant un affichage plein écran fullscreen.ggt. Tutorial sur la création d une visite virtuelle avec Pano2VR Page 19

20 Cliquer sur le bouton OK. Le système affiche le message suivant. Cliquer sur Oui pour lancer la création du fichier Flash. Le système affiche la taille du fichier Quicktime créé. Il faut que la taille soit autour de 2 Mo sans dépasser 3 Mo pour un affichage en plein écran. Ici la taille est 2,7 Mo ce qui est correct. Si la taille est supérieure à 3 Mo, cliquer sur l icône en forme d outil et diminuer la taille du cube et/ou la qualité. Il reste à renseigner sur les informations générales sur le panoramique et à créer les hotspots. Cela se fait exactement de la même façon que pour la version Flash. Après la création des 2 hotspots, il ne reste plus qu à sauvegarder le projet (menu Fichier et Sauvegarder ) pour pouvoir faire des modifications éventuelles ultérieurement. Le système affiche la fenêtre. Cliquer sur le bouton Save Dans le répertoire créé au début, 5 nouveaux fichiers ont été créés - aitre_brisgaret1.mov : c est le panoramique sphérique au format QuickTime - aitre_brisgaret1.html : c est le script html permettant de lancer le panoramique avec affichage en plein écran - aitre_brisgaret1_hs.png : c est le fichier contenant la position des hotspots - aitre_brisgaret1.p2vr : c est l ensemble de la sauvegarde des informations entrées dans Pano2VR - p2q_embed_object.js : c est un utilitaire pour lancer le panoramique en QuickTime Tutorial sur la création d une visite virtuelle avec Pano2VR Page 20

21 En final après avoir fait le traitement sur les 3 panoramiques, le répertoire contenu au début du tutorial contiendra les fichiers suivants Parmi les fichiers du répertoire, seuls les fichiers surlignés en bleu sont à mettre en ligne dans un espace de stockage sur internet En final, dans le répertoire de l espace stockage internet, on doit avoir les fichiers suivants Voilà c est fini!! Tutorial sur la création d une visite virtuelle avec Pano2VR Page 21