0

I'm working on a desktop application (Java Swing) which contains a screen allowing the user to enter and edit magstripe track-data.

This track-data is a string, looking like this:

;1234567890123445=99011200XXXX00000000?

Of course, this is not just random data; the first string of digits is an account number, the string 9901 is an expiry date, etc. The start and end-characters (';' and '?') are always present.

I would like to present this as multiple controls; a text-entry for the account number, dropdowns for the expiry-date, etc., making sure that the user always enters correctly formatted data.

Since this is for a test-tool, however, it should also be possible to enter any data, even with incorrect formatting.

So my current thought is to present the editor as two tabs - one where data is edited in a formatted way, and another one where the data is edited 'raw', basically as one textbox.

Switching from the formatted view to the raw tab is never a problem, since formatted data can always be shown as raw data. The opposite - switching from the raw tab to the formatted tab - is more problematic, since it may not be possible to display the data entered in a formatted way.

My thinking is now to show a warning dialog in that case, telling the user that his track-data will be erased if he really enters formatted view. This doesn't feel quite right though, and I'm sure people have come up with better solutions.

To make things a bit more difficult, the user is not editing just one, but three tracks of data, some of which might become invalid, and others not.

Does anyone have a better solution for this scenario?

Improve this question
5
  • Do I understand you right that users can enter multiple strings in both views?
    – ITJ
    Mar 1, 2015 at 13:44
  • Why do you need a raw view / input at all? Seems very error-prone and not very user friendly. You can still transform it to a single string in your backend if necessary.
    – CodeManX
    Mar 1, 2015 at 14:32
  • @isger janson: Yes, there are three tracks, all of which are editable
    – Jeroen
    Mar 2, 2015 at 11:32
  • @codemanx: It's a test-tool, which will test the response of a device to magstripe-data. It's a requirement to be able to send both valid and invalid data.
    – Jeroen
    Mar 2, 2015 at 11:32
  • 2
    If it's a test tool, I wonder why UX is so important. Either way, I can think of several design solutions, here's an example: jsfiddle.net/1w5ucfmw/2 (uses Knockout.js to update the raw number as you type, but still allow to send arbitrary raw numbers as long as you don't change one of the other fields).
    – CodeManX
    Mar 2, 2015 at 20:05

1 Answer 1

Reset to default
1

I don’t see why switching between both views should matter or the number of tracks you want to cover. Eventually you need to clarify that (and answer @CoDEmanX question).

Maybe your design pattern isn’t well chosen and sticking with Tabs isn’t the best choice to achieve what you really want. As much as I understand you want to have two ways of entering data strings, a formatted one and a freeform, to send these invalid and valid data to a device for testing.

I think about this as a two-step process, entering valid or invalid data multiple times and then sending it. With this idea of processing in mind I came up with a split screen solution with the left side in use for entering valid data which can be added to the right side where invalid data can be entered as well before sending it.

Split screen solution

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.