Mystery Movie – lights, camera, AIction!
For Cogapp’s 24th hackday there was one rule and one rule only – make something with AI. In other words: “The first rule of the Cogapp hack day is: you must make something with AI. The second rule of the Cogapp hack day is: you MUST make something with AI!”, said in the voice of Tyler Durden in Fight Club.
Having had very limited interaction with AI up to this point, I was a bit Clueless and apprehensive about this rule, it felt like Mission Impossible (see what I did there?). Being unfamiliar with AI tools, I didn’t know what their capabilities were, but this was the perfect opportunity to dip my toes into the AI water.
After lots of back and forth and reading various articles, I eventually had a plan! I was going to make a Mystery Movie game. The idea was to make a simple UI with a “Play Now” button, which used AI to generate three images based on the beginning, middle and end of the plot of a random movie. The user could then try to guess the movie title behind the scenes.
I decided to use Next.js, which I’d never used before, so I incorporated AI into my project in yet another capacity – by relying heavily on ChatGPT to help me write the code. I asked ChatGPT lots of questions throughout the day and with some refinement I pieced together various code snippets in a Frankenstein-esque manner (okay, I’ll stop now). This was an interesting way of working given the AI theme of the hack day, and with lots of hand holding, I ended up learning a lot about Next.js in a short amount of time.
Once I’d decided to use Next.js, the first thing I needed was an API to get the plot of a movie, which could then be split into three sentences. I did some Googling and decided to use The Open Movie Database, as it was simple to use and provided the option of a short or full movie summary. It was exactly what I needed: it was like The Sound Of Music to my ears (I’m out of control)!
The output of the API call was very comprehensive, giving me the movie rating, information about awards, and even a link to a movie poster. But the only thing I was interested in was the plot. I started off by hard coding the movie title, and would work on randomising it once I’d connected all of the dots.
Here’s the response from the OMDb API call for the movie Alien:
{
Title: 'Alien',
Year: '1979',
Rated: 'R',
Released: '22 Jun 1979',
Runtime: '117 min',
Genre: 'Horror, Sci-Fi',
Director: 'Ridley Scott',
Writer: "Dan O'Bannon, Ronald Shusett",
Actors: 'Sigourney Weaver, Tom Skerritt, John Hurt',
Plot: `In the distant future, the crew of the commercial
spaceship Nostromo are on their way home when they pick
up a distress call from a distant moon. The crew are under
obligation to investigate and the spaceship descends on the
moon afterwards. After a rough landing, three crew members
leave the spaceship to explore the area on the moon. At the
same time as they discover a hive colony of some unknown creature,
the ship's computer deciphers the message to be a warning, not a
distress call. When one of the eggs is disturbed, the crew realizes
that they are not alone on the spaceship and they must deal with the
consequences.`,
Language: 'English',
Country: 'United Kingdom, United States',
Awards: 'Won 1 Oscar. 18 wins & 22 nominations total',
Poster: 'https://m.media-amazon.com/images/M/MV5BOGQzZTBjMjQtOTVmMS00NGE5LWEyYmMtOGQ1ZGZjNmRkYjFhXkEyXkFqcGdeQXVyMjUzOTY1NTc@._V1_SX300.jpg',
Ratings: [
{ Source: 'Internet Movie Database', Value: '8.5/10' },
{ Source: 'Rotten Tomatoes', Value: '98%' },
{ Source: 'Metacritic', Value: '89/100' }
],
Metascore: '89',
imdbRating: '8.5',
imdbVotes: '904,074',
imdbID: 'tt0078748',
Type: 'movie',
DVD: '01 Jun 1999',
BoxOffice: '$81,900,459',
Production: 'N/A',
Website: 'N/A',
Response: 'True'
}With the movie plot in hand, I added this to the moviePlot variable and used the OpenAI API to send the following prompt to ChatGPT:
“Please split the following movie plot into 3 short sentences. 1 sentence should explain the beginning of the movie, 1 should explain the middle and 1 should explain the end.
Movie plot: ${moviePlot}”
Like a true AI maestro, ChatGPT promptly delivered the requested sentences. Here’s what I was given for Alien (#spoileralert):
- “In the distant future, the crew of the commercial spaceship Nostromo receive a distress call from a distant moon and decide to investigate, even though their journey back home was almost complete.”
- “After a rough landing on the moon, three crew members explore the area and stumble upon a hive colony of an unknown creature, just as the ship’s computer deciphers the message to be a warning rather than a distress call.”
- “When one of the eggs in the hive colony is disturbed, the crew realizes they are not alone on the spaceship and must confront the terrifying consequences of their investigation.”
I was getting close to reaching my Final Destination (last one, I promise). The last piece of the puzzle was sending off the three sentences as prompts to an AI image generator. As I was already using the OpenAI API, this seemed like the easiest option.
I was quite impressed with the results, although some movies produced better images than others. The images produced for Alien were quite good and managed to incorporate some of the key details from the sentences:
Here are some of the other more successful results:
At this stage, I was still hard coding the movie title each time, so the final step was to produce a random result. Sadly, the OMDb API doesn’t allow you to return a random movie as the title is a required field, so instead I manually chose some famous films and added them to an array. I then used the array to randomly select one of the movie titles each time the button is pressed.
It was a really fun project to work on, and it would be interesting to continue playing around with the parameters to see how the results would change. For instance, outputting each of the images in the style of the movie poster returned by OMDb, or just using the movie title to return a single image — with AI, the possibilities are a ‘NeverEnding Story’! 😉
You can play Mystery Movie here: https://mystery-movie.netlify.app/
Or take a look at the code: https://github.com/CogappLabs/mystery-movie
Hannah is a Developer at Cogapp, a digital agency specialising in the cultural sector. Please get in touch if you’d like to hear more about our other hack-day projects or any of our other work.
If you’re interested in joining us for a hack day, there’s more information on our website.
We’re on Twitter or you can contact us via our website.
