Primeiramente, é necessário avaliar o que será utilizado na home, defina quais widgets serão utilizadas e o material pode mudar de acordo com cada widget. O mockup da home deve ser um .jpg, .pdf ou .psd.
- Menu: Defina se o menu terá ícones customizados ou será utilizado os ícones padrões do fluig, listados na página: https://style.fluig.com/components.html#icons na aba "Fluig icons". Exceto pelo botão "Mais" no menu, que apenas exibirá ícones padrões do fluig ou a lista com o nome das páginas.O menu pode ser a esquerda ou ao topo:
Caso deseje colocar um degradê de fundo no topo ou na barra de menu, é necessário construir esse degradê/imagem.
2. Logo e Favicon: O logo deve ser no formato .png, é recomendado que o logo tenha 60px de altura, porém a largura não possui limitação. O Favicon deve ser no formato .ico com tamanho 32x32px.
3. É necessário definir as cores utilizadas na plataforma baseado nos exemplos: https://drive.google.com/drive/folders/1G_EdMu8VsqijcmwS6xRfvuMym9oCAC-f
As cores podem ser hex ou rgba (Caso seja hex, ele será convertido em rgba automaticamente).
4. Banner: O Banner pode ser utilizado mais de uma vez na página. O banner pode ser colocado em slots de 12, 8, 6, 4, 3 e 2 colunas.
É necessário que as imagens do banner tenham o mesmo tamanho, caso contrário, alguma das imagens durante a exibição será cortada.
O banner não possui um limite de tamanho, entretanto, por questões de performance, indicamos um limite de 1366x555.
5. Menu de botões: O menu de botões são atalhos para algum link, entretanto, é necessário definir quais links e quais botões serão utilizados, baseado nisso, é necessário criar as imagens que serão utilizadas nesses botões ou escolher os ícones padrões do fluig. Esses conjunto de ícones não possui um tamanho definido, porém devem ter o mesmo tamanho (Ex: Todos com 130x130px). Abaixo exemplo de menu de botões exibindo as redes sociais.
6. Fontes: Para cada tamanho de fontes "p e textos comuns", "Links", "H1", "H2", "H3", "H4", "H5", "H6" e "Texto Formulários" é necessário informar qual fonte será utilizada (Essa fonte deve existir no site: https://fonts.google.com/, caso contrário, não irá funcionar), cor da fonte, case (Nenhum, Capitalizado, Tudo Minúsculo ou Tudo Maiúsculo)
7. Disposição das widgets na tela: Será definido a posição das widgets na página: banner, notícias, etc baseado nos exemplos https://drive.google.com/drive/folders/1G_EdMu8VsqijcmwS6xRfvuMym9oCAC-f e na lista de widgets.
Atenção ao selecionar widgets do seu pacote: básico, intermediário ou avançado:
Parcerias | Bolão | Gestão Eventos Lojas | Tutorial Acesso | Contagem Regressiva | Menu Botoes |
Política Uso | Bolão Ranking Campeonato | Html Editor | Vagas | Conteúdo Externo | Menu Links |
Ramais Úteis | Bolão Ranking Jogo | Idioma | Welcome | Destaques Rotativos | Mini Menu |
Reserva Salas | Cardápio | Indicador Mapa | Alertas | Elogios Recomendações | Minicurrículo |
Setup Usuário | Central Tarefas | Indicadores | Analytics | Enquetes | Novidades |
Social Poster | Classificados | Itens Favoritos | Aniversariantes | Estrutura Empresa | Novidades Horizontal |
Social Timeline | Clientes | Lojas Busca | Banner Box | Faq | Nuvem Tags |
Título | Comunidades Destaque | Menu App Identity | Banner Carrossel | Gestão Eventos | Ofertas |
8. Comunidades: É necessário que a empresa analise quais comunidades serão criadas, baseado nessa informação, construir as fotos de perfil das comunidades, os formatos de arquivo suportados são jpg, jpeg e png, o tamanho máximo para upload de arquivo é 100mb.
9. Todas essas dicas são suficientes para criar um layout básico de uma página, após isso, entre em contato para avaliarmos o mockup e o material e fazer possíveis correções.