Application Process Flow

All Processes App Process Flow

An application process flow is a high-level understanding of how people interact & behave with our applications or system based on the three defined types of processes. Below we will describe the different types of processes used commonly by people to interact and complete tasks within applications. At a low level the page ui designs and components designs will affect the type of process that is inherited from them. The type of process used will directly affect users behaviour and interactions with applications. Applications are based on a CRUD system whereby users can typically create, read, update and delete within a mobile & online desktop experience.

Types of Process

 

Cyclical Process

Cyclical App Process Flow

 

Examples

Feedback forms

Basic forms

Completing actions & tasks on one single page cyclically. A user stays on a single page actively cycling through form fields. One page with associated tasks. For more simplified & less complex designs use a cyclical process.

 

 

Linear Process

 

Linear App Process Flow

Examples

Wizards / E-commerce Checkout

Completing tasks in a linear process from one page to the next including (SPA) single page applications, wizards & step-by-step forms. A user moves from page to page actively completing tasks with multiple steps. Multiple pages with associated tasks. For a more complex design and larger scope of work use a linear process. The inclusion of visual indicators, step heading text and wizard steps can indicate to the person (using the application) how many and what steps there are to complete their goals. They should also know where they currently are, and where they’re going in future steps. It’s essentially a progress indicator of goals with both business objectives and peoples needs being met as easily and less painful as possible. Being able to go back and move forwards easily via the design is a good idea too. Outside of making mistakes (field level validation) people may want to go back to make changes after further thought and consideration. As Luke Wroblewski said “web forms suck!” (Web Form Design by Luke Wroblewski) and the form should be designed top to bottom, left to right (form level) with a clear path to completion. Luke Wroblewski suggests top aligned labels are generally preferred for making a form more readable and for efficient page scanning. This was validated by using eye-tracking tests. One day forms may never exist at all, let’s hope 🙂 (Auto-completed information, Apple Pay, PayPal, Stripe e.t.c.) Be wary of funnels, using funnel techniques and this type of manipulation. People are smart, if something isn’t right or doesn’t suite them, they can simply close the browser window/tab, be slightly aggravated and bounce or potentially never return (head to the competition). Forcing people to do something they don’t want to do or feel uncomfortable with, like a funnel technique along with other problems at the time of check out is a bad idea and can lead to loss of trust, business and a damaged reputation. If something isn’t right at checkout, or part way through the form filling process and the numbers don’t look good (quantitative stats) have a feedback form to assess issues or ask questions through holding interviews and potentially usability studies to ascertain what is causing the lack of completions, sign-ups or payments, presuming site traffic isn’t an issue.

 

 

Combined Process (Cyclical & Linear)

 

Cyclical and Linear App Process

Examples

Complex Apps

Taxation Applications (My Tax Australia)

 

Completing actions and tasks using both a cyclical and linear process. A user moves from page to page and/or tabs, external links while also completing multiple tasks on a single page. The user will move from a linear process to a cyclical process intermittently. Multiple pages with associated tasks. For highly complex designs and features use a combined process. By breaking complex tasks down into sections and pages that are manageable (in a step by step process) people are likely to be more effective and motivated to complete them. Look to have a save option of the users progress to enable them to come back & finish the tasks at a later time. This process assist people and the business to reach the desired goals or outcomes by reducing time, improving efficiencies, user experience & usability while making the tasks more manageable.

 


Simple interactions and a low level of cognitive load use a cyclical process. Complex interactions and intensive cognitive load look to a linear or combined process using content, instructions & design techniques (diagrams, infographics, charts, analytics, tooltips, explanations, block quotes, video & video tutorials, visual references, iconography, layout and symmetry, descriptive headers & text, animations or animated giffs,  more simplified/succinct language and simplified design, visual spacing & negative space e.t.c).

 

Seek to minimise extraneous cognitive load through functionally appropriate, yet simplified visual design and user interface design. Try to not over simplify, reduce functionality or content as complex tasks require continued load in the person completing the tasks in order for the information to be retained in memory and task successfully completed. It’s important for the person completing the tasks to build a mental schema and understanding even when facing difficult problems or questions. In some applications it’s as much a learning and education process (though various forms of design & content approaches) to better inform people as to what to do, rather than assuming people will automatically know or understand what is required to proceed.

 

Further Reading:

Cognitive Load Theory

Extraneous Cognitive Load

Intrinsic Cognitive load

Cognitive Offloading

Instructional Design

Working Memory

Long Term Memory

System Complexity (Relating to HCI)

Attention Aware Systems

Accessibility and impaired users

HCI relating to Mobility & Device Context

 

Google Scholar