Gen Art Pixels

GenArtPixels is a collaborative canvas where people co-create evolving pixel art frames to share ideas, stories, and causes through creativity and community.

Comment

Inspiration

We were inspired by the magic of collective creativity. Projects like r/place showed how powerful it is when communities build something together. But in r/place, the artwork evolved in a chaotic way. We wanted to provide a more structured approach that allows communities to rally around a cause or idea, combining that collaborative energy with digital art and storytelling.

What it does

GenArtPixels is a collaborative digital canvas where users create, share, and evolve pixel-based artworks called frames. Think GitHub for Pixel Art. Each frame serves a purpose, to express ideas, support causes, or tell stories, while growing as multiple contributors add pixels over time. Users can explore frames in real time, zoom in to see individual contributions, and interact through likes and contributor stats. Frames are easily shareable via unique URLs, and a simple pixel quota system encourages steady participation while highlighting creativity, community, and meaningful expression. All frames are publicly viewable, but collaboration can be moderated by requiring approval for editing. Once a frame is complete, it can be frozen to prevent further changes.

How we built it

We built GenArtPixels using Kiro with a spec-driven development approach. We created specs that included requirements, design, and task definitions, and iterated on them with Kiro. Kiro then implemented the tasks using Spec credits, while we interleaved Vibe credits for debugging and refinements. Kiro’s spec-driven development is a game changer, providing the right structure for AI-based coding. Even though we only got access to Kiro late in the process, we were able to build a working project in just two weeks.

The technical stack is based on Next.js for the frontend and Supabase for the database, real-time interactions, and authentication. The design emphasizes efficiency and simplicity, ensuring anyone can jump in and participate. GenArtPixels supports both desktop and mobile devices through a responsive web design.

Challenges we ran into

  • Getting authentication working with Supabase was challenging as new libraries are available and do not interoperate well when mixed with old ones.
  • Getting pixel editing and manipulation working and keeping pixel updates fast and real-time without overwhelming the database.
  • Creating a smooth, responsive UI that works seamlessly on both desktop and mobile.

Accomplishments that we're proud of

  • Building a fully functional real-time collaborative art platform in a very short timeframe.
  • Designing a system that feels playful yet meaningful, with shareable frames and visible contributor impact.
  • Watching the first frames come to life as multiple users added pixels together.

What we learned

  • How to leverage the power and efficiency of Kiro to build a functional project in record time.
  • How to balance technical performance with user experience in real-time apps.
  • The importance of social features (likes, stats, shareable links) in making collaboration engaging.
  • That even the simplest building blocks (pixels) can spark creativity and community when used collectively.

What's next for GenArtPixels

We plan to:

  • Optimize latency with caching (e.g. Redis).
  • Introduce generative AI tools to remix and evolve frames.
  • Host community events and challenges around frame creation.
  • Expand contributor recognition with badges, leaderboards, and frame histories.
  • Explore partnerships with artists and organizations to use frames for causes and campaigns.

Built With

  • kiro
  • nextjs
  • postgress
  • realtime
  • sso
  • supabase
  • vercel
Share this project:

Updates