Wir machen einen 3D-Konfigurator ohne Programmierung und Layout. Teil zwei

In unserem vorherigen Artikel „Erstellen eines 3D-Konfigurators ohne Programmierung und Layout “ haben wir die Probleme beim Erstellen eines 3D-Juweliergeschäfts mit den Modellierungspaketen Blender und 3ds Max erörtert.

Heute werden wir dieses Projekt aktualisieren und es zu einem wirklich funktionierenden Geschäft machen. Dazu müssen wir folgende Funktionen bereitstellen:
  • Preisgestaltung basierend auf Benutzerkonfiguration.
  • Senden von Aufträgen zur weiteren Bearbeitung durch den Manager.
  • Schaltflächen sozialer Netzwerke (wo ohne sie).

Am Ende werden wir so etwas haben:

Bild

Klicken Sie hier , um die Anwendung zu starten.

Wie üblich finden Sie die Quelldateien (3ds Max, Blender und Puzzles) dieses Konfigurators in der neuesten Version der Verge3D-Framework-Distribution.

Planen


Die Aufgabe sieht etwas ehrgeizig aus. Wir müssen einen 3D-Speicher mit einem Konfigurator (clientseitig) und einem serverseitigen Auftragsabwicklungssystem erstellen. In Wirklichkeit ist jedoch nicht alles so kompliziert, weil wir einen klaren Plan haben:

  1. Zuerst müssen wir den Server so konfigurieren, dass Bestellungen empfangen und verarbeitet werden.
  2. Der nächste Schritt besteht darin, den Preis mit dem visuellen Editor von Puzzles zu berechnen, die Logik der Auftragsbildung hinzuzufügen und an den Server zu senden.
  3. Schließlich fügen wir der Anwendung Schaltflächen hinzu, um unsere Anwendung auf Facebook, Twitter, LinkedIn und Google+ zu teilen.

Schauen wir uns Schritt für Schritt den gesamten Prozess an.

Server-Setup


In diesem Tutorial wird davon ausgegangen, dass auf Ihrem Server ein WordPress-Content-Management-System installiert ist. Ab Version 2.7 enthält das Verge3D-Framework (das wir zuletzt zum Erstellen des Konfigurators verwendet haben) ein WordPress-Plugin. Dieses Plugin enthält bereits ein einfaches E-Commerce-System, das Bestellungen verarbeiten kann, die mit dem visuellen Ortslogik-Editor „Bestellung aufgeben“ von Puzzles übertragen wurden (wir werden diesen Punkt etwas später besprechen).

Wenn Sie keinen Server haben oder nicht wissen, was WordPress ist, geraten Sie nicht in Panik! Google "Hosting WordPress", wir studieren und bestellen einen fertigen Server (Hinweis - Sie können nicht mehr als 100 Rubel pro Monat geben). Um zu lernen, wie man mit WordPress als Programmierer, Systemadministrator oder Webdesigner arbeitet, ist dies nicht erforderlich.

Lassen Sie uns unseren Shop weiter einrichten. Installieren und aktivieren Sie zuerst das Verge3D-Plugin über das Menü "Plugins" im WordPress-Administrationsbereich. Dieses Plugin ist im offiziellen WordPress.org-Verzeichnis verfügbar , sodass keine Installationsprobleme auftreten.

Fügen Sie als Nächstes den folgenden Funktionscode zu jeder Seite oder jedem Beitrag hinzu, um Ihrer Website das Verarbeiten von Bestellungen beizubringen:

[verge3d_order]

Dieser Code wird durch ein Bestellformular ersetzt, das ungefähr so ​​aussieht (ungefähr, weil sein Erscheinungsbild stark vom verwendeten WordPress-Thema abhängt):

Bild

Alle Bestellungen, die über dieses Bestellformular gesendet werden, sind über das Menü Verge3D-> E-Commerce in Ihrem Admin-Bereich verfügbar:

Bild

Bestellungen in dieser Liste werden automatisch erstellt, nachdem Anforderungen von Ihrer Konfiguratoranwendung empfangen wurden. Wenn beispielsweise ein bestimmter John (seine erste Bestellung auf dem Bild) einen silbernen Ring mit drei Edelsteinen für 180 US-Dollar kauft, können Sie ihn zurückrufen oder einen Brief schreiben, die Bestellung bestätigen und zusätzliche Informationen wie Lieferadresse und Zahlungsmethode erhalten.

Eigentlich ist das alles, was Sie auf dem Server tun müssen. Jetzt ist es Zeit, zu unserem 3D-Konfigurator zurückzukehren und ihm die Arbeit mit WordPress beizubringen.

Wir befestigen das Bestellformular am 3D-Konfigurator


Dieser Teil ist ziemlich einfach. Fügen Sie Ihrer Anwendung das Puzzle "Bestellung aufgeben" hinzu, geben Sie die URL auf dem Bestellformular, den Namen, die Beschreibung und den Bestellbetrag an. Hier ist das Ergebnis:

Bild

Die Logik der Arbeit ist ziemlich trivial: Wenn der Benutzer auf die Bestellschaltfläche klickt, berechnen wir den Preis des Rings anhand des ausgewählten Metalls und der Edelsteine. Dann verwenden wir das Puzzle "Bestellung aufgeben", um die ausgewählte Konfiguration an den Server zu senden.

Soziale Schaltflächen Netzwerke


Haben Sie jemals ein Geschäft ohne Schaltflächen zum Teilen in sozialen Netzwerken gesehen? Lassen Sie uns dieses Missverständnis mit einer Reihe von Rätseln des gleichen Typs beheben:

Bild

Hier ist die Logik noch einfacher. Wenn der Benutzer auf die Schaltfläche klickt, öffnen wir das gewünschte soziale Netzwerk in einem neuen Tab, nachdem wir zuvor den Titel und den Inhalt des Beitrags gemeldet haben, den wir veröffentlichen möchten.

Schlussfolgerungen


Die in diesem Artikel beschriebenen Methoden können nicht nur für 3D-Produktkonfiguratoren, sondern auch für andere E-Commerce-Anwendungen verwendet werden. Sie können sie beispielsweise verwenden, um einen 3D-Modellspeicher oder eine interaktive Präsentation von etwas zu erstellen, insbesondere wenn Sie in dieser Präsentation etwas bestellen können.

In Bezug auf soziale Netzwerke ist der Spielraum für Vorstellungskraft einfach riesig. Anstelle eines langweiligen flachen Knopfes können Sie einen lustigen animierten Charakter erstellen.

Vielen Dank, dass Sie meinen Artikel an dieser Stelle gelesen haben. Kommentare sind wie immer willkommen.

Source: https://habr.com/ru/post/de423791/


All Articles