Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 3 down vote favorite

I'm looking for examples and advice for displaying XML in a user readable way. The user does not edit the xml, but is just looking for information inside of the xml. I'm designing an interface for system admins, and they need to scan or find specific data in SOAP messages to do their troubleshooting. I'll be providing a search mechanism, but I still want a more user friendly display mechanism.

I've searched on UX, and found http://www.wymeditor.org/, which has a pretty interesting display technique, but it might de-emphasize the tag name too much.

I know there isn't much that's user friendly about XML, so any ideas are appreciated!

share|improve this question
I think this heavily depends on how much you expect your users to know about XML. I don't know a ton about it, so something simple like a searchable tag-value list would probably be good. I'm sure some sort of respect to the hierarchy in XML could be used, as well, like an expandable tree. XML already has a lot of structure built into it, so playing off that might be your best bet – borego Jan 17 '12 at 4:20
XML is actually rather user friendly, as it's designed specifically to be a human-readable way to store data. The files can be unwieldy, admittedly. – DA01 Jan 17 '12 at 14:50
@DA01 You're right, XML itself isn't that bad.. I should have specified that SOAP in practice isn't very user friendly. Especially when much of the interfaces are generated automatically from data models. – Kusmeroglu Jan 17 '12 at 15:26

2 Answers

up vote 3 down vote accepted

Since all who know XML are familiar with Notepad++, so I would try to use the elements used there. And maybe extend the code lines with color tags (for example XML tags), bold (for example properties), italics (for sg else).

something like in GMail

enter image description here

Colors can even help in scanning, remembering and improve memory. See this case study on The Effects of Color on Memory PDF for corroboration.

share|improve this answer
That last link seems to have messed up. What were you trying to link to? – Rahul♦ Jan 17 '12 at 13:29
@Rahul -- I suggested an edit for that. – stealthyninja Jan 17 '12 at 13:50
1  
@stealthyninja Thanks! Fixed. – Rahul♦ Jan 17 '12 at 14:23
Good point about Notepad++ and color usage, thanks! – Kusmeroglu Jan 17 '12 at 16:48
up vote 2 down vote

My immediate idea is to use an XSLT stylesheet to transform the XML into a HTML document which you can then visually style any way you want. That way you can show them eg. tables and datagrids instead of raw XML. But considering that you're developing this for system admins, you may not have to go that far as it's likely they're already familiar with XML. One thing to keep in mind is that you should develop the right interface for the right audience. So if they already grok XML, don't worry about oversimplifying things.

In my product, Handcraft, we provide an option called "focus on writing" which is intended for copywriters and other non-technical users who would like to edit the copy of a HTML prototype. The mode fades out all XML nodes and just keeps text opaque so you can still understand the structure if necessary but aren't distracted by it and can just focus on writing copy:

enter image description here

You could consider doing something similar where you display the XML as normal but only highlight certain parts that you want them to look through (using XPath, for instance). Having said that, SOAP remains barely legible as it is, so there's definitely a challenge there. Good luck!

share|improve this answer
I love this idea - especially for SOAP, de-emphasizing the envelope and all of the namespace cruft would really help the user focus on the actual data contained in the text. – Kusmeroglu Jan 17 '12 at 16:48

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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