설명서AEMAEM as a Cloud Service 튜토리얼

Coworker를 사용하여 적응형 양식으로 AEM Sites 연락처 페이지 만들기

마지막 업데이트: 2026년 10월 10일
  • 적용 대상:
  • Experience Manager as a Cloud Service

작성 대상:

  • Beginner
  • Intermediate
  • Developer

[AEM Forms as a Cloud Service]{class="badge informative"}

개요

Coworker Enterprise는 자연어 지침을 사용하여 Adobe Experience Manager(AEM)에서 작업을 수행하는 AI 지원 방법을 제공합니다. 모든 작성 및 구성 단계를 수동으로 수행하는 대신, 사용자는 만들고자 하는 경험을 설명할 수 있으며, Coworker는 AEM 내에서 지원되는 작업을 실행하는 데 도움을 줄 수 있습니다.

동료는 상호 작용하며 참조 페이지, 기존 구성 또는 사용할 서비스와 같은 추가 정보가 필요할 때 후속 질문을 할 수 있습니다. 이를 통해 AI 지원 작성을 기존 AEM 에셋, 구성 요소, 양식 및 통합과 결합할 수 있습니다.

이 문서에서는 페이지 및 적응형 양식 만들기, 우편번호 조회 구성, 기존 Azure 스토리지 구성에 대한 양식 제출 설정 등 AEM Sites 연락처 환경을 구축하는 데 Coworker를 사용합니다.

이 자습서에서는 Coworker​를 사용하여 다음을 포함하는 AEM Sites 문의하기 페이지를 만드는 방법을 보여줍니다.

  • 전면적인 은행업을 테마로 한 배너
  • AEM Sites 페이지에 포함된 적응형 양식
  • 2열 양식 레이아웃
  • 태블릿 및 모바일 장치용 반응형 동작
  • 고객 정보 및 조회 세부 정보의 논리적 그룹화

페이지는 다음 위치에 만들어집니다.

/content/bankingapplication/us/contact-us

사전 요구 사항

시작하기 전에 다음을 확인하십시오.

사이트 페이지를 만들고 수정하는 데 필요한 권한과 적응형 Forms을 사용하여 AEM 환경에 액세스할 수 있습니다.

이 문서 전체에서 사용되는 예에서 bankingapplication은 환경에 구성된 AEM 프로젝트이며, 연락처 페이지는 /content/bankingapplication/us 아래에 생성됩니다.

AEM 프로젝트 이름과 콘텐츠 구조가 다를 수 있습니다. 이 문서의 예제 경로를 AEM 환경에 적합한 프로젝트 이름 및 콘텐츠 위치로 바꿉니다.

마찬가지로 적응형 Forms 및 관련 에셋은 프로젝트에 적절한 위치에 만들 수 있습니다. 이 문서에 표시된 동일한 경로를 사용할 필요는 없습니다.

1단계: 동료 열기

Coworker를 열고 만들 페이지를 설명하는 자연어 요청을 제공합니다.

프롬프트에 다음이 포함되어야 합니다.

  1. 페이지 위치
  2. 원하는 페이지 구조
  3. 배너 요구 사항
  4. 적응형 양식 요구 사항
  5. 2열 레이아웃
  6. 반응형 비헤이비어
  7. 양식에 필요한 필드
  8. 시각적 및 접근성에 대한 기대치

일반적으로 세부 프롬프트는 "Create a Contact Us page"와 같은 짧은 요청보다 예측 가능한 결과를 생성합니다.

2단계: 페이지 만들기 프롬프트 제공

다음 프롬프트를 복사하여 Coworker에 붙여넣습니다.

2단계: 페이지 만들기 프롬프트 제공

다음 프롬프트를 복사하여 Coworker에 붙여넣습니다.

AEM Sites에서 다음 콘텐츠 경로에 연락처 페이지를 만들고 싶습니다.

/content/bankingapplication/us

페이지 요구 사항

1. 전체 금융 배너

  • 페이지의 전체 너비에 걸쳐 있는 배너/영웅 이미지를 추가합니다.
  • 최신 뱅킹 및 금융 서비스 테마​를 사용하여 적합한 배너 이미지를 만드십시오.
  • 비주얼은 신뢰, 전문성, 보안 및 고객 서비스를 전달해야 합니다.
  • 배너는 데스크탑, 태블릿 및 모바일 레이아웃에서 잘 작동해야 합니다.

2. 적응형 양식​에 문의

  • 페이지 하단에서 AEM Sites 페이지 내에 직접 AEM 적응형 양식​을(를) 추가합니다.
  • 데스크톱에서 양식 필드를 나란히 두 개의 패널/열​로 논리적으로 구성하십시오.
  • 태블릿과 모바일 장치에서 패널은 응답형 경험을 제공하기 위해 세로로 스택되어야 합니다.

왼쪽 패널 - 내 정보

  • 이름
  • 이메일 주소
  • 상세 주소
  • 도시
  • 상태
  • 우편 번호

오른쪽 패널 - 어떻게 도와드릴까요?

  • 조회 유형
  • 제목
  • 메시지 / 댓글
  • 기본 연락 시간

전체 양식의 균형을 맞추고 쉽게 사용할 수 있도록 제출 단추를 양식 필드 아래의 논리적 위치에 배치합니다.

페이지 위치

다음 위치에 문의하기 페이지를 만듭니다.

/content/bankingapplication/us/contact-us

동료의 후속 질문에 답변

프롬프트를 제출한 후 Coworker는 AEM Sites 페이지를 만들기 전에 추가 질문을 할 수 있습니다. 이러한 질문은 Coworker가 기존 사이트 구조, 디자인 규칙, 사용 가능한 구성 요소 및 원하는 구현을 이해하는 데 도움이 됩니다.

동료 응답

Coworker-respone

recommendation-more-help
experience-manager-learn-help-cloud-service