How should a clickable step icon look like?

I am in middle of a design, and currently looking at the UX.
How should it work:

3 types of steps:

  1. Completed (with a tick)
  2. Complete (tickable)
  3. Disabled, need to complete the above steps in order to be tickable.

So this is the output:

Is the second step icon, actually tells you “hey, tick me?” or?..

How can I make it better?

1 Like

It doesn’t say tickable to me. I am not aware of any time I have had to tick something in an app to say I have completed it.

Is there any way the app can detect completion? If not, I would suggest using a standard form tick box, maybe even with a greyed out tick as a suggestion of what it does.

1 Like

I agree. It doesn’t say ‘tickable’ to me either. It says ‘if you wait, I’ll be ticked’.

1 Like

The design of it reminds me of a progress indicator rather than an actionable list. Agree on the comments about using more standard tick boxes:

13

3 Likes

update! what do you guys think?

1 Like

Definitely better IMO.

It’s hard to say. I think it looks a lot clearer but my perspective is now polluted. I think you need some fresh eyes just in case.

In my opinion, it’s a lot more clear the second one :wink: