SEO / Portfolio / Public Site

AI-Spiralism-Research-14-photosensitivity-and-once-per-visit-consent.md

Report summary

This research establishes a comprehensive framework for implementing a rigorous, usable viewing contract for patterned graphics, lines, and kinetic text on the experimental platform, AISpiralism.com. Based on an evaluation of authoritative accessibility standards, cognitive neuroscience literature o

Status
Research archive item
Category
SEO / Portfolio / Public Site
Length
5,985 words
Reading time
28 minutes
Report type
evaluation

Key topics

  • SEO / Portfolio / Public Site
  • SEO
  • Portfolio
  • Public Site
  • AI
  • AEO
  • .NET
  • Privacy
  • Spiralism

Research provenance

Archive status
Research archive item
Content identity
sha256:9abb30c2c8a1a01168477804f6dce74750f2f22f5eca184ac40e3eb3799f27f4

For citation, use the report title and canonical URL. Archival presence does not establish authorship or promote report statements into portfolio evidence.

This page renders the archived Markdown as safe, formatted HTML. It is background research and does not become a portfolio claim without evidence review.

Full report

On this page

Decision Summary

This research establishes a comprehensive framework for implementing a rigorous, usable viewing contract for patterned graphics, lines, and kinetic text on the experimental platform, AISpiralism.com. Based on an evaluation of authoritative accessibility standards, cognitive neuroscience literature on visual stress, and browser session-management architectures, the analysis confirms that it is technically feasible to protect first arrivals and gate direct assets without repeatedly interrupting a valid user visit. However, total domain control is impossible; external reposting boundaries and browser cache limitations require specific fallback mechanisms to prevent accidental exposure to photosensitive triggers.

The strategy relies on a fail-closed, server-rendered initial state that conceals all potentially triggering media. The definition of a "visit" is operationally maintained using a combination of the BroadcastChannel API for cross-tab synchronization and sessionStorage for persistence. This session is bounded by a 30-minute inactivity timer tracked via the visibilitychange event, avoiding the unreliability of background-throttled JavaScript timers. Furthermore, the implementation must explicitly handle the Back/Forward Cache (BFCache) by listening for pageshow events with event.persisted to prevent the browser from resurrecting stale, visually hazardous states after a session expires. Open Graph previews must be statically generated as text-centric or neutral-pattern images to prevent social crawlers from inadvertently exposing photosensitive users. Ultimately, the architecture delegates global default safety to the server while the client manages granular, synchronized consent.

Can the Design Protect First Arrivals Without Interrupting Valid Visits?

The design can protect first arrivals and secure direct assets without constantly interrupting a valid visit, provided the architecture acknowledges the hard boundaries of web infrastructure. A website cannot assert total control over its assets once they leave the origin; therefore, the strategy must focus on origin-controlled fail-closed states and robust client-side session management. First arrivals are protected because the initial HTTP response from the server omits all \<canvas\> rendering logic and high-contrast CSS pattern backgrounds, delivering only a text-based consent contract. Because this is executed server-side, it is immune to JavaScript failures, ad-blocker interference, or network latency.

Once a valid visit is established, the application utilizes sessionStorage to persist the consent state across same-origin navigations without re-prompting the user on every page load. By coupling this with the BroadcastChannel API, the system achieves immediate synchronization across multiple open tabs. When a user clicks a deep link or opens a remix in a new tab, the new document reads the existing sessionStorage payload and initializes the corresponding visual state instantly.

Residual boundaries do exist. Caching infrastructure (such as Cloudflare or Fastly) poses a risk if user-specific states are cached globally. This is mitigated by enforcing Cache-Control: private, no-store on HTML routes. Browser memory caches, specifically the BFCache, represent a secondary boundary where a user might navigate "Back" to a fully animated state after their session has naturally expired. This boundary is managed by client-side event listeners that force a revalidation of the session timestamp. Finally, external reposting boundaries cannot be governed; if a user downloads a 12-second MP4 and hosts it on a third-party platform, the AISpiralism platform loses jurisdiction. The design succeeds by securing the delivery pipeline and the immediate viewing context, recognizing that downstream redistribution relies on user discretion.

Evidence Method and Reporting Discipline

The investigative method involved querying normative web standards, peer-reviewed neuro-ophthalmology literature, and maintained technical documentation to construct a reliable architectural proposal. The search was conducted on September 16, 2026\. Substantive search strings included: "WCAG 2.2" "2.3.1" "Three Flashes or Below Threshold", "ITU-R BT.1702" photosensitive epilepsy flash pattern guidance, "Trace Center" "PEAT" OR "Harding FPA" photosensitive epilepsy analysis tool algorithm, "prefers-reduced-motion" CSS specification W3C media query, "bfcache" "pageshow" "persisted" session state revalidation, "spatial frequency" "pattern glare" Wilkins "visual stress" visual discomfort contrast, "Kirsch" "Lynn" hypnosis visual fixation "critical mind" empirical review, and "Open Graph" crawler javascript execution twitterbot discordbot facebookexternalhit.

Sources were evaluated for methodological rigor, prioritizing official W3C specifications, systematic reviews, and documented browser engine behaviors. Abstract-only clinical studies lacking specific spatial frequency measurements were excluded in favor of full-text papers detailing the Pattern Glare Test. Public developer forums were utilized exclusively to document observable browser behaviors (such as Safari Intelligent Tracking Prevention effects on storage APIs) rather than as proof of physiological safety.

