# Hero Next Bilingual Personal Site

Adapted from the project README

A standalone bilingual personal site built with the Next.js App Router, React Three Fiber, and Three.js. It combines a profile, essays, project cases, public channels, and a journal, with distinct experiences for immersive desktop browsing and mobile reading.

[Website source](https://zzzxc.com/projects/gh-1366880001)

## Content and browsing experience

The site presents a profile, AI and philosophy axioms, public projects, and public channels across four chapters, followed by a date-based journal. Chinese and English share typed content, while locale, theme, and project-room selection are persisted.

Wide screens with a fine pointer use a circular article index, moving sheets, a four-wall project room, and a perspective journal. Mobile, touch, and short landscape windows switch to a reading layout with complete text, compact lists, and native disclosures.

## Interaction and architecture

The project keeps one runtime, canvas, and scroll source. React Three Fiber manages rendering and the frame loop for a WebGL tetrahedron, face projection, triangular transitions, a GLB model, and lighting, while CSS handles semantic DOM layout, accessible colors, stacking, and pointer routing.

Theme and locale use separate persistent stores. The experience supports reduced motion and targets at least 4.5:1 contrast for normal text; the mobile reading layout keeps a theme control available throughout the page.

## Project catalog and machine-readable content

The project includes four complete bilingual featured case studies and can add validated public repository data to its project directory. Cases can open in a native reading dialog over the exhibition room or render as standalone pages.

A server-rendered Agent directory and Markdown documents cover the profile, axioms, projects, and journal. They are generated during the build from existing typed content and a validated journal snapshot rather than maintained as separate copy. Journal data must be synchronized before the first development session or build.

## Boundaries and limitations

The implementation consumes only public Viselora entrypoints and pins the relevant package versions. Its permissive development hostname allowlist is intended only for trusted networks, and the development port should not be exposed publicly.

The README notes that Canvas and DOM glyph rasterization may still differ slightly, and the current content is a base version intended for further editing. Automated coverage, interaction evidence, and remaining diagnostics are maintained in the project's status documentation.

## Explore further

- [Project source](https://github.com/agenticnoob/hero-next)

[Contents](https://zzzxc.com/agent/en/index.md)