skills

-
HTML5
-
CSS3
-
javascript
-
jQuery
-
Typescript
-
Git & Github
-
Vscode
-
Figma
-
Photoshop
-
illurstrator
-
Premiere pro
-
Money
기업형 PC 웹사이트
롯데 콘서트홀(pc)
- XHTML버전으로 제작된 기존 웹사이트 리뉴얼
- W3C 웹접근성 검사 및 만점 완료
- 웹표준 접근성에 맞춰 시멘틱 마크업과 아웃라인 정돈
- php include를 활용하여 header, footer 코드의 재사용성과 유지보수의 편의성을 높임
- 스크롤 위치에 따른 헤더 레이아웃 변형
- JavaScript를 활용하여 index 페이지 스크롤 이벤트 적용 (서브페이지에선 aos 활용)
- Ajax와 Json 활용
- JavaScript를 활용하여 탭메뉴, 아코디언 메뉴, 이미지 슬라이드, 필터 기능 구현
- swiper, map api 활용
- 제작 기간
- 약 1개월
- 제작 인원
- 1인 (기여도 100%)
- COLOR
- #6a6869
- #e70012
- #ae9b73
- #231816
- 제작 스킬
- HTML5, CSS3, JavaScript, jQuery, Ajax, Json, 그누보드 게시판, Figma,
Adobe Photoshop, illustrator, W3C 웹 표준 통합 마크업 검사(html/css),
웹 접근성검사 (K-WAH), 크로스브라우징 완료
기업형 Mobile 웹사이트
롯데 콘서트홀(mobile)
- 롯데 콘서트홀 웹사이트를 모바일 기기에 맞춰 새롭게 구현한 모바일 웹사이트
- W3C 웹접근성 검사 및 만점 완료
- 모바일 환경에 맞는 터치 이벤트 중심의 UI를 설계
- Media Query와 JavaScript를 활용하여 해상도별 이미지 최적화 서비스
- JavaScript를 활용하여 index 페이지 스크롤 이벤트 적용
- 가로/세로 화면전환에 따른 유동 레이아웃
- 다양한 디바이스별 테스트
- 햄버거 메뉴 구현
- 제작 기간
- 약 1개월
- 제작 인원
- 1인 (기여도 100%)
- COLOR
- #6a6869
- #e70012
- #ae9b73
- #231816
- 제작 스킬
- HTML5, CSS3, JavaScript, jQuery, Media Query, Ajax, Json, Figma,
Adobe Photoshop, illustrator, W3C 웹 표준 통합 마크업 검사(html/css),
웹 접근성검사 (K-WAH), 크로스브라우징 완료
반응형 웹사이트
APEX LEGENDS
- 게임 apex legends를 주제로 한 반응형 웹사이트
- W3C 웹접근성 검사 및 만점 완료
- JavaScript를 활용하여 해상도에 따라 자동으로 비주얼 영역을 조정.
PC에서는 영상을, 모바일에서는 사진을 자동으로 교체
- 다양한 기기별 해상도에 최적화된 UI를 제공하기 위해Media Query와 JavaScript를 활용하여 사용자 경험을 극대화
- 스크롤 및 마우스 이벤트를 사용하여 동적인 애니메이션 삽입
- 그리드 레이아웃, masonry 활용
- 제작 기간
- 약 1개월
- 제작 인원
- 1인 (기여도 100%)
- COLOR
- #6a6869
- #e70012
- #ae9b73
- #231816
- 제작 스킬
- HTML5, CSS3(Nesting), JavaScript, jQuery, Media Query, Figma,
Adobe Photoshop, iMovie, W3C 웹표준 통합 마크업 검사(html/css),
웹접근성검사(K-WAH), 크로스브라우징 완료