Here’s the Team

RML Model: User Interface Flow

I recently needed to show how the pages of a log-in process interacted. I started writing a process flow, then switched to a system flow, but in both cases was fighting the model—I wanted to show both what the user was doing and the system decisions. I also wanted to make it clear which pages were used when logging in. Then I remembered the User Interface Flow. It worked like a champ, conveying all the information I wanted to convey really well.

A User Interface Flow shows the pages of interest for a user interface (UI), the navigation between the pages, and the underling system decisions that impact navigation, using these symbols:

Here’s a partial example for a log in process:

Like most models, this one gives you leeway. I’ve chosen to analyze the pages and interactions of interest to me. For example, every page might have “contact us” and “privacy policy” page links. Showing those interactions for every page would obscure the information I’m trying to convey. Also, I’ve labeled all of the UI triggers. That’s a choice you can make—if the trigger is obvious you don’t have to label the line. I could have left off the “Select Forgot Password” label; some might even argue that all of the triggers are obvious. But, since my example is fairly simple and adding them didn’t cause undue clutter, I chose to include them to maximize reader understanding.

Notice that the decision shape is used only to describe system decisions. The fact that the user can make different decisions about what to do on the log-in page is shown by different interaction choices coming out of the page. When applicable, you can create decision trees or tables to further analyze and explain the system decision.

If you’re trying to model a UI with a process or system flow and feel it just isn’t working, the User Interface Flow just might be the answer for you.

About Joyce Grapes

Hi, my name is Joyce Grapes and I’m a business architect here at Seilevel.

I fit the saying “I wasn’t born in Texas, but I got here as quick as I could”, coming to Austin to attend the University of Texas and then sticking. I’m a math major who’s first professional job was programming and, since it was a small shop, also testing and writing system specifications. I switched to a business analysis focus about 10 years ago when I joined Seilevel.

I like creating software, and I like being efficient, so I really enjoy business analysis/product management, which, if you take a step back, is about maximizing your development efficiency. On the blog, you’ll see a lot of quick tips from me.

No comments yet.

Your email address will not be published. Required fields are marked *

Comment

We take care to protect your email and other information in the same way we would want our own personal information protected. At any time you can manage your subscription by clicking on the email preferences link at the footer of our emails. I agree to Seilevel’s Privacy Policy*

Newsletter Subscription

Interested in learning more? Sign up for our monthly newsletter below to get more details such as featured articles, upcoming training and webinars, free resources, and best practice advice from our experts.