Adobe XD을 통한 UI 계획 ui-planning-adobe-xd
대부분의 경우 새 웹 사이트에 대한 계획은 모형과 정적 디자인에서 시작됩니다. Adobe XD 는 사용자 경험을 구축하기 위한 동급 최고의 디자인 도구입니다. Adobe은 Adobe XD 또는 기타 도구를 사용하여 UI mockup을 사용하여 사이트 구현을 계획하는 것을 권장합니다.
사전 요구 사항 prerequisites
이 자습서는 여러 부분으로 구성되어 있으며 이전 장에 설명된 단계가 완료된 것으로 간주됩니다. 이 챕터는 단순히 관찰 및 학습 부분이므로, 후속 챕터를 계속 진행하려면 별도의 작업이 필요하지 않습니다.
필요한 비디오와 함께 팔로우하십시오. Adobe XD 설치됨, a 무료 체험판이 제공됩니다..
목표
- 에서 제공한 UI 키트 검토 표준 사이트 템플릿 WKND 디자인 팀의 도움을 받을 수 있습니다.
- UI 키트를 사용하여 AEM Sites 구현을 매핑하고 계획하는 방법을 이해합니다.
- 구현을 위해 Adobe XD에서 만든 UI 디자인을 프론트엔드 개발자에게 전달하는 방법을 알아봅니다.
빌드할 내용 what-you-will-build
이 장에서는 Adobe XD 파일 두 개를 검사합니다. 하나는 표준 사이트 템플릿 및 제안된 WKND 사이트에 대한 또 다른 정보를 제공합니다. 다음
표준 사이트 템플릿 UI 키트 standard-site-template-uikit
높은 수준의 단계:
- 다운로드 표준 사이트 템플릿 XD 파일.
- Adobe XD의 UI 키트 Inspect.
- 디자인을 프론트엔드 개발자에게 전달하는 것을 시뮬레이션합니다.
WKND UI 키트 wknd-ui-kit
높은 수준의 단계:
- 다운로드 WKND 문서 XD 파일.
- Inspect WKND 문서 템플릿에 대한 디자인입니다.
축하합니다! congratulations
축하합니다. Adobe XD UI Kit를 사용하여 AEM Sites 구현을 매핑하고 계획하는 방법을 배웠습니다.
추가 UI 키트 사용 가능 을 클릭하여 검사하고 다운로드합니다.
다음 단계 next-steps
다음 장에서는 WKND 문서 디자인을 기반으로 하는 새 페이지 템플릿이 만들어집니다.
만들고 수정하는 방법에 대해 알아봅니다 페이지 템플릿. 페이지 템플릿과 페이지 간의 관계를 이해합니다. 컨텐츠에 대한 세분화된 거버넌스 및 브랜드 일관성을 제공하기 위해 페이지 템플릿의 정책을 구성하는 방법에 대해 알아봅니다. 잘 구성된 매거진 문서 템플릿은 Adobe XD의 목차를 기반으로 만들어집니다.
recommendation-more-help
b2a561c1-47c0-4182-b8c1-757a197484f9