~/gabriel-filiot (refonte-total-du-site-ozzak)./releases./cvgithub ↗linkedin ↗
~/g-filiot (refonte-total-du-site-ozzak)
v2.0.0

Complete redesign of OZZAK

period2024 — 2025
contextFull stack developer, then freelance · Ozzak
stacknext.js · reactjs · typescript · api platform · tailwind · symfony
Complete redesign of OZZAK
# CHANGELOG
  • −Legacy website
  • +API-first architecture with API Platform
  • +Secure front ↔ back communication with JWT
  • +Integration of a UX design agency's mockups
# README.md

As a full stack developer at Ozzak, a startup specializing in discounted cinema ticket sales, I actively participated in the comprehensive overhaul of the platform (Ozzak v2). This ongoing project aims to significantly modernize the user experience, enhance strategic data collection, and implement a fully responsive, API-first approach.

Project Objectives :

  • Modernize and optimize the user experience through a fully redesigned interface.
  • Accurately collect user interaction data to meet the specific needs of Ozzak and its cinema partners.
  • Provide strategic data access to selected clients through a powerful API using API Platform.

Design by Carré Sauvage :

The visual redesign was entrusted to the specialized design agency Carré Sauvage, who developed a fresh visual identity along with a modern and intuitive user experience.

image36.png
Ozzak V2 Mockup - Login Page
image59.png
Ozzak V2 Mockup - Movie Search Page
image41.png
Ozzak V2 Mockup - Film Cards (mobile)
image39.png
Ozzak V2 Mockup - Film Cards (desktop)

Technological Choices :

  • Next.js for the front-end, chosen due to existing team expertise and to leverage technology already integrated into the project, enabling efficient development.
  • Symfony & API Platform on the back-end, ensuring efficient data management and providing a robust, high-performance REST API.
  • CapacitorJS to quickly generate Android and iOS mobile applications, saving development time and ensuring an optimal multiplatform experience.

Strategic Importance of User Data :

Detailed collection of user data is strategically essential, as such data is limited within the cinema industry. These insights help cinemas tailor their offerings and anticipate viewer preferences.

API Platform enables Ozzak to strategically provide these critical insights to cinema partners and privileged clients via a clear, robust API.

Project Status :

The project is currently ongoing. From August to December, I personally handled the complete integration of the mockups provided by Carré Sauvage, significantly enhancing my front-end development skills and autonomous project management capabilities.

To ensure project reliability, I implemented End-to-End (E2E) testing using Playwright, thus guaranteeing quality and stability of key functionalities.

Below, you can see a preview of the different pages of the new website.

The movie search page makes it easy for users to find specific movies, addressing a major frustration in the previous Ozzak version. Multiple filters are available (genre, age, language), and users can also quickly find screenings at their favorite cinema, all updated in real-time.

Capture d'écran 2025-03-17 230947.png
Ozzak V2 - Movie search page

The movie detail page efficiently allows users to filter showings by upcoming dates. There's no longer any need to view schedules far into the future since cinemas update their programming every Tuesday. With an interactive slider, users can easily sort showtimes by date, city, cinema, or language, making the search process quick and intuitive.

Capture d'écran 2025-03-17 153349.png
Ozzak V2 - Movie page
Capture d'écran 2025-03-17 231216.png
Ozzak V2 - Movie page (mobile)
Capture d'écran 2025-03-17 153739.png
Ozzak V2 - Checkout page

I also worked on the new interface for the news section. While the overall design hasn't fundamentally changed—as the current design was already highly effective—the article page has undergone a complete redesign, offering a more modern and enjoyable reading experience. Content management continues to be handled efficiently through Strapi.

Capture d'écran 2025-03-17 231357.png
Ozzak V2 - News page
Capture d'écran 2025-03-17 231430.png
Ozzak V2 - Page of an article

A completely new user profile page has been created, allowing users to manage and customize their experience easily while centralizing key information (favorite cinema, tickets, upcoming screenings, etc.)

Capture d'écran 2025-03-17 153701.png
Ozzak V2 - Login page

To effectively collect user data, we implemented interactive questionnaires. These surveys appear either after movie screenings or at targeted points in the user journey. They feature visually appealing designs that encourage user engagement, facilitating participation and gathering valuable insights.

Moreover the interactive API documentation generated with Swagger, enabling secure requests to various endpoints protected by JWT tokens. The main strength of this solution lies in the backend's stability, which remains largely unchanged. Most of the development involved creating and configuring the data models to be exposed via the API using ApiResource (API Platform documentation). However, understanding API Platform was challenging. The documentation, being community-driven, was sometimes unclear, and it required watching many hours of API Platform conference talks to fully grasp its powerful yet complex mechanisms.

There's so much more to say about this exciting project, but I can't reveal everything here—stay tuned for the final version! This experience has been extremely enriching for me, providing the opportunity to tackle a huge, from-scratch project on my own and face the challenge of learning and mastering new technologies.

Results and Next Steps :

At this intermediate stage, the project has already achieved:

  • A complete visual redesign providing a more intuitive and efficient user experience.
  • The establishment of a robust infrastructure to collect and leverage user data.
  • Preparation of a solid API ready for deployment to strategic cinema partners.

The project will continue to evolve over the coming months, progressively reaching its final objectives.

 

git checkout v1.0.0Production of the news section of OZZAK