Storyline: Connecting Lines Matching Question

Allison LaMotte
Allison LaMotte
6,452 Downloads
Download

Have you ever wanted to create a classic connecting lines matching question in Storyline? Well you’re in luck! Now all you have to do is download this template, pop in your content, and update the branding to match your guidelines. Easy-peasy!

Explore this project.

39 Comments
Allison LaMotte
over 2 years ago02/08/21 at 1:37 pm (UTC)
Hi Christophe, Sure thing! You'd need to: - Duplicate the rectangles and circles - Update the states so that the lines go to the right places - Update the correct answers in Form View Here are some links you may find helpful: - https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-add-and-edit-states - https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-edit-questions-in-form-view I hope that's helpful!
Shumon Islam
over 2 years ago02/09/21 at 4:29 pm (UTC)
Alison, this is amazing. this is my first official storyline project and I really loved it. It worked the moment I downloaded and opened into my storyline 360. While it's built for matching, I also made it a question for step-by-step instructions. Ex: three steps of changing a flat tire (Step 1: lightly loosen the lug nuts, Step 2: Place a Jack under the car, (3) Step 3: completely loosen the lug nuts and remove the lug nuts. ) Learners can click and match each step with its corresponding definitions. Now. I will try to add more step. Alison, thank you for being so generous.
Meredith Moon
2 years ago05/26/21 at 11:49 pm (UTC)
Hi Allison, This was a fabulous help, and a great learning exercise, thanks for sharing. I've got a very weird issue, number 1 works fine number 2 & 3 do not show the hand to move the numbers across, you need to do number 4 next and then the other numbers seem to fix themselves. Not sure if that's clear you can check out the issue here https://360.articulate.com/review/content/bd5b3837-39d2-407d-8f5e-ec5f94a9cb4c/review
Tyler Haw
over 1 year ago10/06/21 at 10:32 pm (UTC)
Hi Allison, I hope you are still around... I really like this example! I'm trying to replicate it, and I have almost everything, except, I'm having trouble with having the state of the rectangle change back to normal when an object intersects. I have set a trigger to have the state return to normal when the drop oval intersects with any of the starting ovals.. but when I preview, the connecting line doesn't disappear. As an example, this happens when I try to move #2 to the circle that #1 has already been placed on. Do you have any idea what mistake I might be making? Thank you,
Tyler Haw
over 1 year ago10/07/21 at 2:15 pm (UTC)
Hi Allison, thanks for replying. Yes, I downloaded your file to try and mimic it. Everything works as intended, except for when you want the line to disappear once a number returns to the original spot. On yours, you have, "Change state of columnbox to normal when drag 1 intersects with any of start 1,2,3. On mine, the line only disappears when I drag the circle over the starting circle. However, the line does not disappear when I drop 2 on 1 for example, and 1 auto returns to it's starting location. The line stays where it was, which is not what should happen. Any thoughts?
Tyler Haw
over 1 year ago10/12/21 at 2:04 pm (UTC)
Hello everyone, I reached out to articulate support as Allison suggested, and got a resolution. I did want to share though in case anyone else was wondering. So it turns out you need to have a drop correct and drop incorrect state in order for this to work. I didn't think this would be necessary, but maybe the intersect trigger only works if the shape is actually changing when it reverts from (in)correct state back to normal. One thing to keep in mind, if you use the exact same shape on the drop states, then it still won't work. You either need to have a completely different look on the states, or create a new shape, same size, and that will do the trick. Thanks again for the example Allison!
Daymon Kiliman
over 1 year ago12/30/21 at 3:22 pm (UTC)

Thanks so much for this template, Allison! I'm still fairly new to Storyline, so I'm a bit in awe at the ingenuity of this project and am using it to learn more about how to create these complex interactions with visual feedback. One thing I'm wondering about is the options available for drop targets. I think most learners would understand that the "drag" objects should be moved over to the "drop" areas, but it is possible for a "drag" object to be moved to another starting point (Drag1 placed on top of Drag2, for example). I think I've figured out that you have the "intersect" object trigger change the state of drag objects if they're placed on a starting point rather than a dropping point to make the connecting line disappear if the learner previously moved a "drag" to a definition "d... Expand

Allison LaMotte
over 1 year ago01/05/22 at 1:34 pm (UTC)
Hi Daymon, To get the drag items to snap back to their original location when dropped outside a drop target, you can simply check that option in the drag-and-drop options window. Learn more about these options here: https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-create-freeform-drag-and-drop-questions#step3 Easy peasy! :)
Andrew Barnes
over 1 year ago01/20/22 at 7:08 pm (UTC)

Good Afternoon Everyone, Thank you Allison for sharing the template with us it works very well. I have set ATTEMPTS TO 3, so that the user can retry up to 3 times, but when the user clicks TRY AGAIN I want To have it reset to the Normal state and I just cannot get it to do that. I have added Slide Triggers Layer - Try Again Show layer Incorrect When timeline starts on this layer if Word_DragnDrop>=value2 (Word_DragnDrop is my numeric variable) The I created Object Triggers Add value 1 to Word_DragnDrop When user clicks Try Again HIde Layer this layer When user clicks Try Again Change state of Colum1Box1 - MS Word to Normal When user clicks Try Again Change state of Drop1 - to Hidden When user clicks Try Again Change state of Drag1 - to Normal When user clicks Try Agai... Expand

Sign In to Comment