Glide & Show Modul – presono's Wissensdatenbank

Überblick:

Freischaltung des Moduls
Technisches Set Up
Inhaltserstellung
Template Set erstellen
Seitenverhältnis
Hintergrundtemplate
Hintergrundbild auf Hauptslide(s)
Verschiedene Overlays
Option 1: Overlay bleibt stehen
Option 2: Overlay bewegt sich mit
Präsentation erstellen & verlinken

In diesem Artikel geben wir einen kurzen Überblick über unser "Glide & Show" Modul.

Es ermöglicht eine interaktive Navigation auf einer Slide durch die Bewegung des Monitors/Tablets. Das Modul bietet vielfältige Einsatzbereiche, von "Röntgenblicken" auf Messen bis zu Zusatzinfos über einen Showroom oder Standbereich. All dies natürlich unter Einbeziehung aller generellen interaktiven Möglichkeiten von presono und kombinierbar mit anderen Modulen wie bspw. Remote Control.

In diesem Beispiel haben wir eine Haupt-Slide, die unseren Zug (unser Modell) mit "Röntgenblick" zeigt und wo diverse Detailinfos in Form von Overlays verlinkt sind. Das ist aber natürlich beliebig erweiter- und kombinierbar mit diversen weiteren Slides und Funktionen in presono (Screensaver, mehr als eine Detail-Ebene, weitere Module etc.).

Freischaltung des Moduls

Hinweis: beim Glide & Show Modul handelt es sich um ein zusätzliches Modul, welches separat freigeschalten werden muss. Kontaktiere daher gerne deine Ansprechperson bei presono oder schreib uns unter info@presono.com.

Technisches Set Up

Sobald das Modul freigeschalten wurde, können die Inhalte vorbereitet werden. In den nachstehenden Abschnitten erklären wir dir genau, worauf du dabei achten musst. In diesem Abschnitt erklären wir dir noch kurz, wie das technische Set Up funktioniert.

Aufbau:

Verbau/Statischer Teil

Stromkabel (mitbewegt)
(LAN Kabel (mitbewegt))
Führungsschiene(n)
Zahnradschiene (trägt kein Gewicht)
Anschläge

Beweglicher Teil

(Touch)Bildschirm
Mini PC
Arduino / Minicontroller
Drehgeber
Anschlag-Taster
Verteilerdose (Stromversorgung für Bildschirm, Mini PC)

Tipp: Griffe damit nicht am Touch-Screen angefasst wird

Der ganze Aufbau besteht im Prinzip aus einem (Touch-)Monitor, der auf einer Schiene platziert wird und einem Computer (Mini PC o.ä.), der den Monitor mit Inhalt bespielt. Zusätzlich gibt es eine Zahnradschiene sowie einen Minicontroller und zwei Anschläge (li/re). Bei der Magnetschalter Version entfallen die Zahnradschiene und die Anschläge. Die Zahnschiene kann gerne von presono bezogen werden. Die notwendigen Module (Anschläge, Minicontroller, Drehgeber) werden in jedem Fall von presono bereitgestellt. Der Mini PC ist nicht standardmäßig enthalten, kann aber auch gerne von presono bereitgestellt und aufgesetzt werden. Der Screen ist nicht inkludiert.

Auf dem PC läuft ein virtueller Server (wird von presono bei der Einrichtung aufgesetzt und liegt idealerweise im Autostart) und die presono Desktop App (Windows) mit einem Presenter User. Eine Nutzung über die mobilen Apps (Android & iOS) ist derzeit nicht möglich.

Wenn du Details zum Aufbau und Verbau benötigst, kannst du dich gerne melden, dann senden wir dir ein detailliertes Info-Sheet dazu.

Varianten

Bei Glide & Show gibt es zwei Varianten: Entweder eine Lösung mit Magnetschaltern oder eine kontinuierliche Bewegung entlang einer Schiene.

Je nach Anwendungsfall sollte im Vorfeld eine der beiden Varianten gewählt werden, da sie sich vom technischen Aufbau und auch der inhaltlichen Wartung stark unterscheiden.

