Konviva | Manual de Personalização do Aplicativo Padrão
Sobre o Aplicativo Padrão do Konviva
Se você utiliza o Konviva saiba que possuímos um aplicativo, disponível para Android e iOS. É só procurar por “Konviva” na Play Store ou Apple Store, baixar e começar a utilizar! Nosso app tem foco no usuário com perfil aluno, assim ele pode acessar a plataforma a qualquer hora e em qualquer lugar.
Nessa solução padrão, que pode ser baixada e usada imediatamente, a identidade visual aplicada (logo, cores, imagens) apenas é visualizada após se abrir o aplicativo e inserir a url do ambiente.
Se a sua necessidade é dar a impressão que o usuário está baixando o seu app e não o app do Konviva você pode solicitar a publicação de aplicativo personalizado. Assim, você poderá escolher nome, ícone, imagens da loja conforme quiser. Optando por essa solução, ao baixar e acessar o aplicativo, o mesmo já será visualizado com a identidade visual aplicada e url gravada. Para isso, entre em contato com a equipe do Konviva pelo email manuela.caron@ilog.com.br ou através do telefone (48)99634-6976.
Obs: usamos o termo personalização nos referindo a um conjunto de elementos e funcionalidades do aplicativo previamente mapeados que podem ser facilmente alterados para se adaptar ao cliente.
Configuração de layout do aplicativo
Independente se você optar ou não pela publicação de aplicativo personalizado, você terá acesso às seguintes configurações que impactam no layout:
Carrosséis na página inicial: É possível selecionar os carrosséis que irão aparecer na página inicial, sendo eles: Cursos em andamento, Trilhas, Catálogo, Biblioteca e Pílulas. Essa informação deve ser enviada juntamente com as imagens para que seja feita a publicação do app. Caso você já seja usuário do aplicativo e deseja alterar essas configurações é necessário abrir um chamado com sua solicitação para o suporte.
Itens no menu: Você pode definir quais as opções quer que sejam mostradas no menu inferior e também no menu lateral.
Para o menu inferior é possível selecionar duas opções: Cursos, Trilhas, Catálogo, Biblioteca, Pílulas e Favoritos.
Para o menu lateral é possível selecionar entre as opções: Meus Cursos, Trilhas, Catálogo, Biblioteca, Posts, Histórico, Marcar Presença, Gamificação - Extrato, Gamificação - Ranking e Pílulas. (Não há um limite de quantidade)
Personalização do aplicativo
Independente se você optar ou não pela publicação de aplicativo personalizado, você terá acesso às seguintes possibilidades de personalização para aplicar a identidade visual desejada:
Logo: é exibida na tela de login e na página inicial. Para o login a imagem deve ter 240x86px de tamanho, nos formatos svg (preferencialmente) ou png com fundo transparente. Recomendamos que a imagem seja fechada com alinhamento centralizado e que se evite a utilização de textos muito pequenos, pois podem ficar ilegíveis em telas pequenas. Lembre-se que essa imagem será aplicada sobreposta à imagem de fundo da tela de login. É possível utilizar uma logo diferente para o menu, sendo necessário enviá-la também seguindo as mesmas especificações citadas.
A logo para a página inicial deve ter 380x86px, também nos formatos svg (preferencialmente) ou com fundo transparente. A logo ficará no cabeçalho, então atente-se na escolha da cor do fundo para que a logo fique visível.
Cor: é possível definir algumas cores para personalizar no app, sendo elas:
- Campos de Login: a cor é aplicada nos campos de usuário e senha. É importante definir cores que tenham um bom contraste com a imagem de fundo, para que o usuário consiga ler as informações sem dificuldade.
- Botões e elementos principais: é aplicada aos botões, ícones e barras de carregamento. A cor definida deve ser bem diferente da cor de fundo para que seja possível identificar com facilidade esses elementos, não atrapalhando a usabilidade do usuário (se o fundo for claro, definir uma cor escura para os botões e se a cor do fundo for escuro, a cor dos botões deve ser clara).
- Cor de fundo do app: A cor de fundo do app é aplicada como fundo em todas as páginas do aplicativo. Importante pensar que essa cor será bem presente no aplicativo, então é necessário defini-la com cuidado para que não prejudique a interação do usuário com o aplicativo.
- Obs: As cores (preta ou branca) são atribuídas automaticamente ao texto a partir da cor selecionada para o fundo, buscando manter o contraste ideal para uma boa leitura.
- Barra de navegação e do menu inferior: Para definição dessa cor deve ser pensada nas cores da logo que será aplicada na barra de navegação.
Obs: As cores (preta ou branca) são atribuídas automaticamente ao texto e ícones do menu inferior. - Menu lateral: A cor definida para o menu é aplicada, conforme indicado na figura abaixo. A cor do texto é alterada automaticamente, como já orientado anteriormente.
- Cabeçalho e rodapé do menu lateral: A cor é aplicada no topo e rodapé do menu lateral. Indicamos utilizar uma variação da cor aplicada ao menu lateral.
Obs: se você quiser manter a mesma identidade visual do ambiente web, não precisa se preocupar com essas definições. Por padrão, o aplicativo utiliza a mesma logo e cor do ambiente web. Quanto à imagem de fundo da tela de login, se você não quiser definir nada diferente, pode utilizar nossa imagem padrão exemplificada nas imagens acima.