본문 바로가기

Design Manual

디자인 관리 사용 매뉴얼

담아(DAMA) 관리자에서 사이트를 직접 꾸미는 방법을 최신 화면 캡쳐와 함께 정리했습니다. 처음 사용하는 사용자도 이 순서대로 따라 하면 테마 선택, 대표 이미지 교체, 색상 설정, 소개 문구 수정, 팝업/배너, 공유 정보, 상단/하단 영역을 직접 설정할 수 있습니다.

담아(DAMA) 디자인 관리 전체 화면
기본 화면 디자인 관리는 사이트 화면을 꾸미는 중심 메뉴입니다.

왼쪽 메뉴의 화면 설정 그룹에서 테마 관리, 디자인 관리, 팝업/배너 관리, SEO/공유 관리, 상단/하단 관리를 순서대로 사용할 수 있습니다. 디자인 관리에는 미리보기와 복구, 페이지별 이미지 카드, 사이트 스타일, 사진 보관함이 함께 표시됩니다.

Latest Menu

최신 디자인 관련 메뉴 구조

최신 관리자에서는 디자인 작업이 화면 설정 그룹으로 정리되어 있습니다. 테마를 먼저 고르고, 디자인 관리에서 이미지와 색상을 맞춘 뒤, 운영 노출과 공유 정보, 상단/하단 영역을 별도 메뉴에서 마무리합니다.

01

테마 관리

  1. 기본 8개 테마 중 기록관 목적에 맞는 화면 구성을 선택합니다.
  2. 사이트 내비게이션에 노출할 섹션을 체크합니다.
  3. 테마를 바꿔도 등록된 사진과 기록 데이터는 유지됩니다.
02

디자인 관리

  1. 대표 이미지와 페이지별 이미지 슬롯을 교체합니다.
  2. 색상 프리셋, 배경색, 포인트 색상을 조정합니다.
  3. 소개 페이지 문구, 이미지 위치, 이미지 크기를 수정합니다.
03

팝업/배너 관리

  1. 첫 방문 팝업을 켜거나 끕니다.
  2. 운영 배너 문구, 링크, 노출 기간을 설정합니다.
  3. 페이지와 기기별 노출 조건을 지정합니다.
04

SEO/공유 관리

  1. 공유 제목과 설명을 입력합니다.
  2. 카카오톡, 문자, SNS에 노출될 대표 이미지를 지정합니다.
  3. 검색과 외부 공유에 적합한 문구로 정리합니다.
05

상단/하단 관리

  1. 브랜드명, 상단 버튼, 모바일 메뉴 방식을 설정합니다.
  2. 하단 문구와 하단 링크를 정리합니다.
  3. PC와 모바일에서 헤더/푸터 표시를 확인합니다.

Before Start

처음 시작하기 전에

디자인 변경은 저장 후 실제 사용자 사이트에 반영됩니다. 안전하게 작업하려면 먼저 미리보기 위치와 복원 방법을 확인한 뒤, 작은 범위부터 수정하는 것이 좋습니다.

01

관리자 접속

  1. 홈페이지에서 로그인합니다.
  2. 상단 회원 메뉴의 관리자 접속을 누릅니다.
  3. 관리자 왼쪽 메뉴에서 디자인 관리를 클릭합니다.

사이트를 꾸미기 전 현재 테마와 공개 섹션을 먼저 확인하려면 테마 관리 메뉴를 먼저 확인하세요.

02

미리보기와 복구 확인

  1. PC 미리보기로 데스크톱 화면을 확인합니다.
  2. 모바일 미리보기로 모바일 화면을 확인합니다.
  3. 저장 후 마음에 들지 않으면 최근 디자인 이력에서 복원합니다.
  4. 처음 상태로 되돌리려면 디자인 초기화를 사용합니다.

저장 전후로 미리보기를 비교하면 이미지가 글자를 가리거나 모바일에서 밀리는 문제를 빨리 찾을 수 있습니다.

03

사진 보관함 확인

  1. 디자인에 사용할 사진은 먼저 사진 관리에 등록되어 있어야 합니다.
  2. 사진이 디자인 보관함에 보이지 않으면 공개 상태와 이미지 등록 여부를 확인합니다.
  3. Google Drive, Dropbox, OneDrive 연동은 설정 그룹의 외부 저장소 연동에서 설정합니다.

외부 저장소 연동은 사진을 가져오기 위한 별도 운영 메뉴입니다. 디자인 관리에서는 등록된 공개 사진을 선택해 화면에 배치합니다.

Step 0

기본 테마와 노출 섹션을 먼저 정합니다.

