Informações Gerais
Trabalho em equipe
Verde: PRESENÇA
Azul: FALTA ABONADA
Vermelho: FALTA
Membro\Encontro | 09 | 10 | 11 | 12 |
---|---|---|---|---|
Felipe Silva | ||||
Felipe Viacava | ||||
João Rezende | ||||
Lucas Alba |
Situação do projeto
Verde: ENTREGUE
Azul: ENTREGUE ATRASADO
Vermelho: PENDENTE
Fase\Entrega | Wikidot | GitHub |
---|---|---|
Arquitetura de Informação | ||
Leis de Gestalt e Princípios CRAP | ||
Teoria das Cores e Tipografia |
GitHub
https://github.com/chends888/Projeto-1-Co-design-de-apps.git
Arquitetura de Informação
Primeira tarefa
Experimentação e testes em laboratório
Acionamento PWM com eletrônica analógica ou filtro
Estação meterorológica
Projetos envolvendo softwares
Protótipo de website
Protótipo de aplicativo
Jogo da velha
Comparação de interfaces
CRUD
Projeto final
Prototipagem
Estação metrorológica
Sistema de aquecimento de chuveiro elétrico
Barata elétrica
Brinquedo infantil
Rede de distribuição de petróleo
Circuito eletrônico com amplificados operacional ou diodos e transistores
Produções textuais
Primeiro artigo
Segundo artigo
Aplication Singularity
Apresentações
Aplication Singularity
Dinâmica populacional
Farmacocinética ou Termodinâmica
Sistema mecânico
Projetos teóricos
Sistema mecânico
Farmacocinética ou Termodinâmica
Cálculo de conceito
Teorema do limite central
Modelos de regressão
Dinâmica populacional
Estudo autônomo
Ajuste de modelo teórico
Análise exploratória
Projeto único
Feedback do ninja
Divisão de competências por curso: Mecânica e Mecatrônica estão exatamente iguais, seguindo esse raciocínio parece que não é necessário ter dois cursos diferentes. Também não há nada de programação em ambos, algo a ser considerado, já que programar se tornou um requisito mínimo para engenheiros.
Divisão de competências práticas e teóricas: O projeto único de Física do Movimento também poderia ser uma opção para competência prática.
PS: cuidado com os erros de português
Segunda tarefa
Feedback do ninja
Entrega não relacionada ao que a tarefa pedia.
Terceira tarefa
-Projeto: Estação meteorológica
-Categoria: Prototipagem e experimentação
-Semestre: 1º
-Disciplina: Instrumentação e medição
-Descrição: A estação meteorológica desenvolvida para a disciplina Instrumentação e Medição consistia num circuito elétrico montado numa placa de circuito impresso de cobre, contendo sensores de umidade, temperatura, pressão e algum outro sensor escolhido pelo grupo. Todo este circuito era ligado a um micro-controlador (neste caso o Arduino), que recebia as leituras dos sensores e, através de um código criado pelo grupo contendo a calibração deles, transformava-os em um sinal digital exposto numa tela LCD. Para as desenvolver os códigos de calibração dos sensores, os alunos utilizaram os laboratórios e fizeram diversas medições, comparando-as posteriormente com os valores reais medidos por sensores já calibrados.
-Projeto: Farmacocinética ou termodinâmica
-Categoria: Prototipagem
-Semestre: 1º
-Disciplina: Natureza do design
-Descrição: A barata elétrica foi o produto do primeiro projeto de Natureza do Design, uma das disciplinas do primeiro semestre de engenharia. Os alunos foram encarregados, em duplas, de remover o motor elétrico de uma barata de brinquedo, projetar uma plataforma para acoplar este motor e imprimir esta plataforma numa impressora 3D. Ao final do projeto, era esperado que a “baratinha” de cada grupo fosse capaz de se locomover quando estivesse com o motor ligado. A apresentação foi uma corrida em raias entre os projetos dos diferentes grupos.
-Projeto: Barata elétrica
-Categoria: Apresentações e projetos teóricos
-Semestre: 1º
-Disciplina: Modelagem e simulação do mundo físico
-Descrição: O segundo projeto do curso de Modelagem e Simulação do Mundo Físico foi analisar um sistema físico real – sendo este sistema um sistema termodinâmico ou farmacocinético – e, a partir desta análise, desenvolver um código em Python que simulasse este modelo e fizesse previsões do comportamento do mesmo para diversas situações. Os projetos foram expostos em banners numa apresentação em sala de aula, tendo como avaliadores o professor, alunos e monitores designados pelo professor.
-Projeto: Jogo da velha
-Categoria: Software
-Semestre: 1º
-Disciplina: Design de software
-Descrição: O jogo da velha, um exercício-programa da disciplina Design de Software, foi um código em Python criado pelos grupos de alunos. O resultado foi simples: um jogo da velha designado para 2 jogadores na mesma tela, capaz de interpretar as jogadas e anunciar o vencedor. Ao final, o tabuleiro deveria se limpar sozinho. O principal recurso utilizado foi a biblioteca Tkinter, responsável por gerar interfaces gráficas.
-Projeto: Primeiro artigo
-Categoria: Produções textuais
-Semestre: 1º
-Disciplina: Grandes desafios da engenharia
-Descrição: Para a tutoria da disciplina Grandes Desafios da Engenharia, foi requisitado que os alunos escrevessem um pequeno ensaio acadêmico com introdução, resumo, metodologia e conclusão. O tema discutido neste ensaio deveria ser pertinente ao curso.
-Projeto: Dinâmica populacional
-Categoria: Apressentações e projetos teóricos
-Semestre: 1º
-Disciplina: Modelagem e simulação do mundo físico
-Descrição: O primeiro projeto para Modelagem e Simulação do Mundo físico foi o estudo e a modelagem da dinâmica populacional de tubarões, raias e vieiras. Foi criado um código em Python considerando diversos parâmetros e variáveis – como caça, predação e reprodução – que fazia simulações neste sistema, buscando estabelecer relações entre as variáveis e parâmetros de uma população (como a de tubarões) com a projeção final de outra população envolvida no sistema.
Feedback do ninja
Incompleto
Quarta tarefa
Analisando diversos sites, que consideramos bons e ruins, chegamos à conclusão de que nosso site irá ter um visual mais limpo, contendo apenas o necessário (que seriam as categorias, algum tipo de slide de imagens e o setor de contato [sobre nós]), como mostra a imagem abaixo.
Ele teria uma certa proximidade entre os objetos, mas não exagerada, teria um alinhamento geral mais centralizado (retirado bastante do site da Apple, o qual achamos bem organizado). A simetria se daria bastante por causa da simetria nos elementos do site. A repetição se daria nas várias páginas do nosso site, que seriam todas feitas a partir de um modelo comum. Não existiria um contraste muito grande, as cores seriam todas parecidas, apenas com mudanças nas tonalidades.
Haverá proximidade entre os itens comuns, por exemplo os link para a página individual de cada aluno, facilitando assim a divisão entre os temas dentro de uma mesma página.
Atualização:
Resolvemos não usar mais este modelo. Principalmente porque descobrimos que cada aluno tem que ter suas próprias páginas do portifólio. Então achamos mais sensato colocar a seleção de alunos logo na página principal do site.
Feedback do ninja
Incompleto
Teoria das Cores e Tipografia
Mockup da página principal
Aqui optamos por uma página inicial que já desse a opção de escolha do aluno, afinal o objetivo do portifólio é acessar o portifólio de um aluno específico.
C: Pode-se perceber o contraste dos botões e do texto do título com o fundo branco da página, gerando assim um texto bastante legível e botões chamativos.
R: A repetição da página incial se dará mais pelo estilo em geral, como as cores e tipografia do site.
A: O alinhamento percebe-se nos botões, que estão todos alinhados na horizontal, junto com o título.
P: Sobre a proximidade não há muito o que falar, os objetos estão todos próximos, facilitando a leitura.
Mockup da página sobre mim
Em nosso caso a página 'sobre mim' é a própria página de projetos do aluno, contendo uma breve descrição sobre o mesmo, seu contato e seus projetos categorizados.
C: Observa aqui assim como na página principal, um contraste no texto com o fundo, porém agora existe uma área para a descrição do aluno (um fundo bem escuro), em contraste com o texto nele contido (cor branca), facilitando novamente a leitura.
R: A repetição como citada anteriormente se da bastante no estilo da página, mas aqui é introduzida ao leitor o menu (espaço para navegação entre os alunos do grupo), e a área para descrições, objetos que se repetirão na página dos projetos, criando um costume ao leitor.
A: O alinhamento se dá bastante nos botões dos projetos, os quais estão todos alinhados e organizados conforme o tamanho da janela do navegador.
P: A proximidade é observada tanto nos botões das categorias como no texto da descrição, ambos não se estendem do começo ao final da página, facilitando e não cansando a leitura.
Mockup da página de projeto
A página dos projetos é bastante similar com a página do aluno, mantendo o menu e a área de descrição (agora destinada aos projetos). Tínhamos a intenção de colocar imagens individuais para cada projeto, mas no fim acabamos não organizando nosso tempo e os projetos ficaram apenas com a descrição textual.
C: O contraste aqui seria praticamente igual à página do aluno, e da página principal por causa das imagens, análoga aos botões da página principal.
R: A repetição como citada, se daria no menu e na área de descrições. Também vale falar que todas as páginas de projetos seguiram o mesmo modelo
A: O alinhamento também se daria nas imagens dos projetos.
P: A proximidade seria observada na descrição do projeto, que segue o mesmo modelo da descrição do aluno e nas imagens, que não estariam longe da descrição, seguindo a linha de leitura do leitor.
A principal cor utilizada em nosso website é um azul claro, ele que é considerado uma cor 'segura' de ser utilizada, principalmente pois traz uma sensação de calma, e azul é a cor mais favorita entre homens e mulheres no mundo, informação encontrada no link a seguir: https://blog.kissmetrics.com/psychology-of-color-and-conversions/. Os títulos de nosso site usam esse azul (pode ser observado na tabela abaixo), assim como alguns fundos, no caso, quando o fundo é azul, o texto contido nesse fundo torna-se branco, criando uma harmonia de cores claras, entre o azul claro e o branco tanto do texto quanto do fundo geral do site, bem como um contraste, facilitando a leitura.
(preencha seguindo o modelo da entrega fictícia)
Referências de cor e fonte
Cor dos títulos e fundos de botões: #2BCDC1
Cor do fundo da descrição na página de cada aluno: #777777
Textos dos botões: #777777
Cores | Títulos e botões | Fundo descrição | Botões quando o fundo é azul |
---|---|---|---|
Cores |
Fontes utilizadas:
Corpo de texto: utilizamos a Open sans, sans serif. Uma fonte bastante simples, enxuta, fácil e organizada de se ler em telas.
Títulos: Utilizamos a Lato, bem parecida com a Open sans, também sans serif.
Feedback dos avaliadores
Tivemos um feedback bastante crítico (com bastante conteúdo), de Rafael (PandoraLab).
Sobre a usabilidade: Ele achou bem ruim, pois para a busca de um projeto específico, o leitor precisa passar o cursor encima de todos os botões até achar o projeto desejado. A sugestão dele foi: Já que não pode se identificar (ou é bem difícil) um projeto apenas pela sua imagem, poderíamos modificar os botões para mostrarem um texto fixo em cima da imagem que poderia estar escurecida, e quando passássemos o cursor encima do botão, o texto sumisse e a imagem se tornasse totalmente visível.
Sobre o footer ou rodapé: Disse que sentiu falta de um footer com algumas informações que não são tão 'importantes' para estarem no menu do topo, só que também não podem estar ausentes, como criação do site, mais informações (sobre a faculdade por exemplo), co-criadores (professores por exemplo)