How Avion Brings User Story Mapping To Product Teams using Meteor

The Avion team has built an elegant, effective web-based tool for remote teams to Post-It virtually.

When you think of user story mapping, you probably envision a group of developers staring at a whiteboard with colorful Post-Its, lined up in neat rows.

User story mapping helps teams to plan a product and its features from the perspective of their customers and users.

Post-Its define actions the user can take (aka user stories) within the context of a product’s core user journeys. So, for example, core user journeys on YouTube include watching a video, posting a video, searching for content, and reporting videos.

Under each core journey, teams then add Post-It notes to better visualize the steps that their users will need to take. This helps teams identify what they need to work on next and how to build it, whilst also constructing a birds-eye view of the whole product backlog.

So, with the help of the Meteor framework, Avion built a digital version of this process, enabling remote teams to collaborate around a user story map.

Avion — User Story Mapping For Product Teams

At its core, Avion is a tool that enables product teams to build, plan, and prioritize their backlogs better, using the technique outlined above — user story mapping.

Its co-founders, Tim Ramage and James Sear, wanted to bring the traditionally offline experience to the web in a modern and collaborative interface. And since they’re both experienced engineers, having worked in agile teams ranging from startups to global enterprise, they knew that the two most crucial elements to get right were user experience and third-party integrations.

Two years after launching, Avion is a tool that hundreds of product teams around the world now rely on to plan, build and collaborate around their backlogs.

What You Can Do With Avion

Avion helps teams:

Focus on their users

In Avion, user stories can only be defined inside user journeys and steps, which forces product teams to think about their end-users when writing features and user stories.

Translate designs into actionable releases

Avion provides an environment that is perfect for taking a set of wireframes or visual designs and translating them into user stories. From there, teams can build up horizontal “slices” that make up a set of deliverable releases.

Prioritize and challenge releases

The story map is a perfect place for conversations around the priority of releases and features. It encourages teams to be more lean and ask questions like “is this release as focused as it can be?”. As Jeff Patton says — Minimize output, and maximize outcome and impact.

Synchronize planned releases with other backlog tools

Once the hard planning work has been done in Avion, releases can be pushed to more development-focused backlog tools, like Jira or Trello. Avion will then keep stories synced up in the background, giving the team context wherever they are working.

Why Avion Chose Meteor

An early version of Avion was built using a framework called FeathersJS. Though the Avion team enjoyed some elements of Feathers, there were also some frustrating restrictions of the framework at the time, such as filtering and manipulating published data to connected clients.

As the dissatisfaction grew whilst building an MVP, Avion co-founder Tim — who had some previous experience working with Meteor — suggested that they make the switch. And they haven’t looked back since!

“Meteor gave us the ability to create a fully real-time application with absolute ease”

If you want to build a real-time application that has connected clients using websockets, there really aren’t many other frameworks that will cater for this need. As is often done, comparing Meteor to frameworks like Next and Gatsby — is like comparing Apples to Oranges — these frameworks do completely different things. Meteor gave us the ability to create a fully real-time application with absolute ease. Avion also proves that Meteor is not just a tool for building prototypes; we are live and have not struggled to scale at all.

Finally, the fact the Meteor is just a Node app under the hood gives us so much peace of mind that we can always just write custom functionality and hook into the Meteor app. We have recently done this by delivering multi-tenanted SSO, all whilst using Meteor’s core authentication system.

Avion’s Tech Stack

The Avion team insisted on a real-time web application. They wanted users to see updates without ever having to click Refresh, giving them that same collaborative experience and real-time feel of moving Post-Its around on a wall.

However, since both founders were JavaScript developers, they realized that they didn’t have many real-time framework options. And, they didn’t have time to build a customized framework and a startup simultaneously.

Meteor was very attractive in this respect because it’s an open-source framework for seamlessly building and deploying web, mobile, and desktop applications in JavaScript. Meteor enabled the Avion team to focus on the experience, without having to worry about managing complex technical aspects like websockets.

A Consistent Front and Back-End Infrastructure

As Meteor automatically syncs the data between the front and back-end, Avion’s stack is very simple. They only decouple aspects of the Meteor application where it makes sense, using core AWS services, such as Lambda functions, SQS queues and SNS emailing.

Data and rendering performance is absolutely critical for the Avion application since it has an almost canvas-like DOM setup. The screen can become very wide and very tall with many DOM nodes. To contend with this, The Avion team takes advantage of a custom setup to consume Meteor publications in their React app, which leverages MobX for super fast state diffing and data management.

Current Challenges and Future Goals for Avion

2020 was an amazing year of growth for Avion, which ended with them securing a seed round of investment from Haatch Ventures, who work with Marvel and Poplar.

Current Tech Challenge — Scale, Scale, Scale!

Avion offers tight two-way integrations with backlog tools like Jira, Trello, and GitHub. But due to the nature of their integrations, the Avion application can receive thousands of updates per second, that their system needs to queue and deal with. The Avion team is working hard to ensure their infrastructure can continue to scale up and handle this level of traffic.

What’s Next for Avion

Over 2021, the Avion team is looking to build out their platform to offer more value to product teams, including road mapping and alternative prioritization techniques.

Commercially, the Avion team wants to encourage more product teams to try user story mapping to drive their backlog in 2021. If teams are searching for an intuitive, user-focused, lean way to plan their release roadmap, they’d be wise to give Avion a try.

Want to give Meteor a try for your business? Click here to install and find out how it will fit your business! Interested in hosting with us? Check out Meteor Cloud for all of your hosting and app monitoring needs.

Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.