Aaron's Design Artifacts: Flows n' Stuff

Hi there!

In this post I’m talking about and showing some of the many flow charts I made during my time at Vreal. I’ll preface by saying this list can and will change depending on future personal, team and project needs. Also, there are different types of flow charts one can use. I’ve also seen some confusion in labeling flow charts. The charts I’ve used the most are Task Flows

Flow charts are one of the great starting points for me when designing new features, laying out an app, etc. If I join a project and no flows have been created yet then I’ll create some, even if it’s for my personal use as it helps me understand the feature or system in its current implementation.

Flow charts are also not limited to just software experiences given their goal is providing a high-level, clear road map that focuses purely on functionality. They are also useful as I can send a chart out to team members for feedback and ensure everyone is in sync before moving forward. It allows folks to focus on the functionality and not be distracted by visual elements.

Being a very visual person flows are extremely helpful in providing a holistic view of how a user will interact with a feature or the different steps needed to achieve a goal. Seeing a road map of sorts that lays out the various paths and choices a user can take allows me to quickly ideate, get feedback and optimize before getting started with wireframing. As a project changes over development I’ll keep my flows updated as well.

Below are a few Task Flow examples I made while at Vreal.

Publish Content Flow

The first is a Task Flow I created to show the three different paths relating to a user publishing content on the Vreal desktop app.

Purchase Avatar Flow

This Task Flow was created to showcase a possible path for a user to purchase and equip custom avatars.

account creation flow

The last task flow was made when we were going to require users to log into Vreal. We considered three possible options; create a Vreal account or log in with your Steam or Facebook account. Registering your email and creating a Vreal account was the P0 option.

vreal desktop app flow

This is a snapshot of the Vreal Desktop App in it’s entirety (minus the various error states). I lost the exact date of creation. It shows people needing to be whitelisted before they could record content though so it’s definitely after the first redesign.