Planejamento da interface do usuário com o Adobe XD ui-planning-adobe-xd
Na maioria dos casos, o planejamento para um novo site começa com modelos e designs estáticos. O Adobe XD é a melhor ferramenta de design do setor para criar experiências de usuário. A Adobe recomenda o planejamento da implementação do Sites por meio do uso de modelos de interface do usuário com o Adobe XD ou outra ferramenta.
Pré-requisitos prerequisites
Este é um tutorial em várias partes e presume-se que as etapas descritas no capítulo anterior foram concluídas. Este capítulo é simplesmente uma parte de observação e aprendizado, nenhuma ação é necessária para poder continuar com os capítulos subsequentes.
Para acompanhar os vídeos que você precisará do Adobe XD instalado, uma avaliação gratuita está disponível.
Objetivo
- Examine o Kit de Interface do Usuário fornecido pelo Modelo de Site Padrão e pela equipe de design da WKND.
- Entenda como os kits de interface do usuário podem ser usados para mapear e planejar uma implementação do AEM Sites.
- Saiba como entregar designs de interface do usuário criados no Adobe XD para um desenvolvedor front-end para implementação.
O que você vai criar what-you-will-build
Neste capítulo, dois arquivos Adobe XD são inspecionados, um para o Modelo de site padrão e outro para o site WKND proposto. O
Kit de interface do usuário de modelo de site padrão standard-site-template-uikit
Etapas de alto nível:
- Baixe o Arquivo XD de Modelo de Site Padrão.
- Inspect o kit de interface do usuário no Adobe XD.
- Simular a entrega dos designs a um desenvolvedor front-end.
Kit de interface do usuário do WKND wknd-ui-kit
Etapas de alto nível:
- Baixe o Arquivo XD do Artigo WKND.
- Inspect os designs do modelo de Artigo WKND.
Parabéns. congratulations
Parabéns, você aprendeu como os Kits de interface do usuário do Adobe XD podem ser usados para mapear e planejar uma implementação do AEM Sites.
Kits de Interface do Usuário adicionais estão disponíveis para inspeção e download.
Próximas etapas next-steps
No próximo capítulo, um novo modelo de página é criado com base no design do Artigo WKND.
Saiba como criar e modificar Modelos de página. Entenda a relação entre um Modelo de página e uma Página. Saiba como configurar as políticas de um Modelo de página para fornecer governança granular e consistência de marca para o conteúdo. Um modelo de Artigo de revista bem estruturado é criado com base em um modelo do Adobe XD.