이 문서에서는 AEM 스타일 시스템을 사용하여 조직의 디자이너, 콘텐츠 작성자 및 개발자가 고객이 기대하는 속도와 규모로 경험을 만들고 제공할 수 있는 권한을 부여하는 방법을 알아봅니다.
AEM 스타일 시스템에는 다음과 같은 네 가지 주요 이점이 있습니다.
5단계 설정은 표준 구성 요소 개발 워크플로와 매우 유사합니다.
리더십 | 디자이너 | 개발자/아키텍트 | 템플릿 작성자 | 콘텐츠 작성자 |
---|---|---|---|---|
해당 구성 요소에 대한 콘텐츠 및 목표 결정 | 콘텐츠의 시각적 및 경험적 표현 결정 | 경험을 지원하기 위한 CSS 및 JS 개발. 사용할 클래스 이름 정의 및 제공 | 개발자가 정의한 CSS 클래스 이름을 추가하여 스타일이 지정된 구성 요소에 대한 템플릿 정책을 구성합니다. 각 스타일에 대해 사용자에게 친숙한 이름을 활용해야 합니다. | 페이지를 작성하는 동안 에서는 필요에 따라 스타일을 적용하여 원하는 모양과 느낌을 얻을 수 있습니다 |
이것이 초기 설정이지만 많은 고객이 이 프로세스를 간소화하여 추가적인 민첩성을 달성했습니다. 예를 들어 CSS를 DAM에 업로드하여 배포 없이 스타일을 업데이트할 수 있습니다. 다른 고객에게는 배포나 개발 없이 활용할 수 있는 구성 요소와 스타일을 개발할 수 있는 모든 기능을 갖춘 유틸리티 클래스 세트가 있습니다.
스타일 시스템은 다음과 같은 몇 가지 유형으로 제공됩니다.
레이아웃 스타일
디자인 및 레이아웃에 대한 다면적인 변경 사항
잘 정의되어 있고 식별 가능한 렌디션에 사용됨
스타일 표시
스타일의 기본 특성을 변경하지 않는 작은 변형
예를 들어 색상 구성표, 글꼴, 이미지 방향 등을 변경할 수 있습니다.
정보 스타일
이러한 기능에 대한 데모 버전을 보려면 다음을 시청하는 것이 좋습니다. 고객 성공 웨비나 윌 브리즈번과 조셉 반 버커크와 함께.
스타일 시스템은 복잡한 대화 상자의 필요성을 줄이지만 대화 상자를 대체할 수는 없습니다. 이러한 구성 요소는 작업을 단순화하는 데 도움이 되지만 구성 요소 속성이나 대화 상자에 스타일 시스템을 만드는 대신 해당 구성 요소 속성을 사용하려는 경우가 있을 수 있습니다.
개발 관점에서 프로세스를 간소화할 수 있습니다. 하나의 스타일 시스템으로 동일한 콘텐츠를 여러 번 볼 수 있습니다. 마찬가지로 작성 측면에서는 작성자 및 작성자가 팰리스에서 사용할 구성 요소를 기억해야 하는 대신 작성 속도를 향상시킬 수 있습니다.
모든 것이 깨끗하다. 핵심 구성 요소 내의 HTML은 매우 장황합니다. CSS 수준에서 이 모든 작업을 수행하면 구성 요소 빌드가 더 빨라지고 코드도 더 깔끔해집니다.
마지막으로, 스타일 시스템의 사용은 과학보다 예술이다. 앞에서 설명한 대로 여러 가지 우수 사례가 있지만 조직의 설정을 사용자 지정하는 방법을 유연하게 사용할 수 있습니다.
자세한 내용은 다음을 참조하십시오. 고객 성공 웨비나 윌 브리즈번과 조셉 반 버커크와 함께.
에서 전략 및 사고 리더십에 대해 자세히 알아보십시오 고객 성공 허브.