WEB SYSTEMS ARCHIVE
Selected web projects exploring immersive design, responsive interfaces, atmospheric presentation, and interactive user experiences.
FLAGSHIP PROJECT
Echoes Through Time
A narrative-driven historical riddle web application featuring AI-powered NPC interactions, persistent progression systems, and immersive multi-device design.
Echoes Through Time is a narrative-focused riddle-solving web application inspired by historical mystery, atmospheric storytelling, and deduction-based gameplay.
Players progress through a series of themed historical challenges by interpreting riddles, consulting AI-powered NPCs, and uncovering answers through dialogue, observation, and logical inquiry.
Developed as a full-stack web application using PHP, JavaScript, MySQL, and OpenAI APIs, the project combines persistent progression systems, contextual NPC interactions, responsive multi-device layouts, and modular level architecture within a unified immersive experience.
The interface was designed with responsiveness and immersion as central priorities, with dedicated layout adaptations for desktop, tablet, and mobile portrait and landscape environments.
Particular attention was given to preserving readability, atmospheric cohesion, and gameplay usability across varying aspect ratios and device types.
Each level features a dedicated AI-powered historical “guardian” designed to guide the player through deduction and contextual questioning rather than direct exposition.
Inspired by classic yes/no deduction games such as Guess Who?, the interaction system encourages players to test theories, refine assumptions, and progressively narrow possibilities through dialogue.
To support conversational continuity, NPCs also receive recent message history as contextual memory alongside each new question, allowing follow-up and clarification questions to feel more natural and coherent.
All interface elements, including sigils, buttons, decorative frames, icons, and themed input systems, were custom designed specifically for the project in order to integrate seamlessly with AI-assisted environmental artwork and reinforce the atmosphere of each historical setting.
The backend architecture was built around a reusable “engine + content” philosophy, where gameplay systems such as progression tracking, level guarding, AI interaction handling, session management, and solved-state logic could support entirely new levels through modular configuration rather than structural rewrites.
Player progression is stored through a MySQL-backed persistence system supporting both authenticated users and temporary guest sessions, allowing returning players to seamlessly continue their progress across sessions.
A strong emphasis was placed on maintaining immersion through both visual consistency and intentional separation between gameplay spaces and user-oriented systems such as authentication, account management, and contact interfaces.
Originally conceived as a smaller academic project, Echoes Through Time gradually evolved into my first large-scale full-stack web application and became an important milestone in understanding modular architecture, responsive design, asynchronous frontend interaction, deployment workflows, and immersive interface presentation.
EARLY IMMERSIVE FRONT-END WORK
Vioi Kolaseos
Atmospheric literary blog presentation and thematic front-end customization.
Vioi Kolaseos ("Chronicles of the Afterlife") was developed as a custom-themed Blogger presentation page for a Greek fantasy-horror novel, with a strong focus on atmosphere, readability, and immersive visual identity.
Using dedicated CSS and lightweight HTML customization, the project reworked the original Blogger theme through typography adjustments, cinematic background treatment, layered transparency effects, and atmospheric content presentation.
Particular attention was given to visual hierarchy, spacing, and thematic consistency across the sidebar, article layout, embedded media, and navigational elements in order to create a reading environment inspired by gothic literature and dark fantasy aesthetics.
At the writer's request, the page also integrated embedded and downloadable PDF excerpts of the novel directly into the browsing experience, allowing visitors to preview sections of the book without leaving the site.
While technically simpler than later projects, this work became an important early exploration of immersive front-end presentation, thematic web styling, and atmosphere-driven interface design principles that would later evolve into larger interactive projects such as Echoes Through Time.