it-swarm.com.de

Vorschlag für eine lange Form wie eine Rechnung

Ich bin dabei, ein langes Formular zu erstellen, in dem Benutzer Daten direkt auf einer Weboberfläche auswählen/eingeben können. Ähnlich wie beim Ausfüllen eines Rechnungsformulars auf der Webseite. Ich wollte Eingaben darüber, welcher Prozess der beiden unten genannten für einen Benutzer einfacher zu füllen ist.

Option 1: Verwenden eines Assistenten und Ermöglichen der Auswahl durch den Benutzer in zwei bis drei Schritten

[ODER]

Option 2: Verwenden Sie ein einziges Formular, um alle Details auszufüllen

Die Details, die aufgenommen werden sollen, sind unten:

  1. Kundendaten (Name, Adresse und Kontakte)
  2. Rechnungsdetails (Rechnungsnummer, Datum, Fälligkeitsdatum, Bedingungen P.O #)
  3. Produkt-/Servicedetails (mehrere Produkte mit Preis, Menge, Rabatt, Steuern und Betrag)
  4. Gesamtübersicht (Zwischensumme, Steuern, Rabatt und GESAMT)
  5. Terms & amp; Bedingungen
1
jelumalai

Die letztere Option gibt den Benutzern eine genaue Vorstellung vom Umfang der Aufgabe. Ja, Option 1 kann dies mithilfe von Breadcrumbs bereitstellen, dies bietet jedoch keinen vollständigen Gültigkeitsbereich, und IMO ist es besser, die Benutzer jederzeit so gut wie möglich auf dem Laufenden zu halten.

Trotzdem möchten Sie kein unnahbares Formular mit zu vielen Feldern, daher helfen Untertitel, Abschnitte und sogar ein Akkordeon dabei.

Um Ihnen eine Vorstellung davon zu geben, was ich meine (ich habe nur die ersten paar Formteile gemacht), das Akkordeon links und das geschnittene Formular rechts:

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups


Bearbeiten:

In einem Formular auf dem System, an dem ich arbeite, könnten Abschnitte minimiert werden. In Ihrem Fall könnten Sie einen Hauptabschnitt/eine Hauptkategorie wie oben aufgeführt haben und dann Eingaben in Feldsätzen gruppieren. Die Gruppen können reduziert werden, was bedeutet, dass Sie immer Pflichtfelder säen können (indem Sie Feldsätze mit Pflichtfeldern standardmäßig erweitern) und dennoch Platz sparen, indem Sie einige Bereiche des Formulars ausblenden. Screenshot unten.

enter image description here

1
TJH