This site is currently only available on pc & mobile
APOLOGIES FOR THE INCONVENIENCE
ONAFilms
\ Pre 2025
A sleek React movie database for discovering films, trending releases, and trailers in real time.

PROJECT DESCRIPTION

ONA Films is a React-based movie discovery platform designed to help users explore films, trending releases, and detailed movie information through a fast, intuitive interface. The application connects to real-time movie data to present searchable listings, dynamic categories, and up-to-date content, allowing users to browse, filter, and discover movies effortlessly. The project was built as a collaborative effort, with a strong focus on usability, performance, and responsive interaction across devices.

ONA Films delivers a smooth, engaging user experience through a clean UI system and responsive layouts optimized for both desktop and mobile. Interactive components such as sliders, filters, and dynamic views enhance navigation, while careful attention to error handling and interface feedback ensures reliability. Designed and iterated using modern UI/UX practices, the platform demonstrates scalable frontend architecture, collaborative workflow management, and practical integration of real-time API data into a polished application.

stack

Reactjs
Vite
JavaScript
Splidejs
CSS3
HTML5
XD
Illustrator

PROJECT Process

1
Project Planning & Feature Definition

Defined the core goals of the application, focusing on movie discovery, trending content, and detailed movie views. Identified key features such as search, filtering, and responsive navigation.

2
UI / UX Design Exploration

Designed the interface and layout system with an emphasis on clarity, responsiveness, and intuitive browsing. Iterated on wireframes and visual elements to ensure smooth user flow across pages.

3
API Integration & Data Handling

Integrated the TMDB API to fetch real-time movie data, including trending titles, movie details, and media assets. Implemented error handling and loading states to ensure reliable data presentation.

4
Frontend Development

Built the application using React with a component-based architecture. Developed reusable UI components for movie cards, sliders, filters, and detail views.

5
Responsive Layout & Interaction Design

Optimized layouts for multiple screen sizes and devices. Enhanced user interaction with smooth navigation, sliders, and dynamic content updates.

6
Testing, Refinement & Iteration

Tested application behavior across devices and edge cases. Refined UI interactions, fixed bugs, and improved overall usability based on peer feedback.

outcomes / impact

No items found.

project gallery

Responsive Design \ Accessibility

Mobile-First, Everywhere Always.