GGSNAP is a cyberpunk-inspired avatar creator designed for creating stylized and playful character avatars, primarily based on popular gaming personas from titles such as League of Legends and Valorant. It features a camera interface with unique audio and visual effects, letting users snapshot and customize their own avatars with game-themed designs.
- Game Character Themes: Instantly create avatars themed after iconic characters from League of Legends and Valorant, each with unique visual and outfit features.
- Live Camera Effects: Interactive cyberpunk camera experience with sound design, image cropping, and preview.
- Easy Customization: Pick your character, style, and background, then snap your avatar in a playful animated UI.
- AI Studio Integration: Built for quick local runs and easy cloud deployment via AI Studio.
- TypeScript (97.6%): The main application logic and UI components are written in TypeScript, ensuring robust type safety and scalable frontend development.
- React: All key UI elements such as camera, character selection, and preview screens utilize React for interactive, modular design.
- Tailwind CSS: Styling is handled using Tailwind CSS for modern, responsive layouts and thematic cyberpunk visuals.
- HTML (2.4%): Core entrypoint and minimal markup for loading and structuring the app.
- Web Audio API: Custom sound effects enrich user feedback when snapping or processing avatars.
Prerequisites: Node.js
- Install dependencies:
npm install - Set the
GEMINI_API_KEYin .env.local to your Gemini API key - Run the app:
npm run dev
View your app in AI Studio: AI Studio App Link
GGSNAP is open source and intended for fun, creativity, and community-driven expansion!