Create a study/task workflow

Our audience has little domain knowledge

I see more than one audience for UTS:

1. Drupal developers with no usability background - This is likely the largest audience. They may have a good understanding of core Drupal concepts, but may not know what task analysis or card sorting is.
2. Usability practitioners with little or no Drupal experience - Definitely not as large as the first audience, but a definite possibility as more usability work happens in Drupal.
3. Drupal developers with a usability background - Likely the smallest group, but addressing either of the first two groups should address this one.

On this note, at least for English speakers, you may want to reconsider the use of the term "study" and go with something more colloquial like "test". If the primary audience is the first one, they are going to conceptualize terms like "study" and "survey" differently than researchers do. Usability practitioners will understand the colloquial use of "test" in this context.

This form is used, to edit afterwards

This could be tricky if you're using the wizard format. If the user wants to edit something on the third panel of the wizard, they have to click to edit and then click next twice to get to what they really want to edit. In the edit version of the form, there needs to be a way for the user to get directly to what they want to edit without stepping through the wizard process again.

Mockup 1

This collapsing form reminds me of some of the forms in Habari. This would be a really complex form under the hood, however, in order to deal with how Drupal verifies forms for security purposes. There would also be a great deal of validation functionality replicated on the client side in JavaScript and the server side in PHP. Or would you be relying completely on JavaScript for that?

Instead of a pointed right side on the section header, what about having an icon that becomes highlighted to indicate the form has all required information? Something like a grayed out check mark that turns green when that section is complete.

The way the radio buttons are connected with their description makes them look like tabs. The tab metaphor is strong, and it will cause some confusion here since these are not tabs. I think there's a good chance that the user is going to click down the list of radio buttons thinking they are tabs before they realize that they aren't tabs.

I'm unsure about the utility of the "Save as Draft" function. It adds new overhead on the UI that lists the studies and seems a bit like feature-itis. Hold off on adding a feature like this until you've determined that the demand for it is sufficient.

Mockup 2

The progress indicator looks like a breadcrumb. Is it? If so, and I'm in the create study context (as opposed to the edit existing study context), what happens if I have entered data in step 1 and then click on the second step instead of clicking "Next"?

Does the content of the progress indicator change depending on the type of study selected (i.e., is there still a "Task" step if the study type is "Card Sorting", or is that step called something different for card sorting)?

The duplication of "Create a Study" is a little confusing. It appears above and below the progress indicator. In the second drawing, you have the lower label as "Step 1" which is clearer. Perhaps something like "Step 1: Basic Information"?

When the type description changes based on the select box, it needs to flash in some way to call attention to itself. Something like having the background flash a highlight color and then fade back to white. Just replacing text isn't likely to draw attention.

Why would you need a indicator to show how far you are in filling in a part of the form? I don't see the point.

Not to indicate how far you are in filling in part of a form, but that you have filled in the information necessary to move to the next part. In the beginning, you have a state where you can't transition to the second part of the form until a study type and an environment have been selected. Unless a type and environment are selected by default.

I know the radio button solution conveys tab's to much, however I am unsure if that is really wrong. I don't see an other way of presenting this information, as the description is linked to the radio button. Any ideas?

In the second mockup, you present it as a drop down with a text area beside it. That's more consistent with the rest of Drupal. I think with some tweaks to the graphic design, however, you could keep the radio buttons and grouping outline without creating as much of a tab look. If there's only an outline around the selected radio button and its description, and no outline or background change around the unselected radio buttons, it won't look like a tabbed panel. The problem with it looking too much like tabs is that tabs aren't used for selection purposes. They're used to separate and group content. You never make a choice in tabbed dialog by selecting a tab and then clicking okay.

But what about the structure?

I'm not sure what else you're looking for with "structure." I think having the groups collapsed is a good thing; it's nice to have the end of the form in the view port. What about putting the Type selection below description? That may have two advantages: 1) it will place it closer to the form area that's changed when the type selection is changed and 2) it will require only one activity context switch for the user. As is, the user switches from typing (title) to reading, selecting, and deciding (type), back to typing (description) and then to reading, selecting, and deciding (environment) . If Description is placed after Title, the activity cycle is typing -> typing -> reading/selecting/deciding -> reading/selecting/deciding.

Until you choose study you cant really display the next step

What is the intent of progress bar here? To tell the user how many more panels they have to fill out, to let them know what the next step in the process is, or a combination of both? If you're only telling them how much more work they have to do, "Step x of y" may be sufficient.

I don't think there's an easy answer if you need them to know what the next step is other than trying to find a generic term that describes the next step for each type of study. The progress indicators in the slide show you linked always have the same steps after progress begins.

One thing that would help in evaluating wireframes would be a brief outline of what the user is supposed to be accomplishing on the screen. Something more detailed than "create a study" since I'm new to UTS.