Teil 1: Erstellung einer AR-Webanwendung

Allgemein Schlagwörter: , , , 0 Kommentare

In den letzten Wochen habe ich einen Google Kurs für Augmented Reality und ARCore erfolgreich belegt. Nun erstelle ich Beispiel-Anwendungen für die Kundengewinnung.

Sie haben es eilig? Dann speichern Sie diesen Blogartikel von R23 als PDF

Brauchen Sie den Inhalt dieses Artikels "Teil 1: Erstellung einer AR-Webanwendung" schnell und bequem? Dann speichern Sie ihn doch einfach als PDF!

Was ist ARCore?

ARCore ist ein von vorgestelltes Development Kit (SDK) zur Realisierung von Augmented Reality (AR)-Anwendungen auf Android-Geräten.

Eine Beispiel-Anwendung für ARCore ist die App IKEA Place im Play Store. Eine App mit Augmented Reality (erweiterter Realität). Sie sorgt dafür, dass Einrichtung mehr Spaß macht.

Dieser Beitrag ist Teil einer Artikelserie:

Teil 1: Erstellung einer AR-Webanwendung
Teil 2: Experiment mit Augmented Reality Features im Web

Verwandeln Sie Ihren Commerce mit 3D-Visualisierung von R23

Ein Maskottchen / Charakter transportiert die Botschaft Ihrer Dienstleistungen und Produkte nach außen. Darüber hinaus kann ein Maskottchen / Charakter für einen Wiedererkennungswert sorgen.

Charakterdesign / Maskottchen

Wir bieten Ihnen Maskottchen / Charakter Design für Ihre Marke, in 3D oder als Zeichnung. Ihre einzigartige Sympathiefigur.

Was Du benötigst, wenn du Augmented Reality im Web sehen möchtest

Dies ist ein Überblick, was du benötigst, wenn du eine AR-Webanwendung erleben möchtest.

  • ARCore-fähiges Android-Gerät mit Android 8.0 Oreo. Ich verwende Android 9.0 P
  • ARCore installiert (Chrome fordert Sie automatisch auf, ARCore zu installieren)
  • Chrome für Android: Muss Version 70 oder höher sein

Chrome mit AR-Features erhalten

Die ersten AR-Funktionen sind in Chrome Canary-Builds mit einer Mindestversion von 70 implementiert. Du kannst unter Einstellungen -> Über Chrome gehen, um zu sehen, welche Version von Chrome Du verwendest.

Ich verwenden die noch in der Entwicklung befindliche Device API (der Nachfolger der API), die sowohl Augmented Reality (AR) als auch Virtual Reality (VR) Funktionalität kombiniert. Wir werden uns auf experimentelle AR-Erweiterungen der WebXR Device API konzentrieren.

Stelle sicher, dass die AR-Funktionen auf Chrome aktiviert sind.

Die ersten AR-Features verbergen sich hinter und -hit-test Flags. Um Augmented Reality Unterstützung in Chrome zu aktivieren:

  • Überprüfe, ob Du Android 8.0 Oreo oder aktueller verwendest.
  • Überprüfe, ob Dein Android-Handy eines der unterstützten ARCore-Geräte ist.
  • Vergewissere Dich, dass die Chromversion >= 70 ist.
  • Gebe chrome://flags in die URL-Leiste ein.
  • Gebe in das Eingabefeld Suchfeld ein.
Gebe webxr in das Eingabefeld Suchfeld ein.
  • Setze Device API (#webxr) auf Enabled.
  • Setze das Flag Hit Test (#webxr-hit-test) auf Enabled.
  • Tippe auf RELAUNCH NOW, um sicherzustellen, dass die aktualisierten Einstellungen wirksam werden.

Bei einer AR-Webanwendung erscheint folgender Dialog.

Teil 1: Erstellung einer AR-Webanwendung 2
Teil 1: Erstellung einer AR-Webanwendung 3

Die AR-Webanwendung verwendet JavaScript, um 3D-Modelle zu rendern, die so aussehen, als ob sie in der realen Welt existieren.

Teil 1: Erstellung einer AR-Webanwendung 4

Der Screenshot von meinem Handy zeigt das 3D Model von Naomi Chen / CC-BY

Jetzt bist du gefragt!

Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Ich freue mich über Dein Feedback in den Kommentaren.
Wenn Dir das Projekt gefällt, dann klicke bitte like und/oder share, um auch anderen Interessierten den Beitrag zugänglich zu machen. Vielen Dank!

Willkommen bei unserem Blog über AR/VR und Metaverse! Wir werden Ihnen einen Einblick in die immer größer werdende Welt der Augmented Reality und Virtual Reality geben. Erfahren Sie mehr über die verschiedenen Komponenten, Technologien und Strategien, mit denen Unternehmen virtuelle Welten erschaffen können. Außerdem möchten wir einen neuartigen Service vorstellen - ChatGPT, der es Nutzern ermöglicht, sich auf natürliche Weise über das Thema zu informieren. Wir hoffen, dass Sie von den Inhalten unseres Blogs profitieren können!
Fragen Sie ChatGPT alles über AR/VR und Metaverse.
Ihr interaktiver Begleiter in die Welt von AR/VR und Metaverse

Wie können wir Ihnen helfen?

Wir unterstützen Sie bei der Umsetzung Ihres Augmented Reality (AR) oder Virtual Reality (VR) Projektes! Ob Produktfotografie, 3D-Scan-Service, 3D-Visualisierung oder fertige 3D-Modelle für AR/VR - wir beraten Sie persönlich und unverbindlich.

Wenn Sie ein individuelles Angebot auf Basis Ihrer aktuellen Vorlagen (Fotos, Zeichnungen, Skizzen) wünschen, nutzen Sie einfach unser Anfrageformular.

Teil 1: Erstellung einer AR-Webanwendung 5

R23 Newsletter

ABONNIEREN SIE UNSEREN NEWSLETTER

Liebe Leserin, lieber Leser,

wenn Sie sich für aktuelle Themen und Tipps rund um unser Atelier für Virtual & Augmented Reality interessieren, dann melden Sie sich jetzt für unseren kostenlosen Newsletter an. Sie erhalten wöchentlich eine E-Mail mit spannenden Artikeln, exklusiven Angeboten und praktischen Ratschlägen.

Um sich anzumelden, füllen Sie einfach das folgende Formular aus und klicken Sie auf “SETZ DICH AUF DIE LISTE”. Sie können sich jederzeit wieder abmelden, wenn Sie möchten.

Wir freuen uns auf Ihre Anmeldung!

Wir senden keinen Spam! Erfahren Sie mehr in unserer Datenschutzerklärung.

Hat Ihnen dieser Artikel gefallen?

Mit Ihrer Bewertung helfen Sie uns, unsere Inhalte noch weiter zu verbessern.

Gefällt Ihnen dieser Beitrag? Teilen Sie ihn mit anderen. Sie machen uns damit eine große Freude!
R23
R23 : Metaverse, Augmented Reality, Virtual Reality

Kommentar verfassen

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Ralf Dreiundzwanzig: Atelier für Virtual & Augmented Reality

Aktuell

Virtuelle Influencerin

Charakterdesign
In unserem r23 Atelier in Hagen entwerfen wir für Ihr Unternehmen, Ihre Organisation oder Ihr Projekt die passende virtuelle Influencerin. Wir entwerfen gerade eine virtuelle Influencerin für uns selbst. Verfolgen Sie die Entstehung auf https://blog.r23.de/tag/claudia/
Virtuelle Influencer von R23