Chronograph Lessons Learned (examples)

Here are some rotation tags for analog hands which support chronograph/stopwatch functions with simplified math:

  • Chronograph Seconds Hand (60 seconds per revolution): (#SWES#*6)
  • Chronograph Minute Hand (60 minutes per revolution): (#SWEM#*6)
  • Chronograph Hour Hand (12 Hours per revolution): (#SWEM#/2)

And the explanation is:

  • The seconds hand multiplies each second by 6 degrees (so 60 seconds = 360 degrees)
  • The minutes hand multiples each minute by 6 degrees (so 60 minutes = 360 degrees)
  • The hour hand divides the elapsed minute count (not the elapsed hours) by 2 as there are 60 minutes/hour and 30 degrees per hour marker (so 60/30 = 2).

The chronograph seconds hands seems to drag/jump when there are too many other animations/actions being displayed (at least in showcase mode), so consider turning off the display of other animations/updates when the chronograph/stopwatch is running by setting the Opacity field:


So if chronograph is running the opacity for the selected element is zero (transparent), otherwise it is 100% which is fully visible.

1 Like

Thank you very much for sharing @mark ! I will use this for one of my future designs… :handshake::handshake::handshake::wink: