Texto Explicativo – Protótipo de Tela do Chat do Solar
Autor: Mateus | Publicado: 2012-09-20T19:04:00-07:00





A tela foi feita nas medidas 600 x 768 px, para ser uma janela extra. O chat se desenvolverá&nbsp;numa nova janela flutuante.

A proposta usa a metáfora de mesa redonda, mesa de conversas, onde o professor administra&nbsp;o que está sendo dito, ele organiza a mesa. Permite a entrada de usuários que desejam entrar&nbsp;na conversa e pede para algum usuário retirar-se da mesa. Na mesa redonda todos estão no&nbsp;mesmo nível de importância, inclusive o professor, cuja única vantagem é ser o responsável&nbsp;pela mesa. As conversas sobem em formato de balão de fala e se agrupam em cima da&nbsp;mesa, representando que o assunto está no ar. Quando utilizado a função de lousa digital,&nbsp;o desenho é mostrado em miniatura e pode ser ampliado clicando sobre ele com o cursor.&nbsp;Da mesma maneira funcionam os anexos. Cada usuário é representado por um avatar de cor&nbsp;diferente, sentado ao redor da mesa. O Nick desse usuário é da mesma cor do seu avatar, que&nbsp;é gerado aleatoriamente. Pouco acima da mesa e abaixo das falas está a barra de status, que&nbsp;consecutivamente posta algumas ações importantes como: sair da mesa (retirar-se), entrar&nbsp;na mesa (sentar-se), enviar arquivos, estados de humor, dentre outros. Ao passar o mouse&nbsp;sobre um avatar, aparecerá um balão flutuante contendo informações daquele usuário. Nesse&nbsp;balão há a opção de direcionar uma fala para aquele usuário. Ao clica na mesa, a fala volta a&nbsp;ser geral. Para o professor há um ícone especial, a Medalha. Ela acrescenta pontos ao aluno,&nbsp;somente o professor pode pontuar um aluno, e serve caso o comentário desse seja relevante&nbsp;ou importante. O professor pode ao final da conversa, analisar a pontuação, como uma forma&nbsp;de avaliação do desempenho daquele aluno. Ao clicar sobre o Nick no balão de fala, o mesmo&nbsp;balão flutuante de informações é mostrado.

Na barra horizontal superior, temos 4 botões para funções mais gerais e rotineiras: Assunto&nbsp;da Mesa expõe o enunciado e a proposta do professor para aquele debate; Quem está na&nbsp;mesa mostra uma listagem dos usuários sentados; Histórico de Conversas permite ao usuário&nbsp;consultar as conversas anteriores, por data ou assunto; Sair da Mesa faz com que o usuário&nbsp;saia da conversa.

A caixa de texto é o ultimo elemento da tela do chat. Ela é um pouco maior que os outros&nbsp;elementos devido aos diversos botões e funções que ela contém. A começar pelo ícone&nbsp;de Lápis que quando clicado possibilita a escrivã via cursor, ou lousa virtual. O caractere A,&nbsp;converte e possibilita a escrita de texto normalmente. O checkbox rolagem automática habilita&nbsp;e desabilita a rolagem automática. Na ordem de aparição da esquerda para a direita temos:&nbsp;Pedido de Fala – usado pelo aluno que quer falar, ele aperta o botão e entra na fila dos que&nbsp;solicitaram o poder de fala; O Smile – altera o humor dos avatares na mesa de acordo com&nbsp;a opção escolhida; O Clip – Possibilita anexar arquivos e enviá-los ao centro da mesa para&nbsp;compartilhar; O cadeado – é uma função exclusiva do professor que pode bloquear alguns&nbsp;usuários ou a conversa toda, serve para pausas e intervalos e para controle de flood; O Auto-falante – controla o volume dos sons do ambiente; A Chave-inglesa – outra função exclusiva&nbsp;do professor serve para configurar a mesa de conversa, habilitando ou desabilitando funções&nbsp;e botões, conferindo gráficos de desempenho, solicitando a ajuda, entre outros. Por ultimo&nbsp;temos o botão de enviar, cuja função é encaminhar a mensagem para o centro da mesa.

As cores utilizadas para o fundo são tons monocromáticos em gradiente, padrão seguido por&nbsp;muitos desenvolvedores de chat, ela conta com uma textura sutil de grid quadricular para&nbsp;quebrar a monotonia e dar um aspecto mais humano. Os gradientes como sombra nas bordas&nbsp;dão ênfase à metáfora da mesa e ressaltam a organicidade em contra ponto com uma tela&nbsp;chapada. As cores da barra superior são semelhantes às usadas no atual solar, decidimos&nbsp;manter as mesmas para aumentar a fidelidade do protótipo.

A tipografia usada foi a Gandhi Sans na cor Azul Escuro #183F60, mesma da barra superior. Os&nbsp;ícones são em tons monocromáticos para padronizar com o fundo. O destaque fica por conta&nbsp;da representação da mesa de conversas, bem colorida, em contraste com a frieza do resto da&nbsp;tela. Chamando atenção à metáfora. A sombra nos balões de fala brancos é para acentuar a&nbsp;ideia de que a conversa está no ar.




    Tela do chat apresentação  from Átila Oliveira