SaaS, 분석 서비스
Umami
분석 서비스의 가치를 큰 제목과 실제 제품 화면으로 설명하는 마케팅 홈. 기능이 복잡한 SaaS의 첫 화면을 설계할 때 참고합니다.
섹션 이미지 11
원본 사이트를 직접 캡처한 장면입니다. 이미지를 눌러 전체 높이로 살펴보세요.
11개 이미지
크게 보기히어로와 제품 화면
히어로큰 제목과 가입 CTA 뒤에 실제 제품 화면을 배치한 소개 구성입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기제품 가치와 기능 요약
기능·콘텐츠 묶음제목·설명과 제품 예시의 정보 위계를 참고하는 캡처입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기유입 분석 기능 소개
제품·UI 예시제목·설명과 제품 예시의 정보 위계를 참고하는 캡처입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기행동 분석 기능 소개
제품·UI 예시제목·설명과 제품 예시의 정보 위계를 참고하는 캡처입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기전환과 재방문 기능 소개
제품·UI 예시제목·설명과 제품 예시의 정보 위계를 참고하는 캡처입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기수익 분석 기능 소개
제품·UI 예시제목·설명과 제품 예시의 정보 위계를 참고하는 캡처입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기AI 연동 소개
기능·콘텐츠 묶음제목·설명과 제품 예시의 정보 위계를 참고하는 캡처입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기프라이버시 설명
신뢰·근거홈페이지 후반부의 신뢰 형성과 행동 유도 구성을 참고합니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기오픈소스와 지표
신뢰·근거홈페이지 후반부의 신뢰 형성과 행동 유도 구성을 참고합니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기하단 가입 CTA
CTA홈페이지 후반부의 신뢰 형성과 행동 유도 구성을 참고합니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗
크게 보기푸터와 정보 탐색
푸터제품·자료·회사 링크를 나눈 푸터 구성입니다.
출처·촬영 조건
원본 사이트의 현재 데스크톱 화면을 직접 캡처했습니다. UIZZE가 보관한 팩 이미지와 다른 시점의 자료입니다.
CSS 뷰포트 1584 × 929 px. 정지 화면이며 실제 동작을 재현하지 않습니다.
원본 사이트 ↗디자인 연구를 위한 화면 기록입니다. 이미지에 포함된 브랜드·사진·서체 등 원본 소재의 프로젝트 사용 조건은 별도로 확인하세요.
구성 분석
첫 화면: 내비게이션 → 서비스 분야 → 핵심 가치 제목 → 짧은 설명 → 시작 버튼 → 대시보드 이미지.
제품 화면이 서비스 설명 뒤에 이어져 방문자가 결과물을 먼저 예상할 수 있습니다.
디자인 관찰
2026-10-27 원본 사이트 첫 화면 관찰: 밝은 바탕, 중앙 정렬의 큰 검정 제목, 넓은 위아래 여백. 파란색은 시작 버튼과 짧은 안내에 사용됩니다.
제품 이미지는 실제 서비스의 소개 자료입니다. 로그인한 대시보드의 필터·빈 상태·오류 처리를 확인한 것은 아닙니다. 정확한 서체명·색상 코드·크기 수치는 측정하지 않았습니다.
적용 메모
제품이 해결하는 문제를 한 문장으로 먼저 정리합니다.
예시 차트는 우리 서비스의 실제 데이터와 화면으로 교체하고, 한 번에 설명할 기능 수를 줄입니다.
가입 버튼과 데모 확인 중 프로젝트의 우선 행동을 하나 정합니다.
프로젝트 적용 기록
아직 실제 프로젝트에 적용하지 않았습니다.
출처와 확인 범위
UIZZE 팩 ID·링크와 캡처 조건은 제공된 2026-10-27 조사 보고서의 Umami 상세 관찰에 근거합니다.
이번 구성·디자인 분석은 2026-10-27 원본 홈을 1440 × 1000 CSS px 데스크톱으로 직접 확인한 기록입니다. 팩의 2026-10-21 캡처와 현재 홈은 별도 시점입니다.
2026-10-27 원본 사이트의 섹션별 직접 캡처를 추가했습니다. 촬영 시점·뷰포트·출처는 각 이미지에 기록하며, 기존 UIZZE 팩의 캡처 조건과 구분합니다.
원본 사이트의 공개 홈페이지를 직접 캡처한 섹션 이미지와 자체 분석을 보관합니다. UIZZE가 보관한 이미지·DESIGN.md·코드·폰트 파일은 복제하지 않았습니다. 캡처 안의 브랜드·사진·서체 등 원본 소재의 프로젝트 사용 조건은 별도 확인 대상입니다.
UIZZE 자료 모음 →