it-swarm.com.de

Eingabe eines mehrsprachigen Namens

Wir entwickeln eine Client-Anwendung, die mehrere Sprachen unterstützt. Wir haben einige MasterData, für die ein lokalisierter Name erforderlich ist (z. B. wird ein Produkt an jedem Standort anders benannt). Bei der Erstellung solcher MasterData sollte dem Benutzer die Möglichkeit gegeben werden, lokalisierte Namen für jede Sprache einzugeben, er muss jedoch mindestens die englische Übersetzung eingeben.

Wie würden Sie ein solches Eingabeformular erstellen?

Ich habe darüber nachgedacht, eine Art kleines UserControl zu erstellen, mit dem verschiedene Sprachen durchlaufen, angezeigt und eingegeben werden können.

5
TheJoeIaut

Hier ist meine endgültige Lösung atm:

Thats what i came up with

1
TheJoeIaut

Für die Aufzeichnung verwenden wir in unserer eigenen Anwendung etwas wie Ben Brocka, aber ohne den Schmerz der Auswahlliste für den Benutzer.

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Es ist ein winziges Layout, in dem alle vorhandenen Übersetzungen mit einer Schaltfläche zum Entfernen vorhanden sind. Unten finden Sie die anderen verfügbaren Sprachen über eine Liste von Schaltflächen. Wenn Sie auf eine dieser Schaltflächen klicken, wird eine Lokalisierung hinzugefügt. Nicht wirklich anders, aber wir fanden, dass es nützlicher war als eine Auswahl.

Die Hauptvorgabe dieser Benutzeroberfläche für Ihr Problem - und auch für unsere - ist, dass Sie nicht alle Übersetzungen aller Felder auf einmal verwalten können. Sie ist nur feldorientiert.

5

Eine Standardoption besteht darin, ein erforderliches Feld und eine Schaltfläche zu haben, die ein neues Eingabefeld für zusätzliche Elemente wie neue Lokalisierungen hinzufügt:

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Ich habe Englisch als Standardnamen erscheinen lassen, da Ihre App so funktioniert. Jede hinzugefügte Lokalisierung/jeder hinzugefügte Name enthält eine Sprache und ein Eingabefeld für den lokalisierten Namen.

4
Ben Brocka

Es gibt einen Nice-Ansatz, der von Prestashop (einer mehrsprachigen Open-Source-E-Commerce-Webplattform) implementiert wird. Ich bin mir ziemlich sicher, dass Sie die Aktion in ihrer Online-Demo sehen können: http://www.prestashop.com/en/demo (Rufen Sie das Admin-Panel auf und bearbeiten Sie ein Produkt, da Produktnamen sein können lokalisiert).

Ihr Ansatz ist wie folgt:

Nehmen Sie das lokalisierbare Bearbeitungsfeld und fügen Sie danach eine kleine Flagge hinzu (in derselben Zeile). Die Flagge hat die gleiche Höhe wie das Bearbeitungsfeld, sodass sie sich wie eine sehr natürliche Erweiterung des Bearbeitungsfelds anfühlt. Sie können einen Tooltip mit dem Sprachnamen anzeigen, wenn Sie mit der Maus über die Flagge fahren, damit Personen, die ihre Flaggen nicht so gut kennen.

Wenn Sie auf die Flagge klicken, wird ein Dropdown-Menü (oder ein Hover-Menü) mit allen anderen Sprachen angezeigt. Sobald Sie eine Sprache ausgewählt haben, verschwindet das Hover-Menü und der Inhalt im Bearbeitungsfeld bezieht sich auf diese Sprache.

Es ist Bens Vorschlag ziemlich ähnlich, aber viel sauberer. Es gibt fast keinen Unterschied zwischen dem lokalisierbaren und dem nicht lokalisierbaren Bearbeitungsfeld, sodass Sie mit geringfügigen Layoutänderungen hin und her wechseln können.

enter image description here

3
talkol

Nach den großartigen Vorschlägen von Ben und talkol würde ich standardmäßig die allgemeinen Übersetzungen hinzufügen, die der Benutzer auswählen würde (eine weitere Herausforderung besteht darin, diese Standardeinstellungen so genau wie möglich vorherzusagen). Ein weiteres wichtiges Merkmal ist die Möglichkeit, hinzugefügte Übersetzungen zu löschen, möglicherweise durch Hinzufügen eines kleinen X links von jeder Zeile.

0
Dvir Adler