Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add completeness bar to workflow selection buttons #1151

Closed
rogerhutchings opened this issue Sep 20, 2019 · 5 comments · Fixed by #1204
Closed

Add completeness bar to workflow selection buttons #1151

rogerhutchings opened this issue Sep 20, 2019 · 5 comments · Fixed by #1204
Assignees
Labels
enhancement New feature or request
Projects

Comments

@rogerhutchings
Copy link
Contributor

rogerhutchings commented Sep 20, 2019

The design for the workflow select button in the Hero widget includes a completeness bar which needs to be added:

Screenshot 2019-09-20 13 56 54

Related: #1077

And https://zooniverse.slack.com/archives/C0Z7YNTSL/p1554151344033200

@rogerhutchings rogerhutchings added the enhancement New feature or request label Sep 20, 2019
@rogerhutchings rogerhutchings added this to To do in Project app via automation Sep 20, 2019
@rogerhutchings rogerhutchings self-assigned this Sep 23, 2019
@rogerhutchings rogerhutchings removed their assignment Sep 30, 2019
@beckyrother
Copy link

(Working on this now)

@beckyrother beckyrother self-assigned this Oct 2, 2019
@beckyrother
Copy link

Think I was trying to be too clever the first time. How does this feel?
workflow-button-3 2

For reference, here's the first one we were thinking about (pretend the button text is black like it should be):
workflow-button 1

@eatyourgreens
Copy link
Contributor

Lose the blue tooltip, and I think this is much better (and something we can implement.)

@eatyourgreens
Copy link
Contributor

#1204 adds a basic background gradient, which is muted somewhat on hover/focus. Each link is announced in VoiceOver as something like 'Link: Workflow name 60% complete'.

@beckyrother
Copy link

beckyrother commented Oct 2, 2019

If we need to remove the blue tooltip, let's add a secondary line to the button to indicate the percent complete and give a reason that the button is a progress bar.
image
Note the white 1px border between the gradient and the box background.
Gradient: #F0B200 to #D46256

Project app automation moved this from To do to Done Oct 7, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
Project app
  
Done
Development

Successfully merging a pull request may close this issue.

3 participants