Explore your cosmic identity: https://palaxy.app
Deliverable: A personality exploration app built with Next.js, TypeScript, and Framer Motion, inviting users to discover their cosmic archetype through motion, storytelling, and thoughtful interaction.
Purpose: To merge art, logic, and play into a cohesive web experience that reflects the harmony between creativity and engineering. Designed for accessibility, optimized for performance, and fine-tuned for an interesting, unique, and out-of-the-world experience.
- Framework: Next.js / React.js
- Language: TypeScript
- Styling: Tailwind CSS + Custom gradients + Google Fonts (Black Hans Sans, Spinnaker)
- Animation: Framer Motion
- Form Validation: Zod
- Database / Backend: Supabase
- Deployment: Vercel + Vercel Web Analytics
- Six original cosmic avatars with unique archetypes and animated intros
- Custom designed avatar graphics and radically optimized images
- Cosmic motion design using layered Starfields and Wavy Prism
- Dynamic flow: Avatar Grid → Avatar Modal → Force Map → Pulse Survey → Transmission
- Type-safe validation with Zod for robust form handling
- Keyboard-navigable, ARIA-labeled interactive components
- Perfect Lighthouse scores (100 / 100) on desktop and mobile
- Vercel Web Analytics for real-time UX insights
- Gained hands-on best-practice experience through rapid prototyping and iterative refactoring, restructuring component hierarchies and evolving code architecture to support complex user interactions with motion design.
- Refined accessibility by auditing and aligning all interactive elements with meaningful ARIA labels, ensuring inclusivity while preserving motion and visual rhythm in the interface.
- Improved the Wave Prism animation’s rendering consistency by fine-tuning the vector stroke weight, canvas dimension, and layout flow.
- Simulated real-world code release processes and version control management via Git and GitHub.
- Defined Zod schemas in TypeScript, integrated Supabase, and connected the survey form end-to-end to ensure validated, reliable data flow.