Skip to content

wigtn/wigtn-webpage

Repository files navigation

WIGTN Homepage

와 이게 되네? (Wow, this works?) - AI Agent 개발 회사 소개 홈페이지

🚀 Features

  • Modern Tech Stack: Next.js 15 + React 19 + TypeScript + Tailwind CSS
  • Smooth Animations: Framer Motion으로 구현된 부드러운 인터랙션
  • Responsive Design: 모든 디바이스에서 완벽한 반응형 디자인
  • Dark Mode: 세련된 다크 테마
  • Glassmorphism UI: 트렌디한 글래스모피즘 디자인
  • Distinctive Typography: Syne + DM Sans 폰트 조합

🎨 Design Philosophy

"Precision Magic" - 기술적 정밀함과 AI의 마법이 만나는 곳

  • Electric Cyan/Amber 컬러로 에너지 표현
  • 유동적인 애니메이션과 기하학적 정밀함의 조화
  • 해외 트렌디한 디자인 (Vercel, Linear 스타일)

🛠️ Getting Started

Installation

npm install

Development

npm run dev

Open http://localhost:3000 to view it in your browser.

Build

npm run build
npm start

📁 Project Structure

wigtn-homepage/
├── app/
│   ├── layout.tsx          # Root layout with fonts
│   ├── page.tsx            # Main page
│   └── globals.css         # Global styles
├── components/
│   ├── navigation.tsx      # Header navigation
│   ├── hero.tsx           # Hero section with video bg
│   ├── how-it-works.tsx   # Workflow visualization
│   └── contact.tsx        # Contact form
├── lib/
│   └── utils.ts           # Utility functions
└── public/
    └── placeholder-video.mp4  # Background video

🎯 Sections

  1. Hero: 비디오 배경과 스크롤 애니메이션이 있는 히어로 섹션
  2. How It Works: 5단계 워크플로우 시각화
  3. Contact: 글래스모피즘 스타일의 문의 폼

🎨 Color Palette

  • Background: Rich dark blue-gray (#0A0A0F)
  • Primary: Electric Cyan (#00F0FF)
  • Secondary: Electric Amber (#FF9500)
  • Accent: Electric Blue (#0066FF)

📝 License

© 2024 WIGTN. All rights reserved.

About

wigtn-introduce front-end homepage

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors