Nothing To Watch

screenshot of Nothing To Watch
react
vite
tailwind

An experimental webgl gallery that can visualize tens of thousands of film posters as a voronoi diagram

Overview

In today's fast-paced digital world, traditional cinema often feels like a relic of the past. However, for film enthusiasts, there remains an immense wealth of cinematic history to explore. An exciting new project has emerged that allows users to dive into an expansive gallery of film posters, showcasing the richness of over a hundred years of cinema in an engaging and interactive way.

This experimental WebGL gallery transforms the traditional browsing experience by utilizing a force-directed voronoi diagram to visualize tens of thousands of film posters. This innovative approach not only makes discovering movies visually captivating but also highlights the relationships between films, allowing users to engage with cinema in a fresh and dynamic manner.

Features

  • Interactive WebGL Visualization: Immerse yourself in a real-time rendering experience featuring tens of thousands of film posters that you can explore at your leisure.
  • Custom Voroforce Engine: Experience a unique force simulation and rendering system designed specifically for optimal performance and multi-threading support.
  • Responsive Design: No matter the device you're using, whether desktop, tablet, or mobile, the gallery adapts seamlessly to provide an excellent user experience.
  • Performance Optimized: Benefit from GPU-accelerated rendering that ensures efficient memory management and smooth performance.
  • Film Discovery: Discover new movies through visual relationships, with a clustering feature that connects similar films for easy exploration.
  • Multiple View Modes: Enjoy different user experiences with various modes, including intro, selection, and preview options that cater to diverse browsing preferences.
react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

tailwind
Tailwind

Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.

react-hook-form
React Hook Form

React Hook Form is a performant, flexible, and extensible form library for React with easy validation. It reduces re-renders and improves performance by using uncontrolled components and native HTML validation, making form handling simple and efficient.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.

Zustand

Zustand is a lightweight state management library for React that provides a simple and intuitive API for managing state in your application. It allows developers to easily create and manage global state, and provides a powerful set of tools for optimizing performance and improving developer productivity. Zustand is designed to be easy to use and easy to learn, making it a popular choice for developers of all skill levels.