I had the pleasure of joining the Starzero team to help them build their new website from scratch.
Starzero is a Google Lab startup focused on developing AI tools that accelerate media discovery across large libraries.

Challenges & Solutions

• Complex animations and interactions: The website features advanced animations and interactions that required careful planning and execution to ensure a smooth and engaging user experience.
  • Utilized the Motion library to create fluid and performant animations.
  • Implemented lazy loading for heavy assets to improve initial load times.
  • Conducted regular cross-device and cross-browser testing to ensure consistent performance.
• Responsive design: The website needed to look great and function seamlessly across a wide range of devices and screen sizes.
  • Leveraged CSS Grid and Flexbox to create flexible layouts adaptable to any screen.
  • Implemented responsive typography and scalable vector graphics (SVGs) for crisp visuals.
  • Thoroughly tested on multiple devices to guarantee a consistent user experience.
• Performance optimization: High performance was a priority to deliver fast loading and smooth interactions, even with complex animations.
  • Used tools such as Vercel Speed Insights, Vercel Analytics, and Lighthouse (Chrome) to identify and fix bottlenecks.
  • Wrote a custom script to compress and optimize image and video assets.
  • Applied lazy loading strategies to minimize initial load time.
• Accessibility: Ensuring accessibility was key to making the website inclusive for all users.
  • Implemented semantic HTML elements for better screen reader support.
  • Ensured keyboard navigation and proper focus management for interactive elements.

Technologies Used

• Astro
• TypeScript
• Motion (animation framework)
• CSS
• Github

Role

• Frontend Development
• Performance Optimization
• Accessibility