Mit Magnetschaltern gibt es im Prinzip fixe Punkte auf einer Schiene, wo die Magnetschalter schließen (auf dem beweglichen Teil ist ein Teil vom Magneten und auf der Schiene der Gegenpart) und zur nächsten Slide gesprungen wird.

Jedes „Schließen“ löst dann das Signal aus, für die Slide zu der aktuellen Position. Hier wird also eine Präsentation mit mehreren Slides gestartet und die Slides in der Präsentation werden dann pro Magnetschalter-Station aufgerufen. Also an Position 1 wird die erste Slide der Präsentation angezeigt, an der zweiten Position die zweite Slide etc.

Bei der kontinuierlichen Variante gibt es eigentlich ein „Hintergrundbild“ und durch das Bewegen vom Bildschirm (Schiebemonitor) bewegt man sich im Bild nach links und rechts. Wenn also beispielsweise ein 3D Modell einer Anlage physisch aufgebaut ist und davor der Schiebemonitor, ist in der presono-Slide etwa ein Bild der Anlage mit „Röntgenblick“ zu sehen und durch den Bildschirm bewege ich mich mit dem Röntgenblick hin und her. An unterschiedlichen Stationen der Anlage kann ich dann auf Zusatzinfos klicken.

Durch die Desktop App kann presono im Showroom oder auf Messen auch hier offline genutzt werden und sogar zu einer Plug-and-Play Lösung konfiguriert werden. Mehr dazu hier: presono auf Messen & Offline präsentieren

Inhaltserstellung

Version 1: Magnetschalter

Hier wird eine Präsentation gestartet und die Slides in der Präsentation werden dann pro Magnetschalter-Station aufgerufen. Also an Position 1 wird die erste Slide der Präsentation angezeigt, an der zweiten Position die zweite Slide etc. Interaktionen auf den Slides können regulär genutzt werden, wenn ein Touch-Screen in Verwendung ist.

In presono kann also die Präsentation beliebig bearbeitet werden (Slides hinzufügen/austauschen/bearbeiten).

Version 2: Kontinuierliche Bewegung auf der Schiene

In dem Fall gibt es spezielle Templates (teilweise mehrere Sets), die in den spezifischen Seitenverhältnissen angelegt sind. Die „Hintergrundslide“ ist zum Beispiel einfach eine sehr sehr breite Slide. Ist der zu verschiebende Monitor beispielweise Hochformat, ist auch das Template Set im Hochformat. Die Inhalte werden dann aber ganz regulär in presono gewartet. Die Templates bekommen einmalig die Eigenschaft (im Hintergrundtemplate), dass sie ein Glide&Show Template sind, damit wird die Slide dann nicht länger eingepasst sondern eben „verschoben“. Die Templates sind dann aber regulär.

Im nachfolgenden Abschnitt erklären wir dir die Details.

Template Set erstellen

Seitenverhältnis

In presono können Template Sets mit individuellen Seitenverhältnissen erstellt werden - das benötigte Seitenverhältnis muss individuell berechnet werden.

Im Prinzip errechnet man sich das Verhältnis der insgesamten Breite - die Länge der Schiene mit Berücksichtigung ob der Monitor über die Endpunkte der Schiene hinausragt - zur Höhe des Monitors.

Diese Werte können dann mit der genauen Pixelhöhe des Monitors in den Einstellungen vom Template Set hinterlegt werden:

Hintergrundtemplate

Alle Hintergrund Templates, die für Glide & Show verwendet werden sollen, benötigen folgende Klasse auf der Layout Ebene (Achtung nicht auf der Gruppe und nur auf den extra breiten Hintergrund-Slides und -Overlays):

fill-and-scroll

Durch diese Klasse werden die Slides, die dieses Hintergrund Template verwenden, ausgefüllt (volle Höhe) und nicht eingepasst angezeigt werden beim Präsentieren, wodurch sie sich verschieben lassen.

