미리보기
기본 정보
'디자이너에서 개발자로, 사용자 경험을 극대화하는 문제 해결사' 디자이너 출신 2년 차 프론트엔드 개발자로서, 디자인과 개발의 관점을 모두 이해하며, 기획부터 결과물까지 일관된 퀄리티를 만들어갑니다. 디자이너의 세심한 시선과 개발자의 기술적 구현 역량을 결합해, 견고한 커뮤니케이션 다리 역할을 수행합니다. 제품 개발 과정에서는 항상 '왜(Why)'라는 질문을 중심에 두며, 문제의 본질을 파악하고 구체적이고 실질적인 해결책을 제시합니다. 효율적인 협업 문화를 구축하고, 체계적인 문서화를 통해 팀 내 신뢰를 쌓아왔습니다. 이러한 과정을 통해 팀의 생산성과 사용자 경험을 동시에 극대화하는 데 기여했습니다. 다양한 사회 경험을 바탕으로 빠른 상황 파악과 문제 해결 능력을 갖췄으며, 맡은 일에 책임감과 프로의식을 가지고 끝까지 집중합니다. 팀과 함께 성장하며 신뢰받는 결과물을 만들어가는 개발자로 성장하고자 합니다.
기술 스택
React, TypeScript, Next.js, tailwind-css, react-query, React Context
경력
주식회사유니크굿컴퍼니
사원 | 프로덕트 팀
2022.08. ~ 2024.09. (2년 2개월)
다양한 테마의 게임 콘텐츠를 즐길 수 있는 몰입 경험 플랫폼인 리얼월드를 서비스하는 유니크굿컴퍼니에서 프론트엔드 개발을 담당했습니다.
리얼월드 모바일 앱 연동 웹 페이지 개발과 사용자 경험을 고려한 홈페이지 개선 프로젝트 개발 을 메인으로 전담하였고, 리얼월드 앱과 동일한 사용자 경험을 제공하는 웹 버전으로 이전의 정적인 인터페이스를 동적이고 상호작용이 가능한 페이지로 개선하여 유저에게 보다 몰입도 높은 경험을 제공하는데 기여했습니다.
일일 업무 공유 도입 및 산재되어있는 문서들을 통합하고 관리하고 팀 내의 문서화 시스템을 체계적으로 개선하며 효율적인 협업 문화를 구축하는 데 주도적으로 기여하면서, 팀원들과 함께 성장하는 문화와 병목없는 업무 환경을 조성하고자 했습니다.
Work Performance
리얼월드 모바일 앱 연동 웹 페이지 개발
하이브리드 앱 내 웹 페이지 설계 및 구현으로 모바일 유저 경험 개선
반응형 웹 디자인을 적용해 다양한 모바일 디바이스 호환성 확보
Safari WebView에서 발생한 특정 UI 렌더링 문제를 분석하고 CSS 수정과 WebKit 접두사를 적용해 이슈를 해결하여 모바일 사용자들의 페이지 로드 오류율 감소
홈페이지 개선 프로젝트 메인 개발 담당
홈/상세 페이지 UI/UX 개선 및 성능 최적화
소셜 기능(프로필, 친구 맺기) 구현
사용자 경험을 고려한 온보딩 시스템 구축
개선 후, MAU(월간 활성 사용자 수)가 1만에서 4만으로 400% 증가하며 플랫폼 활성화에 기여
프론트엔드 문서화 시스템 구축
병목 없는 협업 환경을 위해 산재된 개발 문서를 Notion으로 통합하여 체계화하면서 팀 생산성 30% 향상
코드 컨벤션, 트러블슈팅 사례 등을 정리하여 신규 팀원의 온보딩 시간 단축
디자인과 개발의 연결
디자인 의도를 정확히 이해하고 UI/UX 디테일을 살리며 효율적으로 구현
디자이너, 기획자와 원활하게 소통하며 초기 기획 단계에서도 적극적으로 의견을 나누어 서비스 품질 상승에 기여
프로젝트
REALWORLD WEB
주식회사유니크굿컴퍼니
2024.04. ~ 2024.09.
Description
사용자 경험을 고려한 리뉴얼 개선과 유저 간 소셜 기능을 제공하기 위해 진행된 프로젝트.
리얼월드 플랫폼의 사용자 경험을 향상시키고, 다양한 기기에서의 접근성을 높여 더 많은 사용자를 확보를 목표로 진행.
✦ [리얼월드 홈페이지 바로 가기]
Experience
기존 플랫폼은 앱과 전혀 다른 인터페이스와 기능으로 리얼월드 앱 서비스를 소개하는데에만 국한되어 있었으며, 모바일 기기에서 최적화되지 않아 유저 접근성이 제한적이었음. 또한 앱과 웹 모두 사용자 간 상호작용이 부족했고 이를 위해 커뮤니티 기능 도입이 필요하다 판단하였음.
리얼월드 홈페이지의 PC 및 모바일 웹 리뉴얼과 고도화를 전담
로그인/회원가입 및 유저 온보딩 과정을 동적인 애니메이션과 함께 최적화하여 신규 사용자 경험을 개선함
React-Query를 활용하여 기존 API 호출을 80% 감소시키는 캐싱 전략 도입으로 성능 최적화
App Router를 활용하여 애플리케이션 구조를 체계적으로 구성, 코드 가독성과 유지보수성을 대폭 향상
Custom Hook 설계, 공통 모듈화 등으로 팀 내 코드 관리와 협업 생산성을 향상시키며, 유지보수 비용 절감 효과를 달성
정적인 페이지를 앱과 동일한 화면 구조로 개선하여 웹과 앱의 사용자 경험을 통합하고 사용자 경험을 긍정적으로 개선하면서 리얼월드 웹 MAU(월간 활성 사용자 수)가 1만에서 4만으로 400% 증가하며 플랫폼 활성화에 기여함
Tech Stack
Next.js Typescript React-query emotion storybook
REALWORLD WEB PLAY
주식회사유니크굿컴퍼니
2023.02. ~ 2023.07.
Description
리얼월드 앱의 제약에서 벗어나 웹 브라우저를 통해 게임을 즐길 수 있도록 접근성을 개선하고 사용자 경험을 향상시키는 프로젝트
Experience
게임 플레이를 앱 내에서만 즐겨야 한다는 앱 중심의 제한적인 사용자 경험에 대한 극복이 필요했으며, 웹 플레이 과정에서의 커뮤니티 활성도와 참여율이 낮은 문제가 있었음
PC 및 모바일 웹뷰 플랫폼에서 플레이 가능한 도움글 페이지 구현
실시간 도움글 검색 기능과 사진 업로드가 가능한 게시글 작성/수정/삭제 기능 개발
Custom Hook 설계, 공통 모듈화 등으로 팀 내 코드 관리와 협업 생산성을 향상시키며, 유지보수 비용 절감 효과를 달성
웹 브라우저를 통해 게임을 즐길 수 있도록 접근성을 개선하며 리얼월드 웹 활성화에 기여
Tech Stack
Next.js Typescript React-query emotion storybook
너에게 닿기를(Keep in touch)
푸딩캠프
2024.09. ~ 진행 중
푸딩캠프(포트폴리오 만들기)프로그램 산하에서 진행하는 프로젝트에 참여했습니다. 멀어진 친구나 지인에게 메시지를 전달하는 플랫폼으로, 감정적 소통과 관계 회복을 돕기 위해 설계된 서비스입니다. 1차 프로젝트 개발과 배포가 완료된 상태이며, 2차 개발 진행 중이며 완료 이후 운영 예정에 있습니다.
Description
연락이 닿지 않거나 멀어진 친구 및 지인에게 메세지를 전달하는 플랫폼
✦ [1차 개발 완료된 서비스 바로가기 - 너에게 닿기를(Keep in touch)]
1차 개발(24.09.16 ~ 24.10.09 완료)
핵심 기능(메시지 전달) 구현 및 배포 완료
2차 개발(24.11.4 ~ 25.12.29 진행 중)
1차 프로젝트에서 발견된 기술적 해결/도전 과제 수행을 목표로 진행
Experience
관계 단절을 경험한 사용자들에게 쉽게 소통할 수 있는 플랫폼을 제공하고자 한 프로젝트
현재의 2차 프로젝트에서는 1차 프로젝트의 유저 피드백을 반영하기로 결정하며 기존 코드를 기반으로 기술적 해결/도전 과제 수행을 목표로 진행 중이며, 1차 프로젝트에서 경험했던 100% 온라인 협업의 문제점(업무 병목 현상, 낮은 업무 효율성)에 대한 적극적 개선이 필요하다 판단함
Docker 기반 개발 환경 통일 및 CI/CD 자동화로 배포 효율화
App Router를 활용한 애플리케이션 구조 개선으로 코드 가독성과 유지보수성을 향상
프로젝트 전반의 문서화와 Git 브랜치 전략 수립으로 협업 효율성 극대화
프로젝트 기획 및 리드 역할 수행을 통해 업무의 방향성을 설정하고, 팀 내 역할을 명확히 분배하여 프로젝트를 안정적으로 진행하도록 주도함
플랫폼의 안정적 런칭 및 사용자 피드백 기반으로 서비스 개선
팀 내 협업 환경을 적극적으로 체계화하며 프로젝트 진행 성공적으로 순항 중
현재 2차 프로젝트 최종 배포를 앞두고 있음
Tech Stack
Next.js Typescript Tailwind CSS Vitest zod
토닥토닥 포토월
주식회사유니크굿컴퍼니
2022.12. ~ 2022.12.
Experience
'내 트리를 꾸며줘' 라는 성공적인 서비스를 벤치마킹하여 바이럴 효과를 목적으로 한 이벤트 페이지가 필요하다는 홍보처의 요청으로 기획부터 디자인까지 주도적으로 참여하며 진행하게 된 프로젝트.
유저가 감정과 추억을 공유할 수 있는 간단하면서도 감성적인 인터페이스를 제공하고 바이럴 효과를 위한 동적인 사용자 경험 강화가 필요하다는 공통된 의견.
Vite와 React를 사용해 CSR(클라이언트 사이드 렌더링) 기반으로 구현
Swiper를 활용한 페이지 이동 로직 개발
런타임 CSS-in-JS인 Emotion 대신 Zero Runtime 라이브러리인 Stitches를 적용하여 성능 최적화
폴라로이드(이미지) 꾸미기 및 공유 기능 개발
동적인 인터페이스로 사용자에게 감성적인 경험을 제공하며 연말 프로젝트의 바이럴 효과를 달성
새로운 기술 도입으로 개발 효율성과 퍼포먼스를 동시에 개선함
✦ [토닥토닥 포토월 - 현재 deprecate 된 상태입니다.]
Tech Stack
Vite+React Typescript React-hook-form Stitches
포트폴리오
교육
원티드 프리온보딩 프론트엔드 코스
사설 교육
2022.03. ~ 2022.05. | 졸업
대외활동
포트폴리오 만들기 토이스토리
푸딩캠프
이력서 주제를 반영하는 포트폴리오를 위한 토이 프로젝트를 만듭니다. 참여하는 전체 기간 동안 2개의 프로젝트를 제작하며, 출시하고 운영하는 것이 목표입니다. 특정 기간 이상으로 운영하며 서비스를 개선 및 발전시키고, 운영에서 경험하고 얻은 교훈으로 하드스킬과 소프트스킬을 향상시키고자 참여하였습니다.
자기소개
Frontend Development
핵심 기술 스택
Next.js와 React를 활용해 사용자 중심의 웹 서비스 개발에 익숙합니다.
TypeScript로 안정성과 가독성을 높이는 것을 선호합니다.
React-Query를 활용하여 서버 상태 관리 및 성능 최적화를 구현합니다.
상황에 맞는 렌더링 방식(CSR/SSR/SSG)을 적용하며, 웹 표준과 접근성을 준수합니다.
문제 해결 경험
React-Query 캐싱 전략을 통해 기존의 불필요한 API 호출을 80% 감소시키며 성능을 대폭 개선한 경험이 있습니다.
Safari WebView의 크로스 브라우징 이슈를 해결하여 사용자 환경을 안정화했습니다.
재사용 가능한 컴포넌트를 설계하여 코드의 중복을 줄이고 개발 효율성을 높였습니다.
Communication
협업 방식
Figma와 Zeplin을 활용해 디자인 의도를 정확히 파악하고 개발에 반영합니다.
Notion을 통해 프로젝트 진행 상황, 코드 컨벤션, 트러블슈팅 사례를 체계적으로 문서화하여 팀원과 공유합니다. 팀 내 산재된 개발 문서를 Notion으로 체계화해 신규 팀원의 온보딩 기간을 단축하고 팀 생산성을 향상시킵니다.
Git을 활용한 협업에 적극적으로 참여하며, 생산성을 높입니다.
팀워크
주간 회고 및 일일 업무 공지를 통해 팀원들과 진행 상황 및 이슈를 공유합니다.
챕터 내 업무 일정과 프로젝트 진행 사항을 문서화하여 효율적인 업무 환경을 조성했습니다.
디자이너와 기획자와 원활하게 소통하며, 초기 기획 단계에서도 적극적으로 의견을 나누어 서비스 품질을 높였습니다.
Collaborative Leadership
문서화와 체계적인 관리
모든 프로젝트에서 세부적인 문서화를 통해 팀 간 협업의 명확성을 높입니다.
디자인과 개발의 연결
디자인 의도를 빠르게 간파하고 세부 사항을 놓치지 않으며 전체적인 방향성을 유지하고 프로젝트를 주도합니다.
문제 해결 능력
크로스 브라우징 이슈 해결, 재사용 가능한 컴포넌트 설계로 생산성과 품질 동시 달성하고자 합니다.
Professional Mindset
다양한 사회 경험에서 얻은 문제 해결 능력과 책임감을 바탕으로, 맡은 업무에 끝까지 책임을 다하며 결과를 도출합니다.
주도적인 리더십과 오너십을 발휘해, 프로젝트의 시작부터 끝까지 업무를 관리하고 성공적으로 완수합니다.
학습을 통해 기술적 역량과 태도를 지속적으로 발전시키며, 신뢰받는 동료가 되기 위해 노력합니다.
문제 상황에서 객관적으로 판단하고 이해관계자와 적극적으로 소통하며 최선의 해결책을 찾습니다.
세부적인 디테일을 놓치지 않으면서도 프로젝트의 큰 그림을 보며 균형 잡힌 결과를 추구합니다.
디테일에 대한 믿음과 문제 해결 능력을 기반으로 사용자 중심의 가치를 실현하며, 팀의 성과와 협업 문화를 동시에 성장시키는 개발자로 나아가고자 합니다.