33

My team has been "tasked" to create an application that follows the task-based UI (not necessarily with CQRS). I really like a UI that helps the user accomplish common tasks easily, but many pieces of this application really "feel" (to me) like a job for a typical CRUD interface (ex: all the details for a product in a catalog).

At this point, we need examples of good task-based UIs to help us see what is possible. What have you seen in the interwebs?

1
  • Migrate to UX.SE
    – clickbait
    Aug 22, 2018 at 23:36

5 Answers 5

31

The easiest way to generate a task based UI is to protect all attributes/properties of your models. i.e. remove all setters.

From this (pseudo code):

public class TodoTask
{
    public Date getDateAssigned();
    public void setDateAssigned(Date);
    public string getAssignedTo();
    public void setAssignedTo(string);
}

to this:

public class TodoTask
{
    public Date getDateAssigned();
    public string getAssignedTo();

    public void AssignTo(string userId);
}

You can't create a basic CRUD app anymore. You have to perform a task (Assign()) to update the model.

Start by removing all setters and then analyze what kind of actions (task) you should be able to do on each model.

Then you're all set.

I've blogged about it: http://blog.gauffin.org/2012/06/protect-your-data/ (scroll to the bottom to see mockups for CRUD vs Task based)

6
  • +1 and good article, though some people miss the point of your article in the comments; that's inevitable. Question: Even with this approach, at some point we need to update the db record to set the AssignedTo and AssignedOn fields, so is that not U from CRUD? I totally agree we should move the update and put it close to the db and not allow this from the UI or domain model, but I ask because I always thought that even with this approach it is called a CRUD. My understanding of CRUD is at some point you do one of those operations on the entity or many entities, is my understanding wrong? Oct 14, 2018 at 21:46
  • I have always thought non CRUD apps are those apps which just don't deal with a db. For example, an application which compresses files. Oct 14, 2018 at 21:48
  • 2
    You are absolutely right. CRUD is CReateUpdateDelete, the basic operations when using databases. You need to use those. What I was talking about was applications that where designed to wrap CRUD. That is, no enforcement of business rules but let the user store whatever they want directly in the database. With business entities (enforce rules) you still have to use CRUD, but that's hidden in the DB layer and not exposed in the application.
    – jgauffin
    Oct 15, 2018 at 6:40
  • 1
    So "CRUD applications" = Applications that require that the users enforce the business rules. Task based applications = Fields are protected and the methods make sure that all data entered by the user follows the business rules.
    – jgauffin
    Oct 15, 2018 at 6:43
  • 1
    Questions 2: That's right. The fields should not be editable by the user, but it's perfectly fine to display them in labels.
    – jgauffin
    Oct 15, 2018 at 6:43
26

I think this would qualify as a Task Based UI. Windows Control Panel

5
  • 2
    Looks like a glorified menu to me. What am I missing? Jan 26, 2015 at 9:27
  • 9
    @Muzietto: A menu is a user control (like a text box). Task based UI (as I understand it) is an approach that is centered around tasks that a user needs to accomplish, as oppose to CRUD form that is geared toward editing data. One can call the screenshot a glorified menu, but I'm not sure the downvote is justified.
    – Dmitry
    Jan 27, 2015 at 2:52
  • 1
    OK, I see what you mean. That's the explanation I missed. Jan 27, 2015 at 13:47
  • 3
    This is one of the most difficult to use (glorified) menus I know of - I never find what I want, always have to search, which never returns anything close to the right option, and then I end up having to Google up a screenshot-by-screenshot tutorial instead. :)
    – conny
    Jun 30, 2015 at 3:01
  • 2
    One of the best explanations of task-based UI vs CRUD is at kylecordes.com/2014/task-based-user-interfaces - "Change of Address Example" section. It illustrates value behind the TB-UI approach - from there, I think it's easier to figure out UI design which achieves those goals.
    – Leo
    Feb 23, 2018 at 1:56
13

CRUD Interfaces

CRUD interfaces have a "Save" button when editing and you miss the "reason" why something changes.

For example changing the address of a customer from "Fountain St. 55" into "Birds St. 444" has the very same semantics than changing it from "Fountain St. 55" into "Fountain St. 555". Just "updated" the street.

Task-based Interfaces

Task-based interfaces have "Action buttons" that "mean" something of the business.

For example you could have a "Correct Address" button to signify that you are changing the address because it contained a typo and the address in fact "conceptually" is the same, only that now it reads correctly. In this case the customer did not physically move.

And then you could have another different action like "Move Customer to a new address" that means that the customer actually moved to a new place and the address change carries all that meaning.

So... in short

In CRUD UIs => You "edit data".

In Task-Based UIs => You "signal that business things happened".

Conclusion

The second is always more powerful, although is harder to think in advance and the system must be flexible to add, carry and convey new "meanings" as they are discovered during the business operation itself.

But you get a huge benefit: Know "why" things mutate. In other words... capture the user's intent.

1
  • 1
    I like your comparison. It clarifies the difference between CRUD and Task Based UI
    – arn-arn
    Apr 25, 2020 at 19:52
10

Microsoft Money 2000 was an example by Microsoft (although they call it Inductive User Interface. Here are the underlying guidelines and a few screenshots along the way: Microsoft Inductive User Interface Guidelines

0
1

I guess I don't really think of UI's having an appearance of being task-based or CRUD-based (although Dmitry's example is one that does demonstrates being task-based -- lots of commands). I see a task-based UI more in terms of how it interacts with the underlying domain and data model. If your interaction is nothing more than a typical out-of-the-box MVC application with action methods for Get/List/Insert/Update/Delete, then you're building a basic CRUD application. But if your forego those default action methods and create actions/commands that are meaningful to the application (e.g. add item to shopping cart, deactivate a class, etc.), then this gets more into the task-based UI world.

I do think it's a pretty gray line between the two.

As for an example, I know that a site that I work on (braincredits.com) is my attempt at a task-based UI. It's definitely a work in progress and I'm making changes to it to constantly improve it, but the implementation is command-based (e.g. post to transcript, add lesson, view transcript, etc.) and parts of it do use the CQRS pattern.

I hope this helps! Good luck!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.