ausgefüllt: (mit Glide-and-Show Klasse)

eingepasst: (ohne die Klasse)

Hintergrundbild auf Hauptslide(s)

Eine Besonderheit beim Hintergrund der Haupt-Slide(s) gibt es noch zu beachten. Da presono die hochgeladenen Bilder für die unterschiedlichen Anwendungen optimiert, muss das Hintergrundbild für ein so spezielles Seitenverhältnis in einzelnen Abschnitten hochgeladen werden. Die Höhe sollte dabei genau die (Pixel) Höhe des Monitors sein, die Breite maximal 1280px. Alle Bilder müssen gleich breit sein und werden dann in eine Grid-Gallery eingefügt, um einen nahtlosen Übergang zu erreichen.

Alternativ kann kurzfristig das Uploadlimit von 8000px durch presono hochgesetzt werden, wodurch ein extra breites Bild hochgeladen werden kann. Wichtig ist dann, dass auf dem Gerät, wo die Präsentation abgespielt wird, auch in den Einstellungen die zu synchronisierende Mediengröße angepasst wird. Mehr dazu hier: Kiosk & Präsentation

Verschiedene Overlays

Es gibt im Prinzip zwei unterschiedliche Arten von Overlays, die über der Haupt-Slide angezeigt werden können:

Option 1 wäre ein Overlay, was an einer spezifischen Stelle erscheint und auf der Hauptslide "stehenbleibt", wenn ich den Monitor bewege - im Prinzip also aus dem Sichtfeld rückt, wenn ich den Monitor entsprechend bewege.

Option 2 ist ein Overlay, was am Monitor "stehenbleibt". Was sich also "mitbewegt", wenn man den Monitor schiebt - also am Bildschirm weiterhin sichtbar, auch wenn der Monitor bewegt wird. (ganz bedeckt, so wie hier, aber natürlich auch teilweise bedeckt möglich zB nur das untere Drittel).

Für Option 1 benötigst du kein neues Template Set, diese Overlays können einfach im Template Set für die Haupt-Slide(s) als neues Layout angelegt werden.

Für die Option 2 hingegen wird ein neues Template Set benötigt, weil die Breite eine andere sein muss, wie die, die bei der Haupt-Slide hinterlegt wird.

Tipp: wenn man ein Overlay haben möchte, welches sich schneller oder langsamer als der Hintergrund/die Hauptslide bewegt, kann man dies natürlich auch über eigene Template Sets lösen, die eben entweder länger oder kürzer sind als die Haupt-Slide-Breite.

Option 1: Overlay bleibt auf der Slide stehen

Hier wird im Haupt-Template Set gearbeitet.

Auch hier muss im Overlay-Hintergrund die Klasse fill-and-scroll auf der Layout-Ebene vergeben werden:

Tipp: Hier kannst du einfach einen Bereich außerhalb des Sichtfelds hinlegen, wo der Overlay-Schließen-Link drauf liegt (um den Hintergrund zu einem Overlay-Hintergrund zu machen). Den eigentlichen Close Button kannst du dann individuell in den Layouts setzen und so einen Hintergrund für mehrere Overlay-Layouts verwenden.

Lege dann das Layout wie gewohnt an und platziere die Bereiche genau an die Stelle des Hintergrunds, wo du sie später brauchst:

Tipp: du kannst mit Zoomen & Scrollen deinen Canvas-Bereich super einpassen, sodass du auch hier gut arbeiten kannst:

Erstelle am Ende wie gewohnt dein Overlay und verlinke es auf der Haupt-Slide.

Option 2: Overlay bleibt am Monitor stehen

Bei der Option, wo das Overlay am Monitor stehen bleibt arbeiten wir in einem neuen Template Set:

Dieses Set benötigt das Seitenverhältnis vom Monitor, der geschoben wird. Das Overlay kann natürlich den ganzen Bildschirm bedecken, wie hier, oder nur einen Teil.

In diesem Fall benötigen wir keine Klasse im Hintergrundtemplate, weil wir ja nicht verschieben wollen: