The first question behind this opening animation was not “can it look cool?” It was: before entering a personal site, can there be a moment short enough not to annoy, but solid enough to feel like a threshold?
I did not want the common particle field. Particles too easily become the default answer for “technology”: dots, lines, floating, gathering, finally resembling any AI product launch video. As the discussion went on, the more precise word became Widmanstätten: the interlaced crystalline structure exposed when meteoritic iron is cut and acid-etched. It is not decorative linework. It is a cross-section of material time.
Once the word arrived, the animation’s grammar arrived with it.
Order Left by Slow Cooling
What is truly compelling about Widmanstätten patterns is not whether they look futuristic. It is that they were never grown in order to be seen.
They form as nickel-iron meteorites cool with extreme slowness. Metals mixed at high temperature separate into different crystal phases across vast time. Only when the object is cut, polished, and acid-etched do the differences hidden inside become visible. In other words, this is not a surface ornament. It is an object carrying the conditions of its own formation inside its body.
That matters to me. Many webpage animations paste a layer of “atmosphere” onto the outside of content, like a filter. The meteorite pattern is not atmosphere. It is history. It says: truly textured things are not designed to be complicated; they grow structure through constraint, pressure, and cooling.
So the opening should not be merely “beautiful black-and-white lines.” It should suggest a slower value system:
- order is not drawn from outside; it precipitates from within the material;
- time is not a background parameter; it is part of the shape;
- cutting is not always destruction; sometimes it is the only way to see internal structure;
- revelation happens afterward, not during growth.
Placed back into this site, that is almost exactly the entry metaphor I want. A personal site worth staying in should not only display conclusions; it should let people see how those conclusions cooled, stratified, and pressed against one another. The “growth” of the opening pattern is not a trick. It says: the content here should also behave like a cross-section, allowing the texture of time to be seen.
Not Background, but Cross-Section
A real Widmanstätten pattern has a temperament that is almost anti-web: it is not smooth, not ingratiating, not self-explanatory. Lines cut through one another; bright and dark faces compress each other; local regions resemble scratched metal, while the whole maintains a stable directional order.
So the implementation does not use one large noise texture as a background. The image is built from several classes of layer:
- three lamellae families separated by roughly 60°, forming the main crystal directions;
- small dark triangular pockets and bright rhombus faces, giving the intersections the weight of metal section;
- short crosshatches, Neumann-like fine lines, and polish scratches, so the image is not a clean SVG grid;
- a few near-white specular facets, flashing only locally, avoiding full-screen glow.
It looks complex, but complexity is not the point. The point is: every layer appears to have grown from the same material. That is why it suits the site better than ordinary “tech texture.” Tech texture often simulates control; Widmanstätten patterns admit that beyond control there are time, cooling, and irreversible formation.
Growth Matters More Than Appearance
The opening does not fade in a picture. It lets the pattern “grow” out of time. In code, every fragment carries its own t0 and dur, then is ordered by the same sweep direction. What you see is not random emergence. You see a cross-section gradually revealed.
This belongs to the site’s rhythm. P1·103N1X is not a landing page that wants to show everything immediately. It is closer to a notebook that has been cut open. The opening pattern previews that rhythm: you are not entering a dashboard; you are entering a material surface. The interface does not welcome you first. The material shows its age first.
The title therefore does not receive an ornate reveal. “Phoenix” cuts in hard. The pattern already moves enough; the word should stop. The moving part opens the space. The still part confirms identity.
Scroll Exit
The most important detail is actually the exit.
If the animation merely played and disappeared, it would still be a splash screen. Now it waits for the user’s first scroll, movement, or click, then erases the already-grown pattern in reverse. Entry into the site is not “time has passed.” Entry is “you made the gesture.”
I like this detail: the pattern is not covered by the page. It withdraws into black by itself. Like a curtain, or like a metal cross-section being returned to darkness.
The Rule It Leaves Behind
What remains from this discussion is not a pretty screenshot, but a more useful rule:
A visual asset that is merely beautiful will age quickly. If it explains the way a site is entered, it becomes part of the structure.
Widmanstätten is not a “meteorite theme” here, nor a science-fiction skin. It is closer to the site’s first sentence of grammar: black ground, material, cross-section, slow revelation, then a door opened by the user’s scroll. A site can grow this way too: first internal structure, then cross-section, and only at the end, viewing.
