SYSTEM BLUEPRINT

브랜드 홈페이지
방문자와 운영자의 화면 여정

첫인상부터 Work·Insight 발행과 국영문·SEO 검수까지 연결한 화면 설계입니다.

스토리보드란?

스토리보드는 실제 사이트가 완성되기 전에 방문자와 운영자의 화면을 미리 확인하는 문서입니다. 각 화면은 제안서의 약속과 연결됩니다.

  1. 방문자가 브랜드를 보고 Work와 Insight를 탐색하는 흐름
  2. 운영자가 사례와 글을 발행하고 국영문·SEO를 점검하는 흐름

마지막까지 보시면 브랜드 경험과 운영 방식이 어떻게 함께 바뀌는지 그려지실 것입니다.

방문자 시나리오

발견에서 신뢰까지

브랜드 첫인상에서 Work 사례와 인사이트 글로 이어지는 방문 여정입니다.

1. 홈 도착

브랜드 첫 화면과 대표 사례

2. Work 탐색

분야별 사례를 살펴봄

3. 상세 확인

이미지와 과정·결과 확인

4. Insight 읽기

전문성 있는 글 탐색

5. 언어 전환

국영문 콘텐츠 연결

방문자 | 화면 01

브랜드 홈

/preview/u1_wf1
WORK / INSIGHTWORK · INSIGHT · ABOUTKR / EN
SELECTED WORK
브랜드의 방향을
보여주는 공간
2026.09 · 대표 사례
첫 화면

브랜드의 방향을
보여주는 공간

2026.09 · 대표 사례

공간의 언어
브랜딩 · 2026추천
제품의 맥락
디지털 · 2026신규
사람의 이야기
캠페인 · 2025게시됨
MORE TO EXPLORE
다음 이야기를 살펴보세요Work 24건 · Insight 18건
LATEST STORY
사례와 생각을 한곳에서2026.09.29 업데이트

[화면 개요 및 목적]

홈의 시각 기준을 승인받아 기본 테마 느낌을 피합니다. 데모 Step 1에서 첫인상과 반응형 구성을 확인합니다.

[핵심 기능 로직]

대표 Work와 모션 진입점을 첫 화면에 두고 모바일에서는 같은 정보 순서를 유지합니다.

  • 담당자가 직접 확인
    WordPress 편집·미리보기
방문자 | 화면 02

Work 목록과 상세

/preview/u1_wf2
WORK / INSIGHTWORK · INSIGHT · ABOUTKR / EN
SELECTED WORK
작업의 결과를
이야기로 읽다
전체 24건 · 브랜딩 8건
Work 탐색

작업의 결과를
이야기로 읽다

전체 24건 · 브랜딩 8건

공간의 언어
브랜딩 · 2026선택됨
제품의 맥락
디지털 · 2026게시됨
사람의 이야기
캠페인 · 2025게시됨
MORE TO EXPLORE
다음 이야기를 살펴보세요Work 24건 · Insight 18건
LATEST STORY
사례와 생각을 한곳에서2026.09.29 업데이트

[화면 개요 및 목적]

사례를 직관적으로 찾아 상세 맥락까지 읽는 화면입니다. 데모 Step 2에서 탐색을 체험합니다.

[핵심 기능 로직]

분야별 필터와 큰 이미지 카드로 사례를 고르고 상세 페이지에서 결과를 확인합니다.

  • 담당자가 직접 확인
    WordPress 편집·미리보기
방문자 | 화면 03

Insight와 언어 전환

/preview/u1_wf3
WORK / INSIGHTWORK · INSIGHT · ABOUTKR / EN
SELECTED WORK
생각을 쌓는
브랜드 저널
2026.09.29 · 최신 글
Insight

생각을 쌓는
브랜드 저널

2026.09.29 · 최신 글

좋은 공간의 기준
인사이트 · 09.29신규
디자인의 지속성
리서치 · 09.18게시됨
Making Space
English · 09.12EN 연결
MORE TO EXPLORE
다음 이야기를 살펴보세요Work 24건 · Insight 18건
LATEST STORY
사례와 생각을 한곳에서2026.09.29 업데이트

[화면 개요 및 목적]

