Graded Quiz pop out

Mar 13, 2018

Mikel Tan
By Mikel Tan

So I had this idea to create a graded quiz pop out. The trouble I am having is getting my black 'burger' icon to stay hidden after user clicks the black burger button, and then come right back when user clicks the white burger button from the pop out menu.

I know this is an unorthodox way of doing this method, believe me, I've tried other ways to create a graded pop out, and manually doing it this way seems time consuming, but I only need to create it once and duplicate it anyway. 

On another note, I would like to dim the background, so my fix for this was to create another square that moves from the right to the left with a mild transparency. I made it so that when user clicks the white burger button or the transparent grey square, everything moves back so that the learner can continue to view whats actually at the forefront of the base layer.

 

If anyone can provide some insight as to how I can better this process, please chime in and help out if you're able to.

 

I definitely need help on the Black Burger button though. That I definitely need help on. I have attached my .story file for your analysis.

4 Replies
Richard Anciado
6 years ago03/14/18 at 6:26 pm (UTC)

Hi Mikel. I've managed to resolve the issue with the black 'burger' icon.

Here are some of the things I did.

  1. Deleted the current Hidden state. Created a new state called 'Hide' and set the image transparency to 100%.
  2. Created a new trigger to return the black 'burger' state to Normal after the questionnaire slides out (Line Motion Path 2).
  3. Added a condition on the Hovering state of the black burger. It must not be in 'Hide' state for the hovering trigger to work. Previous version allows you to hover on the black burger even when it is supposed to be hidden.

I've attached the updated .story file below. Let me know if it works for you. Cheers!

Mikel Tan
6 years ago03/15/18 at 6:59 pm (UTC)

Richard, thank you so much man! You have help me through this hurdle, however, during preview mode, it works, on the other hand, when my Black Burger button is pressed, and animation plays through, once in a while either the White Burgerb button or the Menu button will dissappear. 

Do you think this could just be a temporary bug that only exist in the preview?

Richard Anciado
6 years ago03/15/18 at 8:56 pm (UTC)

Hi Mikel. I've managed to reproduce the 2 bugs you might be referring to.

  1. Menu button sometimes disappears when mouse hovers over it.
  2. Black burger disappears when you hide the Menu while keeping the mouse hovering over the location of the hidden black burger. I think what happens here is that the hover trigger is designed to return to the previous state when the mouse leaves the object. Usually that state is "Normal", but in our case it might be storing the "Hide" state as the previous state.

Unfortunately, these aren't unique to preview. I encountered the same problems after publishing to Articulate 360.

The quick fix that I did is to remove the trigger for the hover state on the black burger. This removes all the bugs (from my limited testing) and makes the behavior predictable.

I'm not sure how important that feature is for you. Hopefully it isn't a deal-breaker. I've attached an updated .story file below. Let me know how it works. Cheers!

This discussion is closed. You can start a new discussion or contact Articulate Support.