Skip to content

Latest commit

 

History

History
195 lines (120 loc) · 3.84 KB

File metadata and controls

195 lines (120 loc) · 3.84 KB

Project: thuan-hm.github.io

1. Overview

A blog with a calm, introspective, and slightly poetic vibe.

This is a quiet corner of the internet — not a portfolio, product, or personal-brand site.

A place to slow down, think, write, learn, and figure things out along the way.

Identity:

  • Thoughtful and curious
  • Introverted, personal, unforced
  • Writes to understand, not to impress

2. Core Feeling

The site should feel:

  • Calm
  • Quiet
  • Personal
  • Organic
  • Thoughtful
  • Slightly mysterious
  • Comfortable in solitude

The experience should feel like:

"A small personal place where someone's thoughts slowly unfold."


3. Design Philosophy

Quiet, but not empty

Minimalism should come from restraint, spacing, muted colors, and subtle motion — not from a lack of detail.

The environment can contain trees, branches, leaves, flowers, snow, and particles, but should remain subdued and never compete with the content.

Detailed, but quiet.


4. Design System

Theme

  • Light + Dark mode
  • Same visual composition in both modes
  • Dark/light should feel like the same place under different lighting

Background

Keep the base background mostly flat and uniform.

  • Light: warm off-white / paper-like
  • Dark: deep muted navy / charcoal

Avoid large background glows, gradients, light streaks, or bright patches.

Typography

  • Primary: elegant, readable serif
  • Monospace: code / technical details only

Layout

  • Centered
  • ~680–760px reading width
  • Generous whitespace
  • Strong negative space
  • No heavy cards or visual clutter

5. Seasonal Environment

The site has a subtle natural environment that changes with the year.

The same quiet place, seen in different seasons.

Mapping

  • Feb–Apr → Spring
  • May–Jul → Summer
  • Aug–Oct → Autumn
  • Nov–Jan → Winter

Season is determined client-side from the visitor's date.

No weather API, geolocation, backend, or external service.

General rules

  • Seasonal elements frame the content
  • Center remains relatively open
  • Use natural asymmetry and multiple depth layers
  • Trees should have believable branching structures
  • Leaves, flowers, and snow should feel naturally attached / placed
  • More environmental detail is welcome, but never more visual noise

Spring

Young trees, buds, flowers, petals, fresh foliage.

Summer

Full mature trees, dense green foliage, warm air, subtle dust/pollen.

Autumn

Layered trees, many leaves, falling and settled leaves, partially bare branches.

Winter

Detailed bare trees, fine branches/twigs, frost, sparse snow and snowflakes.


6. Motion

Animation should feel natural and slow.

  • Leaves drift and fall
  • Flowers/petals float
  • Summer foliage moves gently
  • Snow falls at different depths
  • Branches sway subtly

Use varied paths, durations, delays, and depth.

Avoid obvious loops, synchronized movement, fast particles, or attention-grabbing effects.

Respect prefers-reduced-motion.


7. Content

Writing should be:

  • Personal
  • Clear
  • Thoughtful
  • Reflective
  • Honest
  • Unforced

Topics may include engineering, technology, learning, books, problem solving, and personal observations.

The site should not be defined by a single technical field.


8. Technical Direction

  • Astro
  • Static site
  • GitHub Pages
  • Markdown-based posts
  • Lightweight client-side JavaScript
  • Fast loading
  • CSS/SVG preferred for environmental effects

9. Non-Goals

Not:

  • A portfolio
  • A product landing page
  • A personal-brand site
  • A design showcase
  • Feature-heavy
  • Visually loud

10. Keywords

quiet · personal · organic · seasonal · introspective · thoughtful · slow · serif · minimal · detailed


Final Note

The site should feel like:

A small, quiet place on the internet — where the seasons change slowly and thoughts are written down to be understood.