Product Card

Exemplo de exibição de um produto como Card inspirado na Amazon.

A Amazon apresenta diferentes conteúdos em sua ficha de produto. Principalmente relacionado à outras ofertas e formas de entrega.

O componente foi dividido nos seguintes containers:

O ideal é que cada container tenha os elementos:

Heavy Product Card - Amazon

O exemplo abaixo demonstra um produto com muitas informações. O ideal é que no dia-a-dia a ficha do produto não tenha tantas informações.

Um ponto interessante que a Amazon utiliza é exibir a opção Mais formatos. Desta forma o consumidor pode visitar variações do produto que está sendo apresentado. Podendo apresentar os SKU's que estão relacionados àquele produto.

Título da imagem
Novidade
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:
Título da imagem
Muito procurado
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:
Título da imagem
BraveInnov Recomenda
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:

Light Product Card - Amazon

O exemplo abaixo demonstra um produto com menos informações.

Título da imagem
BraveInnov Recomenda
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:
Título da imagem
BraveInnov Recomenda
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:
Título da imagem
BraveInnov Recomenda
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:
Título da imagem
Novidade!
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:

Live Product

Exemplo de produto com atualizações de informações via WebSocket.

Título da Imagen
Novidade!
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
  • 2 itens em estoque
  • 23 pessoas visualizando
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete
Mais formatos:
Título da Imagen
Novidade!
Iphone Titulo do produto com texto longo, semelhante ao encontrado na Amazon
Descrição simples sobre o produto. Nem todos os layouts exibirão esta informação.
  • 2 itens em estoque
  • 23 pessoas visualizando
Preço
R$
200
99
R$
200
99
Mais opções de compra
R$
200
99
(3 ofertas de produtos novos e usados)
  • Entrega em 24 Horas
  • Na compra de até R$100,00 Frete Grátis Texto muito longo. Analisar como é apresentado.
  • R$29,90 de Frete