Partilhar via

Diretrizes da UX para parceiros da API de Deteção do Marketplace

Esta página contém as melhores práticas para os nossos parceiros conceberem uma experiência de Azure Marketplace. As informações aqui apresentadas destinam-se a programadores envolvidos na criação de integração ponto a ponto com o Catálogo do Marketplace, abrangendo a integração de front-end e a experiência do utilizador, utilizando as APIs do Catálogo do Marketplace.

Esquema de página da galeria geral e ações de utilizador principal

Funcionalidade de pesquisa

  • Pesquisa colocação da barra: posicione a barra de pesquisa de forma proeminente no centro superior da página, junto a filtros e resultados de pesquisa. Esta colocação mantém uma ligação visual e funcional entre a entrada de pesquisa e os resultados.
  • Experiência de pesquisa interativa:
    • Ao clicar: apresentar sugestões, incluindo termos de pesquisa, produtos e histórico de utilizadores com uma opção para limpar entradas anteriores.
    • No tipo: Oferecer sugestões de preenchimento automático.
    • Ao introduzir/procurar: apresentar resultados de pesquisa com opções de filtro. Pode reter filtros ativos durante o processo de pesquisa.
    • Visibilidade: mantenha o termo de pesquisa visível até que o utilizador o limpe ou inicie uma nova pesquisa.

Filtros

  • Colocação: a posição filtra visivelmente, quer seja como um menu vertical à esquerda (com secções expansíveis/desmontáveis) ou como uma barra horizontal na parte superior com menus pendentes ou menus de comprimidos. Os filtros podem ser concebidos para permanecerem constantemente visíveis, ancorados durante toda a navegação do utilizador.
  • Organização e personalização:
    • Filtros de encomendas por relevância e popularidade.
    • Ofereça sugestões de filtro dinâmicas e personalizadas, mostrando contagens de resultados e ajuste da ordem com base na relevância.
    • O grupo filtra de forma coesa, diferente dos elementos de navegação.
  • Filtros sugeridos: para além das opções de filtro padrão, é vantajoso apresentar uma seleção organizada dos filtros mais populares ou relevantes. Este subconjunto deve ser dinamicamente adaptado a cada utilizador, melhorando a personalização da experiência de navegação. À medida que os utilizadores fazem seleções, estes filtros em destaque podem adaptar-se e evoluir, refletindo as preferências ou necessidades em mudança do utilizador individual. Esta abordagem não só simplifica o processo de pesquisa como também apresenta aos utilizadores opções de filtragem potencialmente valiosas que podem não ter considerado inicialmente.

Ordenação

  • Implemente uma lista pendente para opções de ordenação, incluindo relevância, classificações, popularidade e frequência de atualização. Lembre-se das preferências de utilizador para visitas subsequentes.

Pesquisa e filtrar resultados

  • Permitir o refinamento contínuo dos resultados de pesquisa e filtro.

  • Incorpore uma paginação eficiente e otimize os tempos de carregamento da página.

  • Os resultados da pesquisa de exemplo são apresentados aqui:

    Captura de ecrã a mostrar os resultados da pesquisa no ecrã do marketplace.

Pistas de natação e ecrãs de mosaicos de grupo

  • Marcar secções de título claramente, como "Novidades" ou "Tendência".
  • Apresentar três a oito mosaicos à vista, com elementos interativos como carrossels para obter mais conteúdo.
  • Veja mais botões ou ligações que mostram todos os resultados em grupo.

    • São apresentadas pistas de natação de exemplo aqui:

      Captura de ecrã a mostrar as pistas de natação e os mosaicos de grupo apresentados.

Visualizações

  • As vistas de produto podem variar entre as opções de apresentação (mosaicos, lista ou tabela). A nossa pesquisa indica uma preferência pela vista de mosaico depois de procurar comparações mais fáceis. Implemente uma lista pendente para seleção e lembre-se das preferências de utilizador para visitas subsequentes.

    • A vista de mosaico é apresentada aqui:

      Captura de ecrã a mostrar os resultados da pesquisa com a apresentação pendente de vistas.

    • A vista de lista é apresentada aqui:

      Captura de ecrã a mostrar a vista de lista dos resultados da pesquisa.

    • A vista de tabela é apresentada aqui:

      Captura de ecrã a mostrar a vista de tabela dos resultados da pesquisa.

