Este documento apresenta dicas e diretrizes a serem seguidas ao personalizar a interface do Canvas para uma instituição por meio do Editor de Temas.
Este documento destina-se a administradores que precisam personalizar a interface do Canvas usando o Editor de Temas e explica os vários tipos de arquivos disponíveis no Editor de Temas para upload, incluindo o logotipo da instituição. Estas diretrizes apresentarão o tamanho ideal para cada imagem no Editor de Temas — juntamente com alguns detalhes úteis para a criação de imagens — para que você possa deixar sua instalação do Canvas com uma aparência incrível em pouco tempo.
Se a sua instituição tiver a sorte de contar com uma equipe de marketing ou de branding com um designer gráfico ou web na equipe, recomendamos fortemente que você colabore com essa pessoa para o branding do Canvas. Você obterá ótimos resultados e terá menos trabalho — que maravilha! Um profissional de design também garantirá que você não esteja violando nenhuma diretriz da marca.
Os arquivos de modelo fornecidos neste documento foram criados no Photoshop.Se você não tiver acesso ao Photoshop, poderá usar qualquer programa de edição de imagens para criar seus próprios arquivos com base nos tamanhos de imagem ideais incluídos em cada etapa.
Gráficos vetoriais versus gráficos bitmap
Antes de fazer o upload do logotipo da sua instituição, você precisará obter uma cópia em alta resolução para usar no Editor de Temas. O ideal é usar uma imagem de alta resolução.vetorimagem do logotipo em vez de umbitmapImagem do logotipo.
- Vetorimagens geralmente terminam em.ai,.eps, ou .svgPor serem baseadas em caminhos, e não em pixels, as imagens vetoriais são redimensionadas com nitidez para qualquer tamanho. Imagens vetoriais podem ser arrastadas ou coladas em softwares de edição de imagens como Illustrator, Photoshop e Sketch. Elas podem então ser redimensionadas sem perda de nitidez. Para manter a proporção, abra a imagem em um programa compatível e mantenha pressionada a tecla Shift. Para uso no Editor de Temas, os arquivos vetoriais devem ser salvos no formato ..svgformato.
- Mapa de bitsimagens geralmente terminam em.jpg,.png, ou .gifElas são compostas por um número fixo de pixels. Se você redimensioná-las (especialmente quando são ampliadas), elas geralmente ficam borradas.
Se não houver como obter uma versão vetorial do logotipo da sua instituição, tente obter a versão bitmap com a maior resolução possível — qualquer arquivo com mais de 1.000 pixels de largura deve funcionar perfeitamente. O formato de arquivo bitmap mais adequado é o PNG (.png), pois são projetadas para a web e mantêm a melhor qualidade. Elas também se adaptam bem a diferentes tamanhos e suportam fundos transparentes.
Envio de imagens
Após obter a sua imagem, você pode carregá-la em diversas áreas do Editor de Temas.
Logotipo de navegação
| Logotipo no topo do Menu de Navegação Global (compatível com arquivos SVG, PNG e JPG) Tamanho recomendado:200 x 200 pixels Tipo de arquivo recomendado para exportação:PNG Dicas importantes:
- Ao criar o arquivo, deixe um espaço livre (de pelo menos 10 a 20 pixels) ao redor da imagem do logotipo. Caso contrário, ela ficará comprimida contra as laterais da navegação principal.
Baixe o arquivo de exemplo do logotipo da Nav. Baixe o modelo de logotipo Nav para Photoshop. |
|---|
Marca d'água
| Imagem de fundo clara que aparece atrás do conteúdo da página; o tamanho de exibição é subjetivo e depende do tamanho do arquivo carregado. Tamanho recomendado:400 x 400 pixels Tipo de arquivo recomendado para exportação:PNG Dicas importantes:
- Assim como uma marca d'água em papel de carta, nossa imagem de marca d'água tem o objetivo de ser um...sutilElemento de marca (recomendamos que sua imagem não contraste muito com o fundo branco do Canvas) que geralmente fica coberto por outros elementos do Canvas.
- A marca d'água é totalmente opcional. Não se sinta obrigado a usá-la se não tiver acesso a uma imagem adequada.
Baixe o arquivo de exemplo de marca d'água Baixe o modelo de marca d'água para Photoshop. |
|---|
Favicon
Ícone da tela inicial do celular
Azulejo quadrado para janelas
| Imagem da versão quadrada do bloco do Windows Tamanho necessário:558 x 558 pixels Tipo de arquivo recomendado para exportação:PNG Dicas importantes: - Para realmente se adequar à aparência do Windows 8, crie sua imagem totalmente em branco e escolha uma cor de fundo vibrante de acordo com as diretrizes da sua marca.
- O Windows exige dimensões exatas para uma imagem usada como bloco do Windows. A imagem que você enviar para um bloco do Windows deve atender às dimensões exatas especificadas.
Baixe o arquivo de exemplo do Windows Tile Square. Baixe o modelo de Photoshop Windows Tile Square |
|---|
Janelas de azulejo amplas
| Imagem para a versão ampla do bloco do Windows Tamanho necessário:558 x 270 pixels Tipo de arquivo recomendado para exportação:PNG Dicas importantes: - Para realmente se adequar à aparência do Windows 8, crie sua imagem totalmente em branco e escolha uma cor de fundo vibrante de acordo com as diretrizes da sua marca.
- O Windows exige dimensões exatas para uma imagem usada como bloco do Windows. A imagem que você enviar para um bloco do Windows deve atender às dimensões exatas especificadas.
Baixe o arquivo de exemplo do Windows Tile Wide. Baixe o modelo de Photoshop "Windows Tile Wide" |
|---|
Logotipo da barra lateral direita
Imagem de fundo
| Imagem para o fundo de login Tamanho recomendado:2800 x 2000 pixels Tipo de arquivo recomendado para exportação:JPG (obras com qualidade entre 30 e 40%) Dicas importantes:
- A imagem de fundo em tela cheia é totalmente opcional. Você pode preferir uma cor de fundo simples, sem imagem (e certamente carregará mais rápido).
- Se a sua imagem for menor que o tamanho recomendado, o Canvas irá redimensioná-la; porém, ela poderá ficar ligeiramente pixelizada.
Baixe o arquivo de amostra da imagem de fundo. Baixe o modelo de imagem de fundo para Photoshop. |
|---|
Logotipo de login
| Logotipo exibido na parte superior da página de login. Tamanho recomendado:380 x 150 pixels Tipo de arquivo recomendado para exportação:PNG (SVG também pode ser usado para usuários avançados) Dicas quentes: - O logotipo na sua página de login será redimensionado para 190 pixels de largura, independentemente do tamanho.
- O tamanho ideal ainda é recomendado para manter uma resolução de imagem alta em telas Retina e/ou monitores grandes. Um tamanho menor pode resultar em imagem desfocada.
Baixe o arquivo de exemplo do logotipo de login. Baixe o modelo de logotipo de login para Photoshop. |
|---|
Este recurso também pode ser acessado nos seguintes Guias do Canvas:
