my-website/bio.html at main · hazelian0619/my-website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lian - Biography</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/remixicon@4.5.0/fonts/remixicon.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap" rel="stylesheet">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: '#2D3047',
secondary: '#E8E9F3'
}
}
}
}
</script>
<style>
body {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'SF Pro Display', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.nav-link {
position: relative;
}
.nav-link::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 0;
height: 1px;
background-color: currentColor;
transition: width 0.3s ease;
}
.nav-link:hover::after {
width: 100%;
}
</style>
</head>
<body class="bg-white text-primary">
<nav class="fixed top-0 w-full bg-white/90 backdrop-blur-sm z-50 border-b border-gray-100">
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
    <div class="flex justify-between items-center h-16">
      <a href="index.html" class="text-xl font-medium">Lian</a>
      <div class="hidden md:flex space-x-8">
        <a href="index.html" class="nav-link text-sm hover:text-primary transition-colors">HOME</a>
        <a href="bio.html" class="nav-link text-sm hover:text-primary transition-colors">BIO</a>
        <a href="research.html" class="nav-link text-sm hover:text-primary transition-colors">RESEARCH</a>
        <a href="work.html" class="nav-link text-sm hover:text-primary transition-colors">WORK</a>
        <a href="cv.html" class="nav-link text-sm hover:text-primary transition-colors">CV</a>
        <a href="contact.html" class="nav-link text-sm hover:text-primary transition-colors">CONTACT</a>
        <a href="other.html" class="nav-link text-sm hover:text-primary transition-colors">OTHER</a>
      </div>
    </div>
  </div>
</nav>

