With a tight development deadline, we delivered and won! Our idea? We leveraged generative AI to create user stories in Jira.
We narrowed it down to creating user stories but this time leveraging generative AI to do so. My sister, a tech lead, often found herself drafting tickets when her product manager was busy, and I, as a product designer, had walked a similar path. We understood all too well the complexity involved in crafting user stories and adding acceptance criteria.
In those highly regulated industries, documentation was the queen bee, and we'd seen enough paperwork to rival the Library of Congress. Our team had spent more time documenting than a detective in a never-ending crime novel. It was like watching an action movie where the heroes save the day by filing paperwork.
Now, why do we need these user stories to be as detailed? Because it's like the secret sauce to make our process sail smooth. Without it, our project would move slow. So, we're basically writing the superhero script that saves the day, one user story at a time.
Flow & Wireframe
We encountered bugs and limitations as we worked on this together. We had to use Atlassian's Forge API and a limited design component library.
Because of the time constraint, we knew that there will be some things we'd have to cut out, or it would be too much to do.
Some of the changes and constraints we faced in the development of this project:
Development Factors -
- Limited amount of time.
- We started on October 21, 2023
- API are free but with limitations
- Cost of API calls over a limit concerns
- Limited Forge capabilities
Design Factors
- Design constraints
- User experience concerns
We know that an ideal AI experience that is native to Atlassian would be ideal, however, that's not the case, as we are outsiders and have to leverage their Forge API.
Tools we used to communicate
- Facebook Messenger
- Google Hangouts
- Loom (to do async videos) - we are in different time zones.
After much brainstorming and deliberation, we zeroed in on a solution. Our chosen mission: to unlock the potential of Jira and AI, crafting user stories from the issue's title or summary.
Jenearly wanted to include a Figma Preview for attachments (it was something we worked on previously for another Atlassian project).
The path ahead presented a lot of choices, a debate between a modal approach and an inline solution came up.
In the face of some tricky modal issues, we embraced the simplicity of an inline solution. It made perfect sense. Onward we go.
For the user, after a ticket is created, there is a title or summary created. We figured this idea would help be the text to go into the prompt.
To generate a user story, a user, can click on ‘Magic Stories’ and launch the app by generating a prompt from the description as seen. Once it’s added, you review and add it to the description. Refresh and it's there.
You can even go back to edit your description at anytime.
This took many quick iterations. We haven't user tested it. If we had more time we would have done this.
Sure, our creation might have a few usability quirks, but hey, it's like building a spaceship with a few extra buttons – it might not look pretty, but it's going to get us to the moon! It's our MVP.
To kickstart our project, we leveraged Figjam for initial brainstorming. Subsequently, we transitioned to Figma to gain a comprehensive understanding of the user experience.
For the foundation of our app, we sought the following essentials:
An integrated development environment (IDE): We opted for VS Code. To collaborate effectively with the Atlassian Forge CLI, we required the following tools: Docker Desktop Node Git GitHub Virtual Machine (VM) enabled.
As we commenced app development, we identified the following critical dependencies and elucidated their significance:
@forge/api fetch: Vital for making API calls to Figma and Ai21. storage: Necessary for securely storing API keys, should users choose to do so. @forge/ui The cornerstone of our app's user interface, encompassing everything from buttons to modals.
In terms of our API interactions:
The core functionality of our app relies on Ai21. We simply send a prompt text to their API, and in response, receive AI-generated text precisely tailored to our request. An intriguing feature involves interfacing with Figma. If a user incorporates a Figma link in their prompt, our custom listener seamlessly processes it through Figma's API, creating a dedicated section for it.
Honestly, this was one of the most fun project we got a chance to collaborate on, where we had fun using AI in mostly everything we did. It wasn't just limited to our app, but in how we created a theme out of it in our design and content.
Even our headshots were AI generated. Our team name was AI generated.
We know AI is the future. Somehow while balancing the life we have, we managed to make an app, raise our kids, create content, bond and have fun.
This funfest was so good that we've decided to turn it into a yearly tradition. In fact, we've got our sights set on another hackathon! Two in a year? You better believe it!
We're like tech-savvy superheroes, always growing, and learning new tricks, and not even having a family can slow us down. We've become the Jedi masters of time management, and that's why we rock the 5AM wake-up call – it's the secret sauce to our superpowers.
- Improved user experience in Jira
- Ability to do more than user stories and incoproateinto Confluence deveraging Open AI's ChatGPT.
Atlassian for hosting the Codegeist Unleashed HackathonJason Fukura, CUA for your wireframe kit wireframe kitFigma for allowing us to jam and create our workCapCut for being an awesome free app I could use to edit my videosChatGPT this wouldn't have ever been possible if it weren't for you
If you like what you see and want to work together, get in touch!
yenith.jirsa@gmail.com