플러스
프로젝트 배경
[프로젝트명] WKWK.AI 랜딩페이지 개발 [프로젝트 비용] ₩3,500,000 [프로젝트 배경] 이 프로젝트는 기존 영상 편집 시스템의 불편함을 개선하고, AI가 자동으로 영상 편집을 도와주는 서비스를 새롭게 만들기 위한 웹 개발 프로젝트입니다. 누구나 쉽게 사용할 수 있는 직관적인 화면 디자인과 자동화 기능을 중심으로, 사용자의 편의성을 높이고 작업 시간을 줄이는 것을 목표로 했습니다.
위시켓과 함께한 진행 과정
프로젝트 등록
Next.js 기반 AI 영상 자동 제작 서비스 프론트엔드 개발
2025.03.21.
프로젝트 완료
주식회사 크랩스프로젝트 성과
컴포넌트 재사용률 70% 이상 달성
Figma 기반 디자인 시스템을 개발 구조와 연계하여, 재사용 가능한 컴포넌트를 중심으로 페이지 개발 효율 향상.
개발 공수 40% 절감
자체 구축한 아키텍처와 컴포넌트 구조를 활용해, 신규 페이지 제작 속도를 기존 대비 약 40% 단축.
디자인 시스템 통합 운영
Figma 디자인 시스템과 실제 코드 컴포넌트를 일원화하여, 디자이너·개발자 간 협업 생산성 향상.
반응형 UI 구현 완성도 향상
다중 디바이스 환경(PC·태블릿·모바일)에 최적화된 반응형 구조를 적용해, 유지보수 비용 및 QA 리소스 절감.
브랜드 일관성 유지 및 품질 향상
통합된 디자인 시스템을 기반으로 스타일 가이드 자동화를 구현해, 전체 페이지의 시각적 일관성과 완성도를 강화.
핵심 기능
랜딩페이지 반응형 UI/UX 구현
랜딩페이지의 다양한 디바이스(PC, 태블릿, 모바일) 환경에서 자동으로 최적화되는 레이아웃을 적용하여 일관된 사용자 경험 제공.
진행 단계
기획 및 디자인 시스템 확립
2025.08.
Figma 기반으로 페이지 구조와 컴포넌트 설계를 정의하고, Storybook 환경에서 재사용 가능한 디자인 시스템 구축.
프로젝트 상세
[프로젝트명] WKWK.AI 랜딩페이지 개발 [프로젝트 비용] ₩3,500,000 [프로젝트 개요] 클라이언트가 피그마(Figma)로 제작한 디자인 시안을 기반으로, 유지보수와 확장성을 최우선으로 두고 랜딩페이지를 개발했습니다. 단순히 한 페이지를 구현하는 것이 아니라, 이후 서비스 페이지·소개 페이지·대시보드 등 여러 화면으로 자연스럽게 확장할 수 있도록 아토믹 디자인 시스템(Atomic
