Photobooth Frame Creator Web App

Project Description

LBAM SRL (“La Box à Moments”), a Belgian company specializing in photobooths and event automation, is looking for a skilled developer (or small team) to build a web-based application that allows users to create and customize photobooth frame templates.

The goal is to generate DSLRBooth-compatible templates composed of background.jpg (background) and overlay.png (foreground with transparency), ready to use for photo printing at events.

Core Features
Template Library

Predefined template formats (10×15 cm landscape/portrait, 2×6" strips, etc.)

Ability to duplicate or import templates

Template thumbnails with tags, titles, and categories (wedding, corporate, etc.)

Visual Editor (WYSIWYG Canvas)

Text editing: custom fonts, colors, size, alignment, rotation, opacity, line spacing, bold/italic

Image upload: personal logos, PNGs with transparency, resizing, rotation, mirror, opacity, layering

Layer management: rename, hide, lock, group/ungroup elements

Grid and alignment guides: snap-to-grid, safety margins, bleed area indicators

Undo/redo, history tracking, and element locking

Resize and reposition texts and images freely with handles or numeric input

Fonts and Colors

Support for Google Fonts and admin-uploaded fonts

Color picker (HEX/RGB) with a predefined LBAM color palette

Optional eyedropper tool to pick colors from the canvas

Export (DSLRBooth Compatible)

Exports in ZIP format containing:

background.jpg (high quality, 300 DPI)

overlay.png (transparent PNG)

preview.jpg

meta.json (template info: size, DPI, fonts, author, etc.)

Strict file structure and naming for DSLRBooth compatibility

Optional export directly to Nextcloud / WebDAV storage

Automatic webhook call upon export to notify LBAM backend

Project Management

Save and duplicate projects

Share via secure links (view or edit mode) with expiration dates

Client Mode: restrict editable fields (e.g., text or logo only)

Technical Requirements

Frontend: React or Vue.js with Fabric.js or Konva.js for canvas rendering

Backend: Node.js (Express/Nest) or PHP (Laravel/Symfony)

Server-side image rendering to ensure accurate color, font, and DPI output

Storage: local filesystem with Nextcloud/WebDAV integration

Authentication: Admin / Editor / Client roles with password login

Responsive: primarily desktop, read-only mode on mobile

Export quality: minimum 300 DPI with consistent font rendering

Deployment: must run via Docker Compose with .env configuration

Deliverables

Complete source code (frontend and backend)

Docker setup and installation guide (README)

Ten starter templates (wedding, corporate, 2×6 strips, etc.)

Three preinstalled open-source fonts

Functional tests (export validation, transparency, resolution, Nextcloud integration)

Short user documentation (PDF or small wiki)