Central Bicol State University of Agriculture

About the CBSUA Tabulation System

A state-of-the-art, automated tabulation platform built to modernize competition scoring, eliminate manual calculation delays, and ensure 100% transparency, accuracy, and fairness.

The Creators

Meet the Developers

Designed, architected, and engineered by dedicated students and developers of CBSUA.

Ar-jay F. Llanera

Ar-jay F. Llanera

Lead Full-Stack Developer & System Architect

@CODE-RJ45

Led the end-to-end system architecture, real-time WebSocket communication infrastructure, database relational modeling, and official reporting engines.

Actual Key Contributions:
  • •Core System Architecture: Initialized the Next.js 15 project structure, Prisma ORM, and custom server infrastructure.
  • •Real-Time WebSocket Engine: Built the custom Socket.io server (server.js) for sub-second live score synchronizations across devices.
  • •Database & Schema Design: Modeled relational database schemas, TiDB Cloud integration, cascading integrity rules, and migrations.
  • •Printable Reports Engine: Developed the official printable tabulation sheets (Master, Category, Rank-per-Judge, and Final Rank).
  • •Live Board & Tie-Breaking: Engineered stage projector display (/live), reveal animations, tie-breaking logic, and production deployment.
System ArchitectureSocket.ioPrisma ORMNext.js 15TiDB CloudReport Engine
Jeus R. Ofenda

Jeus R. Ofenda

Frontend UI/UX Developer & System Co-Developer

@ArtistDev09

Co-developed the user experience, focusing on judge evaluation workflows, administrative authentication, and official institutional branding.

Actual Key Contributions:
  • •Judge Scoring Interface: Built the comprehensive candidate scoring UI (src/app/score/[id]) with category tabs and score input controls.
  • •Authentication & Security: Developed the admin authentication and login portal (src/app/admin/page.tsx) with secure credential handling.
  • •Institutional Branding: Integrated the official CBSUA seal, logos, and visual identity across all site headers, navbars, and certificates.
  • •Landing Page Judge Portal: Engineered the homepage judge selection modals, event selection workflows, and secure PIN verification.
  • •Print Header Templates: Designed the institutional certificate and tabulation report header layouts (print-header.tsx).
Judge Scoring UIAuthenticationInstitutional BrandingUI/UX DesignTailwind CSS
System Highlights

Built for High-Stakes Competitions

Engineered with enterprise patterns to handle large-scale pageants, sports matches, and academic events.

Real-Time Scoring Engine

Sub-second live synchronization powered by WebSockets, broadcasting judges' scores instantaneously to the master tally.

Bulletproof Judge Security

Role-based PIN verification, strict out-of-bound score clamping, and automated sheet locking prevent tampering and accidental changes.

Interactive Live Board

Cinematic projector display featuring dynamic stage reveal mode, rank transitions, and confetti animations for the audience.

Advanced Tie-Breaking

Configurable resolution algorithms including Total Score, Registration Number, Include Ties, and Manual Committee Selection.

Audit & Printable Reports

Generates official printable certification sheets, ranking breakdowns, and criterion summaries ready for signature submission.

Multi-Phase & Gender Separation

Seamless support for Preliminary and Final phases with distinct candidate gender divisions and standalone talent scoring.

Technology Stack

Leveraging the modern web ecosystem for maximum speed, security, and uptime.

Next.js 15
Core Framework
React 19
UI Library
TypeScript
Language
Tailwind CSS
Styling
Prisma ORM
Database Layer
TiDB Cloud / MySQL
Database Engine
Socket.io
Real-Time WebSockets
Radix UI
Accessible Primitives
CBSUA Seal

Central Bicol State University of Agriculture

Dedicated to advancing institutional transparency and digital transformation through innovative, student-led technological development.

Built with passion for CBSUA events and competitions