Portfolio

Welcome 2026
MOON MIJIN

UI Publishing & Frontend Development

Scroll
✦
Profile
✦
✦

Moon
Mijin

EMAIL ansalwls2217@gmail.com

PHONE 010. 2915. 7152

MBTI INFJ #계획적 #공감능력

Technical Skills SECTION 01

HTML5 / CSS3
JavaScript (ES6+)
Git / GitHub

Education SECTION 02

  • Full-Stack Web Development CourseSpring 기반 웹 애플리케이션 구조 이해 및 DB 연동 실습
  • Web Publishing CourseHTML/CSS 중심 웹 표준 및 UI 구현 훈련

Achievements SECTION 03

  • ERP 회계 정보관리사 2급 한국생산성본부(KPC)
  • 정보기술자격(ITQ)한글엑셀 A등급 한국생산성본부(KPC)
  • MOS Word Expert Microsoft

Key Strengths SECTION 04

  • UI Structure Thinking 레이아웃과 구조를 먼저 이해하고 안정적인 화면 구성을 설계합니다.
  • UI Implementation HTML/CSS 기반으로 실제 화면에서 동작하는 인터랙티브 UI를 구현합니다.
#UI구현 #웹표준
My
Interests
🎬 Movie
✈️ Travel
🎧 Music
📚 Reading
🌙 Space

PORTFOLIO

UI INTERACTIONS

트리피

TRIPPY
트리피 메인 화면
#SITE TRIPPY
#PERIOD 3 Days (Refactoring)
#TYPE UI Refactoring
#STACK HTML / CSS · jQuery
PROJECT OVERVIEW
OVERVIEW 개인 맞춤 여행 코스 제작 및 관리 플랫폼
ARCHITECTURE JSP → Static HTML/CSS
PATTERN UI Refactoring
ROLE UI 재구성 · 반응형 구현 · 컴포넌트 분리
LINK Trippy Site
PROJECT DETAIL

TRIPPY는 기존 JSP 기반 여행 플랫폼을 정적 HTML/CSS 구조로 재구성한 UI 리팩토링 프로젝트입니다.
주요 페이지를 선별하여 퍼블리싱 관점에서 구조를 재정리하고 UI 흐름을 개선했습니다.

반응형 웹으로 구현하여 다양한 디바이스 환경을 고려했으며,
header, footer, 메뉴를 공통 컴포넌트로 분리해 유지보수성을 높였습니다.

또한 카테고리 필터, 페이지네이션 등 인터랙션 요소를 구현하여
실제 서비스와 유사한 사용자 경험을 제공하도록 구성했습니다.

Macintosh HD › Projects › TRIPPY

Favorites

  • Overview
  • Demo
  • Documentation

Tags

  • HTML
  • CSS
  • JSP Refactor
Demo Video Demo Video (Legacy Version)
1 items Last opened: Today

윙스텝

WINGSTEP
윙스텝 메인 화면
#SITE WINGSTEP
#PERIOD 3 Weeks
#TYPE Frontend · API Integration
#STACK React · REST API
PROJECT OVERVIEW
OVERVIEW 러닝 기록 관리 및 시각화 서비스
ARCHITECTURE API 연동 기반 UI 구조
PATTERN Data-driven UI
ROLE UI 구현 · API 연동 · 데이터 처리
LINK

React 기반 프론트엔드와 API 서버를 분리하여 개발한 웹 프로젝트입니다.

Live Demo API Source
PROJECT DETAIL

러닝 기록을 저장하고 시각화할 수 있는 웹 서비스입니다. React 기반 UI와 Spring Boot REST API 서버를 연동하여 사용자의 운동 기록 관리와 데이터 조회 기능을 구현했습니다.

Macintosh HD › Projects › WINGSTEP
upload heart menu-dots search

Favorites

  • Overview
  • Demo
  • Documentation

Tags

  • React
  • Spring Boot
  • MyBatis
  • MySQL
Demo Video Demo Video
Project PDF Project PDF
2 items Last opened: Today

PORTFOLIO

Wep Publishing

그로브

GROVE
image1
#SITE Grove
#PERIOD 2 Weeks
#Type Website Renewal
#STACK HTML / CSS · jQuery
PROJECT OVERVIEW
OVERVIEW UI/UX 개선 웹 리뉴얼 프로젝트
ARCHITECTURE 정적 웹 기반 구조
PATTERN UI Markup & Interaction
ROLE UI 마크업 · 반응형 웹 · 인터랙션 구현
LINK Grove Site
DESKTOP DESIGN

기존 사이트에서 불편함 점과 부족했던 정보성 콘텐츠를 중심으로
개선하여 제작하였습니다.

image1
image1
MOBILE DESIGN

먼저 진행된 PC버전을 바탕으로 모바일에 최적화된 화면을 구성했습니다.
모바일에서도 PC와 동일한 경험으로 제공하며 각 메뉴로의 접근성을 용이하게 설계했습니다.

image1
image1

캠핑카 앤 서바이벌

CAMPING CAR & SURVIVOR
image1
#SITE Camping car & Survivor
#PERIOD 3 Weeks
#Type Website Renewal
#STACK HTML / CSS · jQuery
PROJECT OVERVIEW
OVERVIEW UI/UX 개선 웹 리뉴얼 프로젝트
ARCHITECTURE 정적 웹 기반 구조
PATTERN UI Markup & Interaction
ROLE UI 마크업 · PC/Mobile 별도 구현 · 인터랙션
LINK Desktop Site Mobile Site
DESKTOP DESIGN

기존 사이트에서 불편함 점과 부족했던 정보성 콘텐츠를 중심으로
개선하여 제작하였습니다.

image1
image1
MOBILE DESIGN

먼저 진행된 PC버전을 바탕으로 모바일에 최적화된 화면을 구성했습니다.
모바일에서도 PC와 동일한 경험으로 제공하며 각 메뉴로의 접근성을 용이하게 설계했습니다.

image1
image1

집시네마

ZIP CINEMA
image1
#SITE Zip Cinema
#PERIOD 3 Weeks
#Type Website Renewal
#STACK HTML / CSS · jQuery
PROJECT OVERVIEW
OVERVIEW UI/UX 개선 웹 리뉴얼 프로젝트
ARCHITECTURE 정적 웹 기반 구조
PATTERN UI Markup & Interaction
ROLE UI 마크업 · PC/Mobile 별도 구현 · 인터랙션
LINK Desktop Site Mobile Site
DESKTOP DESIGN

기존 사이트에서 불편함 점과 부족했던 정보성 콘텐츠를 중심으로
개선하여 제작하였습니다.

image1
image1
MOBILE DESIGN

먼저 진행된 PC버전을 바탕으로 모바일에 최적화된 화면을 구성했습니다.
모바일에서도 PC와 동일한 경험으로 제공하며 각 메뉴로의 접근성을 용이하게 설계했습니다.

image1
image1

CONTACT

Thank You

CONTACT-LIST

PHONE 010. 2915. 7152 EMAIL ansalwls2217@gmail.com GITHUB github.com/moonme98