prof. ing. Dino Molli SVILUPPO SOFTWARE - FORMAZIONE E CONSULENZA INFORMATICA http://www.dinomolli.it info@dinomolli.it Dispense a cura del prof. ing. Dino Molli Foto a 360 gradi Allegato a La GRAFICA x il WEB Foto a 360 gradi pag. 1/7
Foto a 360 gradi Generalità Il componente web che viene descritto in queste dispense fornisce certamente al sito che si vuole realizzare un aspetto accattivante; tramite scene a 360, è possibile dotare le nostre pagine di una sorta di realtà virtuale, nel senso largo del termine, avendo con esse la possibilità di visualizzare un ambiente, sia esterno che interno, in maniera sicuramente più completa di quella che si avrebbe con delle semplici fotografie, seppure eseguite in maniera impeccabile. Vediamo come operare per creare una semplice scena a 360 : Operazioni Preliminari La realizzazione di una scena a 360 parte da una serie di fotografie, ravvicinate ed allineate fra loro; la vicinanza ideale è rappresentata dalla sovrapposizione laterale di qualche millimetro fra loro, mentre l'allineamento deve essere il più possibile preciso. Le fotografie devono essere fatte in sequenza ordinata tra loro, nel senso che la macchina fotografica deve essere ruotata progressivamente di un certo numero di gradi e mai fatta tornare indietro. Si consiglia, a questo proposito l'uso di un cavalletto e di un goniometro; normalmente occorrono circa 12 foto per coprire 360, usando un obiettivo grandangolare a 35 mm, proporzionalmente maggiore è questo numero se si usa un obiettivo telemetrico o normale 50mm. La sequenza può essere eseguita con una macchina fotografica classica (a rullino), reflex o meno; in questo caso si dovranno digitalizzare le foto una a una tramite scanner. E possibile altrimenti usare una macchina fotografica digitale semplice (ad es. WebCam Go Plus Creative) o una molto evoluta; in entrambe i casi si ottengono prestazioni buone. Il formato in cui si dovranno salvare le foto dovrà essere.jpg (jpeg). Il risultato finale dovrà essere di questo tipo: Foto a 360 gradi pag. 2/7
Quest esempio è tratto dal programma PixMaker Lite 1.0 ( http://http://www.pixaround.com/ ); si tratta di un interno (showroom). Ogni foto si sovrappone longitudinalmente alla successiva di qualche percentile e devono trovarsi tutte nella medesima cartella. USO di PixMaker Lite Il suo utilizzo è molto semplice, in quanto è costituito da soli 3 passaggi: 1. Snap (caricare le fotografie): Scegliere "My computer" per individuare l'area dove prelevare i file all'interno del proprio computer; in questo caso si individua l'area dove sono custoditi i files di esempio di PixMaker: Selezionare tutti i files contemporaneamente alla pressione del tasto "ctrl"; tutti dovranno essere selezionati come Foto a 360 gradi pag. 3/7
nell'esempio seguente. Si dia l'ok e si vedranno tutti i files con le loro anteprime. E' importante notare che i files grafici devono avere i nomi che terminano con numeri progressivi (foto01. foto02,... foto12), visto che pixmaker li ordina in base al loro nome. Normalmente le macchine digitali assegnano ad essi tali nomi automaticamente, mentre si dovranno sceglierli manualmente nel caso che si acquisiscano manualmente le foto tramite scanner. Il passo successivo è lo stitch (incollaggio ed elaborazione), al termine del quale si otterrà già un'anteprima della foto a 360. In questo caso il software si limita a generare un file.jpg che rapprersenta la "somma" delle immagini selezionate, intendendo come somma il risultato dell'unione orizzontale delle stesse. Importante è anche scegliere le corrette impostazioni iniziali, come il tipo di foto (360 o parziale, dalla casella "Type") e il typo di obiettivo usato (default va sempre bene, scelto dalla casella "Lens" (Tipo di Obiettivo)): Ecco il risultato: Foto a 360 gradi pag. 4/7
A questo punto non resta che pubblicare il tutto con il terzo pulsante "Publish": Scegliamo una pubblicazione di pagina web: Foto a 360 gradi pag. 5/7
Diamo un titolo e una didascalia e premiamo "Next": Scegliamo una cartella e diamo un nome per la nuova pagina web che si sta creando (in questo caso foto360.htm). Premiamo Salva... Questa finestra ci avverte che sono stati creati 3 elementi, tutti costituenti la pagina web, in particolare: foto360.htm è la pagina web foto360.jpg è la "striscia" risultante dall'operazione di incollaggio, eccola: Foto a 360 gradi pag. 6/7
upixsceen.jar è il modulo Java che rende dinamica la navigazione attraverso la scena. Ed infine ecco come appare la pagina web completa: Fatto! S o m m a r i o Foto a 360 gradi... 2 Generalità... 2 Operazioni Preliminari... 2 USO di PixMaker Lite... 3 S o m m a r i o... 7 Foto a 360 gradi pag. 7/7