토끼처럼 빠르게 흡수하고
거북이처럼 묵묵히 일하는
빠른 대응력으로 유연하게 움직이면서도
흐트러짐 없이 꾸준한 실행력으로 기본을 지키며 완성도를 높여가는
UI개발자 진승열입니다.
About
금융 서비스 화면 구현에서 시작해, 지금은 카페24 13개 브랜드 자사몰의 퍼블리싱과 운영을 혼자 맡고 있습니다.
웹 표준을 지킨 시맨틱 마크업과 반응형 레이아웃, 크로스브라우징을 기본으로 하이브리드 앱과 홈페이지, React 환경까지 퍼블리싱합니다. 공통 컴포넌트를 먼저 정의한 마크업 가이드로 화면을 조립해 일관성과 속도를 함께 챙깁니다.
항상 프로젝트의 목표를 중심에 두고 디자이너, 개발자와 협업합니다. 최근에는 Claude Code 같은 AI 도구를 퍼블리싱 워크플로에 들여 반복 수정과 배포를 자동화하고, 필요한 도구는 직접 만들어 씁니다.
2025.09 ~ ing
닥터블릿헬스케어
2021.10 ~ 2025.08
로움아이티
2021. 09
웹디자인기능사 - 한국산업인력공단
2021. 03 ~ 2021.08
UI/UX 반응형 웹디자인&웹퍼블리셔 - 그린컴퓨터아카데미
세모리포트 앱의 공통 컴포넌트를 먼저 정의한 마크업 가이드입니다. 컴포넌트마다 구조와 클래스 기준 표, 예시 코드, 모바일 목업 프리뷰를 한 페이지에 두어, 이후 화면은 가이드에서 골라 조립하는 방식으로 만들었습니다.
Skills
Works
참여
|100%
역할
|13개 브랜드 자사몰 퍼블리싱 전담, 디자인 토큰 체계와 AI 보조 워크플로우 설계
기술
|HTML, CSS, JavaScript, GSAP, GitHub Actions, Google Apps Script, Figma, Tokens Studio
환경
|Cafe24 13개 브랜드 monorepo
성과
|퍼블리셔 3인이 4개 브랜드씩 분담하던 자사몰 운영을 1인 전담으로 맡아, 브랜드별 디자인 토큰과 수정 레시피를 정리하고 Claude Code 기반 파이프라인으로 요청 접수부터 staging 검증, 운영 배포까지 잇는 구조를 만들었습니다.
참여
|100%
역할
|퍼블리싱, 마크업 가이드 설계 및 구축
기술
|HTML, CSS, jQuery
환경
|하이브리드 앱
성과
|공통 UI 컴포넌트를 정의한 마크업 가이드 구축으로 개발 속도 향상 및 효율성 개선
참여
|100%
역할
|퍼블리싱
기술
|HTML, CSS, jQuery, Chart.js, w2ui
환경
|웹 앱
성과
|표와 숫자로는 비교가 어려운 세무 자료수집 현황을 Chart.js 믹스 차트와 도넛 차트, 정렬과 필터가 되는 w2ui 그리드로 한눈에 비교되게 구성. 센터, 확인, 토스트 팝업을 규격화하고 오류와 세션 만료 같은 예외 화면까지 빠짐없이 구축
참여
|100%
역할
|퍼블리싱
기술
|React, SCSS, TypeScript
환경
|웹 앱
성과
|업무 카드와 날짜 선택처럼 반복되는 요소를 props 기반 컴포넌트로 분리해 디자인 시안과 1:1로 맞춘 화면을 빠르게 생산. 모든 props를 TypeScript 타입으로 명시해 데이터와 UI 연결 오류를 컴파일 단계에서 막고, SCSS를 리셋, 전역, 모듈 3계층으로 나눠 스타일 충돌 없이 유지보수
참여
|앱(신규 40%, 유지운영 60%), 홈페이지(100%)
역할
|퍼블리싱, 홈페이지 프론트 개발 및 배포
기술
|HTML, CSS, jQuery, AWS(S3, CloudFront, Route 53)
환경
|홈페이지, 하이브리드 앱
성과
|Ajax 통신을 통한 데이터 렌더링 및 신청 페이지 개발 및 도메인 분리를 통한 PC/모바일 별 맞춤 UI 제공
참여
|앱(신규 40%, 유지운영 60%), 홈페이지(100%)
역할
|퍼블리싱, 홈페이지 프론트 개발 및 배포
기술
|HTML, CSS, jQuery, GA4, AWS(S3, CloudFront, Route 53)
환경
|홈페이지, 하이브리드 앱
성과
|홈페이지 AWS 정적 배포로 클라이언트 요구사항에 신속 대응 및 운영 효율 개선, GA4를 활용해 홈페이지의 사용자 흐름 분석
참여
|100%
역할
|기획 일부 참여, 퍼블리싱, 프론트 개발 및 배포
기술
|HTML, CSS, jQuery, AWS(S3, CloudFront, Route 53)
환경
|홈페이지
성과
|순수 바닐라 스크립트를 활용한 스크롤 인터랙션 및 카카오 지도 API 연동을 통한 사용자 경험 제공
참여
|신규 40%, 유지운영 60%
역할
|퍼블리싱
기술
|HTML, CSS, jQuery
환경
|하이브리드 앱
성과
|SVN 및 HTML 산출물 페이지 구축을 통한 업무 프로세스 30% 단축
참여
|신규 70%, 유지운영 30%
역할
|퍼블리싱
기술
|HTML, CSS, jQuery
환경
|하이브리드 앱
성과
|CSS 하드웨어 가속을 활용한 프레임 속도 2배 향상 및 Mobiscroll.js를 활용한 달력 적용
Frontend Side Projects
기술
|React, Styled Components, Firebase, Axios
설명
|TMDB API를 활용해 인기 콘텐츠를 실시간으로 제공하는 OTT 플랫폼 클론 프로젝트입니다. Firebase 인증으로 로그인과 회원가입을 구현하고, 반응형 UI로 다양한 디바이스에서 동일한 경험을 제공합니다.
기술
|React, Context API, Axios, Express
설명
|Context API로 주문 상태를 전역 관리하는 여행 상품 주문 웹앱입니다. 상품과 옵션 선택부터 주문 요약, 완료까지 3단계 흐름을 구현했고, 상품과 주문 API를 제공하는 Express 서버를 직접 만들었습니다. 데모는 서버 응답을 내장한 정적 빌드로 동작합니다.