Documentação do Steamworks
Recursos gráficos de promoções na loja
Caso esteja à procura de todas as especificações de recursos do Steam, consulte Recursos gráficos: vista geral.

Muitos dos grandes eventos do Steam, incluindo as promoções regulares definidas pela Valve, contam com imagens e ilustrações de tamanhos específicos utilizados exclusivamente nesses espaços promocionais.

Pode aceder a todos os modelos para Photoshop e detalhes aqui: MODELOS ATUAIS
(Atenção: use este novo modelo e remova quaisquer versões anteriores.)


Muitos destes recursos podem ser criados por si, com o auxílio da sua equipa de design. Envie estes recursos para a Valve com, pelo menos, uma semana de antecedência para que possamos enviar feedback e as nossas equipas de tradução tenham um prazo adequado para os traduzir. Os banners do Steam são sempre traduzidos para mais de 26 idiomas.
ATENÇÃO: estes são os requisitos associados ao envio dos recursos:
  • **Todos os recursos devem ter menos de 5 MB**.

    O QUE NOS DEVE ENVIAR
  • Ficheiros do Photoshop (PSD) com layers
    • A ilustração principal do jogo ou da personagem deve estar na maior resolução possível e, de preferência, ser um smart object. Assim, poderemos reutilizar estes recursos gráficos para criar outras imagens promocionais do Steam sempre que necessário.
    • O logótipo deve estar separado da ilustração e, de preferência, ser um smart object.
    • Todos os textos devem ser editáveis e colocados numa pasta separada com o nome "text" no documento PSD para que seja facilmente traduzido pelas nossas equipas.
  • Deve incluir todos os tipos de letra utilizados (especialmente os tipos de letra personalizados).
Recursos animados
  • No caso de recursos animados, deve fornecer também uma sequência ininterrupta em loop nos formatos MP4 e PNG, sem o texto nem o logótipo. Nenhum texto deve ser animado de forma a facilitar a respetiva tradução pelas nossas equipas.
  • Tente fornecer animações com cerca de 3 a 5 segundos de duração. Este requisito ajuda a garantir o tamanho ideal para apresentação no Steam. Todos os ficheiros finais exportados devem ter menos de 5 MB..
  • Tente manter a animação lenta e pouco garrida. A animação deve ser subtil, como um efeito ambiente.
  • Tente fornecer uma animação ininterrupta em loop. Lembre-se que o Steam irá sempre reproduzir a animação do início ao fim e esta função não pode ser desativada. Um loop ininterrupto não é obrigatório, mas é altamente recomendado para os melhores resultados visuais possíveis.
  • Todas as animações para mensagens de marketing serão exportadas como ficheiros WebM e MP4.
  • Todos os textos (além dos logótipos do jogo ou do developer) que exprimirem uma mensagem para os utilizadores (por exemplo, "Já disponível" ou "Nova atualização") devem permanecer editáveis para que possam ser traduzidos:
  • O texto não pode ser animado e nenhum efeito sobre o texto deve ser animado.
  • Não integre nenhum texto no fundo ou na animação.
  • Ao exportar a sua sequência PNG ou ficheiro MP4, certifique-se de que todas as layers de texto estão desativadas para que nenhum texto seja integrado no plano de fundo.
  • Todas as informações essenciais devem estar contidas na área segura indicada no modelo, já que todo o conteúdo fora desta área não será visível em resoluções mais baixas.

    O QUE NOS DEVE ENVIAR
  • Ficheiros do Photoshop com uma timeline de vídeo que contenha as imagens, mensagens e sequência de animação PNG.
  • Uma pasta com a(s) sequência(s) inteira(s) de animação PNG.
  • Se não puder fornecer uma sequência PNG, também aceitamos um ficheiro MP4 da animação.
  • Deve incluir todos os tipos de letra exclusivos utilizados (especialmente os tipos de letra personalizados).

