SF Hackathon Unwrapped

A 4-day sprint focused on Digital Product Design, with an exciting blend of the AI technologies Chat

Sep 25, 2023



min read

A hackathon is a time-limited event where teams collaborate intensively to create a working prototype or solution for a specific problem or challenge.

Hackathons are, time-bound events where we come together and collaborate intensively to solve problems, innovate, and push the boundaries of what's possible. They serve as a vessel for creativity, a space where ideas are not just born but also executed. At Spinning Fox, we engage in hackathons to accelerate our learning, foster team collaboration, and bring our most audacious ideas to life.

This particular hackathon was a 4-day sprint focused on Digital Product Design, with an exciting blend of the AI technologies Chat GPT and Midjourney at its core. The goal? To create an MVP that marries the two together.

You can watch the full video recap here:

Give the working prototype a try

Get creative with our AI-powered storytelling app; Spinning Stories.

Here’s what happened

The team

4 days • 3 Designers • 2 Developers

Day 1: Ideation ignition

We kicked off with a virtual gathering on Zoom, where we reviewed three briefs and weighed their potential for innovation. A democratic Miro poll helped us choose the winning blend of Chat GPT and Midjourney, setting the stage for an AI-powered journey. Ideas were bounced around as we discussed a wide range of concepts that this combination of AI services could be used for — and we swiftly moved on to building user flows as the vision started to take shape.

The aim: To create a storytelling app, with captivating visuals - all generated on the fly.

Day 2: Wireframe wonderland

Day 2 was all about integration and design. While the developers wrestled with tool integrations, the rest of us delved into wireframing and designing effective prompt templates. We ended the day with a partial win—successful integration with Chat GPT and Midjourney’s Discord bot, but unable to programmatically write prompts for Midjourney.

Introducing Spinning Stories:Amidst our productive endeavours, we also gave birth to our product's name - Spinning Stories! A name that perfectly captures the essence of what we're creating - captivating narratives brought to life by AI.

Day 3: Overcoming obstacles, embracing alternatives

So we hit a snag with Midjourney's restricted external access but quickly pivoted to an alternative— Dall-E. This proved to be a fortuitous choice, though not as advanced as Midjourney, it fulfilled our proof-of-concept needs brilliantly.

In the background, the design team pressed on with UI designs with a North Star approach to creating a clickable prototype, which would sit alongside a working Proof-of-Concept.

Day 4: The final polish

Even on the final day, we weren’t lacking ambition — we integrated Voice AI allowing users to enjoy stories generated by Chat GPT read out in a celebrity voice. The design team added the finishing touches (and animations!) to the prototype, and by day's end, our MVP was born—complete with Chat GPT-generated stories, Dall-E visuals, and celebrity voiceovers.

Final thoughts: Lessons from the journey

This hackathon was a rollercoaster of highs and lows, but through it all, we learned the value of adaptability, collaboration, and swift decision-making. We discovered that sometimes the alternative route can be the more rewarding one — don’t be afraid to pivot.

In just four days, we turned an ambitious idea into a tangible product, and that's something we're all incredibly proud of.

And here it is get creative with our AI-powered storytelling app; Spinning Stories.

the author

Matt Boyle

Sr. Product Designer

Matt is a Product Designer with an eclectic skillset centred around creative problem solving. His design thinking is driven by empathy and clarity to design stand out digital experiences. With a background working as part of in-house digital teams and for agencies; he’s helped startups, brands and corporations to launch and transform their digital presence.