Unified Interface Controls – The Arc Knob

World Domination with UI Controls!

Yet another lovely number control for us to play with! The Arc Knob is similar to the radial knob in look and feel but is better for conveying a sense of status or value. If you’re not already familiar with how to add a control to a field on a form, I recommend reviewing my previous blog post.

Don’t you wish your credit score could grow so easily?

Using the Arc Knob – The Facts:

  • Must be used with a number field: Whole, floating point, currency, decimal
  • Must implement a min/max value
  • Allows the user to increment in “Steps” – specific values for each new level on the slider

Implementing this control is again, super simple and very much the same as the Radial Knob. In this example, we’re going to add the Arc Knob to display someone’s credit score. This gives the end user a very simple visual representation of the contact’s current score. To implement, select the form you wish to add the control to and then select the relevant field. You should have access to the following screen:

Now you will have access to set the parameters of the control. Let’s take a look at what we have:

Very straightforward stuff! Because I’m mapping this field to a Credit Score (if you’re not from the US I apologise if this field doesn’t make sense!) I’m setting the values from 0 – 900. The incremental step for this field is also set to 1.

900 is the best credit score possible in our case

Now we have all of that set up, we just need to apply the control to the client. In this case, it makes sense to have the control on the web and tablet client, but it might be difficult to see/use on the mobile client:

Next, save and publish the form to see your changes!

What a good cat!

Congrats! Yet another control implemented!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.