1

I'm developing a application that allows business users to create forms with fields such as text, select boxes, check boxes, radio buttons, numeric, etc with a easy drag-n-drop UI like:

enter image description here

Once the form is created, end-users fill out the form like:

enter image description here

and then based on that data users can search and create charts from it.

enter image description here

Pretty simple concept. My problem is I'm not sure what the best way to illustrate how users would create charts from this data. The charts vary from bar to pie to gauge.

I need to show how the data is constructed to create a chart. As you see here, its just flat but based on the data I could create a chart like: Average Numeric Grouped by Text. The group would be the 'y-axis' but I can't really use that as it wouldn't apply for a pie chart. The 'x-axis' would be have values like count of, average, sum, etc based on the group.

Excel accomplishes this pretty well but the overall data is already in place when you launch the chart dialog like:

enter image description here

I was thinking of UI like this but I'm not sure its the most clear UI:

enter image description here

anyone have any ideas?

2 Answers 2

3

I think it would benefit the user to be able to create the chart using a blank canvas, in a WYSIWYG format wherever possible. This way there is something tangible to think about right away, rather than having to select from potentially confusing options ("statistics"?).

On the "canvas" there are two main areas to start: the chart box and the legend. In the chart the user must first select the type of chart, and then can click each data element to modify it. In the legend, the user can add/remove new sets of data.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Once a chart type is selected, the axes areas appear and can offer some customization options.

0

enter image description here

Ended up going with a WYSIWYG approach like @Luke suggested but slightly different UI. See:

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.