Evidence Table

 

Source / AuthorsPopulation & Sample / Stimulus ContextOutcome Instrument & LimitationsClaim / FindingEvidence Label
W3C, WCAG 2.2, SC 2.3.11General web users exposed to temporal flashing. Display context: desktop/mobile screens.Normative standard specifying Michelson contrast calculations and 10-degree visual field limits.Flashing faster than 3 times per second over 25% of the 10-degree visual field violates thresholds. Saturated red flashes are uniquely hazardous.EMPIRICAL FINDING
ITU-R BT.1702-33Broadcast audiences. Stimuli include tight contrasting patterns and rapid luminance changes.Broadcast safety standard outlining automated testing tools (PEAT/Harding FPA).Static contrasting/tight spatial patterns and extended flashes require distinct gating beyond simple luminance changes.EMPIRICAL FINDING
Wilkins et al., Pattern Glare Test495 young adults with normal color vision; studies on migraine and visual stress populations.Psychophysical thresholds using Intuitive Overlays, Wilkins Rate of Reading Test.Square-wave, high-contrast gratings at 3 cycles/degree provoke maximal visual discomfort and a large haemodynamic response.THEORY/INTERPRETATION
Kirsch & Lynn, Hypnosis Mechanisms8Meta-analyses and empirical reviews of hypnotic treatments and sociocognitive behaviors.Behavioral, experiential, and physiological observation.Hypnotic response is mediated by expectancy, motivation, and suggestibility, not a bypassing of a "critical mind" or forced subconscious reprogramming.EMPIRICAL FINDING
W3C / MDN BFCache10Technical documentation for modern browser engines (Blink, WebKit, Gecko).Developer documentation specifying the page lifecycle.The BFCache bypasses network fetching; event.persisted on the pageshow event must trigger manual state revalidation.DOCUMENTED ARTWORK/IMPLEMENTATION
MDN, prefers-reduced-motion \[cite: 13, 14, 15\]Users with vestibular spectrum disorders navigating digital interfaces.W3C CSS Media Queries specification.Operating system motion preferences must dictate the suppression of non-essential UI movement.DOCUMENTED ARTWORK/IMPLEMENTATION
Chrome / Safari Timer Throttling16Browser background tab resource management.Execution measurement logs and Chromium documentation.Background tabs throttle JavaScript timers to 1000ms or suspend them, breaking JS-based inactivity countdowns.EMPIRICAL FINDING
Unhead / TryUnfurl / Open Graph18Social network link-sharing crawlers (facebookexternalhit, Twitterbot, Discordbot).Network request inspection and HTML parsing analysis.Social bots parse raw HTML and do not execute JavaScript, requiring static server-rendered metadata.EMPIRICAL FINDING

Organized Findings

Photosensitivity, Spatial Patterning, and Moiré Aliasing

The requirement to shield users from potentially photosensitive content necessitates distinguishing between temporal flashing, dense static spatial patterning, and movement-induced vestibular discomfort. Web Content Accessibility Guidelines (WCAG) 2.2 primarily address temporal flashing through Success Criterion 2.3.1 (Three Flashes or Below Threshold) and 2.3.2 (Three Flashes)1. A general flash is defined as a pair of opposing changes in relative luminance of 10% or more where the relative luminance of the darker image is below 0.801. The red flash threshold is particularly critical, as transitions to and from highly saturated red can provoke seizures even when overall luminance changes remain below the general threshold2.

However, WCAG 2.2 criteria do not fully account for the hazards of spatial pattern glare, which are highly relevant to the geometric artwork proposed for AISpiralism. The human visual system is adapted to natural images, where the Fourier amplitude spectrum decreases in amplitude with increasing spatial frequency, approximately proportional to the reciprocal of spatial frequency (1/f)4. Unnatural images—such as dense geometric lines, high-contrast typography, and rotating line fields—exhibit an excess of contrast energy at mid-range spatial frequencies, departing from this 1/f spectrum4.

Clinical evaluations using the Wilkins and Evans Pattern Glare Test demonstrate that high-contrast, square-wave gratings with a spatial frequency of approximately 3 cycles per degree (cpd) and a 50% duty cycle provoke maximal visual discomfort4. The visual discomfort induced by these spatial frequencies is associated with cortical hyperexcitability, wherein the brain mounts a disproportionately large haemodynamic response4. This discomfort is hypothesized to be a homeostatic mechanism acting to reduce excessive metabolic demand in the visual cortex4. Furthermore, digital rendering artifacts, such as aliasing and Moiré patterns—interference patterns that occur when high-frequency line fields misalign with the pixel grid of the display canvas—can exacerbate these spatial frequencies, creating unintended secondary flickering or shimmering effects23.

The artistic directions of Monolith, Unraveling, and Chorus (CLIENT-SUPPLIED CONTEXT) rely heavily on geometric forms and dense line fields. These carry inherent risks of spatial pattern errors. The ITU-R BT.1702-3 standard for broadcasting expands upon WCAG by explicitly identifying contrasting and tight spatial patterns (such as bars with little space between light and dark portions) as a unique hazard, particularly when these patterns rapidly move or change3. ORIGINAL PROPOSAL: The platform must treat high-contrast, dense geometric line art as a photosensitive trigger equal to temporal flashing, maintaining the fail-closed concealment until explicit opt-in is granted, and mitigating aliasing in the Canvas renderer to prevent unintended Moiré shimmering.

