Design for nimble spinner

[nate-ni]

😯 Problem to Solve

We need a finalized design for the nimble spinner (indeterminate progress indicator).
We currently have this design: https://xd.adobe.com/view/6fc414f4-1660-4bff-4552-3e62baaa9e1e-19f5/screen/ced36959-68d6-440f-a0cc-031bc29d7e98/

More info at #346 (You can find example of usage in this issue)

💁 Proposed Solution

Solution should address these considerations:

• Flexible sizing (16x16, 32x32, 64x62, etc.)
• Color for all themes (light, dark, color)
• Timing
• Should there be a determinate version of this progress indicator?
• If we finalize this design on the more stylized version of this component (the "bit" spinner) should we create another issue for another version that is more like a standard, radial indeterminate spinner?

[NIbokeefe]

I've reworked our brand version of the bits-indeterminate-spinner, and included them into Nimble components.

• 16, 32 and 64 size examples
• Multiple UI color themes
• Animation timing
• Determinate version TBD
• Lets use this design universally for all indeterminate instances, which will help keep brand consistency. Unless there is a proposal (now or in the future) that provides a specific use case where this 'bits' indeterminate spinner will not work; meaning it's a UX issue for the user.

Navigate: Miscellaneous > Spinner - Indeterminate

https://xd.adobe.com/view/33ffad4a-eb2c-4241-b8c5-ebfff1faf6f6-66ac/

[nate-ni]

An example of it in use:

spinner-in-action.mov

[NIbokeefe]

An example of it in use:

spinner-in-action.mov

@nate-ni

Is this an example of a current implementation you found or the new nimble one?

[nate-ni]

A current implementation done right after the NI re-brand. Just wanted to provide an example.

[nate-ni]

Final design can be found at:
https://xd.adobe.com/view/33ffad4a-eb2c-4241-b8c5-ebfff1faf6f6-66ac/screen/f3f41187-5dc1-42f5-a9b1-c808e331a3ab/