Nome do recursoDimensõesTipoNotas
Mensagens pop⁃up de marketing570 px x 600 pxJPG, PNG. MP4 e WebM, caso seja animado.Ilustração do jogo ou da atualização com o logótipo do jogo. Breve chamada à ação (CTA).
Ver detalhes
Banner de destaque306 px x 260 pxJPGIlustração do jogo com o logótipo. O texto será sobreposto na parte inferior automaticamente.
Ver detalhes
Banner de destaque principal1850 px x 450 pxJPG, PNG. MP4 e WebM, caso seja animado.Ilustração do jogo ou da atualização com o logótipo do jogo. Breve chamada à ação (CTA).
Ver detalhes
Banner de destaque principal para dispositivos móveis500 px x 350 pxJPG, PNG. MP4 e WebM, caso seja animado.Versão mais pequena do banner de destaque principal.
Obrigatório caso exista um destaque principal.
Ver detalhes
Banner de destaque secundário940 px x 150 pxJPG, PNG. MP4 e WebM, caso seja animado.Ilustração do jogo ou da atualização com o logótipo do jogo. Breve chamada à ação (CTA).
Ver detalhes
Banner de destaque secundário para dispositivos móveis500 px x 160 pxJPG, PNG. MP4 e WebM, caso seja animado.Ilustração do jogo ou da atualização com o logótipo do jogo. Breve chamada à ação (CTA).
Ver detalhes
Fundo da página da promoçãoConsulte o modelo para verificar os requisitos.JPG, PNGImagem que aparece na parte superior e no fundo da página da promoção.Obrigatório caso exista uma página promocional personalizada.
Ver detalhes
Logótipo da página promocional940 px x 460 pxJPG, PNGEsta imagem aparece no topo da página, sobreposta no fundo da página promocional.
Opcional
Banner em páginas da loja1100 px x 160 pxJPG, PNGUm banner que destaca a sua promoção.
Obrigatório caso exista uma página promocional personalizada.
Ver detalhes
Banner em páginas da loja (dispositivos móveis)500 px x 160 pxJPG, PNGVersão mais pequena do banner em páginas da loja.
Obrigatório caso exista uma página promocional personalizada.
Ver detalhes

Os modelos para os recursos acima estão disponíveis aqui: MODELOS ATUAIS

Mensagens pop‑up de marketing

Utilização: imagem apresentada na janela pop‑up de mensagem do Steam e na página inicial da Loja Steam.

Exemplos de utilização no Steam:


popupexample.PNG

frontpageexample394.PNG

Design: para melhores resultados, assegure‑se de que o logótipo é claramente legível e inclua APENAS UMA mensagem relacionada com o tipo de promoção ("Promoção a meio da semana", "Promoção de fim de semana", "Faz já a pré-reserva", "Já disponível", "Nova atualização", etc.) sem a percentagem do desconto ou as datas da promoção. O preço e o botão de chamada à ação (CTA) irão aparecer automaticamente debaixo da imagem. Se houver algum logótipo regional que tenha de ser usado em regiões específicas, inclua-o no ficheiro PSD.

Dimensões: 570 px x 600 px, formato JPEG.
Dimensões do vídeo: 570 px x 600 px, formato MP4 e WebM.

Exemplos:
Já disponívelPromoção de fim de semanaNovo DLC disponível
IM_spark.jpgIM_doom.jpgnewdlcsc377x394.jpg
Promoção a meio da semanaNova atualização
lamplighters_MM_MD.jpgIM_Update.jpg
Faz já a pré‑reservaPré‑carrega já
IM_prepurchase.jpgIM_preload.jpg
Fim de semana grátis
IM_freeweekend.jpg

Banner de destaque

Utilização: o banner de destaque aparece perto da parte superior da página inicial do Steam e é usado para promoções específicas como "Promoção a meio da semana" ou "Promoção de fim de semana". Também aparece em centrais da loja como as páginas de géneros ou de marcadores.

Design: este banner deve conter apenas uma ilustração e o logótipo do jogo. O banner de destaque terá automaticamente uma secção em baixo com texto a descrever o tipo de promoção ("Promoção de fim de semana", por exemplo), assim como a data de conclusão da promoção.

Dimensões: 306 px x 260 px, formato JPEG.

Exemplo de utilização no Steam:

spotlightlocation.PNG