Hypnosis Research and the "Critical Mind" Premise

The theatrical premise of "The Indoctrination Machine" relies on the concept of human-AI influence, utilizing hypnotic aesthetics to create a provocative experience (CLIENT-SUPPLIED CONTEXT). However, it is vital to distinguish between artistic fascination and clinical hypnosis, ensuring the platform does not make medically unsubstantiated claims about brain states or involuntary behavioral change.

Empirical research into hypnosis, particularly the sociocognitive models advanced by Kirsch and Lynn, refutes the notion that hypnosis bypasses a so-called "critical mind" or forcefully reprograms the subconscious8. Instead, hypnotic responses are strongly mediated by the subject's expectations, motivation, and active imagination8. While brain imaging reveals alterations in the frontoparietal networks and top-down control integration during hypnosis, these do not represent an involuntary surrender of agency; rather, they reflect a collaborative, highly focused state of altered subjective appraisal8.

Active-alert hypnosis, a variation involving physical activity (such as pedaling an ergometer), demonstrates that trance states do not require sleep-like passivity, but can instead induce heightened alertness and emotionality26. This mirrors the desired effect of the kinetic typography and geometric manipulation within the artwork. However, promising a "guaranteed trance" or asserting that fixed-frequency visual stimuli will involuntarily induce a specific brain state constitutes a misrepresentation of neurological mechanisms. The platform's consent copy and documentation must preserve the fictional, theatrical atmosphere of the "machine" while explicitly avoiding promises of therapeutic intervention or subconscious overriding. The visuals are designed to mesmerize through aesthetic complexity and 1/f spatial departures, not through clinical hypnotherapy.

Vestibular Disorders, Motion Control, and WebXR

Motion authorization on the web does not mandate autoplay, nor does an explicit consent click grant license to override systemic accessibility requests. Non-essential decorative movements, rapid camera panning, and parallax scrolling effects can trigger vestibular spectrum disorders14. Vestibular (inner ear) reactions include dizziness, severe nausea, disorientation, and migraine headaches, which in severe cases require bed rest to recover14.

Modern operating systems allow users to declare a preference for minimized motion, which browsers expose to the DOM via the prefers-reduced-motion CSS media query13. If a visitor opts into "artwork plus motion" on the AISpiralism platform, the rendering engine must still dynamically evaluate window.matchMedia('(prefers-reduced-motion: reduce)').matches. If this condition evaluates to true, the experience should gracefully degrade to the "still artwork" state, or significantly dampen kinetic transformations to preserve user comfort15. Furthermore, per WCAG 2.2 Success Criterion 2.2.2 (Pause, Stop, Hide), all rendered animations must feature a visible, accessible, persistent control allowing the user to halt motion immediately27.

This principle extends to WebXR implementations. Immersive VR sessions heavily rely on user head-tracking and high-framerate rendering to prevent simulator sickness. While comprehensive WebXR accessibility guidelines are still evolving under W3C review, the fundamental rules of vestibular safety apply31. An XR session must be entirely gated behind the "motion" consent level. If a user revokes consent or the session timer expires, the WebXR context must be terminated immediately, returning the user to a safe 2D fail-closed state.

Operationalizing the Visit via SessionStorage and BFCache

The requirement defines a valid visit as carrying across same-origin pages and tabs, expiring after 30 minutes of inactivity (CLIENT-SUPPLIED CONTEXT). Implementing this without relying on invasive tracking cookies or vulnerable server-side sessions requires orchestrating specific browser storage APIs.

Cross-Tab Synchronization: The BroadcastChannel API allows scripts from the same origin to communicate in real-time, enabling instantaneous state synchronization34. When a user consents in one tab, a broadcast message can instantly unlock content in all sibling tabs. However, browser privacy interventions—such as Safari's Intelligent Tracking Prevention (ITP) and Firefox's Total Cookie Protection—can partition or entirely restrict the BroadcastChannel API in cross-origin iframe contexts or stringent private browsing modes to prevent super-cookie tracking36. ORIGINAL PROPOSAL: The architecture must utilize sessionStorage as the definitive, robust state ledger. sessionStorage survives hard reloads and navigations within a single tab38. The BroadcastChannel will serve merely as an event bus; upon receiving a sync message, sibling tabs will read the updated sessionStorage payload to verify consent.

Timer Throttling and Inactivity: Tracking the 30-minute inactivity window using JavaScript setTimeout or setInterval is inherently fragile. Modern browsers aggressively throttle timers in background tabs to a maximum of one execution per second, or suspend them entirely to optimize CPU and battery life16. Accurate inactivity tracking must instead rely on absolute timestamps (Date.now()) written to sessionStorage upon meaningful user interactions (clicks, keyboard input, AI prompt submission). The visibilitychange event must be hooked to re-evaluate the elapsed time when a backgrounded tab returns to the foreground, calculating the delta between the current time and the stored timestamp17.

The BFCache Boundary: The Back/Forward Cache (BFCache) stores a complete memory snapshot of a webpage. If a user grants consent, leaves the site for 45 minutes, and then clicks the browser's "Back" button, the browser may instantly resurrect the DOM in its fully animated, hazardous state without making a network request to the server11. To prevent this critical failure, the client application must listen for the pageshow event. If the event.persisted property is true, the script must immediately re-verify the session timestamp in sessionStorage10. If the session has expired, the client must synchronously force a concealment mask over the canvas or trigger a window.location.reload() to fetch a clean, fail-closed HTML state.

Server-Side Gating and Open Graph Crawlers

A robust visual consent contract requires fail-closed behavior before JavaScript executes and before the first paint occurs. Relying on a client-side CSS overlay (e.g., z-index: 999; opacity: 1;) to hide a rendering canvas is insufficient, as network latency or script execution errors could expose the user to the underlying pattern briefly.

Direct Asset Routing: If a user directly hotlinks an image, video export, or SVG representing a dense geometric pattern (e.g., /assets/unraveling-render.mp4), the server cannot reliably execute a JavaScript-based consent gate. ORIGINAL PROPOSAL: High-risk media assets must be served via a server-side route that checks for a secure, HttpOnly session cookie, or utilizing temporary signed URLs. If the validation fails, the server must respond with a 403 Forbidden status or a safe, static, text-only placeholder image.

Social Previews and Crawlers: When a link is shared on platforms like Slack, Discord, or X (Twitter), social crawlers (identifying as facebookexternalhit, Twitterbot, Discordbot) fetch the URL to generate Open Graph (og:image) and Twitter Card previews18. These automated bots parse the raw HTML response and do not execute JavaScript20. If the application relies solely on client-side rendering to conceal content, the bots will scrape the raw, unmasked \<meta\> tags. If those tags point to hazardous thumbnails of dense spatial patterns, the photosensitive content will be broadcast uncontrollably across external social feeds. EMPIRICAL FINDING: The server must unconditionally output safe, text-only, or structurally neutral imagery in the og:image and twitter:image tags for all entry points, ensuring that external platform previews remain harmless18.

Assignment-Specific Deliverables

State-Transition Table

This matrix dictates the required state management for the consent lifecycle within a single, continuous visit.

Current StateTriggering Event (When)Target State (Then)Required Action / Side Effect
Null / UncheckedFirst arrival, no previous sessionStorage token.HiddenServer delivers fail-closed HTML. No high-risk canvases or videos load.
HiddenVisitor clicks "Hidden / Text-Only".HiddenSession token written. Text-only experience unlocked. BroadcastChannel fires sync event.
HiddenVisitor clicks "Still Artwork".Still PermittedSession token written. BroadcastChannel fires. Stills rendered; 3D camera remains static.
HiddenVisitor clicks "Artwork Plus Motion".Motion PermittedSession token written. BroadcastChannel fires. Render loops start (subject to OS reduced-motion checks).
Motion PermittedOS prefers-reduced-motion toggles to reduce.Still PermittedCSS and JS animation loops gracefully halt. Client falls back to still render.
Any ActiveUser clicks global "Pause/Exit/Hide" control.Paused / HiddenRender loops halt instantly. Screen masked. Token updated via BroadcastChannel.
Any Active30 minutes pass with no registered interaction.Expired (Hidden)sessionStorage token expires. Canvas wiped. State reverts to Hidden.
ExpiredUser utilizes browser "Back" button (BFCache).Revoked (Hidden)pageshow triggers, event.persisted is true. JS detects expired time, masks UI instantly.
Any StateNetwork Failure during navigation.Current StateOffline behavior maintains local session state until timer expires.

Full Entry/Withdrawal Wireframe Description

