Möglichkeiten eines CMS in der Zukunft des Spatial Computing
Veröffentlicht: 2019-10-24In meiner Rolle bei WP Engine habe ich die Möglichkeit, die Welt zu bereisen und als Botschafter für neue und interessante Möglichkeiten der Verwendung von WordPress zu dienen. Ich war kürzlich in Raleigh, North Carolina, bei All Things Open, um über die Möglichkeiten eines CMS in der Zukunft des Spatial Computing zu sprechen. Dies war ein erhabenes Thema für einen 45-minütigen Vortrag, also dachte ich, ich würde einen tieferen Einblick in eine neue Möglichkeit geben, Extended Reality (XR)-Erfahrungen mit WordPress mit einem Headless-Ansatz zu erstellen.
Der kopflose Wahnsinn
Ich denke, viele von uns sehen Headless in erster Linie als eine Möglichkeit, unsere Websites schneller zu machen und sie von dem CMS zu entkoppeln, das unsere Inhalte steuert. Obwohl dies in einigen Fällen zutrifft, ist dies wahrscheinlich nicht die überzeugendste Perspektive, um dieses Konzept zu betrachten, wenn wir bedenken, was dies für native Apps und Augmented, Virtual und Mixed Reality bedeutet, allgemeiner als Extended Reality definiert.
Um zu verstehen, wie WordPress XR-Erlebnisse unterstützen kann, müssen wir einen Schritt zurücktreten und verstehen, welche Schlüsselfunktionen Entwickler und Designer in interaktiven Anwendungen wünschen.
Was ist der Kernreiz eines CMS?
Wenn ich herauszoome und mir ansehe, was ein CMS im Kern ist, werden einige Schlüsselfunktionen hervorgehoben, die meine zukunftsorientierte Vorstellungskraft zum Rasen bringen. Ein CMS kann grob definiert werden als:
- Beitrags-/Seitendaten
- Metadaten, die mit Daten wie Benutzern und Beiträgen verknüpft sind
- ein sicheres Benutzersystem
- ein Rich-Content-Editor
- Erweiterbarkeit durch Plugins/Themes/etc.
WordPress glänzt hell über dieses gesamte Spektrum und gepaart mit Open-Source-Flexibilität können Sie alles bauen, was Sie sich erträumen. Benutzersysteme und Inhalte sind zentrale Anforderungen in interaktiven und medienreichen Anwendungen wie XR. Eine Open-Source-Lösung wie WordPress gibt Entwicklern mehr Freiheit und mehr Kontrolle über den Quellcode und die Software, was bedeutet, dass sie ihn so optimieren können, dass er nach Belieben funktioniert, ohne durch Lizenzen eingeschränkt zu werden. Ein weiteres Maß an Freiheit wurde erreicht, als der neue Gutenberg-Editor in WordPress 5.0 integriert wurde, wodurch die Leistungsfähigkeit des weltweit beliebtesten CMS weiter demokratisiert wurde.
Möglichkeiten mit dem neuen WordPress-Editor
Wir haben viel Zeit damit verbracht, die Front-End-Vorteile auf einheitliche Weise zu durchdenken, um das Markup mithilfe von Blöcken zu steuern. Ich denke, ein Aspekt des neuen WordPress-Editors, der in der Frontend-Entwicklung weitgehend übersehen wurde, ist die Datenstruktur der Blöcke selbst.
Das Abrufen von Daten über die REST-API gibt normalerweise das endgültige Markup eines Beitrags zurück. Dies macht es für nicht auf HTML basierende Anwendungen schwierig, die Daten zu parsen oder zu verwenden. Sie können die endgültige Ausgabe sicherlich bereinigen, aber es gibt kein Vertrauen in die Zukunft und entfernt oft wichtigen Kontext.
Bevor ein Post Markup im Frontend rendert, werden wertvolle Attribute verwendet, um dieses endgültige Markup zu bestimmen. Diese Optionen sind für eine Nicht-Browser-Anwendung oft genauso nützlich wie für eine Browser-basierte Erfahrung; Sie müssen nur sicherstellen, dass der Inhalt für Ihre Zwecke bereinigt wird.
Stellen wir uns vor, wir haben einen Audioblock mit den Attributen src , loop , autoplay usw. Diese Attribute sind genauso wichtig für eine Nicht-Browser-Anwendung, die erwartet, dass zur Laufzeit dieselben Entscheidungen getroffen werden. Durch Abfragen eines Gutenberg-Beitrags kann man die Audiodatei abrufen und auch die Attribute, wie sie sich verhalten soll, was dazu führt, dass die Anwendung mit dem Browserverhalten vereinheitlicht wird.
In nicht allzu ferner Zukunft werden die physische und die digitale Welt weiter verschmelzen. Da jüngere Generationen zunehmend auf andere Weise als über Bildschirme, Tastaturen und Mäuse interagieren, sollten wir wahrscheinlich anfangen, Inhalte mit Blick auf diese Zukunft zu erstellen. Wollen wir wirklich, dass all dieses Markup gespeichert wird? Ist es überhaupt wichtig? Wenn dies der Fall ist, sollte dieses Attribut möglicherweise gespeichert, verschlüsselt und über JSON verfügbar gemacht werden. Markup ist wirklich nur für das Front-End-Rendering nützlich.
Nur-Ton-AR-Blog-Reader-Konzept
Bose leistet Pionierarbeit bei einem interessanten Ansatz für Augmented Reality. Sie haben ihr Produktangebot schnell aktualisiert und Sensoren mit 6 Freiheitsgraden (6DoF) in ihre Kopfhörer und Sonnenbrillen integriert, um AR-Erlebnisse nur mit Ton zu ermöglichen. Dies gibt uns drei wichtige Mechaniken für XR; 6DoF-Kopfverfolgung, private Klangerlebnisse und Gestenerkennung. Ich habe mich entschieden, diese Technologie zu verwenden, um das Potenzial in der Datenstruktur von Gutenberg-Blöcken zu veranschaulichen.

