X

360 Graden Panorama’s Op Je Site In 3 Stappen

360 Graden Panorama’s

360 Graden Panorama foto’s zijn een leuke feature voor je site bijvoorbeeld als hij gaat over vastgoed, reizen, kunst of andere onderwerpen waarbij het van belang is een fysieke omgeving tastbaarder te presenteren. Omdat bezoekers er vaak dol op zijn kan het goed zijn voor je SEO.

Stap 1: Een Panorama Foto Maken

Om een panorama foto te maken, heb je idealiter 6 foto’s nodig van een locatie die ieder onder een vaste hoek ten opzichte van elkaar zijn genomen (bijvoorbeeld door gebruik te maken van een statief). Deze zes individuele foto’s kunnen dan software matig aan elkaar geplakt worden om samen de zes zijden van een kubus te vormen en zo een virtuele ruimte te vormen. Een voorbeeld van software waarmee je dit laatste kunt doen is PTGui.

Stap 2: Maak Een Export Folder Voor Je Website

Afhankelijk van je doel met het panorama op je website en de browsers en (mobiele) apparaten waarmee je verwacht dat je bezoekers hem zullen bekijken, kun je kiezen uit verschillende export formaten voor je panorama in de gespecialiseerde software van je keuze. Met PTGui heb je bijvoorbeeld de mogelijkheid om een panorama te exporteren als HTML pagina die je kunt toevoegen aan je site. Deze HTML pagina is compatible met alle browsers (IE, Firefox, Chrome etc.) en is bovendien goed te bekijken op mobiele apparaten. Er zijn aanvullende gespecialiseerde tools die geavanceerde functionaliteit bieden om naast of onafhankelijk van PTGUI panorama’s te exporteren.

Pano Builder/Conversie tools

Nu je een panorama hebt kun je hem importeren in tools zoals KRPano of Pano2VR om verschillende export formaten te maken van je oorspronkelijke bestand en functionaliteitslagen toe te voegen zodat het op je site gezet kan worden op een manier die bijdraagt aan de gebruikservaring. Het standaard exportformaat voor een panorama is een flash bestand (.swf). Dit bestandstype wordt echter niet door alle browser/apparaat combinaties even goed ondersteund zodat het nuttig kan zijn om aanvullende exportformaten en ook plaatjes in verschillende resoluties voor verschillende beeldscherm formaten toe te voegen. De hierboven genoemde tools stellen je in staat om de volgende opties toe te voegen aan je export mapje:

  • Een kubus-vormige versie van het panorama-plaatje (voor de hoogste kwaliteit) met een groot formaat
  • Kleinere versies van de zijden van de kubus voor weergave op kleine en mobiele schermen
  • Een preview image dat getoond wordt wanneer het panorama aan het laden is op de webpagina
  • Een menu waarmee gebruikers door het panorama kunnen navigeren en elementen zoals logo, copyright etc.
  • Geavanceerde instellingen zoals parameters voor beeldhoek, automatisch afspelen (snelheid) en meer
  • Een .swf file voor flashplayers
  • Een XML file waar optioneel ook instructies voor afspelen op mobiele apparaten in opgenomen kunnen worden (HTML5)
  • Een javascript
  • Een Quicktime file (QTVR)
  • Optioneel kunnen ook verschillende panorama’s aan elkaar gevoegd worden in een virtual tour door hotspots in ieder individueel panorama te definieren die doorlinken naar het volgende (bijvoorbeeld boven een deur of raam)

KRPano bijvoorbeeld stelt je in staat om op eenvoudige wijze een enkele export folder (om aan je site toe te voegen) te maken met alle benodigde functionaliteit, formaten en instellingen, zonder dat je over enige kennis van het onderwerp hoeft te beschikken. Via het XML bestand kun je echter juist ook weer direct geavanceerde functionaliteit toevoegen. Beide tools die ik hier noem zijn betaalde oplossingen maar hebben ook gratis versies die gelimiteerd zijn op beeld kwaliteit en inpasbaarheid in de website. Veel van de snelst ladende, meest professioneel ogende panorama’s op het web lijken gemaakt te zijn met KRPano. Het zou dus heel goed een tool kunnen zijn waar je in zou kunnen willen investeren.

