Προσαρμοσμένες ιστοσελίδες

PALEMAN Beach Party

Σχεδιασμός και ανάπτυξη μιας «ζωντανής» πλατφόρμας για ένα ελεύθερο, δωρεάν beach party στα Ψακούδια Χαλκιδικής, βασισμένο στην ιδέα του «φέρνουμε ό,τι πίνουμε, φεύγουμε χωρίς να αφήνουμε ίχνος». Ο ιστότοπος λειτουργεί ως ένας ψηφιακός οργανισμός που αναπνέει όλο τον χρόνο, μέσα από τρεις βασικούς πυλώνες: Real-time Sun Tracking Colors: Το χρώμα ολόκληρου του site άλλαζει δυναμικά με βάση την πραγματική θέση του ήλιου πάνω από την παραλία (από βαθύ βιολετί-μαύρο τις χειμωνιάτικες νύχτες, σε πορτοκαλί-μωβ τα καλοκαιρινά δειλινά). Privacy-First Crowd Counter: Ένας δημόσιος μετρητής συμμετοχής χωρίς εγγραφές, emails ή cookies. Βοηθά τη διοργάνωση να υπολογίσει με ακρίβεια τις ανάγκες σε νερό, κάδους, τουαλέτες και ήχο, σεβόμενος απόλυτα την ιδιωτικότητα. Seamless Continuous Web Radio: Ενσωματωμένο ραδιόφωνο με αδιάλειπτη αναπαραγωγή κατά την πλοήγηση, που εκπέμπει 24/7 διατηρώντας το vibe του φεστιβάλ ζωντανό 365 ημέρες τον χρόνο.

PALEMAN Beach Party

Πελάτης

PALEMAN (Ψακούδια, Χαλκιδική)

Τύπος

Ιστότοπος φεστιβάλ με ζωντανή αντίστροφη μέτρηση, WebGL hero οδηγούμενο από την πραγματική θέση του ήλιου, συνεχές ραδιόφωνο και δημόσια καταμέτρηση συμμετοχής χωρίς εισιτήρια.

Ρόλος

Πλήρης ανάπτυξη (full-stack): concept, οπτική ταυτότητα στο web, 3D/shader hero, frontend, API routes, βάση δεδομένων, PWA, τεχνικό SEO/GEO και παραγωγική διάθεση.

Έτος

2026

Εργαλεία

Next.js 16React 19TypeScriptTailwind CSS v4React Three Fiber / Three.jsGLSL shadersGSAPLenisZustandPostgreSQL (Hetzner) + PgBouncerSoundCloud Widget APIPWA / Service WorkerVercel

Παραδοτέα

  • Χρωματικό σύστημα οδηγούμενο από τον ήλιο

    Προσέγγιση NOAA για τη θέση του ήλιου στις συντεταγμένες της παραλίας, γραμμένη σε CSS variables και διαβασμένη ταυτόχρονα από τον WebGL hero και κάθε περίγραμμα ενότητας. Το αποτέλεσμα είναι ένας ιστότοπος που δείχνει διαφορετικός κάθε ώρα της ημέρας, χωρίς χειροκίνητη παρέμβαση.

  • Ζωντανή καταμέτρηση συμμετοχής χωρίς εισιτήρια

    API routes με PostgreSQL πίσω από PgBouncer. Αποτροπή διπλοεγγραφών με salted, περικομμένο SHA-256 από IP + user-agent — τίποτα αντιστρέψιμο, καμία ωμή IP, εκτός πεδίου cookie consent κατά GDPR. Η καταμέτρηση παγώνει με τη λήξη του φεστιβάλ, επιβεβλημένα από τον server και όχι απλώς κρυμμένα στο UI.

  • Ραδιόφωνο που δεν διακόπτεται στην πλοήγηση

    Ο SoundCloud player τοποθετήθηκε πάνω από τον router ώστε το iframe να μην αποπροσαρτάται ποτέ. Επειδή το Web Audio δεν φτάνει σε cross-origin ήχο, συντίθεται μουσικός φάκελος (envelope) ώστε τα visuals να συνεχίζουν να παλμοδοτούν — αντικαθίσταται από πραγματικό analyser όταν ο ήχος φιλοξενηθεί τοπικά.

  • PWA και αναπαραγωγή με κλειστή οθόνη

    Manifest, service worker, offline σελίδα και wake lock, με προτροπή εγκατάστασης αφού ο χρήστης έχει ακούσει για λίγο. Εγκατεστημένη ως standalone εφαρμογή, η αναπαραγωγή επιβιώνει πολύ πιο αξιόπιστα από ό,τι σε καρτέλα Safari ή Chrome.

  • Δίγλωσσο περιεχόμενο, ελληνικά πρώτα

    Τα ελληνικά είναι η προεπιλογή και ό,τι εμφανίζεται στο στατικό HTML — αυτό είναι το κοινό και αυτό ευρετηριάζεται. Τα αγγλικά είναι client-side εναλλαγή, με το λεξικό δομημένο ώστε να μεταφερθεί σε /[locale] routes χωρίς αλλαγή σε κανένα component.

  • Τεχνικό SEO και GEO για μηχανές απαντήσεων

    JSON-LD τύπου MusicEvent με μηδενική τιμή προσφοράς και ξεχωριστό sub-event ανά DJ set, llms.txt και llms-full.txt παραγόμενα από την ίδια πηγή περιεχομένου, sitemap με hreflang, robots.txt με ρητή άδεια σε AI crawlers και παραγόμενη κάρτα κοινοποίησης — ώστε το «πότε και πού είναι το PALEMAN» να απαντιέται σωστά και μέσα σε AI απαντήσεις.

  • Απόδοση σε συνθήκες παραλίας

    190 KB gzipped eager JavaScript στην αρχική· Three.js (228 KB) και GSAP (46 KB) φορτώνονται lazy. Preload του LCP στοιχείου στο πρώτο round trip. Ο ιστότοπος σχεδιάστηκε να λειτουργεί και να δείχνει σωστός ακόμη και χωρίς κανένα από τα βίντεο — το CSS gradient από κάτω είναι σχεδιασμένο επίπεδο, όχι fallback.