Add question form - mark answer as correct

Question

In a web-app quiz form used to add new questions (with answers) for the app, how should I indicate to the user to mark an answer as correct?

enter image description here

Currently you mark an answer as correct by clicking the radio element on the left of it.

Any suggestions are more than welcome.

If only there was a website with questions and multiple answers that allowed to mark one of the answers as correct... :) — Vitaly Mijiritsky, Jun 23 '12 at 17:42
@VitalyMijiritsky The question is about a ui used to add multiple choice questions to an online quiz. I see the similarity to stackOverflow but think it's a different case. — AturSams, Jun 18 '14 at 07:11
@zehelvion, Another suggestion is to use a checkbox instead of radio buttons. — Pacerier, Nov 08 '15 at 00:15

score 18 · Accepted Answer · answered Jun 23 '12 at 17:08

18

If this is an administrator function for a multiple-choice quiz, I would make it clear to the user that a correct answer is required, and allow the addition of one or more decoy answers. (Choose your own terminology for "decoy answer".)

mockup

^{download bmml source – Wireframes created with Balsamiq Mockups}

The application itself would randomise the question's answers when presenting them to students.

answered Jun 23 '12 at 17:08

Andrew Leach

4,370
1
26
27

Wow! This is great! I wish I could give more than 1 upvote. Anyone answering after Andrew is wasting their time. – dnbrv Jun 23 '12 at 18:41
This is very inspiring and completely different than what I had originally thought to do. – AturSams Jun 24 '12 at 23:52
While this makes sense when answers are exclusively right or wrong, how would this work for when 2 answers are correct? Example: "D) Both A and C are correct." – KOVIKO Jul 10 '12 at 19:09
@Koviko That wasn't part of the requirement (which used radio buttons), but you could have more "Correct answer" fields and make one required, just as there are multiple "Decoy answer" fields with one of those required. – Andrew Leach Jul 12 '12 at 16:23

score 1 · Answer 2 · answered Jun 23 '12 at 17:13

1

Have the first answer selected by default and integrate a correct answer wrapper around it for feedback/affordance.

enter image description here

answered Jun 23 '12 at 17:13

Luke Charde

6,284
5
31
42

What do you mean by 'wrapper around it'? :) – AturSams Jun 23 '12 at 17:25
The green visual wrapper in the mockup. – Luke Charde Jun 23 '12 at 17:26
@LukeCharde: How do you afford for the quiz creator's desire to mix right and wrong answers? – dnbrv Jun 23 '12 at 18:40
@dnbrv I was thinking that the radio buttons were enough - that the [Correct Answer] treatment functions as the missing radio label. Drag-and-drop ordering might be good. What are your thoughts? – Luke Charde Jun 23 '12 at 18:54
@LukeCharde Andrew Leach's solution above is far more elegant than anyone can propose. – dnbrv Jun 23 '12 at 19:02
@dnbrv agreed. +1 I was thinking too shallow. – Luke Charde Jun 23 '12 at 19:04
@LukeCharde I was thinking along the same lines, too, as I was reading the question. – dnbrv Jun 23 '12 at 19:11
@LukeCharde: Thanks, my Internet was not working too well yesterday(so I did not see the mockups), I liked this answer too. – AturSams Jun 24 '12 at 23:51

score 0 · Answer 3 · answered Jun 23 '12 at 17:38

0

Or make two headings. One that says correct answer: above the radio buttons. Then move the "answers" header to the right above the input boxes.

answered Jun 23 '12 at 17:38

Earle

1

This is exactly what the selected answer suggested. – dnbrv Jun 28 '12 at 04:47

Add question form - mark answer as correct

3 Answers3