this website is SUPER under construction, please excuse the mess!

and please keep in mind, though this website is compatible for mobile, it is intended to be viewed from a desktop/ipad!

Welcome to the official Frame by Frame website! Though the comic itself hasn't started yet (and likely won't for a while!), you can find information and updates right here in the meantime! Feel free to look around C:

THE TOWER

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.elit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

AORTA

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.elit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

const section = document.getElementById('flashlight-section'); const flashlight = document.querySelector('.flashlight'); if(section && flashlight) { section.addEventListener('mousemove', e => { const rect = section.getBoundingClientRect(); const x = ((e.clientX - rect.left) / rect.width) * 100; const y = ((e.clientY - rect.top) / rect.height) * 100; flashlight.style.setProperty('--x', `${x}%`); flashlight.style.setProperty('--y', `${y}%`); }); section.addEventListener('touchmove', e => { if (e.touches.length > 0) { const rect = section.getBoundingClientRect(); const touch = e.touches[0]; const x = ((touch.clientX - rect.left) / rect.width) * 100; const y = ((touch.clientY - rect.top) / rect.height) * 100; flashlight.style.setProperty('--x', `${x}%`); flashlight.style.setProperty('--y', `${y}%`); } }); }
const overlay = document.getElementById('flashlight-overlay'); const flashlight = overlay.querySelector('.flashlight'); function updatePosition(e) { const rect = overlay.getBoundingClientRect(); const x = ((e.clientX - rect.left) / rect.width) * 100; const y = ((e.clientY - rect.top) / rect.height) * 100; flashlight.style.setProperty('--x', `${x}%`); flashlight.style.setProperty('--y', `${y}%`); } function updateTouch(e) { if (e.touches.length > 0) { const rect = overlay.getBoundingClientRect(); const touch = e.touches[0]; const x = ((touch.clientX - rect.left) / rect.width) * 100; const y = ((touch.clientY - rect.top) / rect.height) * 100; flashlight.style.setProperty('--x', `${x}%`); flashlight.style.setProperty('--y', `${y}%`); } } document.addEventListener('mousemove', updatePosition); document.addEventListener('touchmove', updateTouch);
Middle Room
❮
❯
let position = 1; const rooms = document.querySelectorAll(".room"); const container = document.getElementById("room-container"); const blink = document.getElementById("blink"); const hotspot = document.getElementById("top-right-hotspot"); let isTransitioning = false; function showRoom(pos) { rooms.forEach((room, index) => { room.classList.toggle("active", index === pos); }); hotspot.style.display = (pos === 1) ? "block" : "none"; document.querySelector(".arrow.left").style.display = (pos === 0) ? "none" : "block"; document.querySelector(".arrow.right").style.display = (pos === rooms.length - 1) ? "none" : "block"; } showRoom(position); function blinkTransition(callback) { if (isTransitioning) return; isTransitioning = true; blink.style.opacity = '1'; setTimeout(() => { callback(); setTimeout(() => { blink.style.opacity = '0'; setTimeout(() => { isTransitioning = false; }, 300); }, 200); }, 300); } function goLeft() { if (position > 0) { blinkTransition(() => { position--; showRoom(position); }); } } function goRight() { if (position < rooms.length - 1) { blinkTransition(() => { position++; showRoom(position); }); } } function randomShake() { const maxTranslate = 0.5; const maxRotate = 0.1; const x = (Math.random() * maxTranslate * 2) - maxTranslate; const y = (Math.random() * maxTranslate * 2) - maxTranslate; const r = (Math.random() * maxRotate * 2) - maxRotate; container.style.transform = `translate(${x}px, ${y}px) rotate(${r}deg) scale(1)`; setTimeout(() => { requestAnimationFrame(randomShake); }, 100); } requestAnimationFrame(randomShake); hotspot.addEventListener("click", () => { blinkTransition(() => { location.href = "#board"; }); });

Frame by Frame is a pov-switcher type comic, as of right now we will have 4 different pov's that will differ for each chapter, going back and forth between the four of them

besides the main povs, there will also be an occasional INTERMISSION chapter, a oneshot type chapter involving a side character, or one that hasnt been shown

in the meantime leading up to FRAME BY FRAME's release, there will likely be smaller scale/oneshot comics released of other characters in the same setting.

Frame by Frame was first created in 2022 as a small group of ocs, and that was all they were until around early 2024 when I took them a little more seriously and had the intentions of making a comic. Ever since then i've been working hard with a couple other people to make Frame by Frame a reality! This is a HUGE passion of mine and i'm so excited to share it, no matter how long it takes to get out there

I primarily work on Frame by Frame by myself, but my friend and partner help out from time to time with some things! Together they've designed a handful of both main and side characters and helped out with worldbuilding as well (plus emotional support), so you should totally give them support too!

FAQ

Accordion Vue

Still have questions? You can drop them right here!

There's nothing here yet! Feel welcome to submit something here, the guestbook will likely be a limited time feature, later being archived as to not lag the site