--
JIRA Mobile
JIRA is the world’s leading issue tracking tool for software teams, used by teams at NASA, Tesla, Adobe, Disney, eBay and many more.
In 2015, I worked with a small team at Atlassian to design and build what we believed would be the right mobile companion to this massive beast of a software.
My role
As the Lead Designer for this new product, my job was essentially to kickstart the project by understanding and articulating the product’s “raison d’être”. This involved :
Research
Doing continuous user research, both quantitative and qualitative, through surveys, feedback and data analysis, user interviews and concept testing sessions.
Ideation
Facilitating lots of workshops to build consensus among the team and help us come up with a collective vision for the product.
Storytelling
Using storyboards to craft a story we could all believe in and that would help us share our vision with all stakeholders.
Product architecture
Producing diagrams and prototypes of all sorts to define the product’s architecture and interaction model, from the conceptual frameworks to the finer interactions.
Visual direction
Last but not least, I paired with a visual designer to help him shape the visual language of Atlassian’s new generation of mobile apps.
Our approach
Designing JIRA Mobile was by far the most challenging project I ever worked on.
JIRA is a massive beast of a software, used by millions of people in myriads of different ways, across dozens of industries.
It was always very obvious mobile support was lacking, but getting to clearly articulate why, what role a mobile app would play and what value it would bring both to the business and to users, turned out to be very hard. So much that at one point we went through a hard reboot. We dumped everything and re-started (almost) from scratch, making sure we had answers to the fundamental questions first.
What were we trying to design? What purposes did we believe a JIRA Mobile app serve, not only in terms of features, but why should it even exist?
Considering Atlassian’s mission to “Unleash the potential in every team”, we landed on the following question to be the fundamental one a JIRA Mobile app should be answering :
What can I do now to help my team?
This simple question actually captured what we had initially identified as primary user intents: what do I need to work on? How is my team progressing? What requires my attention?
But the question is no longer about what the user wants to do, but on what he or she needs to know at a given moment.
This lead us to work on a model where relevant information would bubble up to the user, through the simplest UI we could think of, with a simple vertical list of actionable cards, ordered by relevancy and “actionability”.
The models
Once we had decided to pursue the cards concept outlined above, I worked to properly design both the conceptual and interaction models for our cards list. I defined the list’s in- and outputs, the cards’ architecture and started documenting the interaction model both through animated prototypes and flow diagrams, iteratively progressing towards higher fidelity.
Iterating towards 1.0
While I didn’t produce the visual design for the app, one of my responsibilities as the product’s Lead designer was to pair up and provide guidance to a visual designer, to help him come up with a visual proposition that not only looked great but also balanced the app’s own forward-looking personality with the Atlassian brand and design guidelines, the legacy JIRA product identity as well as native platform conventions. This involved close collaboration between ourselves but also with the wider product team and quite a few stakeholders across the company.
Given the app hasn’t been released yet, it’s obviously hard to come to any conclusion on whether the approach we took was successful, but we can at least say we managed to get global buy-in and support across the company, from developers to the CEO, which by itself is no small feat and something we can be proud of, given JIRA’s massive legacy, footprint and flagship product status.
