주식회사 럿지가 공식 인증한 제작 포트폴리오를 모았습니다. 현재 73개 공식 인증 포트폴리오
BAKSAL BEAUTY는 병원·성형외과·피부과 홈페이지 제작 의뢰를 위해 구축한 실전형 웹사이트 데모입니다. 프리미엄 클리닉 랜딩, 시술 카탈로그와 상세 페이지, 다국어 라우팅, 블로그 SEO, 제작 문의 폼, 첨부파일 업로드, 관리자 CMS, 문의 관리 데스크까지 병원 홈페이지가 실제 운영 자산으로 작동하는 흐름을 Next.js 기반으로 구현했습니다.
Affilytics는 기업과 인플루언서를 연결하고 CPS 기반 성과 추적과 정산을 자동화하는 인플루언서 마케팅 운영 플랫폼입니다. 캠페인 등록, 인플루언서 지원과 승인, 고유 추적 링크 발급, 클릭·전환 기록, CPS 정산 검토, 관리자 통합 운영까지 실제 MVP 운영에 필요한 핵심 흐름을 Next.js 기반 SaaS로 구현했습니다.
DARIMA는 시네마틱 영상, 게임 캐릭터 데이터베이스형 정보 구조, AI 페르소나 Q&A, 보안 문의 폼, SEO/RSS/sitemap까지 한 번에 구현한 인터랙티브 랜딩페이지입니다. 단순한 회사 소개 페이지가 아니라 방문자가 스크롤하면서 캐릭터 세계관과 제작 역량을 동시에 경험하도록 설계했습니다. 데스크톱/모바일 분리 영상, 스킬 액션 인터랙션, 게시판형 AI 응답, Cloudflare Turnstile 검증 문의, AWS SES 기반 이메일 라우팅을 포함해 실제 홈페이지 제작문의 전환까지 연결되는 쇼케이스입니다.
주간보호센터와 데이케어센터가 지역 검색 랜딩페이지, 전화·카카오·문의폼, 보호자 상담 기록, 재연락 업무, 방문상담 예약, 유입경로 리포트, 계좌이체 기반 청구를 한 흐름으로 운영할 수 있게 만든 프론트오피스 CRM입니다.
의정부가온주간보호센터(장기요양보험 지정기관) 홈페이지 구축. 치매예방, 미술·음악치료, 인지활동 등 프로그램 안내와 상담문의/오시는 길 정보를 직관적으로 제공.
AI 시네마틱 영상과 콘솔 게임 메인 화면 UX를 결합한 인터랙티브 홈페이지입니다. 일반적인 스크롤형 랜딩 대신, 사용자가 왼쪽 플로팅 메뉴에서 장면을 선택하면 전환 영상이 재생되고 이후 해당 장면의 루프 영상과 HUD UI가 이어지는 방식으로 설계했습니다. 핵심 구현 • GPT Image로 만든 우주 토마토 키비주얼을 첫 프레임 포스터와 히어로 무드로 사용 • Higgsfield 기반 루프 영상과 전환 영상을 Next.js App Router 화면 상태와 연결 • 메인 화면, 새로운 시작, 불러오기, 문의하기, 설정 메뉴를 게임 시퀀스처럼 탐색하도록 구성 • 전환 영상 첫 프레임이 로드되기 전 opacity를 제어해 깜빡임을 줄이고, 영상 종료 후 목표 장면으로 이동 • 문의하기 화면은 관제실 콘셉트의 콘솔 폼, 입력 필드, 송신 상태 피드백까지 구현 화면 구성 • 메인 화면: 거대한 우주 토마토와 함선이 등장하는 풀스크린 시네마틱 배경 • 새로운 시작: 브랜드 진입 동선과 첫 프레임 각인을 설명하는 미션 콘솔 • 불러오기: 제작 로그와 블로그/아카이브 진입을 위한 기록 보관소 콘셉트 • 문의하기: 전환 영상 이후 관제실 배경 위에 문의 콘솔 폼 표시 • 설정: 영상 루프 안정화, 접근성, 검색 신호 연결을 다루는 운영 패널 프로젝트 의미 AI 이미지/영상 제작 도구와 프론트엔드 상태 전환을 결합해, 브랜드 홈페이지도 게임 메인 화면처럼 기억에 남는 경험으로 만들 수 있음을 보여주는 데모입니다. 교육 콘텐츠에서는 GPT Image, Higgsfield, Next.js를 연결하는 제작 파이프라인 예제로 활용할 수 있습니다.
프로젝트 개요 오희진 피부과의원의 전문성과 프리미엄 이미지를 강화하기 위해 하이엔드 메디컬 브랜딩 중심 랜딩페이지를 기획·개발하였습니다. 기존 피부과 웹사이트의 획일적인 구조에서 벗어나, 의료 전문성과 고급 뷰티 브랜드 감성을 동시에 전달할 수 있도록 다크 럭셔리 컨셉 + 첨단 피부 진단 시스템 + 맞춤형 프로그램 UX를 중심으로 설계했습니다. 방문자가 단순히 정보를 읽는 수준을 넘어, 병원의 철학과 기술력, 시술 결과에 대한 신뢰를 자연스럽게 체감하고 상담 예약까지 이어질 수 있도록 구성한 고전환 프리미엄 의료 랜딩페이지 프로젝트입니다. 주요 작업 내용 (고도화 포함) 1. 브랜드 리포지셔닝 중심 메인 랜딩 설계 Hero Section에 강렬한 브랜드 메시지 구성 “섬세한 진단, 자연스러운 결과” 핵심 카피라이팅 제작 경쟁 병원 대비 차별화된 프리미엄 포지셔닝 설계 브랜드 신뢰도를 높이는 메디컬 럭셔리 구조 적용 예약 전환 중심 CTA 동선 설계 2. 다크 하이엔드 UI/UX 디자인 구축 블랙 / 샴페인골드 / 웜브라운 컬러 시스템 적용 고급 호텔·럭셔리 브랜드 감성의 레이아웃 설계 넓은 여백과 대형 타이포그래피 중심 디자인 의료기관 특유의 안정감과 고급감을 동시에 표현 3. 첨단 피부 정밀 진단 시스템 강조 3D 피부 촬영 및 분석 시스템 소개 섹션 구성 색소 / 탄력 / 모공 / 피부톤 분석 시각화 UI 적용 AI 기반 피부 상태 리포트 구조 설계 진단 결과 → 맞춤 프로그램 연결 UX 구현 4. 맞춤 프로그램 탐색 시스템 고도화 리프팅 / 색소·미백 / 여드름·흉터 / 스킨부스터 / 바디라인 카테고리 분류 클릭형 필터 UI 적용으로 빠른 탐색 구조 구현 프로그램별 카드형 정보 제공 모바일 환경에서도 직관적인 사용성 강화 5. 고객 신뢰도 강화 콘텐츠 구성 누적 진료 건수 / 피부 진단 건수 / 만족도 / 재방문율 데이터 시각화 정품·정량 사용 정책 강조 풍부한 시술 경험 및 의료진 전문성 소개 프리미엄 사후 관리 시스템 안내 6. 상담 전환 최적화 시스템 구축 빠른 예약 버튼 상시 노출 카카오톡 실시간 상담 연결 시간 외 예약 접수 자동화 구조 광고 유입 전용 CTA 반복 배치 모바일 상담 전환률 최적화 UI 설계 7. 이벤트 / 매출형 운영 시스템 첫 방문 고객 이벤트 섹션 구축 리프팅 패키지 / 스킨케어 패키지 / 시즌 프로모션 운영 구조 설계 관리자 수정형 이벤트 카드 UI 제작 SNS 광고 랜딩과 연결 가능한 이벤트 모듈화 구성 8. 후기 / 콘텐츠 마케팅 구조 구축 고객 후기 슬라이더 UI 제작 시술 만족 후기 카드형 콘텐츠 구성 블로그 / SNS / 검색 콘텐츠 확장 구조 설계 장기 SEO 운영을 고려한 콘텐츠 허브 형태 설계 9. 퍼포먼스 및 SEO 최적화 Core Web Vitals 대응 최적화 이미지 Lazy Loading 적용 지역 키워드 SEO 구조 설계 “강남 피부과”, “리프팅 추천”, “피부 진단 피부과” 검색 대응 모바일 퍼스트 속도 최적화 진행 10. 유지보수 및 확장성 구조 설계 컴포넌트 기반 섹션 분리 제작 시술 항목 추가/수정 용이한 구조 이벤트 / 후기 / 프로그램 독립 운영 가능 향후 다국어 페이지 및 앱 연동 확장 고려 프로젝트 성과 상담 문의 전환율 +63% 향상 프리미엄 시술 문의 비중 증가 평균 체류 시간 3.1배 상승 모바일 예약 비율 대폭 증가 병원 브랜드 이미지 고급화 성공 광고 효율(CPA) 개선 및 재방문율 상승
프로젝트 개요 오뷰티 피부과 의원의 차별화된 의료 철학과 프리미엄 이미지를 전달하기 위해 하이엔드 브랜드형 랜딩페이지를 기획·개발하였습니다. 기존 피부과 랜딩페이지들이 밝고 유사한 구조에 집중되어 있는 반면, 본 프로젝트는 다크 프리미엄 컨셉 + 미래형 피부 진단 시스템 + 고기능 의료 브랜딩을 중심으로 차별화했습니다. 방문자가 단순히 시술 정보를 보는 것이 아니라, “정확한 진단 → 맞춤 솔루션 → 안전한 시술 → 자연스러운 결과”라는 흐름을 경험하도록 설계된 고전환 의료 마케팅 랜딩페이지입니다. 주요 작업 내용 (고도화 포함) 1. 브랜드 리뉴얼형 랜딩 구조 설계 Hero Section에 강렬한 브랜드 메시지 배치 “정확한 진단, 섬세한 변화” 핵심 카피 개발 일반 피부과와 다른 프리미엄 이미지 강조 스크롤형 스토리텔링 구조 설계 상담 예약 중심 CTA 동선 구축 2. 다크 프리미엄 UI/UX 디자인 구축 블랙 / 딥퍼플 / 핑크 네온 컬러 시스템 적용 고급 뷰티 디바이스 브랜드 느낌의 UI 구성 경쟁 병원 대비 차별화되는 미래형 비주얼 완성 고가 시술 고객층을 겨냥한 신뢰 중심 디자인 3. AI 피부 정밀 진단 시스템 표현 3D 피부 스캔 진단 섹션 구성 모공 / 탄력 / 색소 / 유수분 밸런스 시각화 UI 개인 맞춤 프로그램 추천 구조 설계 진단 후 상담 전환 CTA 연결 4. 시술 프로그램 필터 시스템 고도화 리프팅 / 스킨부스터 / 피부관리 / 색소미백 / 필러 / 바디라인 카테고리 구현 클릭형 필터 UI 적용 각 프로그램별 카드 상세 구조 제작 모바일에서도 손쉬운 탐색 UX 구현 5. 의료 신뢰도 강화 시스템 누적 시술 건수 실시간 강조 UI 고객 만족도 / 재방문율 / 후기 수치화 노출 정품 정량 사용 정책 소개 사후 관리 시스템 강조 섹션 구성 6. 전환율 최적화 상담 시스템 빠른 상담 예약 버튼 상시 노출 카카오톡 실시간 상담 연동 시간 외 예약 접수 자동화 구조 광고 유입 랜딩페이지 맞춤 CTA 반복 배치 7. 이벤트 / 매출형 프로모션 시스템 첫 방문 고객 할인 배너 패키지 상품 카드형 가격 UI 제작 월별 프로모션 관리자 수정 구조 설계 SNS 광고용 이벤트 섹션 별도 제작 8. 후기 / 콘텐츠 마케팅 구조 구축 고객 후기 슬라이더 시술 전후 스토리형 후기 카드 제작 블로그 / 인스타그램 연계 콘텐츠 동선 구축 검색 유입용 콘텐츠 확장 고려 구조 설계 9. 성능 및 SEO 최적화 이미지 Lazy Load Core Web Vitals 대응 지역 키워드 SEO 구조 설계 피부과 / 리프팅 / 강남 피부과 등 검색 최적화 모바일 속도 중심 퍼포먼스 튜닝 프로젝트 성과 상담 문의 전환율 +57% 증가 광고 유입 대비 예약 전환율 상승 평균 체류 시간 2.9배 증가 프리미엄 시술 문의 비중 증가 병원 브랜드 이미지 고급화 성공 경쟁 피부과 대비 차별화된 온라인 포지셔닝 확보
프로젝트 개요 리프팅, 피부관리, 스킨부스터, 색소·미백, 쁘띠 시술 등 피부과 핵심 진료 항목을 중심으로 프리미엄 피부과 브랜드 랜딩페이지를 기획·제작하였습니다. 단순한 병원 소개 페이지가 아닌, 방문자가 첫 진입부터 시술 이해 → 신뢰 형성 → 상담 문의 → 예약 전환까지 자연스럽게 이어질 수 있도록 설계했으며, 고급스럽고 세련된 브랜드 이미지를 강조했습니다. 여성 고객층과 피부과 특유의 섬세한 니즈를 반영해 직관적인 필터 구조, 감성적인 비주얼, 빠른 상담 전환 UX를 결합한 의료 특화 랜딩페이지입니다. 주요 작업 내용 (고도화 포함) 1. 메인 랜딩 구조 전략 설계 Hero Section 중심 브랜드 메시지 설계 “자연스러운 아름다움” 핵심 카피라이팅 구성 첫 화면 상담예약 / 카카오 상담 CTA 배치 사용자 이탈률을 낮추는 상단 고정 예약 버튼 적용 스크롤 동선 기반 콘텐츠 흐름 최적화 2. 시술 필터 시스템 고도화 리프팅 / 피부관리 / 스킨부스터 / 색소·미백 / 바디 등 카테고리 필터 구현 클릭 시 해당 시술 카드 즉시 전환되는 인터랙션 적용 사용자 관심 시술 빠른 탐색 UX 설계 모바일 환경에서도 손쉬운 탭형 필터 구조 구현 3. 전환율 중심 상담 UX 구축 카카오톡 실시간 상담 연결 상담예약 폼 최소 입력 구조 설계 시간 외 상담 신청 자동 접수 기능 스크롤 중간마다 CTA 반복 배치 전화 문의 / 온라인 예약 / 카카오 상담 멀티 전환 구조 구축 4. 프리미엄 비주얼 디자인 강화 피부과 특화 베이지 / 아이보리 / 로즈브라운 컬러 시스템 구축 고급 화장품 브랜드 감성의 타이포그래피 적용 Before / After보다 자연미 강조 중심 이미지 구성 여백 중심 레이아웃으로 고급스러운 신뢰감 연출 5. 신뢰도 강화 콘텐츠 시스템 의료진 전문성 소개 섹션 구성 누적 시술 건수 / 만족도 / 후기 수치화 UI 제공 고객 후기 슬라이더 제작 실제 병원 내부 이미지 및 공간 브랜딩 노출 자주 묻는 질문(FAQ) 아코디언 구조 적용 6. 이벤트 / 프로모션 운영 시스템 구축 첫 방문 고객 이벤트 배너 제작 월별 프로모션 가격 카드 UI 설계 관리자에서 쉽게 수정 가능한 이벤트 영역 분리 시즌별 이벤트 운영 가능 구조 설계 7. 퍼포먼스 & SEO 최적화 이미지 Lazy Loading 적용 Core Web Vitals 대응 최적화 검색 노출을 위한 메타 SEO 구성 지역 기반 키워드 구조 설계 (강남 피부과 / 리프팅 추천 등) 모바일 속도 최적화 및 경량 애니메이션 적용 8. 유지보수 구조 고도화 컴포넌트 기반 섹션 분리 제작 시술 추가 시 관리자 수정이 쉬운 구조 설계 이벤트 / 후기 / FAQ / 가격표 독립 관리 가능 향후 다국어 페이지 확장 고려 구조 설계 프로젝트 성과 상담 문의 전환율 +41% 향상 모바일 예약 비중 +63% 증가 평균 체류 시간 2.4배 증가 시술 상세 페이지 클릭률 상승 병원 브랜드 이미지 고급화 성공 광고 랜딩페이지 전환 효율 개선
프로젝트 개요 새빛교회의 비전과 공동체 가치를 효과적으로 전달하고, 성도와 방문자가 쉽고 편리하게 교회 정보를 확인할 수 있도록 프리미엄 교회 메인 홈페이지 및 디지털 플랫폼을 기획·개발하였습니다. 단순한 소개형 홈페이지를 넘어, 예배 안내 · 설교 콘텐츠 · 다음세대 사역 · 온라인 헌금 · 새가족 등록 · 커뮤니티 기능까지 통합한 현대형 교회 웹 플랫폼으로 구축했으며, 따뜻하고 신뢰감 있는 브랜드 이미지를 중심으로 설계했습니다. 모바일 사용 비중이 높은 교회 특성을 고려해 전 디바이스에서 편리하게 이용 가능한 반응형 구조로 제작하였습니다. 주요 작업 내용 1. 프리미엄 메인 랜딩페이지 구축 교회 비전을 강조하는 Hero Section 구성 감성적인 메인 비주얼과 따뜻한 브랜드 톤앤매너 적용 예배 안내 / 새가족 등록 / 온라인 헌금 CTA 배치 첫 방문자도 쉽게 이해 가능한 정보 흐름 설계 2. 교회 소개 및 비전 콘텐츠 구성 담임목사 인사말 교회 역사 및 핵심 가치 소개 사명 선언문 / 비전 메시지 구성 오시는 길 및 주차 안내 페이지 제작 3. 예배 안내 및 설교 시스템 구축 주일예배 / 수요예배 / 금요기도회 / 새벽예배 안내 유튜브 설교 영상 자동 연동 시스템 최신 설교 / 시리즈 설교 / 주제별 설교 정리 모바일 최적화 영상 시청 UX 구현 4. 다음세대 / 부서 사역 소개 영유아부 / 유치부 / 유년부 / 청소년부 / 청년부 구성 부서별 사진 및 소개 콘텐츠 제공 교육 프로그램 및 모임 일정 안내 5. 커뮤니티 / 소식 / 행사 기능 교회 공지사항 게시판 행사 일정 캘린더 사진 갤러리 및 사역 스케치 업로드 기능 새가족 등록 신청 폼 구현 6. 온라인 헌금 시스템 구축 일반헌금 / 선교헌금 / 감사헌금 / 건축헌금 안내 간편 온라인 헌금 페이지 제작 계좌 안내 및 헌금 절차 UX 최적화 7. 관리자(Admin) 기능 구축 공지사항 등록 / 수정 / 삭제 설교 영상 관리 행사 일정 등록 관리 새가족 신청 내역 관리 메인 배너 및 콘텐츠 수정 시스템 8. 반응형 및 퍼포먼스 최적화 Desktop / Tablet / Mobile 완벽 대응 고연령층도 쉽게 사용하는 UI 설계 빠른 로딩 및 SEO 최적화 적용 유지보수 가능한 구조 설계 프로젝트 성과 교회 브랜드 이미지 고급화 모바일 방문자 이용률 및 체류시간 증가 온라인 헌금 및 새가족 등록 전환 향상 설교 콘텐츠 재생률 증가 성도 대상 정보 전달 효율 개선
프로젝트 개요 교회의 비전과 사역 방향성을 효과적으로 전달하고, 성도 및 방문자들이 필요한 정보를 쉽고 빠르게 확인할 수 있도록 호산나교회 공식 메인 홈페이지를 기획·개발하였습니다. 단순한 소개형 웹사이트를 넘어, 예배 안내 · 설교 영상 · 교회 소식 · 다음세대 사역 · 온라인 헌금 · 커뮤니티 기능까지 포함한 디지털 교회 플랫폼으로 구축하였으며, 전 세대가 편리하게 사용할 수 있도록 반응형 중심 UX로 설계했습니다. 주요 작업 내용 1. 메인 랜딩 구조 설계 Hero Section에 교회 비전 메시지 강조 방문자가 첫 화면에서 교회 정체성을 이해할 수 있도록 구성 예배 시간 / 위치 / 새가족 안내 CTA 배치 2. 교회 소개 콘텐츠 구축 담임목사 인사말 교회 역사 및 비전 소개 사역 철학 및 핵심 가치 정리 오시는 길 / 주차 안내 제공 3. 예배 및 설교 시스템 구축 주일예배 / 수요예배 / 새벽예배 시간 안내 유튜브 설교 영상 연동 최신 설교 / 시리즈 설교 아카이브 구성 모바일에서도 편리한 영상 시청 UX 적용 4. 교회 소식 / 커뮤니티 기능 공지사항 게시판 행사 일정 캘린더 교우 소식 / 사진첩 기능 새가족 등록 신청 폼 구현 5. 온라인 헌금 및 사역 지원 간편 온라인 헌금 안내 페이지 구축 선교 / 다음세대 / 구제 사역 후원 연결 QR / 계좌 / 신청형 구조 제공 6. 반응형 UI/UX 최적화 PC / Tablet / Mobile 완벽 대응 고연령층도 쉽게 사용하는 직관적 UI 설계 빠른 접근 버튼 및 단순한 메뉴 구조 적용 프로젝트 성과 교회 공식 브랜드 이미지 향상 온라인 방문자 정보 접근성 대폭 개선 설교 콘텐츠 재방문율 증가 온라인 헌금 / 새가족 등록 전환 개선 모바일 사용자 만족도 향상
프로젝트 정보 프로젝트명: 리오성형외과 모바일 앱 & 관리자 시스템 구축 프로젝트 금액: 2,800만원 제작 기간: 75일 참여 역할: PM / UIUX 디자인 / 앱 개발 / 관리자 시스템 개발 / 백엔드 구축 프로젝트 개요 리오성형외과의 디지털 전환을 위해 상담, 예약, 견적, 수술 후 관리까지 하나의 앱에서 처리 가능한 통합 의료 플랫폼을 기획·개발하였습니다. 기존 오프라인 중심 상담 구조를 개선하고, 고객이 언제 어디서든 비대면으로 상담을 신청하고 예상 견적을 확인하며 예약까지 진행할 수 있도록 설계했습니다. 또한 관리자 페이지를 통해 상담 현황, 고객 관리, 예약 일정, 매출 통계, 광고 유입 데이터까지 통합 운영할 수 있는 병원 전용 CRM + 모바일 앱 서비스를 구축했습니다. 주요 작업 내용 1. 비대면 상담 프로세스 구축 앱 내 상담 신청 / 사진 업로드 / 희망 시술 선택 기능 구현 실시간 채팅 상담 및 상담 이력 저장 기능 개발 상담 상태별 관리 (접수 / 진행중 / 완료 / 재상담) 상담원 자동 배정 로직 설계 2. AI 모의 얼굴 견적 시스템 구축 얼굴 사진 업로드 후 부위 분석 기능 구현 눈, 코, 윤곽, 가슴 등 시술별 예상 견적 확인 기능 시뮬레이션 이미지 제공 구조 설계 사용자 맞춤 패키지 추천 시스템 개발 3. 예약 및 결제 시스템 구축 상담 후 앱 내 수술 예약 기능 구현 일정 선택 / 담당 의료진 선택 / 예약금 결제 구조 설계 예약 변경 및 취소 기능 제공 알림톡 / 푸시 알림 연동 4. 수술 후 케어 시스템 회복 체크리스트 기능 제공 경과 사진 업로드 및 의료진 피드백 기능 약 복용 / 내원 일정 푸시 알림 고객 만족도 설문 시스템 구축 5. 관리자(Admin) 시스템 구축 상담 고객 CRM 관리 예약 스케줄 캘린더 시스템 고객 상태 분류 및 상담 히스토리 조회 광고 유입 / 상담 전환율 / 매출 통계 대시보드 직원 권한별 접근 제어 시스템 구현 6. 마케팅 / 커뮤니티 기능 이벤트 배너 운영 시스템 전후사진 콘텐츠 관리 고객 후기 운영 페이지 앱 푸시 기반 재방문 유도 구조 설계 성과 비대면 상담 전환율 +68% 증가 예약 문의 응답 속도 75% 단축 상담 → 예약 전환율 34% 향상 고객 재방문율 상승 및 운영 자동화 달성 병원 내부 상담 인력 업무 효율 대폭 개선
럿지 담당자와의 대화
