NekoPix

Logo
Drawing Pad Interface

Inspiration

Game development is a field that motivates many, and it's the reason a lot of people begin studying as a whole. Yet it's a very difficult field to get into, requiring so many different tools and an understanding of a lot of underlying CS principles to get started. That's why we created NekoPix, a tool to help people get started.

What it does

NekoPix allows users to generate a game level/environment from a user's idea. The user is able to come up with a level design through a drawing on our built in drawing pad, as well as give the creator a theme to revolve the level around. Our back end then takes in the ideas given by the user and creates a level according to those demands, helping the user see their imaginations come to life.

How we built it

We used a stack involving Next.js and React.js in order to render the game textures and implement the game controls for a playable experience. We used Dall-E 3, a generative AI model, to create textures from the user's prompts.

Using these technologies, we separated our project into three main parts:

First, the drawing pad, for the user to design the level layouts and game design of their choice.
Second, a server-side prompt to image generation program, in order to create a set of textures and sprites for the game according to the user's ideas.
And third, the actual playable game, a combination of the previous two with our pre-designed game engine and control scheme, to give life to the user's ideas.

Challenges we ran into

Our biggest challenge was working with React components and the limitations that come with them. For example we had trouble setting up a server and REST API endpoint in order to use our async calls in order to generate the images.

Accomplishments that we're proud of

Overcoming our biggest challenge with the connection to a separately hosted back-end server, as to support our asynchronous functions without stalling the overall program. Doing so allowed us to continue the game while the textures were generating, aiding in the user experience.

What we learned

We all learned a lot about the use of generative AI and prompt engineering for our texture creation, as well as game development for the engine built into our app. Alongside that, we learned a lot about app development as a whole, and the full design process that comes with creating something like this from start to finish.

What's next for NekoPix

We hope to add more components and capabilities into our game to allow for more flexibility in our level builder. For example, we hope to add the inclusion of customizable enemies and obstacles, as well additional modes of travel (such as teleporters) for more freedom of gameplay for the user. That way, our users get a better experience and more freedom of what they can actually create.