Réalisation d'un panorama 360 degrés au format QuickTime VR

Ecrit par LesH, le 26-04-2009 14:31

Pages vues 700

Favoris 12

• "XnView" nous servira à réduire la taille des photos originales en utilisant un traitement par lots (batch). Téléchargez XnView depuis le site de l'éditeur : www.xnview.com
• L'éditeur d'images "Gimp" sera utilisé pour retoucher l'image assemblée. Vous trouverez Gimp à cette adresse :  www.gimp.org
• Le lecteur "QuickTime" nous permettra d'afficher le panorama 360. Il est disponible sur le site www.apple.com
• "Hugin" se chargera de l'assemblage des photos. Vous le trouverez à cette adresse : hugin.sourceforge.net
• "Panorama Tools" sont des outils utilisés par Hugin lors de l'assemblage des images. Vous le téléchargerez depuis PTgui : www.ptgui.com
• Pano2QTVR se chargera de créer le panorama 360 au format QuickTime VR est disponible sur le site gardengnomesoftware.com
• Il vous faudra également un pack de photos pour procéder aux essais. Je vous propose 57 images (500 pixels de largeur), permettant de réaliser un 360° à cette adresse (le temps n'étais hélas pas très beau lors de la prise de vues !!!).

Si naturellement on pense au trépied pour réaliser ce genre de d'images, il est tout de même possible de réaliser les différentes photos qui composeront le panorama à main levée. Il faudra juste vous assurer qu'il y a assez de recouvrement entre deux prises de vue (chaque nouvelle image devrait avoir environ 30% de surface commune avec une autre). Lorsque vous photographierez l'horizon, la partie occupé par le ciel ne doit pas être trop importante. En effet, lors de l'assemblage, le logiciel n'y détectera pas de points suffisamment contrastés, ce qui pourrait rendre l'assemblage des photos aléatoire.

La plupart des appareils numérique ont une exposition automatique. Il est recommandé de la désactiver afin que les différentes prises de vue n'aient pas une exposition différente (luminosité). Dans le cas contraire, la juxtaposition des images sera un peu plus difficile.

Les images produites par les appareils photos récents sont de très grande taille. Je vous conseille de les réduire avant de procéder à l'assemblage. Ceci évitera les erreurs de traitement et permettra de diminuer le temps de calcul, d'autant plus que le logiciel d'assemblage les réduira systématiquement à 1600 x 1200 pixels. Lors des essais, 1200 pixels de largeur m'a semblé être un bon compromis, mais vous pouvez descendre jusqu'à 500 pixels. Pour modifier la taille de ces images je vous propose d'utiliser XnView, car cette application permet de préserver les informations EXIF provenant de l'appareil photo qui sont stockées dans les photos.

Après avoir lancé XnView, naviguez jusqu'au répertoire contenant vos photos.
Sélectionnez toutes les images qui constitueront le diaporama, puis cliquez sur "Outils > Convertir".

.



Sélectionner "Remplacer" les fichiers existants (attention cela supprimera les fichiers originaux).
Sélectionnez "JPG" pour le format des fichiers, puis cliquez sur "Options".





Dans les paramètres d'écriture du format JPEG mettez la qualité à 100 pour dégrader le moins possible les photos.
Conservez impérativement les donnée EXIF des photos.
Confirmez la modification pour fermer cette fenêtre de dialogue.





Cliquez sur l'onglet "Transformations" :
Dans la partie gauche de la fenêtre sélectionnez "Redimentionner" puis cliquez sur le bouton "Ajouter".
Dans les paramètres du redimentionnement entrez "1200" dans le champ largeur (les proportions doivent être conservées).
Cliquez sur le bouton "Lancer" pour redimentionner les images.

Lancez "Hugin" pour assembler les photos. Dans ce didacticiel, je n'utiliserai que l'assistant, ainsi aucun ajustement manuel ne sera nécessaire. Tout se fera ainsi automatiquement, ce qui sous-entend que vos photos sont de bonne qualité, et se superposent correctement. Pour une utilisation plus poussée de cette application je vous invite à consulter les tutoriaux du site hugin.sourceforge.net.

Cliquez sur le bouton "Charger les images", puis sélectionnez toutes les photos à assembler (dans cet exemple 57 photos on été sélectionnées).
Tous les paramètres de l'objectif seront automatiquement mis à jour. Ils proviennent des données EXIF des photos.





Cliquez sur "Aligner". L'application recherchera alors les points de correspondance entre toutes les images, puis les alignera.
Cette phase de calculs peut durer plus de 10 minutes, cela dépend de la taille des images et de leur nombre, de la quantité de points à analyser, de la puissance de votre machine...





Lorsque l'alignement des images sera terminé, Hugin vous proposera alors un aperçu, que vous fermerez pour poursuivre.
Si le traitement ne s'est pas correctement déroulé, vous serez amené à définir les points de correspondance manuellement (nécessite beaucoup de patience et de minutie : documentation Hugin) ou à refaire vos photos.





Pour en finir avec "Hugin", cliquez sur le bouton "Créer le panorama". Vous serez invité à entrer un nom pour le fichier de sortie, puis l'assemblage définitif du panorama débutera.





Le panorama assemblé à partir de 57 photos : il manque du ciel, un peu de sol et surtout la taille de l'image reste à modifier.
En effet pour créer le panorama nous aurons besoin d'une photo équirectangulaire (largeur = 2 x hauteur).

Pour retoucher l'image assemblée par "Hugin", il vous faudra utiliser une application permettant la retouche d'images. Celle-ci devra disposer de fonctionnalités évoluées comme l'outil "tampon" ou "clonage", et permettre l'utilisation de "calques". Dans ce didacticiel, j'utiliserai "Gimp" qui est un logiciel libre (vous trouverez de nombreux tutoriels consacrés à Gimp sur le site www.gimpons.net).

Lancez "Gimp" et chargez l'image générée par "Hugin". Il faudra commencer par en modifier la taille. En effet l'image obtenue est de 5348 x 2168 pixels, elle n'est donc pas équirectangulaire.

Dans "Images > Taille du canevas", cliquez sur la chaîne (pour briser le lien permettant de conserver les proportions hauteur/largeur),
puis entrez dans le champ hauteur la nouvelle valeur, soit  2674 (largeur / 2 = hauteur).





Il faudra alors remonter l'image (le calque) pour laisser plus de place au sol.
Dans la boîte à outils, sélectionnez l'outil de déplacement, puis cliquez sur le calque pour le déplacer à la souris (drag) ou à l'aide du clavier (la flèche vers le haut déplace le calque pixel par pixel tandis que "Ctrl" + "flèche haut" le déplace par bonds).
N'oublier pas ensuite d'adapter le calque qui a été déplacé à l'image : "Calque > Calque aux dimensions de l'image"





Il ne restera plus qu'a compléter le ciel et le sol en utilisant l'outil "clonage".
Utilisez une brosse de grande taille (Etiré ou rétrécir) avec un bord dégradé (Circle Fuzzy).





Utilisation de l'outil de clonage.
Pour définir la partie de l'image qui sera dupliquée, positionnez la souris sur cette zone puis appuyez sur la touche "Ctrl".





L'image retouchée.
Dommage que la météo n'ai pas été plus clémente lors de la prise de vues.

La création du panorama 360 degrés sera effectuée grâce à la version gratuite de Pano2QTVR. Cette application nous permettra donc de générer un fichier QuickTime VR, lisible avec QuickTime Player.

Cliquez sur le bouton "Créer un nouveau projet" que vous sauverez de préférence dans le répertoire contenant vos photos.





Le type de projet est un panorama équirectangulaire (case à cocher si tel n'est pas le cas).
Sélectionnez l'image retouchée précédemment en utilisant le bouton "..." à droite du champ "Image équirectangulaire".





Cliquez ensuite sur l'onglet "Paramètres" :

Dans la partie "Paramètres du film", ajustez la taille du fichier vidéo qui sera créé (400 x 300 suffit généralement pour générer une vidéo qui sera placée dans un article Joomla. 800 x 600 est à utiliser pour un panorama plein écran). Mettez également "Qualité en mouvement" à "Normal" et "Sans perte" pour "à l'arrêt".

Lors de la création d'un fichier QuickTime VR, la photo est mappée sur les 6 faces d'un cube. Chacune des faces peut être constituée de plusieurs subdivisions, ce qui permet un affichage partiel de l'image dans de cas d'un film volumineux alors que toutes les données ne sont pas encore chargées. Dans "Paramètres des faces", laissez "Subdivisions" à "1 x 1" si la taille du film est de 400 x 300. Par contre utilisez de préférence "5 x 5" pour les films de 800 x 600.

Dans "Paramètres d'affichage", limitez la rotation verticale (Tilt) qui sera permise à 80 degrés vers le haut et -80 vers le bas. "FoV" est  la focale, qui sera de 70 à l'affichage du diaporama avec une plage autorisée de 5 à 120. "Pan" correspond à la rotation horizontale, donc de 0 à 360 degrés pour un tour complet).

J'ai également décoché "ouvrir après la création" car je préfère afficher le fichier créé par Pano2QTVR avec QuickTime plutôt que dans l'aperçu proposé par cette application.





Après avoir cliqué sur "Create" de l'onglet "Paramètres", une console s'affichera, dans laquelle vous pourrez suivre le déroulement des calculs qui peuvent durer quelques minutes.
Lorsque le rendu sera terminé, ouvrez le répertoire contenant le film pour l'afficher avec QuickTime Player.

Il suffira d'éditer le code html d'un article pour y placer un code qui ressemblera à l'exemple ci-dessous (configurez votre éditeur pour qu'il accepte les scripts) :

• la taille du panorama QuickTime est de 400 x 300 pixels, la fenêtre affichée sera de 416 x 316 pixels avec la barre de navigation.
• vous aurez à remplacer, à deux reprises, le nom du fichier. Dans l'exemple il porte pour nom "qtvr_001.mov" a été placé dans le répertoire "images/stories/panorama/qtvr/" grâce à un client Ftp comme FileZilla (n'utilisez pas le gestionnaire de médias, car le poids du fichier est généralement relativement trop important pour utiliser cette méthode d'upload).

<center>
<object codebase="http://www.apple.com/qtactivex/qtplugin.cab"
classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
height="316" width="416"><param
value="images/stories/panorama/qtvr/qtvr_001.mov" name="src"><param
value="true" name="controller"><param value="true"
name="autoplay">
<embed
pluginspace="http://www.apple.com/quicktime/download/index.html"
autoplay="true" controller="true"
src="/joomla15_test/images/stories/panorama/qtvr/qtvr_001.mov" height="316"
width="416">
</object>
</center>

Je pense que le plus simple pour récupérer le code nécessaire est d'afficher l'exemple qui ce trouve à cette adresse. Puis de copier le code source pour le coller ensuite dans une nouvelle page web.

• Pour afficher le code source d'une page web : avec FireFox, cliquez sur "Affichage > Code source de la page", avec Internet Explorer 7.0 cela se passe dans "Page > Afficher la source"...
• Pour créer une nouvelle page web, utilisez le Bloc-notes ou mieux NotePad++.
• Vous aurez alors à remplacer à quatre reprises l'url de la vidéo. Dans la page exemple l'url à rechercher et à remplacer est "qtvr_002.mov" (le fichier QuickTime se trouvant dans le même répertoire que la page html). Remplacez également le titre de la page et les textes affichés en bas de page. Ce serait très sympathique de conserver le lien vers "Test Extensions II" qui se trouve en bas à droite de la page.