I'm developing a task app that has a dashboard task list.
The user can change a task's status to done. What is the best solution for the done state?
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
Both of your ideas are good. Since both ideas are good, how can you decide in this case of one item in a list?
I find close calls much easier to make when designing for the worse case scenario. How do these two UX ideas compare with a long list; when there is a lot for the eyeball to read?
When glancing at a long list (below), which is quicker to interpret the DONE items and the NOT DONE items? I would vote for the Strikethru Design over the Green box design.
The Green Box solution has an annoying fault of white space in between long and short answers. My eyeball bounces around like a tennis match when trying to align the words with the green box. And this bouncing around adds wasted time when reading a list. Hence, wasted time is bad UX.
I agree with @jhurley and @Stefano's answers, but let me add a different angle:
Going back to first principles--what is the user's context and what task are they trying to accomplish?
I'll use my own experience to illustrate, since I don't know who you're designing for. Loosely ranked by frequency of use, these are my personal scenarios:
I have discretionary time and am looking for a task to take on.I want to quickly review all my options and make a selection.
I have completed a task and want to update my list.
I want to review what I have completed and get a sense of my accomplishment, as well as trigger any additional next actions.
I want to revive a task that was marked completed earlier (either because it was checked off accidentally, or I want to use it for a slightly different task).
For each of the above tasks, I want to separate DONE from not-DONE tasks. I've seen several implementations of this separation:
a) spatially separate them (usually not-DONE on top, DONE tasks below)
b) check mark in front of DONE tasks (and blank checkbox in front of non-DONE tasks)
c) strikethrough the task title for DONE tasks
d) filter / toggle whether
ALMOST EVERY task manager implement (b) and (c). (e.g. Wunderlist, 2Do, Toodledo, Asana). SOME implement (a), and (d). I consider (d) a more advanced feature, and whether you do (a) depends on how important it is to preserve list order.
To answer your specific question, the only advantage I see of a label vs. strikethrough is a slight increase in readability.
The advantages of strikethrough design:
As @Schwood suggested, Google Keep could be a really good source of inspiration:
Completed actions are automatically grouped, so the user won't need to group them.
There is no vibrant label close to the text, and the strikethrough text-decoration reinforces the concept of "Completed/Done" action. Otherwise, if you want to emphasize completed actions, you could fade out a little bit the actions that still has to be completed.
Take a little time thinking about the meaning of the list of completed actions for your users: do you really need to show all the actions, and preserve their order (mixing actions with different statuses)?
For example, in the backlog view of Jira, completed tasks are completely hidden.