Mosaicos

  • Hierarquia de informações:

    • Essencial: destaques de nome do produto, logótipo, descrição, preços, "Avaliação gratuita".
    • Secundário: nome do publicador, classificações e revisões, categorias, indústrias suportadas, informações de compatibilidade, produtos suportados.
    • Além disso: detalhes da versão/plano, outros destaques (como a solução preferida da Microsoft, a sustentabilidade ou os distintivos de diversidade, etc.), tipos de pacotes.

  • Ações principais:

    • Selecione um mosaico para ver uma página completa de detalhes do produto (PDP).
    • Inclua chamadas claras para a ação (CTAs; por exemplo, "Comprar", "Obter", "Saiba mais") e uma opção de "favoritos".
    • Ofereça mosaicos pequenos ou médios com camadas de informação adicionais apresentadas ao pairar ou clicar.

  • É apresentado um mosaico de exemplo aqui:

    Captura de ecrã a mostrar um exemplo de um mosaico contoso.

Página de detalhes do produto (PDP)

  • Estrutura do conteúdo:
    • Inclua informações de produto abrangentes semelhantes ao formato de informações do mosaico.
    • Incorpore secções como Descrição Geral (descrição do produto e suporte de dados), Planos e Preços, Classificações e Revisões, Detalhes e Suporte.
      • Considere implementar secções com separadores ou um deslocamento de página, onde os separadores permanecem ancorados e facilmente acessíveis como um elemento pegajoso na parte superior da página juntamente com o CTA.
  • Descrição e suporte de dados: mostrar multimédia avançada e texto detalhado para descrever o produto. Separe descrições e destaques como secções quando disponível.
  • Planos e preços, promoções e descontos: mostrar claramente informações de preços; realce quaisquer ofertas ou descontos em curso.
  • Informações do Publicador: inclua detalhes sobre o publicador, ligações de suporte e outros produtos.
  • Interação do utilizador:
    • Limpar CTA: cada página de produto deve orientar o utilizador para uma ação clara, como fazer uma compra ou contactar o publicador.
    • Facilitar ações de página, como comprar, contactar, adicionar aos favoritos e partilhar.
    • Inclua um CTA de compra direta para cada plano para facilitar um processo de compra rápido e simples.
    • Apresentar informações legais e de suporte transparentes e acessíveis.

Classificações e críticas

  • Apresentar em mosaicos de produto e PDP com um formato claro.
  • Permitir filtragem e ordenação de revisões (por exemplo, mais recente, mais útil).
  • Apresentar uma indicação clara das revisões por origem (Marketplace e fornecedores externos, como g2).

Geração de oportunidades potenciais

  • Para listagens nãotransactáveis, inclua um CTA "Contacte-me", capturando detalhes essenciais do utilizador e consentimento legal.

Chamar tipos de ação (CTA)

  • Personalize o texto CTAs de acordo com o tipo de oferta e as opções de transação, como "Obter agora", "Avaliação gratuita" ou "Contacte-me".

    • O separador Descrição Geral é apresentado aqui:

      Captura de ecrã a mostrar a secção descrição geral da página de detalhes do produto.

    • O separador Planos + preços é apresentado aqui:

      Captura de ecrã a mostrar a secção planos de página de detalhes do produto e preços.

    • O separador Classificações + revisões é apresentado aqui:

      Captura de ecrã a mostrar a secção classificações e revisões da página de detalhes do produto.

Principais recomendações para melhorar a experiência do utilizador

  • Estrutura centrada no utilizador: concentre-se na navegação intuitiva e na arquitetura de informação clara.
  • Limpar hierarquia visual: utilize elementos de estrutura para orientar a atenção do utilizador de forma eficaz.
  • Esquemas reativos e adaptáveis: garanta a compatibilidade entre dispositivos e tamanhos de ecrã.
  • Personalização: tire partido dos dados do utilizador para oferecer sugestões e filtros personalizados.
  • Otimização do desempenho: garanta tempos de carga rápidos e interações suaves.
  • Conformidade de acessibilidade: conceção para diversas capacidades de utilizador, incluindo leitores de ecrã e navegação de teclado.
  • Segurança e privacidade: realce as funcionalidades de segurança e as políticas de privacidade, especialmente para transações de pagamento.
  • Suporte ao cliente: forneça acesso fácil ao suporte ao cliente e informações de contacto detalhadas.
  • Atualizações regulares e ciclo de comentários: incorpore feedback dos utilizadores para melhorar continuamente a experiência do marketplace.
  • Controlo de comportamento do utilizador: implemente ferramentas para analisar a forma como os utilizadores interagem com o seu marketplace.
  • Idioma inclusivo: utilize linguagem sem preconceitos no seu conteúdo. Evite estereótipos, gíria e termos ou metáforas culturalmente sensíveis.
  • Localização: a localização é o processo de adaptação de um produto ou conteúdo (incluindo texto e outros elementos) para satisfazer a linguagem, as expectativas culturais e políticas e os requisitos de um mercado local específico (região). Tenha isto em mente ao criar o conteúdo para a sua experiência.

Passos seguintes