테마 관리는 사이트의 기본 구조를 고르는 단계입니다. 디자인 관리에서 세부 색상과 이미지를 바꾸기 전에 어떤 화면 구성을 사용할지 먼저 정하면 작업 흐름이 안정적입니다.

  1. 왼쪽 메뉴에서 테마 관리를 클릭합니다.
  2. 기본 테마 선택에서 기록관 성격에 맞는 테마를 고릅니다.
  3. 노출 섹션 관리에서 사용자 사이트에 보여줄 메뉴를 체크합니다.
  4. 저장 후 사이트 보기를 눌러 기본 구조를 확인합니다.

테마는 전체 골격이고 디자인 관리는 세부 편집입니다. 처음에는 테마를 먼저 정한 뒤 색상과 이미지를 조정하세요.

테마 관리와 노출 섹션 관리 화면

Step 1

대표 이미지와 페이지 이미지를 바꿉니다.

디자인 관리 화면에는 미리보기와 복구, 사진 보관함, 페이지별 이미지 카드가 표시됩니다. 각 카드는 실제 사용자 사이트의 첫 화면, 소개, 갤러리 등에 들어가는 이미지 영역입니다.

  1. 바꿀 이미지 카드에서 이미지 교체를 누릅니다.
  2. 오른쪽 사진 보관함에서 사용할 사진을 선택합니다.
  3. 사진이 많으면 보관함의 검색창이나 폴더 필터로 원하는 사진을 찾습니다.
  4. 가운데, 상단, 하단, 왼쪽, 오른쪽 버튼으로 사진 초점을 맞춥니다.
  5. 크기 슬라이더로 사진 확대 비율을 조정합니다.

사진 보관함에는 공개 사진만 표시됩니다. 원하는 사진이 없다면 사진 관리에서 공개 상태와 이미지 등록 여부를 먼저 확인하세요.

디자인 관리 이미지 카드와 사진 보관함 화면

Image Layout

이미지 위치와 크기를 조정하는 방법

디자인 관리에서는 이미지 카드 위치와 크기, 이미지 초점을 함께 조정할 수 있습니다. 모바일에서는 카드가 세로로 정렬되므로 PC 배치 후 모바일 미리보기를 꼭 확인합니다.

04

드래그 배치

  1. 이미지 카드의 사진 영역을 마우스로 잡습니다.
  2. 원하는 위치로 드래그합니다.
  3. 카드 우하단 조절 핸들로 카드 너비를 조정합니다.
  4. 크기 슬라이더로 사진 내부 확대 비율을 다시 맞춥니다.

중요한 얼굴, 장소, 물건은 카드 중앙에 오도록 맞추면 화면이 안정적으로 보입니다.

05

소개 문구 수정

  1. 디자인 관리에서 소개 페이지 영역을 찾습니다.
  2. 상단 라벨, 상단 제목, 상단 본문을 입력합니다.
  3. 아카이브 노트에는 기록관 목적을 적습니다.
  4. 포인트 1~3에는 방문자가 알아야 할 특징을 짧게 정리합니다.

본문은 2~3문장 단위로 끊어 쓰면 모바일에서도 읽기 쉽습니다.

Step 2

사이트 색상과 분위기를 정합니다.

사이트 스타일 영역에서 색상 프리셋과 세부 색상을 조정합니다. 색상은 전체 사이트 분위기를 빠르게 바꾸는 가장 쉬운 방법입니다.

  1. 먼저 따뜻한 성장, 깨끗한 화이트, 다크 갤러리, 차분한 기록 같은 프리셋을 선택합니다.
  2. 사이트 배경은 전체 배경색입니다.
  3. 탑메뉴 배경, 브랜드 글자, 메뉴 글자는 상단 메뉴 가독성에 영향을 줍니다.
  4. 포인트 컬러는 버튼, 라벨, 강조 요소에 사용됩니다.
  5. 자료 목록, 라벨 컬렉션, 기록 타임라인, 소개 화면 배경을 각각 다르게 줄 수 있습니다.

처음에는 프리셋을 고른 뒤 포인트 컬러만 바꾸는 방식이 가장 안전합니다.

디자인 관리 사이트 스타일과 색상 설정 화면

Step 3

운영 배너와 첫 방문 팝업을 설정합니다.

팝업/배너 관리는 공지, 이벤트, 업데이트 안내를 방문자에게 보여주는 메뉴입니다. 최신 화면에서는 운영 현황 요약, 운영 배너 입력, 첫 방문 팝업 설정, 실시간 미리보기를 함께 확인할 수 있습니다.

  1. 왼쪽 메뉴에서 팝업/배너 관리를 클릭합니다.
  2. 운영 배너 표시를 체크하고 배너 문구와 링크를 입력합니다.
  3. 배너 노출 페이지와 배너 톤을 선택합니다.
  4. 팝업을 사용할 경우 첫 방문 팝업 표시를 체크합니다.
  5. 팝업 제목, 본문, 버튼 문구, 버튼 링크를 입력합니다.
  6. 시작일, 종료일, 노출 기기, 노출 페이지를 설정합니다.

