Video Optimizer for Social Media Platforms

L'Oréal Creative Optimization Tool - Based on Impact Plus Documentation v1.1

Overview

This application optimizes video files for various social media platforms using platform-specific codecs and bitrate recommendations. It features:

• 21 Platform Configurations across 8 platforms
• Automatic filename detection for platform and aspect ratio
• Side-by-side video comparison for quality assurance
• FFmpeg-powered conversion with optimal codec settings

Supported Platforms

Platform	Codec	Aspect Ratios	Notes
Meta (Facebook/Instagram)	H264	1:1, 16:9, 4:5, 9:16	-
Pinterest	H264	1:1, 16:9, 2:3, 4:5, 9:16	2:3 not fully tested
Snapchat	H264	16:9, 9:16	-
TikTok	H265	1:1, 16:9, 9:16	Recommended for quality
YouTube & DV360	VP9	1:1, 16:9, 4:5, 9:16	All devices
YouTube CTV	VP9	16:9	Connected TV specific
Amazon Prime	H264	16:9	15Mbit/s minimum
Amazon Freevee	H264	16:9	CTV specific

Installation

Prerequisites

1. Python 3.8+
2. FFmpeg - Required for video processing

Install FFmpeg:

macOS:

brew install ffmpeg

Ubuntu/Debian:

sudo apt-get update
sudo apt-get install ffmpeg

Windows: Download from ffmpeg.org

Setup

1. Clone or navigate to the project directory

2. Create and activate virtual environment:

python3 -m venv venv
source venv/bin/activate  # On Windows: venv\Scripts\activate

3. Install Python dependencies:

pip install -r backend/requirements.txt

Running the Application

Start the Backend Server

source venv/bin/activate  # On Windows: venv\Scripts\activate
cd backend
python app.py

The backend will start on http://localhost:5000

Open the Frontend

Open frontend/index.html in your web browser, or serve it with a simple HTTP server:

cd frontend
python3 -m http.server 8000

Then navigate to http://localhost:8000

Usage

1. Upload Video

• Drag and drop a video file onto the upload area
• Or click to browse and select a file
• Supported formats: MP4, MOV, AVI, MKV, WEBM, FLV, WMV, M4V

2. Filename Auto-Detection

The app can auto-detect platform and aspect ratio from filename patterns:

Platform patterns:

• Meta: _meta_, _fb_, _ig_, _facebook_, _instagram_
• Pinterest: _pinterest_, _pin_
• Snapchat: _snapchat_, _snap_
• TikTok: _tiktok_, _tt_
• YouTube: _youtube_, _yt_
• YouTube CTV: _youtube_ctv_, _yt_ctv_, _ctv_
• Amazon Prime: _prime_, _amazon_prime_
• Amazon Freevee: _freevee_, _amazon_freevee_

Aspect ratio patterns:

• 1:1 - _1x1_, _square_, _1-1_
• 16:9 - _16x9_, _landscape_, _16-9_
• 4:5 - _4x5_, _4-5_
• 9:16 - _9x16_, _vertical_, _9-16_, _portrait_
• 2:3 - _2x3_, _2-3_

Example filenames:

• summer_ad_tiktok_9x16.mp4 → Auto-detects TikTok, 9:16
• product_launch_meta_1x1_final.mov → Auto-detects Meta, 1:1

3. Configure Settings

• Select platform (if not auto-detected)
• Select aspect ratio (if not auto-detected)
• Optionally override bitrate (recommended values are shown)

4. Convert

• Click "Convert Video"
• Wait for FFmpeg to process

5. Compare & Download

• View both videos side-by-side
• Check file size reduction
• Use sync playback to compare quality
• Download optimized version

API Endpoints

Endpoint	Method	Description
/api/health	GET	Health check and FFmpeg status
/api/platforms	GET	Get all platform specifications
/api/detect	POST	Detect platform from filename
/api/upload	POST	Upload video file
/api/convert	POST	Convert video
/api/stream/<type>/<id>	GET	Stream video for playback
/api/download/<type>/<id>	GET	Download file
/api/cleanup/<id>	DELETE	Delete files

Project Structure

Loreal-File-Reduction/
├── venv/                       # Virtual environment
├── backend/
│   ├── app.py                 # Flask application
│   ├── video_processor.py     # FFmpeg processing logic
│   ├── platform_specs.py      # Platform configurations
│   ├── requirements.txt       # Python dependencies
│   ├── uploads/               # Uploaded files (auto-created)
│   └── outputs/               # Converted files (auto-created)
├── frontend/
│   ├── index.html            # Main UI
│   ├── style.css             # Styling (Black + #FFC407)
│   └── app.js                # Frontend logic
└── README.md                 # This file

Technical Details

Codec Settings

H264 (Meta, Pinterest, Snapchat, Amazon):

• Preset: medium
• CRF: 23
• Profile: main
• Pixel format: yuv420p

H265 (TikTok):

• Preset: medium
• CRF: 28
• Pixel format: yuv420p

VP9 (YouTube):

• Deadline: good
• CPU-used: 2
• Row-mt: enabled

Audio Settings

• AAC codec (128 kbps for mobile, 192 kbps for CTV)
• Opus codec for VP9/YouTube (128-192 kbps)

Troubleshooting

FFmpeg Not Found

# Verify FFmpeg installation
ffmpeg -version

# If not installed, install it:
# macOS:
brew install ffmpeg

# Ubuntu/Debian:
sudo apt-get install ffmpeg

CORS Issues

If frontend and backend are on different ports/domains, ensure Flask-CORS is installed and configured.

Large File Uploads

Default max file size is 500MB. To change, edit app.py:

MAX_FILE_SIZE = 500 * 1024 * 1024  # Change this value

Design

• Colors: Black (#000000) + Yellow (#FFC407)
• Font: Montserrat (Google Fonts)
• Theme: Dark UI with yellow accents

Credits

Based on L'Oréal CDMO Creative Optimization Documentation v1.1 Impact Plus - March 2025

License

Internal tool for L'Oréal creative optimization workflows.