1

I'm developing a very complex wizard-style application similar to tax preparation software. The user is guided through many screens, each asking for some piece of data. Different answers lead the user down potentially different paths and there are dozens of screens they will ultimately see.

This project started small so I hard-coded the "next" and "previous" steps based on answers on the current screen, but it has quickly become obvious that this strategy will not scale. I'm sure I can come up with some sort of solution on my own, but I'm sure there are known patterns and best practices for this sort of problem. I've done some googling for such a pattern without success so far. Can anyone give me some insight into a good solution to this sort of problem?

For context, my UI is Angular 2 and my back-end is C# Web API.

3

Our REST API responses contain the information needed to display the correct links or buttons, based on the state of the workflow activity at the moment the page is requested. Instead of hard-coding the links/buttons, they are dynamically generated based on information in the SQL Server database.

HATEOAS has this concept baked in. With HATEOAS, a REST client enters a REST application through a simple fixed URL. All future actions the client may take are discovered within resource representations returned from the server.

  • How good does this work with internationalisation? – Jimmy T. Mar 29 '17 at 17:01
  • 2
    @JimmyT. Internationalization is an orthogonal concern, for the most part. However, in our system it's easy enough to stand up a country-specific workflow. – Robert Harvey Mar 29 '17 at 17:22
  • 1
    This is a good answer, but before starting the implementation, it is good to visually map out the screens, and how the user can transition from one to the other (i.e. do a bit of planning for the UI and state machine). – Frank Hileman Mar 30 '17 at 0:21
1

Since I come from a Java background I am suggesting a tool called Spring Web Flow which can be used as a basis on understanding your problem. Webflow provides what is called a guided navigation in your application and basically breaks your flow into what are called states. So a state can be considered to be a view and based on the user event it can be guided into a different navigation or state. A look into a tutorial on the same would help in understanding the concept to gain more clarity on your problem.

1

Whenever I had a complex UI workflow, I tried to define a FSM underneath that would drive the whole thing. That way, you have predictability and you can make it pretty much immune to errors, since you simply ignore any events that are not predicted by the current state. I would suggest you try something like that.

In cases where I needed to implement the FSM, I used State Pattern or Visitor Pattern. State pattern is better if you have limited number of events, but number of states can change. Visitor pattern is better if you have limited number of states, but number of events can change.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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