Forum Discussion

AmberLinthak287's avatar
AmberLinthak287
Community Member
9 days ago

Infinite Dial

I've follow these directions to try to make a custom dial that can spin 'infinitly'

https://www.articulatesupport.com/article/Articulate-Storyline-360-How-to-Rotate-an-Interactive-Dial-More-Than-Once?productCategory=Storyline_360&searchTerm=dial

 

however my issue is that when spinning the icons i have seem to change how they spin on the axis and do not follow the circle i want them to follow. attached is the SL file.

advice
storyline 360

2 Replies

  • AaronBurgessAU's avatar
    AaronBurgessAU
    Community Member
    9 days ago

    As soon as I opened the Group containing the 3 images I noticed the centre point is not centre of the glowing circle. If you are using Storyline 360 you can move the centre point of Group 2 around and place it centre of the glowing circle.

    Since your glowing circle is not centred either, the easiest method I know to find it's centre point is create an oval shape of 680x680(ish) pixels and centre that within your glowing circle. Then create a rectangle shape that is 340x340 (half the oval size) pixels and align that to the top and left of the oval. That rectangle's bottom right corner is now at the dead centre of the oval. So all you need to do is drag your Group 2 anchor point to that corner.

     

  • Nathan_Hilliard's avatar
    Nathan_Hilliard
    Community Member
    9 days ago

    As Aaron mentioned, make sure your groups are aligned before making the dial. For a quick guide, I tend to snap things to the slide center and then move them as a cluster to their final location so they stay aligned. You may have to make some minor adjustments to the dial center when finished.

    Also, make sure you set up and orient your shapes individually before grouping. For example, insert your icons, leave at 0 degree rotation. Insert each oval with rotation 0, and then align to its icon group. Group each icon with its oval, place on the glowing circle at the desired position then rotate into the desired orientation. Then select each grouped icon and oval and combine the three sets into one group. Convert this into a dial. Make the adjustments to the dial format (i.e., rotation, steps, etc.).

    Note, the way Storyline handles grouped rotations at design time is broken and it will likely look terrible. When published, it should rotate as you expected, with the icons maintaining their correct paths.

    Attached is a quick mockup using your images. The alignment is not perfect, but shows the generally desired outcome.

    https://360.articulate.com/review/content/2d32f19d-f57f-4983-a152-b5695d90d781/review

Related Content