Inspiration

Inspiration strikes once again at KnightHacks 2023. We took inspiration from the hackathons theme and decided to build a retro text-based game like Zork and Planetfall. We’ve combined these ideas in combination with a modern aesthetic twist and whimsical storyline. In tandem with the events theme, we wanted the player to have the ability to create their own unique dialogue and discover new and exciting characters with each new playthrough.

What it does

This is a web based text adventure game where you can select a character. And we’re given a setting and you can interact in a pirate setting and roleplay. There is an inventory feature where you start off with items and you can trade in the game. There is also a search feature in the inventory.

How we built it

We used Next.js as the primary web framework. We also used the following libraries:

  • React Query (frontend requests)
  • tRPC (typesafe APIs)
  • OpenAI (message and image generation)
  • Framer Motion (UI Animations)
  • React95 (UI Components)

Challenges we ran into

Getting ChatGPT to properly tag messages with the speaker and profile image was tricky. We got it mostly working, but it definitely could be better. Getting our project deployed on Vercel. We ran into Eslint issues and typescript problems.

Accomplishments that we're proud of

Getting the trading system working was tricky. We were able to solve this by getting ChatGPT to respond in a parsable JSON form in order to generate valid trade actions that we could render into the UI.

We’re also really proud of how our UI turned out, especially on mobile.

What we learned

Prompt engineering is hard - a future iteration of the project would have better scripted validation.

What's next for Pixel Plunderers

Our stretch goals were:

  • Sound effects
  • Playable Maps
  • Porting this game from web to a mobile app
  • Adding a Gacha system
  • Integrating ad monetization
  • Improving the prompt engineering for the game and messages

Built With

  • chatgpt
  • dalle2
  • react
  • react95
  • tailwindscss
  • vercel
Share this project:

Updates