Page MenuHomePhabricator

Design field editing aids for translation templates
Open, MediumPublic

Description

Template translation (T139332) requires users to edit template fields. We can guide this process for users to know which information they need to provide.

This ticket is intended to clarify how and when to present the following aspects related to field editing:

  • Field description.
  • Data format accepted by the field.
  • Whether the field is mandatory.
  • Highlight the current focused field (and the corresponding one).

Proposed solution

The proposed solution is to use the card system to surface additional information and warnings about the active fields:

fields-highlight.png (820×1 px, 131 KB)

  • Before a field is selected, corresponding fields are highlighted on hover.

fields-editing.png (820×1 px, 144 KB)

  • When editing a template field card is shown. the card includes:
    • Field name
    • Indication on whether the field is mandatory.
    • Field description. Limited to a couple of lines with a "more" option to expand.
    • Format information (if exists), initially collapsed.

fields-mandatory.png (820×1 px, 144 KB)

  • Fields with warnings include a warning icon. The selected field will show warning indicators highlighted in yellow.
  • Warning information is highlighted in the card.

fields-warnings.png (820×1 px, 171 KB)

  • For format-related warnings, the signals in the field are the same as in the mandatory example, but the warning message in the card is shown above the format information.
  • If both "format" and "mandatory" errors occur, only "mandatory" is shown since the field being empty seems the simple one.

Event Timeline

During template translation research (T161188 ) a participant missed details about the fields in order to do the mappings, that this ticket could have helped with. In particular, the highlight to notice the equivalent fields and the descriptions that field card provide.