<main class="pt-32 pb-16 min-h-screen">
  <div class="container mx-auto px-4 sm:px-6 lg:px-8">
    <div class="max-w-6xl mx-auto">
      <h1 class="text-3xl font-extralight tracking-wide mb-16">Biography</h1>

      <div class="space-y-8 mb-20 max-w-[100%] group hover:bg-neutral-50 transition-all duration-300 border-l-2 border-transparent hover:border-emerald-600">
        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          As an MPhil student in Artificial Intelligence at the Hong Kong University of Science and Technology (HKUST), I work under the supervision of Prof. <a href="https://personal.hkust-gz.edu.cn/zhongbingzhuo/index_Chinese.html" class="text-emerald-600 hover:text-emerald-700 transition-colors">Bingzhuo Zhong</a> and Prof. <a href="https://scholar.google.com/citations?user=ZiY3xYEAAAAJ&hl=en" class="text-emerald-600 hover:text-emerald-700 transition-colors">Jintai Chen</a>, focusing on the development of medical AI and cognitive enhancement systems. My research consistently approaches technology from a humanistic perspective, committed to making technology truly serve human needs.
        </p>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          My research began with structural reflection. Growing up in a working-class family, it was STEM education that gave me the opportunity to enter an elite high school. However, during this process, the technology-driven elite development also made me aware of the alienation of human character. This reflection motivated me to choose Chinese Literature at <a href="https://english.bnu.edu.cn/" class="text-emerald-600 hover:text-emerald-700 transition-colors">Beijing Normal University</a>, seeking humanistic answers. Yet even in one of China's finest Chinese literature programs, I clearly recognized how the outdated academic division system conducts deskilling training for women.
        </p>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          To break through these limitations, I completed my entire curriculum in two years and dedicated the remaining two years to practical work—transitioning from editing ancient Chinese characters at a state-owned enterprise to working as a data analyst at ByteDance, accumulating over a dozen work experiences. This journey deepened my understanding of humanistic values while strengthening my pursuit and application of technology.
        </p>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          In the subsequent two years, I systematically trained in algorithm development, entering software engineering through the medical field. Drawing from my personal experience with a rare medical condition, I developed a medical image segmentation and detection framework integrating deep learning, active learning, graph neural networks, and reinforcement learning from human feedback, specifically addressing small-sample annotation and multimodal data fusion challenges in screening applications. Graph neural networks became my core research technology, which I also used to develop creative association systems and writing tools. I am currently working on knowledge graph construction for protein engineering.
        </p>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          Meanwhile, I hoped to share these technological opportunities with more young women in need. I shared career transition strategies and technical learning insights on Douban, garnering 400,000 views and nearly 2,000 followers, developing this into a computational social research project. I also created related podcasts, inviting women with similar experiences to share and form mutual support networks.
        </p>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          This humanistic approach provided me with the opportunity to join a home companion robot product team, where I'm responsible for emotional function development and personality cultivation algorithm design. This work involves human perception, emotional ethics, and value alignment—areas I hope to continue exploring deeply.
        </p>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          My research focuses on three core areas:
        </p>

        <ul class="space-y-3 pl-4">
          <li class="text-base font-light text-neutral-700 list-disc tracking-wide">
            <strong>Human-Robot Emotional Interaction</strong>
          </li>
          <li class="text-base font-light text-neutral-700 list-disc tracking-wide">
            <strong>Medical AI and Graph Neural Networks</strong>
          </li>
          <li class="text-base font-light text-neutral-700 list-disc tracking-wide">
            <strong>Computational Sociology</strong>
          </li>
        </ul>

        <p class="text-base font-light leading-relaxed text-neutral-700 tracking-wide">
          As someone from marginalized groups, I deeply understand the power and purpose of technology. Therefore, I hope to continue doing practical, warm research and work in future endeavors.
        </p>
      </div>

      <div class="mb-20">
        <h2 class="text-2xl font-extralight tracking-wide mb-10">Education</h2>
        <div class="space-y-8">
          <div class="group hover:bg-neutral-50 transition-all duration-300 border-l-2 border-transparent hover:border-emerald-600">
            <div class="flex justify-between items-baseline">
              <div>
                <h3 class="text-base font-light text-neutral-800 group-hover:text-emerald-700 transition-colors">Hong Kong University of Science and Technology</h3>
                <p class="text-sm text-neutral-600 italic mt-1">MPhil in Artificial Intelligence</p>
                <p class="text-xs font-light text-neutral-500 mt-2">Focus: Human-Computer Interaction, Healthcare AI</p>
              </div>
              <span class="text-sm font-light text-neutral-500 group-hover:text-neutral-700 transition-colors">2024.9-2026.6</span>
            </div>
          </div>

          <div class="group hover:bg-neutral-50 transition-all duration-300 border-l-2 border-transparent hover:border-emerald-600">
            <div class="flex justify-between items-baseline">
              <div>
                <h3 class="text-base font-light text-neutral-800 group-hover:text-emerald-700 transition-colors">Santa Fe Institute</h3>
                <p class="text-sm text-neutral-600 italic mt-1">Visiting Researcher</p>
                <p class="text-xs font-light text-neutral-500 mt-2">Research: Complexity Science</p>
              </div>
              <span class="text-sm font-light text-neutral-500 group-hover:text-neutral-700 transition-colors">2025.7-2025.9</span>
            </div>
          </div>

          <div class="group hover:bg-neutral-50 transition-all duration-300 border-l-2 border-transparent hover:border-emerald-600">
            <div class="flex justify-between items-baseline">
              <div>
                <h3 class="text-base font-light text-neutral-800 group-hover:text-emerald-700 transition-colors">Hokkaido University</h3>
                <p class="text-sm text-neutral-600 italic mt-1">Research Exchange Program</p>
                <p class="text-xs font-light text-neutral-500 mt-2">Research: Exercise rehabilitation for older people</p>
              </div>
              <span class="text-sm font-light text-neutral-500 group-hover:text-neutral-700 transition-colors">2024.7-2024.9</span>
            </div>
          </div>

          <div class="group hover:bg-neutral-50 transition-all duration-300 border-l-2 border-transparent hover:border-emerald-600">
            <div class="flex justify-between items-baseline">
              <div>
                <h3 class="text-base font-light text-neutral-800 group-hover:text-emerald-700 transition-colors">Beijing Normal University</h3>
                <p class="text-sm text-neutral-600 italic mt-1">Bachelor in Chinese Language and Literature</p>
              </div>
              <span class="text-sm font-light text-neutral-500 group-hover:text-neutral-700 transition-colors">2020.9-2024.6</span>
            </div>
          </div>

          <div class="group hover:bg-neutral-50 transition-all duration-300 border-l-2 border-transparent hover:border-emerald-600">
            <div class="flex justify-between items-baseline">
              <div>
                <h3 class="text-base font-light text-neutral-800 group-hover:text-emerald-700 transition-colors">Tsinghua High School</h3>
                <p class="text-sm text-neutral-600 italic mt-1">Science Track</p>
                <p class="text-xs font-light text-neutral-500 mt-2">Focus: Mathematics, Physics, and Chemistry</p>
              </div>
              <span class="text-sm font-light text-neutral-500 group-hover:text-neutral-700 transition-colors">2017.9-2020.6</span>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</main>

<footer class="py-8 bg-gray-50">
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center text-sm text-gray-500">
    <p>&copy; 2024 Lian. All rights reserved.</p>
  </div>
</footer>
</body>
</html>