Hello, World!
Frontend Developer, Sejin Han
Creative,
Explorative,
Focused
Frontend Developer
아이디어의 크기나 기술의 복잡함에 관계없이, 저의 창의적이고
탐구적인 태도는 언제나 일관됩니다. 먼저 관찰하고, 깊이 이해한
뒤, 구현합니다.
사용자가 어떻게 웹을 탐색하고, 상호작용하며, 머무는지를
세심하게 살펴봅니다. 그다음, 직관적이고 몰입감 있는 경험으로
이를 구체화합니다. 현장 경험에서 얻은 인사이트를 바탕으로,
정제된 코드와 섬세한 인터페이스를 통해 사용자와 팀 모두에게
효율적이고 의미 있는 웹을 완성합니다.
안녕하세요, 사용자 경험을 설계하고, 인터페이스로 구현하는
프론트엔드 개발자 한세진입니다.
반응형·웹 접근성·웹 표준을 고려한 UI부터, React 기반
컴포넌트 설계와 GSAP·Framer Motion을 활용한 인터랙션
구현까지 경험해왔습니다.
사용자에게 더 나은 경험을 제공하기 위해 고민하고, 협업과
커뮤니케이션을 바탕으로, 효율적이고 일관성 있는
인터페이스를 만드는 데 가치를 둡니다.
- Languages
- Framework / Library
- Build & Development
- HTML5, CSS3, SCSS, Javascript, jQuery
- React, GSAP, Framer Motion
- npm, webpack, yarn
- Server & API
- Tooling
- Etc
- Fetch API, Axios, Json data
- Git
- Jira, Confluence, Shopby
- Name
- Period
- Detail
- HNINE
- 2022.11 ~ 재직 중
-
1. 다양한 기업 브랜드몰 및 프로모션 웹사이트 개발·운영
2. 웹 표준 및 접근성 준수, 성능 최적화를 통한 로딩 속도 개선과 안정적 서비스 제공
3. React, TypeScript, SCSS 기반의 반응형 UI 컴포넌트 설계 및 개발
4. GSAP, Framer Motion을 활용한 인터랙션 중심의 사용자 경험 구현
- Year
- Name
- Description
- 2019-2021
- Seneca College
- Interactive Media Design
- 2016-2018
- 가좌고등학교
- -
- Year
- Name
- Description
- 2025
- 멋쟁이사자처럼
- Deep Dive 코스 UXUI 과정
- 2021
- University of Toronto
- UofT SCS Coding Boot Camp
Stacks
-
HTML / CSS
- 웹 표준과 접근성을 준수한 시멘틱 마크업을 작성할 수 있습니다.
- Media Query 기반 반응형 레이아웃을 구현하여 PC, 태블릿, 모바일 등 다양한 디바이스와 해상도에 최적화 하는데 능숙합니다.
- Flexbox와 CSS Grid를 활용해 복잡한 레이아웃을 효율적으로 구성할 수 있습니다.
- Keyframes와 SVG를 활용하여 모션 디자인과 인터랙션을 구현할 수 있습니다.
- SCSS, SASS, PostCSS 등 CSS 전처리기 사용에 능숙합니다.
-
JavaScript / jQuery
- ES6+ 문법을 능숙하게 사용할 수 있습니다.
- DOM 조작과 이벤트 핸들링을 효율적으로 구현하는데 능숙합니다.
- 폼 검증, 데이터 바인딩, 사용자 인터랙션 구현할 수 있습니다.
- 비동기 처리(Promise, async/await)와 API 연동을 구현할 수 있습니다.
-
React
- 컴포넌트 기반 아키텍처를 이해하고 재사용성과 유지보수성을 고려한 UI를 설계할 수 있습니다.
- React Hooks(useState, useEffect, useMemo, useCallback)을 활용해 상태 관리와 렌더링 최적화할 수 있습니다.
- API 연동 및 비동기 데이터 처리를 통해 동적 콘텐츠를 효율적으로 렌더링할 수 있습니다.
- 재사용성을 높이기 위해 UI를 작은 단위의 독립된 컴포넌트로 분리하고, 명확한 props 구조를 설계할 수 있습니다.
- GSAP, Framer-motion과 결합하여 인터랙티브한 애니메이션을 구현할 수 있습니다.
-
GSAP
- GSAP, ScrollTrigger, Timeline을 활용한 스크롤 기반 애니메이션을 구현할 수 있습니다.
- SVG 및 Canvas 요소를 활용해 인터렉티브한 UI 애니메이션을 구현할 수 있습니다.
- WebGL 및 Three.js를 기반으로 GSAP과 스크롤 인터렉션 애니메이션을 구현할 수 있습니다.
-
Git
- Git 컨벤션에 맞춰 명확하고 일관성 있게 커밋 메시지를 작성할 수 있습니다.
- 원격 저장소(GitHub, GitLab 등)를 통해 팀원과 효율적으로 협업할 수 있습니다.
- Stash, Rebase, Cherry-pick 등 Git 고급 명령어를 상황에 맞게 활용할 수 있습니다.
-
ETC
- SCSS 전처리기의 mixin, extend, variables를 활용해 일관되고 재사용 가능한 스타일 구조를 설계할 수 있습니다.
- 컴포넌트 단위로 SCSS 모듈을 분리하여 유지보수성과 확장성을 높일 수 있습니다.
Works
(08+)-
(01) 시몬스 브랜드몰 구축2025 -
(02) LG Awards 고도화2024 -
(02) 삼성 Data Driven UXUI 개선 프로젝트2024 -
(03) 삼성 개발자 컨퍼런스2023 -
(04) 인벤 Vortex Dao 홈페이지 구축 프로젝트2023 -
(05) 에이치나인 IQ Society 리뉴얼 프로젝트2023 -
(06) Off Brand 클론 프로젝트2024