<!DOCTYPE html>
<html lang="zh">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

<title>Fluxism | 流变生成实在论</title>




<style>

*{margin:0;padding:0;box-sizing:border-box}

body{

  font-family: Arial, sans-serif;

  background:#05070a;

  color:#e8f0ff;

  overflow-x:hidden;

}




/* canvas background */

canvas{

  position:fixed;

  top:0;left:0;

  width:100%;height:100%;

  z-index:-1;

}




header{

  height:100vh;

  display:flex;

  flex-direction:column;

  justify-content:center;

  align-items:center;

  text-align:center;

}




h1{

  font-size:64px;

  letter-spacing:2px;

  background: linear-gradient(90deg,#00ffe1,#7a5cff,#00ff6a);

  -webkit-background-clip:text;

  -webkit-text-fill-color:transparent;

  animation: glow 4s infinite alternate;

}




@keyframes glow{

  from{filter:drop-shadow(0 0 10px #00ffe1)}

  to{filter:drop-shadow(0 0 25px #7a5cff)}

}




.subtitle{

  margin-top:20px;

  font-size:16px;

  opacity:0.75;

  max-width:700px;

  line-height:1.8;

}




/* nav */

nav{

  position:fixed;

  top:20px;

  left:50%;

  transform:translateX(-50%);

  display:flex;

  gap:20px;

  z-index:10;

}




nav a{

  color:#9fb3ff;

  text-decoration:none;

  font-size:14px;

  opacity:0.8;

}




nav a:hover{

  opacity:1;

  color:#00ffe1;

}




/* sections */

section{

  padding:120px 20px;

  max-width:900px;

  margin:auto;

}




.card{

  background:rgba(255,255,255,0.04);

  border:1px solid rgba(255,255,255,0.08);

  padding:22px;

  border-radius:12px;

  margin-top:20px;

  backdrop-filter: blur(10px);

  line-height:1.8;

}




h2{

  color:#00ffe1;

  margin-bottom:10px;

}




.en{

  color:#ffffff;

  font-size:15px;

  opacity:0.9;

}




.zh{

  color:#9fb3ff;

  font-size:14px;

  margin-top:6px;

  opacity:0.85;

}




/* footer */

footer{

  text-align:center;

  padding:60px 20px;

  opacity:0.5;

}




/* smooth scroll */

html{scroll-behavior:smooth}

</style>

</head>




<body>




<canvas id="bg"></canvas>




<nav>

  <a href="#flux">Fluxism / 流变主义</a>

  <a href="#vola">Volatism / 波动主义</a>

  <a href="#ego">EGO 系统</a>

</nav>

<header>

  <h1><a href="index-wp.php" style="text-decoration:none;">→FLUXISM←</a></h1>




  <div class="subtitle">

    <div class="en">

      A generative ontology of reality based on wave, fluctuation, and event-flow.

    </div>

    <div class="zh">

      一种基于“波动—流变—事件流”的生成性实在论本体论。

    </div>

    <br/>

    <div class="en">

      Reality is not substance — it is continuous modulation.

    </div>

    <div class="zh">

      现实不是实体，而是持续的调制过程。
    </div>

  </div>

</header>




<section id="flux">

  <h2>Fluxism / 流变主义</h2>




  <div class="card">

    <div class="en">

      Reality is not composed of objects, but of continuous transitions of state.

    </div>

    <div class="zh">

      现实并非由“对象”构成，而是由连续的状态转移构成。

    </div>




    <br/>




    <div class="en">

      Being = dynamic fluctuation field (not static existence).

    </div>

    <div class="zh">

      存在 = 动态波动场（而非静态实体）。

    </div>

  </div>

</section>




<section id="vola">

  <h2>Volatism / 波动主义</h2>




  <div class="card">

    <div class="en">

      Instability is not noise — it is the generative engine of structure.

    </div>

    <div class="zh">

      不稳定性不是噪音，而是结构生成的动力机制。

    </div>




    <br/>




    <div class="en">

      Order emerges from controlled volatility gradients.

    </div>

    <div class="zh">

      秩序源自“可控的波动梯度”。

    </div>

  </div>

</section>




<section id="ego">

  <h2>EGO System / 自我系统</h2>




  <div class="card">

    <div class="en">

      EGO is the local compression of flux into persistent identity patterns.

    </div>

    <div class="zh">

      EGO 是流动场在局部压缩形成的持续身份结构。

    </div>




    <br/>




    <div class="en">

      Identity = temporarily stabilized wave interference structure.

    </div>

    <div class="zh">

      身份 = 临时稳定的波干涉结构。

    </div>

  </div>

</section>




<footer><br>

原创声明：<br>本站全部文章版权归 © 知虎团队所有，均为原创内容。未经原作者书面许可，严禁擅自转载、摘抄及商用，违者将依法认定为侵权行为。
如需转载、引用本文内容，请务必注明原文出处；学术论文引用须完整标注作者及所属创作团队来源（知虎・Volatism.com、Fluxism.net）。
凡违反本原创声明、违规盗用或非法使用本站内容的个人及机构，本团队将依法保留追究其法律责任的全部权利。

<br>


Original Copyright Statement<br>


All articles on this website are original works copyrighted © by Zhihu Team. Without written permission from the original author, any unauthorized reproduction, excerpting or commercial use is strictly prohibited and shall be deemed an infringement of copyright law.


If you need to repost or cite the content, please clearly indicate the original source. For academic paper citations, the author and affiliated source must be fully specified (Zhihu · Volatism.com; Fluxism.net).


The team reserves all legal rights to pursue liability against any individual or organization that violates this statement or illegally uses the content of this website.
<br><br>

  Fluxism Research Prototype © 2026 · Fluxism / Volatism System

</footer>




<script>

const canvas = document.getElementById("bg");

const ctx = canvas.getContext("2d");




let w,h;

function resize(){

  w = canvas.width = window.innerWidth;

  h = canvas.height = window.innerHeight;

}

resize();

window.addEventListener("resize",resize);




const particles = [];




for(let i=0;i<120;i++){

  particles.push({

    x:Math.random()*w,

    y:Math.random()*h,

    vx:(Math.random()-0.5)*0.6,

    vy:(Math.random()-0.5)*0.6

  });

}




function draw(){

  ctx.fillStyle="rgba(5,7,10,0.4)";

  ctx.fillRect(0,0,w,h);




  for(let p of particles){

    p.x += p.vx;

    p.y += p.vy;




    if(p.x<0||p.x>w) p.vx*=-1;

    if(p.y<0||p.y>h) p.vy*=-1;




    ctx.fillStyle="#00ffe1";

    ctx.beginPath();

    ctx.arc(p.x,p.y,2,0,Math.PI*2);

    ctx.fill();

  }




  for(let i=0;i<particles.length;i++){

    for(let j=i+1;j<particles.length;j++){

      let dx = particles[i].x - particles[j].x;

      let dy = particles[i].y - particles[j].y;

      let dist = Math.sqrt(dx*dx+dy*dy);




      if(dist<120){

        ctx.strokeStyle="rgba(122,92,255,0.15)";

        ctx.beginPath();

        ctx.moveTo(particles[i].x,particles[i].y);

        ctx.lineTo(particles[j].x,particles[j].y);

        ctx.stroke();

      }

    }

  }




  requestAnimationFrame(draw);

}

draw();

</script>




</body>

</html>