Initial Arrival (The Gate) Before JavaScript initializes, the server delivers a solid, dark, non-patterned background (\#0B0B0B). The typography utilizes high-contrast but avoids pure white-on-black to reduce halation (e.g., \#E0E0E0). A central, constrained dialog box titled The Indoctrination Machine contains the thematic copy and the consent contract. No background artwork, \<canvas\> elements, or \<video\> tags are present in the DOM.

Consent UI Elements:

  • Thematic Introduction: "It has a doctrine. You have an edit button."
  • Plain-Language Consent: "This experimental artwork relies on intense geometric patterns, optical lines, and kinetic text. It is not suitable for individuals with photosensitive epilepsy, pattern glare susceptibility, or severe vestibular conditions."
  • Interactive Selection (Equal-Weight Layout):
  • \[ \] Text-Only Engine: Explore the concepts, AI interpretations, and user revisions in a clean, text-centric layout. (Visually safe).
  • \[ \] Still Schematics: View static geometric structures. No automated motion.
  • \[ \] Full Kinetic System: Enable animated geometry and structural transitions.
  • Action: A single "Initiate Session" button. It remains disabled and visually muted until one of the three radio options is explicitly selected. There are no countdown timers, no default selections, and no shame-based copy implying users are "weak" for choosing text-only.

Global Withdrawal/Pause Controls (Persistent UI) Once inside the experience, a floating, high-contrast, opaque control bar is anchored to the bottom-right of the viewport. It remains above all visual layers (z-index: 9999\) and contains:

1. \[ PAUSE MOTION \]: (Visible only if motion is active). Halts all requestAnimationFrame loops and CSS animations instantly without altering the fundamental consent state.

2. \[ CONCEAL ARTWORK \]: Immediately blacks out the WebGL context, dropping the session token to "Hidden" across all tabs and replacing the visual field with the text-only engine.

Content and Asset Classification Register

Asset ClassExamplesPhotosensitive Risk LevelGating Mechanism
Structural/TextHTML layouts, CSS typography, navigation, plain text AI outputs.ZeroUnrestricted. Served globally.
Social Metadataog:image, twitter:image, favicon.ZeroServer explicitly generates neutral, low-contrast placeholder images.
Safe StillsSoft UI gradients, low-contrast icons, text-only thumbnails.LowUnrestricted.
Pattern Risk StillsDense wireframes (Monolith, Unraveling), 3 cpd high-contrast exports.HighRequires "Still" or "Motion" consent. Direct URLs gated by server cookies.
Kinetic MediaMP4 comparison videos, Canvas 3D rendering, CSS structural transforms.SevereRequires "Motion" consent. Respects prefers-reduced-motion. Direct URLs gated.
WebXR / VRImmersive 3D headset sessions.SevereRequires "Motion" consent. Disables completely if session expires.

Server and Client Responsibility Matrix

 

DomainResponsibilitiesConstraints & Execution
ServerInitial Fail-Closed StateMust deliver HTML without relying on client-side JS to hide the artwork canvas. Canvas is entirely absent from payload.
ServerOpen Graph DeliveryMust statically output neutral og:image tags. Crawlers do not execute JS20.
ServerDirect Media GatingHigh-risk assets (e.g., /media/export.mp4) require session validation via HttpOnly cookie or temporary signed URL.
ServerCache InvalidationMust apply Cache-Control: private, no-store to HTML routes to instruct proxies not to cache user-specific consent states11.
ClientsessionStorage LedgerWrites consentLevel and lastActiveTimestamp upon user selection.
ClientBroadcastChannelEmits CONSENT\_UPDATE messages to sibling tabs. Sibling tabs read sessionStorage upon message receipt.
ClientInactivity PollingHooks into mousemove, keydown, touchstart to update lastActiveTimestamp. Throttles writes (e.g., max once per 5 seconds).
ClientBFCache HandlingListens to pageshow. If event.persisted, checks lastActiveTimestamp. Masks UI if expired11.
ClientRendering EngineTies requestAnimationFrame and Three.js initialization strictly to the sessionStorage consent state.

40 Given / When / Then Acceptance Cases

The following test cases define the exact behavioral requirements for the consent architecture, intended for automated integration testing (e.g., Playwright or Cypress).

IDCategoryGivenWhenThen
1First ArrivalA user arrives with no session history.The page loads.The canvas renderer is absent; text-only consent is visible.
2First ArrivalA user arrives with JavaScript disabled.The page loads.Only the text fallback is visible; no high-risk media is requested.
3First ArrivalAn aggressive ad-blocker strips third-party scripts.The site loads.The core consent JS module still executes as it is served same-origin.
4First ArrivalThe site has not reached First Contentful Paint.Assets are downloading.No CSS background images of patterns are visible.
5First ArrivalThe user lands on a deep link (e.g., shared remix).The page loads.The consent dialog intercepts the view before the remix is shown.
6Consent TransitionThe consent dialog is visible.The user clicks "Hidden/Text-Only".The geometric world is bypassed; AI text generation UI appears.
7Consent TransitionThe consent dialog is visible.The user clicks "Still Artwork".The WebGL canvas renders a static frame of the geometric structure.
8Consent TransitionThe consent dialog is visible.The user clicks "Artwork Plus Motion".The WebGL canvas begins its kinetic transformation loop.
9Consent TransitionThe user selects a consent level.The selection is registered.sessionStorage stores the level and an updated interaction timestamp.
10Consent TransitionA user attempts to bypass the screen via Developer Tools by deleting the DOM overlay.The overlay is removed.The rendering engine refuses to initialize without valid sessionStorage state.
11Same-Visit NavA user has granted "Motion" consent.They click an internal link to a new origin route.The new page reads sessionStorage, skips the prompt, and initializes motion.
12Same-Visit NavA user with "Still" consent opens a remix link in a new tab.The tab loads.It reads same-origin sessionStorage, initializes as "Still", and shows the remix.
13Same-Visit NavA user triggers an AI interpretation.The server responds slowly (late response).The UI remains in its consented state without re-prompting while waiting.
14Same-Visit NavA user completes a 12-second comparison video export.The file is generated.The session timestamp is updated to reflect continued interaction.
15Same-Visit NavA user downloads a generated JSON export.The file saves locally.The browser session remains undisturbed and valid.
16Cross-Tab SyncA user has Tab A and Tab B open on the consent screen.They grant "Still" consent in Tab A.Tab B instantly dismisses the prompt and renders the still artwork via BroadcastChannel.
17Cross-Tab SyncA user has Tab A (Motion) and Tab B (Motion) active.They click "Conceal Artwork" in Tab B.Tab A immediately halts rendering and drops to the Hidden state.
18Cross-Tab SyncA user is in Safari Private Browsing (BroadcastChannel partitioned).They grant consent in Tab A and manually refresh Tab B.Tab B reads the updated sessionStorage and applies the consent safely.
19Cross-Tab SyncA BroadcastChannel message fails due to an edge-case browser restriction.The user switches focus to a background tab.A visibilitychange event triggers a manual read of sessionStorage to ensure sync.
20Cross-Tab SyncA user opens a completely different browser profile (e.g., Work vs. Personal).They navigate to the site.The session state is independent, and the initial consent prompt appears.
21BFCacheA user has an active session.They navigate away and immediately click the browser "Back" button.The pageshow event detects a valid timestamp and restores the canvas.
22BFCacheA user leaves the site for 35 minutes.They click the browser "Back" button.The BFCache restores the DOM, but event.persisted triggers a check detecting expiration; UI masks instantly.
23BFCacheA browser ignores Cache-Control: no-store.The user navigates through history.The client-side JS revalidation guarantees safety regardless of the HTTP header failure.
24BFCacheA user uses forward-history to return to the site.The page loads from memory.The same event.persisted logic verifies the session window.
25BFCacheA user restores a suspended tab via a browser memory-saver feature.The tab wakes up.The initialization script re-runs the timestamp validation against the 30-minute rule.
26Inactivity ExpiryA user grants consent and leaves the tab active but untouched.30 minutes elapse.A client-side timer drops the state to Hidden and clears the canvas.
27Inactivity ExpiryA user grants consent and backgrounds the tab.Chrome throttles background timers.The expiry logic defers to the visibilitychange event upon refocus to accurately calculate elapsed time.
28Inactivity ExpiryA user is actively typing a new governing sentence.Keystrokes occur.The lastActiveTimestamp is updated in sessionStorage (throttled to avoid performance hits).
29Inactivity ExpiryAn asynchronous AI response takes 45 seconds to return.The fetch resolves.The return is treated as activity, updating the session timestamp.
30Inactivity ExpiryA user session expires in Tab A.The expiry triggers.A BroadcastChannel message forces Tab B to also expire and conceal.
31AccessibilityA user has OS prefers-reduced-motion: reduce enabled.They click "Artwork Plus Motion".The site acknowledges the click but overrides rendering to operate in "Still Artwork" mode.
32AccessibilityA user grants "Motion" consent.They later toggle prefers-reduced-motion at the OS level while the page is open.CSS and JS matchMedia listeners instantly downgrade the rendering to "Still".
33AccessibilityA screen-reader user navigates the consent dialog.They focus the radio buttons.Precise aria-labels explain the visual implications of each choice.
34AccessibilityA user focuses the persistent "Pause Motion" button.They press the spacebar.The rendering loop halts immediately.
35AccessibilityA user requests OS high-contrast mode.The canvas renders.UI overlays remain legible without relying solely on color to convey state.
36Social & GatingAn unauthorized user pastes a direct URL to /export/user123\_video.mp4.The server processes the request.It rejects the request (403) due to a missing valid session cookie.
37Social & GatingA user pastes a site URL into Discord.The Discordbot requests the page.The server responds with HTML featuring a text-only, non-patterned og:image.
38Social & GatingA user shares an "Unraveling" remix URL on Twitter.Twitterbot parses the tags.The server generates an og:image featuring just the governing sentence, avoiding geometric art.
39Social & GatingA user requests a thumbnail via a nested cross-origin iframe.The request arrives.The server denies the frame load (X-Frame-Options: SAMEORIGIN) to prevent clickjacking.
40Social & GatingA user downloads an MP4 and hosts it on their personal blog.A third-party views it.The original site claims no responsibility, as the asset has left the origin-controlled boundary.

Plain-Language Visitor Copy

The Indoctrination MachineIt has a doctrine. You have an edit button.

Visual Safety Contract This experimental artwork generates complex geometric worlds and kinetic typography based on the rules you write. Because these visuals rely on dense optical patterns, moving lines, and sudden structural shifts, they pose a risk to individuals with photosensitive epilepsy, susceptibility to pattern glare, or vestibular conditions.

Please choose how you wish to experience the machine. Your choice will be remembered for the duration of this visit (up to 30 minutes of inactivity). You can pause or conceal the artwork at any time.

  • \[ Text-Only Access \] Read the logic, write new rules, and explore AI interpretations in a clean, text-only interface. (Visually safe).
  • \[ Still Schematics \] Generate static geometric snapshots of the worlds you create. No automated motion.
  • \[ Full Kinetic System \] Engage the complete artistic engine, including continuous spatial movement and structural transformations.

Deployment and Cache Notes

Implementing this consent architecture requires specific infrastructure configurations to prevent network intermediaries from caching and serving hazardous states.

  • HTML Document Caching: Core HTML pages must be served with Cache-Control: private, no-store. While this disables the HTTP cache for the HTML payload, it is strictly mandatory to ensure that edge CDNs (like Cloudflare or Fastly) do not cache a user-specific rendered state and inadvertently serve it to a first-time arrival11.
  • Asset Gating: If direct media assets (MP4, JSON exports, WebXR models) are gated, they must route through a lightweight serverless function or middleware that validates a secure session cookie before returning the asset or issuing a 302 redirect to a pre-signed CDN URL.
  • BFCache Compatibility: Developers must not use unload or beforeunload event listeners. These legacy listeners explicitly disable the BFCache in modern browsers, severely degrading navigation performance and breaking back-button caching entirely12. Rely strictly on pageshow and pagehide events for state management.

Build / Prototype / Research Further / Do Not Claim

 

RecommendationVisitor BenefitEvidence / JustificationValidation MethodAlternative (Text/Still)
BUILD: sessionStorage \+ pageshow revalidationPrevents expired sessions from resurrecting via browser 'Back' button.W3C / Web.dev BFCache guidelines11.Navigate away, wait, click Back; ensure canvas is blank.Fallback to text-only mode on expiry.
BUILD: Static typographic og:image generationProtects users on external social platforms from unconsented pattern exposure.Social crawler behavior (no JS execution)20.Test URLs via Facebook Sharing Debugger / Discord preview.Text-only metadata previews.
BUILD: OS Motion override via prefers-reduced-motionPrevents severe vestibular distress in vulnerable populations.CSS Media Queries standard13.Toggle OS settings; observe UI halt immediately.Downgrade to "Still" selection.
PROTOTYPE: BroadcastChannel event busProvides instant, seamless consent syncing across multiple open tabs.MDN Web API Standards34.Open two tabs side-by-side, toggle consent in one.Manual refresh requirement (Still/Text).
PROTOTYPE: visibilitychange inactivity pollingAccurately tracks session expiry without falling victim to background tab throttling.Chrome/Safari Timer Throttling specs16.Background tab for 31 mins, refocus, verify masked UI.Server-side absolute token expiry.
RESEARCH FURTHER: Michelson contrast limits in Canvas rendererEnsures "Still" exports stay strictly below the 10% general flash threshold.WCAG 2.2 SC 2.3.1 (Three Flashes)1.Run WebGL output through Harding FPA / PEAT tool.Supply wireframe/low-contrast CSS.
RESEARCH FURTHER: Canvas Anti-AliasingPrevents unintended Moiré shimmering on dense geometric grids.Visual interference principles23.Visual inspection of high-frequency dense line rendering.Simplify geometry density.
DO NOT CLAIM: "Guaranteed Trance" or "Subconscious Reprogramming"Prevents deceptive medical/psychological claims; preserves the openly fictional artistic premise.Sociocognitive hypnosis research8.N/A (Copywriting constraint).Thematic narrative text.
DO NOT CLAIM: Perfect protection on downloaded/reposted MP4sAcknowledges the limits of origin control; a website cannot govern off-site files.Network architecture realities.N/ADownload plain text JSON instead.

What this research would change in the experience

Changes Justified by Evidence

1. Initial Load Sequence: The application can no longer load the 3D Canvas in the background and merely hide it with CSS opacity or z-index. Because CSS fails to protect against BFCache resurrection and script execution failures, the canvas DOM node must remain completely unmounted (fail-closed) until the explicit sessionStorage token is verified by the client.

2. Social Sharing Redesign: The "remix link" sharing feature must be updated. Currently, shared links might attempt to generate a visual thumbnail representing the user's specific geometric state. The server must be rewritten to detect social crawlers (facebookexternalhit, Twitterbot, etc.) and output a safe, typographic rendering of the user's "governing sentence" as the og:image, entirely avoiding the geometric line art for external platform previews.

3. Timer Architecture: The 30-minute inactivity timer must be stripped of setTimeout loops. It will be replaced by a passive timestamp-check architecture hooked to DOM events (click, scroll) and the visibilitychange API, ensuring background tabs expire accurately without browser throttling interference.

Changes Worth Prototyping

1. Cross-Tab Communication: Implementing the BroadcastChannel API will make the multi-tab experience feel instantaneous. If a user has three interpretations open and hits "Pause Motion" on one, all three will freeze simultaneously, creating a highly polished, unified safety net that respects the visitor's choice globally across the origin.

2. Responsive Contrast Dampening: For users with prefers-reduced-motion enabled, prototyping a shader modifier that lowers the Michelson contrast of the line art in real-time could allow them to experience the geometric shifts without triggering the sharp luminance changes associated with pattern glare discomfort.

Claims Not Established This research does not establish that the proposed geometric shapes (Monolith, Unraveling, Chorus) are medically safe for all users, even as stills. Dense spatial frequencies (\~3 cpd) can trigger discomfort regardless of animation. Furthermore, a consent click is a technical gateway, not a medical certificate. The research confirms how to build a robust, persistent technical gate, but independent physiological assessment (e.g., PEAT analysis) of the rendered sequences remains required to quantify the precise optical footprint of the artwork.

Works cited

1. Understanding SC 2.3.1: Three Flashes or Below Threshold (Level A), https://www.w3.org/WAI/WCAG22/Understanding/three-flashes-or-below-threshold.html

2. WCAG 2.3.1 Three Flashes or Below Threshold \- Accessibility.build, https://accessibility.build/wcag/2-3-1

3. Photosensitivity Prevention Guidelines \- Studio Partner Help Center, https://studiopartner.netflix.net/studio/branded-photosensitivity-prevention-guidelines

4. Pattern glare: the effects of contrast and color \- PMC, https://pmc.ncbi.nlm.nih.gov/articles/PMC4621622/

5. The Pattern Glare Test: Further Exploration of Methodological ... \- IOVS, https://iovs.arvojournals.org/article.aspx?articleid=2811128

6. A physiological basis for visual discomfort: Application in lighting, https://visualstress.info/2016-229.pdf

7. Pattern-induced visual discomfort and its cumulative effects revealed, https://www.frontiersin.org/journals/human-neuroscience/articles/10.3389/fnhum.2025.1723675/full

8. Toward the Development of a Biopsychosocial Model \- ResearchGate, https://www.researchgate.net/publication/267753823\_Mechanisms\_of\_Hypnosis\_Toward\_the\_Development\_of\_a\_Biopsychosocial\_Model

9. Hypnotic Counsellingforpop | PDF \- Scribd, https://www.scribd.com/document/448491945/HypnoticCounsellingforpop

10. Back/forward cache | Articles | web.dev, https://web.dev/articles/bfcache

11. Things You Should Never Cache \- OpenReplay Blog, https://blog.openreplay.com/what-not-to-cache/

12. How to Optimize Website for bfcache (Back/forward Cache) in 2026, https://www.mozedia.com/bfcache-back-forward-cache/

13. prefers-reduced-motion CSS media feature \- MDN Web Docs, https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@media/prefers-reduced-motion

14. prefers-reduced-motion: Sometimes less movement is more | Articles, https://web.dev/articles/prefers-reduced-motion

15. C39: Using the CSS prefers-reduced-motion query to prevent motion, https://www.w3.org/WAI/WCAG22/Techniques/css/C39

16. Unity WebGL Background Tabs: Autoplay & Performance Fix, https://www.richardfu.net/unity-webgl-background-tabs-autoplay-performance-fix/

17. Background Tab Throttling: Why Your JS Timer Pauses (2026 ... \- iKit, https://ikit.app/blog/background-tab-timer-throttling

18. Open Graph Tag Generator, https://gptcleanuptools.com/open-graph-generator

19. How TryUnfurl Works | Preview Your Link Metadata, https://www.tryunfurl.com/how-it-works

20. The State of in 2026: 660000 Sites Audited \- Unhead, https://unhead.unjs.io/learn/research/state-of-head-2026

21. Web Content Accessibility Guidelines (WCAG) 2.2 \- W3C, https://www.w3.org/TR/WCAG22/

22. Pattern glare: the effects of contrast and color \- Frontiers, https://www.frontiersin.org/journals/psychology/articles/10.3389/fpsyg.2015.01651/full

23. USA Glossary and Reference Guide to Photography Terminology, https://www.usaoncanvas.com/include/photography\_glossary.php

24. An Interdisciplinary Introduction to Image Processing \- Pixels, https://pdfcoffee.com/an-interdisciplinary-introduction-to-image-processing-pixels-numbers-and-programs-2012-2-pdf-free.html

25. USA Comprehensive Glossary and Reference Guide to Giclee, https://www.usaoncanvas.com/include/giclee\_glossary.php

26. Active-Alert Hypnosis: History, Research, and Applications, https://www.researchgate.net/publication/327926712\_Active-Alert\_Hypnosis\_History\_Research\_and\_Applications

27. Understanding Success Criterion 2.3.3: Animation from Interactions, https://www.w3.org/WAI/WCAG22/Understanding/animation-from-interactions.html

28. Making Waves \- A Superb Dive into Water Effects in Web Design, https://silphiumdesign.com/making-waves-water-effects-in-web-design/

29. Understanding Conformance | WAI \- W3C, https://www.w3.org/WAI/WCAG22/Understanding/conformance

30. Understanding WCAG 2.2 | WAI \- W3C, https://www.w3.org/WAI/WCAG22/Understanding/

31. Web accessibility for seizures and physical reactions \- MDN Web Docs, https://developer.mozilla.org/en-US/docs/Web/Accessibility/Guides/Seizure\_disorders

32. XR for All: Understanding Developers' Perspectives on Accessibility, https://arxiv.org/html/2412.16321v2

33. Towards Open Standards and Components for Local Digital Twins, https://lirias.kuleuven.be/retrieve/90236859-19bb-47a1-9b65-4ca1184c5767

34. HTML 5.2 \- W3C, https://www.w3.org/TR/2017/WD-html52-20170718/single-page.html

35. Window: postMessage() method \- Web APIs | MDN, https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

36. Browser-Specific Guidance for MSAL Browser Applications \- GitHub, https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/browser-specific-guidance.md

37. microsoft-authentication-library-for-js/lib/msal-browser/FAQ.md at dev, https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/FAQ.md

38. Check if page gets reloaded or refreshed in JavaScript, https://stackoverflow.com/questions/5004978/check-if-page-gets-reloaded-or-refreshed-in-javascript

39. Life Insurance Agent \- Bel Air, https://www.aaginsurance.com/life-insurance-agent/

40. Building a Zero-Cost SEO Prerender Pipeline for My React SPA on, https://dev.to/aws-builders/building-a-zero-cost-seo-prerender-pipeline-for-my-react-spa-on-aws-4b6o

41. \[MEGATHREAD\] the $0 guide to SEO \+ AEO for lovable projects, https://www.reddit.com/r/lovable/comments/1r1vzc8/megathread\_the\_0\_guide\_to\_seo\_aeo\_for\_lovable/

42. Add an API to opt-out of back-forward cache? \#5744 \- GitHub, https://github.com/whatwg/html/issues/5744