Mit dem Gutenberg-Objekt-Plug-in, das Open Source ist und von Roy Sivan und Mitwirkenden erstellt wurde, konnte ich die Attributdaten auf REST-freundliche Weise verfügbar machen. Ich konnte dann meinen Fokus auf Baumechanik und eine MVP-Anwendung verlagern, um einen Blog ohne Sehkraft zu lesen. Die Anwendung platziert Schaltflächen im 3D-Raum um den Besucher herum. Rechts ein „Nächster Beitrag“-Button. Direkt davor befindet sich ein Post-Body-Button, der einen Messwert der Post-Daten wiedergibt. Die Voice-to-Text-Technologie wurde durch die Verwendung des Amazon AI Plugin für WordPress ermöglicht.

Beim Doppeltippen auf den Rahmen der Brille, während der Blick auf den Postkörper gerichtet ist, fordert eine Stimme den Besucher auf, eine Nickgeste zu verwenden, um das Postaudio abzuspielen. Innerhalb von 24 Stunden, nachdem ich die Idee skizziert hatte, hatte ich einen funktionierenden Proof of Concept, und ich führe das größtenteils darauf zurück, dass ich nicht herausfinden musste, wie ich meine Daten aufbereiten sollte. Blocks und JSON haben alles für mich getan!
Das folgende Bild ist eine Skizze des Konzepts zusammen mit dem Endprodukt.


Blöcke in der traditionellen Augmented Reality
Das Spatialisieren von Blöcken war für mich interessant, also habe ich einen weiteren Machbarkeitsnachweis erstellt, der zeigt, wie vorgefertigte 3D-Objekte in einer Spiele-Engine mit 2D-Blöcken auf einer Webseite verknüpft werden können. Unten ist ein Screenshot eines Gutenberg-Beitrags, der in meinem Hotelzimmer gerendert wurde.

Während eine wörtliche 1:1-Darstellung einer Webseite in AR zeigt, dass wir unsere Designentscheidungen in und aus einem Browser koppeln können, denke ich, dass wir noch einen Schritt weiter gehen können. Ein Block kann viele Dinge darstellen; Warum also nicht benutzerdefinierte Blöcke verwenden, um 3D-Ideen zu abstrahieren?
Nicht standardmäßige Dateitypen und abstrahierende 3D-Objekte
HTML hat eine endliche Liste von Dateitypen, die standardmäßig erlaubt sind. Das heißt nicht, dass wir nur auf diese Optionen beschränkt sind. WordPress ist flexibel genug, um auf andere erweitert zu werden, indem einfach zulässige Typen hinzugefügt werden.
Ich habe ein Musikspiel namens Broken Place entwickelt, das es Spielern ermöglicht, mit Echtzeitmusik in AR zu interagieren. Die Sound-Engine führt eine Open-Source-Programmiersprache namens Pure Data (PD) aus, die einen ganz bestimmten Dateityp hat, den nur sie lesen kann. In WordPress verwalte ich Post-Inhalte in einem benutzerdefinierten Post-Typ namens „Songs“, wo Spieler ihren PD-Patch hochladen können. Spieler melden sich einfach als Mitwirkender auf der Website an und laden ihren Patch hoch. Der Songbeitrag wird von der nativen App abgefragt und der Patch geladen.

Die Optionen zum Einreichen von Inhalten eröffnen das Potenzial, Benutzern zu ermöglichen, ihre eigenen Layouts für Musikschnittstellen zu entwerfen. Stellen Sie sich in der Grafik unten vor, dass jeder der abgebildeten 3D-Knöpfe mit einem Gutenberg-Block namens „Knob“ verknüpft wäre und jeder dieser Knöpfe ein Attribut hat, das mit der Tonnachricht verknüpft ist, die an die Audio-Engine gesendet wird. Ersteller von Inhalten könnten mithilfe des Spaltenblocks bestimmen, wie die Tonnachrichten in einem Raster abgebildet werden. Wenn Sie Blöcke in einem Spaltenblock verschachteln, verschachtelt die REST-Antwort auch die Objekte als untergeordnete Elemente des Blocks, und die Logik kann mithilfe der JSON-Struktur angewendet werden.

Narratives Gestaltungspotential
In Postdaten erzählen wir Geschichten; manche informativ, manche persönlich, aber sie dienen als Gedankenkapseln. Ich träume von einer Zukunft, in der Posts viel mehr sind als nur Text und Bilder auf einem Bildschirm. Die Räumlichkeit von Inhalten bietet erstaunliche Möglichkeiten für narratives Design. Ich habe dieses Potenzial in den AMP-Geschichten gesehen und hoffe, dass die Struktur dazu beitragen kann, Geschichten zu inspirieren, die in physischen 3D-Räumen erzählt werden.

Stellen Sie sich die gleiche Beitragsstruktur von AMP-Storys vor, aber für 3D-Räume, die Sie zu Hause oder im Büro ablegen können. Mozilla Hubs ist führend in kollaborativen XR-Räumen, die für alle Geräte offen sind, und ich sehe interessantes Potenzial in der Kombination eines WordPress-Erzähldesigns für Mozilla Hubs, um gemeinsame Geschichtenerzählerlebnisse zu ermöglichen.
Ich freue mich darauf, weiterhin neue Möglichkeiten zur Verwendung von Headless WordPress zu erforschen, um XR-Erfahrungen zu ermöglichen und dabei zu helfen, eine völlig neue Ära einzuleiten, wie wir mit digitalen Inhalten interagieren und diese erstellen.