외부 블로그를 내부 Insight로 통합하고 국영문 탐색을 보여줍니다. 데모 Step 4로 연결됩니다.

[핵심 기능 로직]

발행 날짜와 주제를 가진 글 목록, KR/EN 전환을 같은 화면에서 확인합니다.

  • 담당자가 직접 확인
    WordPress 편집·미리보기
운영자 시나리오

입력에서 발행까지

사례·글 등록부터 언어와 검색 설정 검수까지 담당자가 직접 처리합니다.

1. 콘텐츠 선택

Work 또는 Insight 선택

2. 자료 입력

제목·이미지·본문 작성

3. 미리보기

PC·모바일 화면 확인

4. 언어·SEO

번역 짝과 메타 정보 입력

5. 발행·검수

게시 상태와 사이트맵 확인

운영자 | 화면 01

Work 등록과 미리보기

/preview/u2_wf1
WORK / INSIGHTWORK · INSIGHT · ABOUT관리자
CONTENT STUDIO
새 사례를
바로 발행하다
공간의 언어 · 대표 이미지 6장
Work 편집

새 사례를
바로 발행하다

공간의 언어 · 대표 이미지 6장

제목
공간의 언어입력 완료
대표 이미지
6장 업로드미리보기
게시 상태
2026.09.29임시 저장
운영 체크
미리보기에서 발행까지PC·Mobile · 국문·영문
발행 상태
초안과 게시를 한눈에2026.09.29 업데이트

[화면 개요 및 목적]

이미지·본문을 입력해 Work 사례를 직접 발행하는 구조입니다. 데모 Step 3에서 확인합니다.

[핵심 기능 로직]

필수 필드만 입력하고 PC·모바일 미리보기를 거쳐 게시·수정·삭제합니다.

  • 담당자가 직접 확인
    WordPress 편집·미리보기
운영자 | 화면 02

Insight 글 발행

/preview/u2_wf2
WORK / INSIGHTWORK · INSIGHT · ABOUT관리자
CONTENT STUDIO
새 글을 쓰고
일정을 정하다
좋은 공간의 기준 · 820자
Insight 편집

새 글을 쓰고
일정을 정하다

좋은 공간의 기준 · 820자

초안
09.29 작성임시 저장
발행 예약
10.02 09:00예약
지난 글
09.18 발행게시됨
운영 체크
미리보기에서 발행까지PC·Mobile · 국문·영문
발행 상태
초안과 게시를 한눈에2026.09.29 업데이트

[화면 개요 및 목적]

주간·월간 글을 담당자가 쓸 수 있는 내부 에디터입니다. 데모 Step 3과 이어집니다.

[핵심 기능 로직]

글 본문·카테고리·예약일을 편집하고 초안·예약·게시됨을 구분합니다.

  • 담당자가 직접 확인
    WordPress 편집·미리보기
운영자 | 화면 03

언어·SEO 오픈 검수

/preview/u2_wf3
WORK / INSIGHTWORK · INSIGHT · ABOUT관리자
CONTENT STUDIO
언어와 검색을
마지막까지 확인
국문↔영문 · 메타 제목 56자
출시 점검

언어와 검색을
마지막까지 확인

국문↔영문 · 메타 제목 56자

언어 연결
KR / EN완료
XML 사이트맵
2026.09.29완료
도메인·SSL
연결 검수확인 필요
운영 체크
미리보기에서 발행까지PC·Mobile · 국문·영문
발행 상태
초안과 게시를 한눈에2026.09.29 업데이트

[화면 개요 및 목적]

국영문 연결과 검색 노출, 도메인·SSL·매뉴얼 인계를 한 번에 점검합니다. 데모 Step 4에서 확인합니다.

[핵심 기능 로직]

페이지별 메타 제목·설명·OG 이미지와 사이트맵, 구글·네이버 등록 상태를 확인합니다.

  • 담당자가 직접 확인
    WordPress 편집·미리보기
시나리오

| 화면 01

[화면 개요 및 목적]

[핵심 기능 로직]

    | 화면 02

    [화면 개요 및 목적]

    [핵심 기능 로직]

      | 화면 03

      [화면 개요 및 목적]

      [핵심 기능 로직]