Skip to content

gabrieljcoutinho/Challenge-Fiap

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1,469 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌞 Projeto GoodWe - Aplicação React para Gerenciamento de Energia Solar

📌 Visão Geral

Realizei um projeto acadêmico baseado em uma proposta apresentada por uma empresa durante uma visita à faculdade. O objetivo da atividade era compreender as dificuldades que a empresa vem enfrentando e, a partir disso, os alunos deveriam desenvolver soluções tecnológicas que pudessem colaborar com a melhoria de seus processos.

O objetivo era identificar os principais desafios enfrentados pela empresa e, a partir disso, desenvolver soluções tecnológicas criativas e funcionais. A aplicação simula um app mobile para o gerenciamento inteligente de energia solar residencial, com funcionalidades modernas e acessíveis. Todo o sistema foi construído utilizando React, com simulações via APIs fake e integração com inteligência artificial.

🔗 O projeto está publicado na web e pode ser acessado publicamente por meio de um link: https://challenge-fiap-nine.vercel.app/


Proposta do Sistema

A aplicação simula um aplicativo para celular voltado para o gerenciamento e automação de recursos relacionados à energia solar.


🧠 Tecnologias Utilizadas

  • React (Framework principal)
  • React Router DOM
  • CSS Modules e animações
  • Chart.js (Gráficos)
  • APIs Fake (JSON Server ou simuladas)
  • Text-to-Speech API (para acessibilidade)
  • Integração com API de IA (como OpenAI)

Estrutura da Aplicação

A aplicação conta com uma estrutura básica composta por um cabeçalho fixo, que direciona o usuário para diferentes seções:

  • Home
  • Conexões de Aparelhos
  • Chatbot
  • Contato
  • Configurações

📱 Funcionalidades Principais

1. 🏠 Home

  • Alternância entre 3 tipos de gráficos:
    • Linha
    • Barras
    • Pizza
  • Dados gerados por uma API simulada.
  • Exibição de clima atual e previsão do tempo.
  • Imagem dinâmica de fundo do gráfico muda conforme o período do dia (manhã, tarde ou noite).
  • Destaque para impactos positivos da energia solar, com foco ambiental e econômico.
Image

2. 🔌 Conexões de Aparelhos

  • Dispositivos podem ser adicionados de duas formas:
    • Conexão Bluetooth simulada
    • Cadastro manual personalizado (nome, ícone e cor de fundo)
  • Recursos disponíveis após o cadastro:
    • Geração de QR Code
    • Edição, exclusão e desativação
    • Ativação/desativação dos aparelhos
    • Organização dos dispositivos em listas de "conectados" e "desconectados"
    • Drag and drop para reordenação dos dispositivos
  • Caso não haja dispositivos, é exibida uma ilustração indicativa, evitando deixar a tela em branco.
Image

3. 🤖 Chatbot

  • Chat com envio e recebimento de mensagens em tempo real.
  • Integração com:
    • API personalizada (respostas específicas)
    • API real de IA (respostas gerais e simulação de assistente virtual)
  • Reconhecimento de comandos inteligentes, como:
    • "conectar aparelho"
    • "mudar de página"
    • "comandos"
  • Animação de transição ao mudar de página, com efeito de "apagando e acendendo".
Image

4. 📬 Contato

  • Formulário com os seguintes campos:
    • Nome
    • E-mail
    • Mensagem
  • Funcionalidades adicionais:
    • Envio de arquivos
    • Acesso à seção de perguntas frequentes (FAQ)
Image

5. ⚙️ Configurações

Conjunto de ferramentas essenciais para o usuário:

  1. Lista de Comandos Reconhecidos
  2. Central de Ajuda
  3. Acessibilidade com leitura em voz alta (textos clicáveis)
  4. Alternância entre modo Claro e Escuro
  5. Sistema de autenticação (fake):
    • E-mail e senha
    • Login via Google ou Facebook
  6. Página de recuperação de senha (em desenvolvimento)
Image

💡 Diferenciais

  • Responsividade total: funciona em dispositivos móveis e desktops.
  • 🌐 Publicação Web com acesso facilitado.
  • 🎨 Animações suaves em trocas de página, enriquecendo a experiência do usuário.
  • 📊 Gráficos interativos e informativos.
  • 🎤 Comandos de voz e acessibilidade inclusa
  • 🔐 Simulação de login realista com autenticação via múltiplas opções.
  • 🧠 Chat com IA, incluindo comandos inteligentes e contexto dinâmico.

📁 Estrutura de Pastas (Exemplo)

/src
│
├── /components
│   ├── Header
│   ├── Charts
│   ├── Chatbot
│   ├── DeviceManager
│   └── ...
│
├── /pages
│   ├── Home
│   ├── Conexoes
│   ├── Chatbot
│   ├── Contato
│   └── Configuracoes
│
├── /api
├── /utils
├── /assets
├── /styles
└── App.js

⚠️ Limitações

  • APIs utilizadas são fictícias, pois os dados reais da empresa não foram disponibilizados.
  • Algumas funcionalidades são apenas estética, como recuperação de senha.

👨‍🎓 Conclusão

Este projeto foi desenvolvido com o intuito de aplicar na prática conceitos de desenvolvimento web, acessibilidade, automação, usabilidade, e integração com IA, tudo isso dentro de um cenário realista e desafiador proposto por uma empresa do mercado.

About

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published