Stap 3: Een Viewer Plugin Toevoegen Aan WP

Voor je bezoekers panorama’s kunnen bekijken op je WordPress site, moet je de map die je hebt gemaakt in de pano builder tool van je keuze, uploaden naar je site over ftp en een plugin toevoegen aan wordpress zodat de inhoud ervan weergegeven kan worden op je WP site.

Verschillende ontwikkelaars hebben viewer plugins gecreëerd die je in staat zouden moeten stellen 360 graden foto’s toe te voegen aan je blog of wordpress site. Elk van hen heeft zijn eigen beperkingen. Het blijkt bijvoorbeeld lastig om panorama’s in Internet Explorer te tonen bijvoorbeeld. Firefox en Chrome lijken geen problemen op te leveren. Maar ook Safari schijnt beperkingen te hebben als het gaat om grote panorama’s. En laten we mobiel niet vergeten: als je wil dat je panorama zichtbaar is op toestellen en tablets die iOS of Android draaien, dan zul je niet alleen moeten zorgen dat extra bestanden zijn aangemaakt en ingesloten in de pano-builder tool fase van je projectje (zie hierboven) maar ook moeten zorgen dat je wordpress viewer plugin (zie hieronder) met al die bestandsformaten compatible is.

Drie WP Panoviewers

WP KRPano (Viewer). Deze viewer is in een experimentele fase van ontwikkeling. Om hem te gebruiken heb je een volledige licentie voor KRPano nodig. Wanneer je een in KRPAno (de tool) een export folder aan maakt, voegt het namelijk je licentie informatie toe aan die map. Er zijn licenties voor: gewone sites, mobiele sites en virtual tours. Heb je voor een bepaald apparaat type geen licentie dan zal het panorama daarop niet getoond worden.

Panopress is ook experimenteel maar al in een volwassener staat van ontwikkeling met heel veel opties voor verschillende typen en formaten panorama’s waaronder ook het alles in een “MULTIRES” formaat dat KRPano aanbiedt. Dit maakt het relatief eenvoudig om veel verschillende devices te bedienen. Het vergt wel enige eenvoudige wijzigingen aan je mapstructuur en een paar settings in de plugin.

QTRV Viewer is een ander soort oplossing. Het biedt de mogelijkheid om een panorama te tonen dat is gemaakt in QRTV formaat voor Quicktime en biedt, indien Quicktime niet aanwezig is op de computer van de bezoeker het alternatieve DevalVR formaat. Geen van beide standaarden dekt het gehele spectrum van browser/device combinaties af. Bijvoorbeeld: toen ik het testte, werkte het prima onder Firefox en Chrome maar niet in Internet Explorer op een PC en het werkte niet op een IPad of Iphone (vreemd genoeg aangezien Quicktime Apple technologie is). Het leuke van DevalVR is dat je op zeer eenvoudige wijze enorm veel functionaliteit kunt toevoegen met shortcodes. Zo kun je complexe menu’s toevoegen, geanimeerde objecten en ook volledige virtual tours maken. Allemaal gratis. Helaas zal een groot gedeelte van je bezoekers je meesterwerk niet kunnen zien.

Mocht je geen geluk hebben met de implementatie van bovenstaande wordpress viewers dan kun je ook nog proberen om een iframe te gebruiken.

Er zijn natuurlijk meer tool/viewer combinaties beschikbaar. Mocht je je eigen favoriet hebben, vertel de andere lezers er dan hieronder iets over. Waarom is jouw tool de beste?

Job Folbert :Online consultant iMocial. Internet adviseur Job Folbert gelooft in persoonlijk en betrokken advies: meedenken met de specifieke omstandigheden van iedere ondernemer. Wat voor doelen heb je met je website? Waar staat de website in verhouding tot je overige distributiekanalen? Hoe kun je het beste profiteren van nieuwe mogelijkheden in de markt en welke technologie past daarbij binnen jouw budget?

Deze site gebruikt cookies ter verbetering van de dienstverlening. Door de site te gebruiken stem je hier impliciet mee in.