EN
모든 작업

Comfy Org (ComfyUI) · 2025.09 – 2026.03

ComfyUI Cloud 온보딩 – 가입·초대·이메일 인증 플로우와 스플래시 화면

ComfyUI Cloud 런칭 온보딩: 가입·초대·이메일 인증과 브랜드 스플래시 화면

역할
프론트엔드 코어팀 · 온보딩 플로우 개발
기간
2025.09 – 2026.03
기술
  • Vue 3
  • TypeScript
  • Firebase
  • Sentry
ComfyUI Cloud 온보딩 – 가입·초대·이메일 인증 플로우와 스플래시 화면

개요

ComfyUI Cloud 런칭에 맞춰 타이트한 일정 속에서 신규 사용자가 처음 만나는 온보딩 플로우를 설계하고 개발했습니다.

배경

문제

Cloud 런칭 일정에 맞춰 디자인이 실시간으로 전달되는 환경에서, 신규 사용자의 첫 경험을 빠르게 만들어야 했습니다.

주요 작업

  • Firebase 인증 기반 가입·로그인, 초대 코드, 이메일 인증 체크와 폴링, 로그인 사용자용 대기자(waitlist) 화면, 온보딩 설문
  • Router Guard로 접근 제어, WebSocket 재연결 시 원치 않는 로그인 리다이렉트 방지, 페이지 새로고침 시 인증 메일 중복 발송 방지
  • 인증 API 호출에 Sentry 에러 트래킹 추가, Cloud 배포용 Open Graph·Twitter 메타 태그 적용
  • 로고 물결 채움 로더와 Vue 로드 전 스플래시 화면을 설계해 대기 시간을 브랜드 경험으로 개선 (SPA 폴백 깨짐 방지를 위한 CSS 인라인화 포함)

성과

  • Cloud 런칭 온보딩 단독 개발

    가입부터 초대, 이메일 인증, 대기자 화면까지 신규 사용자의 첫 경험을 책임지는 화면을 개발했습니다.

핵심 기능

  • 01

    초대 코드 플로우

    이미 로그인한 사용자는 로그인 단계를 건너뛰고 바로 초대를 수락합니다.

  • 02

    이메일 인증 폴링

    인증 메일 확인을 자동으로 감지해 다음 단계로 넘어가고, 중복 발송을 막았습니다.

  • 03

    스플래시와 로딩 모션

    Vue가 로드되기 전부터 브랜드 스플래시와 로고 로더를 보여줍니다.