Banner de destaque principal

Utilização: utilizado apenas para os lançamentos mais importantes ou em promoções de editoras específicas. Este banner aparece na parte superior da página inicial da Loja Steam.

Design: a imagem deve ser simples e apelativa. Normalmente, é usada a ilustração principal que melhor representa a marca e o logótipo do produto. A imagem poderá ter bordas com desvanecimento ou com transição para uma cor sólida diferente caso a cor principal contraste demasiado com a cor azul usada pela Loja Steam.

Dimensões: 1850 px x 450 px, formato PNG.
Dimensões do vídeo: 1850 px x 450 px, formato MP4 e WebM.

Frontpage_Takeover.jpg

FrontPage_Takeover_EXAMPLE.jpg

Banner de destaque principal para dispositivos móveis

Utilização: versão para dispositivos móveis do banner de destaque principal. Será apresentado em browsers com menos de 500 px de largura.

Design: deverá ser igual à imagem do banner principal, mas mais pequeno. Utilize a imagem na sua totalidade e preencha o espaço com o logótipo e a chamada à ação (CTA).

Dimensões: 500 px x 350 px, formato PNG.
Dimensões do vídeo: 500 px x 350 px, formato MP4 e WebM.

Banner de destaque secundário

Utilização: utilizado apenas para alguns dos lançamentos mais importantes ou em promoções de editoras específicas. Este banner aparece perto da parte superior da página inicial da Loja Steam, imediatamente abaixo do carrossel da cápsula principal.

Design: a imagem deve ser simples e apelativa. Normalmente, é usada a ilustração principal que melhor representa a marca e o logótipo do produto. Esta será apresentada como um banner na página. Desta forma, poderá utilizar todo o espaço disponível (sem adicionar desvanecimento às bordas).

Dimensões: 940 px x 150 px, formato PNG.
Dimensões do vídeo: 940 px x 150 px, formato MP4 e WebM.

take_under.jpg

Banner de destaque secundário para dispositivos móveis

Utilização: versão para dispositivos móveis do banner de destaque secundário. Será apresentado em browsers com menos de 500 px de largura.

Design: deverá ser igual à imagem do banner secundário, mas mais pequeno. Utilize a imagem na sua totalidade e preencha o espaço com o logótipo e a chamada à ação (CTA).

Dimensões: 500 px x 160 px, formato PNG.
Dimensões do vídeo: 500 px x 160 px, formato MP4 e WebM.

take_under_mobile.jpg

Fundo da página da promoção

Utilização: esta é a imagem que aparece na parte superior e no fundo da página da promoção.

Design: o conteúdo mais importante deve estar situado na área segura do modelo, representada pela caixa verde com 940 pixels de largura. A ilustração pode expandir-se para as bordas laterais e inferior da página conforme desejado. Por exemplo, pode criar uma imagem de fundo com 1780 pixels de largura com um efeito de desvanecimento gradual para uma cor sólida nos lados e na parte inferior. Depois, defina esta cor sólida no Steamworks como a cor do fundo da página.

1.png

Banner em páginas da loja

Utilização: pode definir este banner para que seja apresentado na parte superior da página na loja de todos os jogos incluídos na sua promoção. Só pode usar este tipo de banners se os criadores de cada jogo incluído na página da promoção estiverem cientes de tais banners e estiverem de acordo com a sua utilização. Por outras palavras, não queremos que developers fiquem surpreendidos ao ver este banner nas páginas na loja dos jogos que criaram.

Design: a imagem do banner deve ser simples e apelativa. Normalmente, é usada a ilustração principal que melhor representa a promoção.

Dimensões: 1100 px x 160 px, formato PNG.

gamebanner.png

Banner em páginas da loja (dispositivos móveis)

Utilização: versão para dispositivos móveis do banner em páginas da loja. Será apresentado em browsers com menos de 500 px de largura.

Design: deverá ser igual à imagem do banner em páginas da loja, mas mais pequeno. Utilize a imagem na sua totalidade e preencha o espaço com o logótipo e a chamada à ação (CTA).

Dimensões: 500 px x 160 px, formato PNG.