팝업은 너무 자주 뜨면 방문자가 불편할 수 있습니다. 기간과 페이지 조건을 꼭 지정하세요.

팝업 배너 관리 화면

Step 4

공유 제목, 설명, 대표 이미지를 설정합니다.

SEO/공유 관리는 카카오톡, 문자, SNS에 사이트 주소를 보냈을 때 보이는 제목과 설명, 대표 이미지를 정하는 메뉴입니다. 현재 적용 이미지와 사진 보관함을 보면서 공유 이미지를 교체할 수 있습니다.

  1. 왼쪽 메뉴에서 SEO/공유 관리를 클릭합니다.
  2. 공유 제목에는 사이트 이름이나 기록관 이름을 입력합니다.
  3. 공유 설명에는 기록관을 한 문장으로 설명합니다.
  4. 공유 이미지 선택을 누르거나 사진 보관함에서 대표 사진을 지정합니다.
  5. 저장 후 사이트 주소를 메신저에 붙여 넣어 미리보기를 확인합니다.

공유 이미지는 가로형 사진이 안정적입니다. 얼굴이나 주요 대상이 중앙에 있는 사진을 고르세요.

SEO 공유 관리 화면

Step 5

상단과 하단 영역을 정리합니다.

상단/하단 관리는 사이트의 브랜드 영역, 메뉴 방식, 하단 문구와 링크를 정리하는 메뉴입니다. 상단 영역과 하단 영역이 나뉘어 있어 방문자가 자주 보는 문구와 버튼을 따로 관리할 수 있습니다.

  1. 왼쪽 메뉴에서 상단/하단 관리를 클릭합니다.
  2. 상단 스타일을 기본형, 컴팩트형, 투명형 중에서 선택합니다.
  3. 브랜드명, 브랜드 링크, 상단 버튼 문구와 링크를 입력합니다.
  4. 모바일 메뉴 방식을 햄버거 또는 하단 고정 중에서 선택합니다.
  5. 하단 영역 표시 여부, 하단 문구, 하단 링크를 입력합니다.

상단 버튼은 “자료 보기”, “문의하기”, “프로필 보기”처럼 방문자 행동을 이끄는 문구가 좋습니다.

상단 하단 관리 화면

Save Guide

저장 전 최종 확인

아래 항목을 확인한 뒤 저장하면 사용자에게 보이는 화면 오류를 줄일 수 있습니다.

체크리스트

  • 상단 메뉴 글자가 배경 위에서 잘 보이나요?
  • 테마 관리에서 필요한 섹션만 노출하도록 체크했나요?
  • 모바일에서 이미지와 버튼이 겹치지 않나요?
  • 소개 문구가 너무 길어 화면을 밀어내지 않나요?
  • 대표 이미지의 얼굴이나 주요 대상이 중앙에 있나요?
  • 외부 저장소에서 가져온 사진은 사진 관리에 등록되고 공개 상태인가요?
  • 팝업 시작일과 종료일이 맞게 설정됐나요?
  • 공유 제목과 대표 이미지가 사이트 목적을 잘 보여주나요?
  • 하단 영역에 문의 링크나 필요한 안내 링크가 들어갔나요?
  • PC 미리보기와 모바일 미리보기를 모두 확인했나요?
추천

처음 꾸밀 때 순서

  1. 테마 관리에서 기본 테마와 노출 섹션을 선택합니다.
  2. 디자인 관리에서 색상 프리셋을 고릅니다.
  3. 처음 화면 대표 이미지 2~3장을 교체합니다.
  4. 소개 페이지 제목과 본문을 수정합니다.
  5. 상단/하단 관리에서 브랜드명과 버튼을 정리합니다.
  6. SEO/공유 관리에서 공유 제목, 설명, 이미지를 설정합니다.
  7. PC와 모바일 미리보기를 확인한 뒤 저장합니다.
복구

마음에 들지 않을 때

  1. 디자인 관리 화면으로 돌아갑니다.
  2. 미리보기와 복구 영역의 최근 디자인 이력을 확인합니다.
  3. 원하는 이력의 복원을 누릅니다.
  4. 사이트 보기를 눌러 복원 결과를 확인합니다.

복원은 디자인 설정을 되돌리는 기능입니다. 사진과 기록 데이터 자체를 삭제하지 않습니다.