Beautiful Roadmaps

Build beautiful roadmaps in seconds!
Simply drag and drop your issues.
Comes with a large selection of templates.

Inspiration

Many companies use highly customizable roadmap planning tools with a ton of features. They sometimes even include Gantt charts and resource planning.

However, using those tools comes with a drawback for many use cases: Getting a quick overview about a not yet known project becomes incredibly difficult. That is why Beautiful Roadmaps was born. With Beautiful Roadmaps it is super easy to create beautifully designed roadmaps which make it easy to grasp a quick overview of a project roadmap and its current standing.

From a Kanban board to a designed roadmap: It is not even minutes, it is seconds.

What it does

You can create a roadmap by first selecting a designed background for your roadmap.
Afterwards, you can select Jira issues from your boards by selecting them from the sidebar and the already displayed issues, or by searching for specific issues from the sidebar. Then you can simply drag and drop the issues on the position of the roadmap where you want them to appear. Done is your beautiful roadmap.

How we built it

We developed this app as a team of three people, a full-stack software engineer, a designer and a junior developer. We used the Forge platform to build this app to outsource security issues and focus on the core value proposition of the app. We added a global page which holds the roadmap and made it possible for the user to export the roadmap as a pdf. The implementation is done using React with TypeScript and Forge and Atlaskit components. The build is done using Vite and the styling is generated with UnoCSS.

Challenges we ran into

It was quite a challenge to get the feature of exporting an image or PDF from the roadmap to work without exporting the whole screen with the main navigation as well.

Accomplishments that we're proud of

We created a simplistic but also really beautiful roadmap which is user friendly and easy to use. The positioning of Jira issues on the roadmap and therefore the conceptualizing of the roadmap is super intuitive. We are proud that the app is ready to be published and can be used by Jira users and customers. Therefore we submitted our app to the Atlassian marketplace.

What we learned

During the process we learned a lot about the Forge platform, the Atlassian cloud and its advantages. Furthermore, we learned how we could effectively use UnoCSS and Vite in a Forge project. Another takeaway was how we could generate code from OpenAPI specs for the Jira Cloud.

What's next for Beautiful roadmaps

We already have some features planned: We want to bring more design templates so users have a larger variety to choose from. Furthermore, we want to make it possible that users can customize the color designs and change them to their own. We want to add a feature to automatically layout issues so that users don't have to do this by themselves. Another automatisation feature we want to include is the automatic roadmap generation from a JQL query. Last but not least, we want to give users the possibility to add text onto the roadmap for additional comments. We would love to hear feedback from users. We will decide on further steps depending on the feedback we receive.