kommunikations-design & web-design - konzeption. entwurf. realisation.


blog

Interface-Design & Digital Signage App für MOStron

Für die diesjährige Integrated Systems Europe Messe in Amsterdam wurde für das Unternehmen MOStron Elektronik ein Interface-Design entwickelt, gestaltet und letztendlich als Digital Signage Applikation umgesetzt. Zielsetzung war es, das Unternehmen darzustellen, seine Stärken und entsprechenden Produkte zu zeigen. Letztendlich wurden natürlich auch einige ausgewählte Referenzen, die eindrucksvoll zeigen was mit Geräten und Installationen von MOStron möglich ist, ebenfalls in der App präsentiert.

spicone-mostron-interface-digital-signage-app-home-portrait

Die Digital Signage App für MOStron wurde als universelle Lösung für hochformatige und breitformatige Displays entwickelt, zusätzlich war es auch möglich die Inhalte der App jederzeit dynamisch zwischen deutscher und englischer Sprache zu wechseln. Im Falle des Ruhezustands wurde eine Art interaktiver Bildschirmschoner realisiert im Form eines rotierenden Pentagramms, das durch die unterschiedlichen Schlagworte seine Form andeutete, diese konnte man natürlich berühren. Das Info-Pentagramm rotierte in einen gewissen Intervall und wurde mit dezenten Hintergrundanimationen, im Sinne diverser Bildwechsel unterstrichen. Insgesamt wirkte es wie ein ruhiges Motion-Design das einen dazu einlud es zu berühren.

spicone-mostron-interface-digital-signage-app-pentagram-wide

Sobald ein Besucher die Touchscreens berührte, wurde das Interface aktiviert und die Bestandteile wurden in den sichtbaren Bereich des Displays eingeblendet. An dieser Stelle hatte der Besucher die Möglichkeit gezielt Beispiele oder den Produktbereich aufzurufen. Die Galerie mit den Beispielen konnte auf zwei Arten entdeckt werden, einerseits durch die klassische Berührung der Cursor, die nach links und rechts zeigten, aber natürlich auch durch die entsprechende Wischgeste, die mittlerweile fast jedem durch die heutigen mobilen Endgeräte bekannt sein dürfte.

spicone-mostron-interface-digital-signage-app-example-wide

spicone-mostron-interface-digital-signage-app-example-portrait

spicone-mostron-interface-digital-signage-app-product-wide

Im Kopfbereich gab es die Möglichkeiten die Sprache zu wechseln oder zum Ausgangsinterface mit der Petagramm-Animation zurück zu kehren, der obligatorische Kontaktbereich war auch vorhanden und man konnte sich durch erfassen des QR-Codes alle wichtigen Kontaktdaten via VCard Download auf sein mobiles Endgerät abspeichern.

spicone-mostron-interface-digital-signage-app-contact-portrait

Die technische Realisation der Digital Signage App basierte auf einem Konstrukt aus Flash, HTML5 und XML.

Zusätzlich wurden auch drei kleine Filme erstellt, die auf den Displays ohne Touchfunktion gezeigt wurden. Diese wurden natürlich der ganzen Konzeption und Gestaltung angepasst um somit auch ein homogenes Erscheinungsbild auf dem Messestand zu garantieren. Die Filme wurden in unterschiedlichsten Formaten und Auflösungen produziert, somit gab es unter anderem am Ende eine Full HD (16:9) und eine SD (4:3) Umsetzung.

Hier noch zwei Schnappschüsse des Messestands, bevor es auf der Messe los ging – besonders die 52″ Stele auf den ersten Foto war sehr beeindruckend.

spicone-mostron-interface-digital-signage-app-home-foto-portrait

spicone-mostron-interface-digital-signage-app-home-foto-wide

spicOne multimedia

      Leave a Comment