Circular Webstyle Menu

Jul 12, 2015

In a recent teaching session, I saw web style popup menu that I liked the look of and showed the participants how I would build it and make it available on every slide.

After the session I had a play around and made it look better.

Screenshot

here is a demo http://elearninglaboratory.articulate-online.com/8281488099

Here is a the file https://www.dropbox.com/s/y2bb2dlaliilt5z/Circular%20Menu.story?dl=0You need the icons font for it to display correctly, but could just swap them out for wingdings.

The menu is on a slide master and is called by incrementing a variable.

49 Replies
David Anderson

What a schweet menu concept, Phil! It feels like this type of menu would work well for slide-based options, too.

For example, your default menu appears on the home screen, but once the user's within a chapter or topic, the menu could options could be specific to the current chapter.

Anyway, this is really great. Thanks for adding the source file, too!

Parashuram Vhaval
David Anderson

Hi Parashuram - Can you check your link? I'm getting a page not found and would really like to check out what you came up with!

Sorry David, that folder was not shared publicly. I have updated sharing settings. Will you please check same link again.

http://googledrive.com/host/0BwjV_zhDn5ntUHFwV0QwQi1WS0k/story.html 

Phil Mayor

Thanks Kate, It is really simple,  the slide is attached above if you want to have a look.  The Animation is on a slide master layer and is called by incrementing a variable.

The black circle has a grow animation and a shrink animation, before the circle can shrink again there is a trigger on a cue point to pause the timeline of the layer.  Clicking the menu button again unpauses the layer so the exit animation plays and then the layer hides itself when the timeline ends.

Phil Mayor

hi Stephen

You just need to take the menu and build whatever you want with it, this could be used to power any menu or inspire you to take it to the next level.

I have built similar menus into courses for various reason the main one being to allow users to jump back and forwards through content at will.

Storyline and Studio will work well in Moodle, but you can also embed media directly into moodle without using a container, it really depends on what you want to achieve.

Stephan Becker

Thank you Phil for the explanation. I am a course designer in the sense that I design courses with a variety of media to achieve learning objectives. Would you be so kind and explain to me the difference between container vs. no container.

My assumption is that a container is a course module designed with several media plus an activity layer and a 'player' that allows  a user to play the course module in order to achieve a learning objective (for example).  If this is correct, what do you mean with 'embedding media directly into moodle without using a container' - I understand that I can embed media such as pictures, video or sound files into Moodle, but I am not quite sure if this is what you meant with 'media'.

Thank you for clarification on this.

Phil Mayor

I was thinking in terms of using Storyline or Studio as a Scorm Container in Moodle, by doing this you can track if the object (your media) has been viewed and run detailed reports.

You can however embed individual media files directly into Moodle and can track to different degrees if these have been interacted with, if you wanted to track interaction you would be better off using a Scorm package, and either Storyline or Studio will work better in Moodle, I would lean towards Storyline as it has greater flexibility.

Stephan Becker

Yep, that was precisely my line of thought. I have been testing Studio 13 for a day to realize the limitations when it comes to designing what I like to see on screen. Instead of having to work with available templates in Studio, Storyline provides a blank page canvas to work with - much more course design freedom. Thanks for that confirmation. For MOODLE, we will use SCORM, or more likely Tin Can, if information gets passed along correctly that is. 

Laura Lowden

Thank you for your examples, Phil & Parashuram!  I've wanted to create a dynamic/collapsable menu for awhile and couldn't figure out how to do it.  With your two examples, it helped me figure out what I wanted to include on my menu.  Phil - your story file was so helpful!  It seems so simple, yet it helped to open your story file and mine side by side to tweak my menu to work as I need it to.

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