Digital Academic Journal Platform

Digital academic journal platform introducing Korean typography discourse and research
Provides diverse content to typography researchers, designers, and students.

1 / 6

Roles

PlanningDesignFrontendBackend

Tech Stack

Next.js 15

React 19

Tailwind CSS

jQuery

Key Features

Multi-Volume System: Digital magazine with independent layout and table of contents per issue
Interactive Image Gallery: Full-screen overlay on click, close with ESC key or background click
Multi-language Text Toggle: Real-time Korean/English content switching without page refresh
Smart Table of Contents Navigation: Section-based scroll anchors for quick content access
Responsive Typography: Optimized Korean web font rendering from mobile to desktop

Key Achievements

Custom 5-2 Grid System: Responsive layout with body(5) to image(2) ratio optimized for academic content readability
Static Content Architecture: Database-free content management via JS objects, zero-latency loading through build-time bundling
Custom Korean Web Font Optimization: 5 Korean fonts loaded with font-display: swap strategy, preventing FOIT and ensuring render performance
Image Overlay Hook: useExpandableImages custom hook for global state management, scroll locking, and keyboard accessibility
Fluid Typography: CSS clamp() function for viewport-based automatic font size and spacing adjustment
Path-Aware Navigation: Automatic volume-specific header and table of contents switching based on current URL

#Typography

#Digital Magazine

#Academic Journal

#Next.js

#Responsive Web

#Korean Web Fonts