Spaces:
Running
Running
Mostre a final um infografico desde da coleta da amostra a ser analizada ate o final da amostra com resultado no final do projeto - Follow Up Deployment
d8038f2
verified
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Plataforma LAMP para Diagnóstico Molecular de T. gondii e Giardia spp.</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| .hero-pattern { | |
| background-image: radial-gradient(circle at 10% 20%, rgba(56, 182, 255, 0.1) 0%, rgba(56, 182, 255, 0.1) 90%); | |
| } | |
| .dna-animation { | |
| animation: float 6s ease-in-out infinite; | |
| } | |
| @keyframes float { | |
| 0% { transform: translateY(0px); } | |
| 50% { transform: translateY(-20px); } | |
| 100% { transform: translateY(0px); } | |
| } | |
| .protocol-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| </style> | |
| </head> | |
| <body class="font-sans bg-gray-50"> | |
| <!-- Header --> | |
| <header class="hero-pattern"> | |
| <div class="container mx-auto px-6 py-16"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h1 class="text-4xl md:text-5xl font-bold text-gray-800 leading-tight"> | |
| Plataforma LAMP para Diagnóstico Rápido de <span class="text-blue-600">T. gondii</span> e <span class="text-green-600">Giardia spp.</span> | |
| </h1> | |
| <p class="text-lg text-gray-600 mt-4"> | |
| Desenvolvimento e validação de um sistema portátil baseado na técnica LAMP alinhado à abordagem One Health | |
| </p> | |
| <div class="mt-8"> | |
| <a href="#methodology" class="bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition duration-300"> | |
| Ver Metodologia | |
| </a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <img src="https://img.icons8.com/color/512/dna-helix.png" alt="DNA Helix" class="w-64 h-64 dna-animation"> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Introduction Section --> | |
| <section id="introduction" class="py-16 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Introdução</h2> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div class="bg-blue-50 p-8 rounded-xl"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-biohazard text-blue-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold text-blue-800">Toxoplasma gondii</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| Toxoplasma gondii é um protozoário parasita intracelular obrigatório que infecta aproximadamente um terço da população humana mundial (Dubey, 2010). A infecção pode causar toxoplasmose congênita em gestantes e doença grave em imunocomprometidos. | |
| </p> | |
| </div> | |
| <div class="bg-green-50 p-8 rounded-xl"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-green-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-parasite text-green-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold text-green-800">Giardia spp.</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| Giardia duodenalis é um protozoário flagelado que causa giardíase, uma das principais doenças diarreicas em humanos e animais (Ryan & Cacciò, 2013). A transmissão ocorre via água ou alimentos contaminados, com impacto significativo na saúde pública. | |
| </p> | |
| </div> | |
| </div> | |
| <div class="mt-8 bg-gray-50 p-8 rounded-xl"> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-4">One Health e ODS</h3> | |
| <p class="text-gray-700 mb-4"> | |
| A abordagem One Health reconhece a interconexão entre saúde humana, animal e ambiental. Este projeto se alinha diretamente com os Objetivos de Desenvolvimento Sustentável (ODS) 3 (Saúde e Bem-estar), 9 (Indústria, Inovação e Infraestrutura) e 17 (Parcerias para os Objetivos). | |
| </p> | |
| <div class="flex flex-wrap gap-4 mt-4"> | |
| <span class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full text-sm font-medium">ODS 3</span> | |
| <span class="bg-purple-100 text-purple-800 px-4 py-2 rounded-full text-sm font-medium">ODS 9</span> | |
| <span class="bg-green-100 text-green-800 px-4 py-2 rounded-full text-sm font-medium">ODS 17</span> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Justification Section --> | |
| <section class="py-16 bg-gray-100"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Justificativa</h2> | |
| <div class="grid md:grid-cols-3 gap-8"> | |
| <div class="bg-white p-6 rounded-xl shadow-sm"> | |
| <div class="text-yellow-500 mb-4"> | |
| <i class="fas fa-exclamation-triangle text-3xl"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Limitações Diagnósticas</h3> | |
| <p class="text-gray-600"> | |
| Os métodos atuais (microscopia, ELISA) apresentam baixa sensibilidade. O qPCR, apesar de sensível, requer equipamentos caros e mão de obra especializada, inviabilizando seu uso em campo. | |
| </p> | |
| </div> | |
| <div class="bg-white p-6 rounded-xl shadow-sm"> | |
| <div class="text-blue-500 mb-4"> | |
| <i class="fas fa-lightbulb text-3xl"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Vantagens da LAMP</h3> | |
| <p class="text-gray-600"> | |
| A técnica LAMP (Loop-Mediated Isothermal Amplification) permite amplificação isotérmica rápida (60 min) com alta sensibilidade e especificidade, dispensando termocicladores (Notomi et al., 2000). | |
| </p> | |
| </div> | |
| <div class="bg-white p-6 rounded-xl shadow-sm"> | |
| <div class="text-green-500 mb-4"> | |
| <i class="fas fa-mobile-alt text-3xl"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Portabilidade</h3> | |
| <p class="text-gray-600"> | |
| A adaptação da LAMP para um dispositivo portátil permitirá diagnóstico em tempo real em situações de campo, unidades básicas de saúde e vigilância ambiental, democratizando o acesso a diagnóstico molecular. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Objectives Section --> | |
| <section class="py-16 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Objetivos</h2> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div> | |
| <h3 class="text-xl font-semibold text-blue-700 mb-4 flex items-center"> | |
| <span class="bg-blue-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-bullseye text-blue-600"></i> | |
| </span> | |
| Objetivo Geral | |
| </h3> | |
| <p class="text-gray-700 pl-10"> | |
| Desenvolver e validar uma plataforma de diagnóstico molecular portátil baseada na técnica LAMP para detecção simultânea de T. gondii e Giardia spp., alinhada aos princípios One Health. | |
| </p> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold text-green-700 mb-4 flex items-center"> | |
| <span class="bg-green-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-list-ol text-green-600"></i> | |
| </span> | |
| Objetivos Específicos | |
| </h3> | |
| <ul class="text-gray-700 pl-10 space-y-2"> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Selecionar e otimizar primers para os alvos REP-529 (T. gondii) e GDH (Giardia spp.) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Desenvolver protocolos LAMP multiplex | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Validar frente ao qPCR padrão-ouro | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Adaptar para dispositivo portátil com detecção colorimétrica | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Methodology Section --> | |
| <section id="methodology" class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Metodologia</h2> | |
| <!-- Primer Design --> | |
| <div class="bg-white p-8 rounded-xl shadow-sm mb-12"> | |
| <h3 class="text-2xl font-semibold text-gray-800 mb-6 flex items-center"> | |
| <span class="bg-purple-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-dna text-purple-600"></i> | |
| </span> | |
| Desenho de Primers In Silico | |
| </h3> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div> | |
| <h4 class="text-lg font-medium text-purple-800 mb-3">Alvo REP-529 (T. gondii)</h4> | |
| <p class="text-gray-700 mb-4"> | |
| O elemento repetitivo REP-529 (529 bp) foi selecionado por apresentar 200-300 cópias no genoma de T. gondii, garantindo alta sensibilidade (Homan et al., 2000). | |
| </p> | |
| <div class="bg-gray-100 p-4 rounded-lg overflow-x-auto"> | |
| <pre class="text-sm text-gray-800"> | |
| F3: 5'-GGA AGG CAA GTC TGG AGA AG-3' | |
| B3: 5'-TGC ATC TGT AGG TCG AAC ATC-3' | |
| FIP: 5'-TCC GCT GCA GAC ACA GTA TTC GGA GGG GAC GAA TTT CGT C-3' | |
| BIP: 5'-AGC TTC CCT CGA ATG CAG TTC TTT TTG CGT TCA AAG CGT TCG-3' | |
| LF: 5'-GCA GTA TCG TCG TGT GGT TC-3' | |
| LB: 5'-CGC TTC TCG TTG TTG CTC TC-3'</pre> | |
| </div> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-medium text-green-800 mb-3">Alvo GDH (Giardia spp.)</h4> | |
| <p class="text-gray-700 mb-4"> | |
| O gene da enzima glutamato desidrogenase (GDH) foi selecionado por sua conservação entre isolados de Giardia e diferenciação de assemblages (Amar et al., 2002). | |
| </p> | |
| <div class="bg-gray-100 p-4 rounded-lg overflow-x-auto"> | |
| <pre class="text-sm text-gray-800"> | |
| F3: 5'-GCA CGG ACG TTC CAG ACT-3' | |
| B3: 5'-GCC TCG TCC ATC GCA A-3' | |
| FIP: 5'-TCC TGG AGG AAG GAG CGA GAA GGT TTG GGT TCA TCG AAC C-3' | |
| BIP: 5'-GGC TTC CGC TTC ATC GAC GTT TTT CAA CGT TCA CCG ACG AC-3' | |
| LF: 5'-GAG CGA GGT GGA AAC ACC AA-3' | |
| LB: 5'-GAC GAC CTC ACG GCA AAG TT-3'</pre> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-6 bg-blue-50 p-4 rounded-lg"> | |
| <p class="text-blue-800 flex items-start"> | |
| <span class="bg-blue-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-info-circle text-blue-600 text-sm"></i> | |
| </span> | |
| Os primers foram desenhados utilizando o software PrimerExplorer V5 (Eiken Chemical) e avaliados quanto a formação de estruturas secundárias (ΔG < -5 kcal/mol) e especificidade por BLASTn contra o banco de dados NCBI. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- Workflow --> | |
| <div class="mb-12"> | |
| <h3 class="text-2xl font-semibold text-gray-800 mb-6 text-center">Fluxograma Metodológico</h3> | |
| <div class="bg-white p-6 rounded-xl"> | |
| <div class="flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0"> | |
| <div class="text-center"> | |
| <div class="bg-purple-100 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-laptop-code text-purple-600 text-2xl"></i> | |
| </div> | |
| <p class="font-medium">Análise In Silico</p> | |
| </div> | |
| <div class="text-center"> | |
| <div class="bg-blue-100 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-vial text-blue-600 text-2xl"></i> | |
| </div> | |
| <p class="font-medium">Otimização In Vitro</p> | |
| </div> | |
| <div class="text-center"> | |
| <div class="bg-green-100 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-vials text-green-600 text-2xl"></i> | |
| </div> | |
| <p class="font-medium">Amostras Clínicas</p> | |
| </div> | |
| <div class="text-center"> | |
| <div class="bg-yellow-100 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-microscope text-yellow-600 text-2xl"></i> | |
| </div> | |
| <p class="font-medium">Validação</p> | |
| </div> | |
| <div class="text-center"> | |
| <div class="bg-red-100 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-tablet-alt text-red-600 text-2xl"></i> | |
| </div> | |
| <p class="font-medium">Dispositivo Portátil</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Experimental Design --> | |
| <div class="grid md:grid-cols-3 gap-6 mb-12"> | |
| <div class="protocol-card bg-white p-6 rounded-xl shadow-sm transition duration-300"> | |
| <h4 class="text-lg font-semibold text-blue-800 mb-3 flex items-center"> | |
| <span class="bg-blue-100 p-2 rounded-full mr-2"> | |
| <i class="fas fa-flask text-blue-600"></i> | |
| </span> | |
| Reação LAMP | |
| </h4> | |
| <ul class="text-gray-700 space-y-2"> | |
| <li class="flex items-start"> | |
| <span class="text-blue-500 mr-2">•</span> Volume total: 25 μL | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-blue-500 mr-2">•</span> Temperatura: 65°C | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-blue-500 mr-2">•</span> Tempo: 60 min | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-blue-500 mr-2">•</span> Indicador: HNB (azul→violeta) | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="protocol-card bg-white p-6 rounded-xl shadow-sm transition duration-300"> | |
| <h4 class="text-lg font-semibold text-green-800 mb-3 flex items-center"> | |
| <span class="bg-green-100 p-2 rounded-full mr-2"> | |
| <i class="fas fa-dna text-green-600"></i> | |
| </span> | |
| Extração de DNA | |
| </h4> | |
| <ul class="text-gray-700 space-y-2"> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Kit comercial (QIAamp) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Protocolo rápido (10 min) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-green-500 mr-2">•</span> Controle: C. parvum | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="protocol-card bg-white p-6 rounded-xl shadow-sm transition duration-300"> | |
| <h4 class="text-lg font-semibold text-purple-800 mb-3 flex items-center"> | |
| <span class="bg-purple-100 p-2 rounded-full mr-2"> | |
| <i class="fas fa-chart-line text-purple-600"></i> | |
| </span> | |
| Validação | |
| </h4> | |
| <ul class="text-gray-700 space-y-2"> | |
| <li class="flex items-start"> | |
| <span class="text-purple-500 mr-2">•</span> Sensibilidade: Limite de detecção | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-purple-500 mr-2">•</span> Especificidade: 100 isolados | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-purple-500 mr-2">•</span> Comparação: qPCR TaqMan | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <!-- Portable Device --> | |
| <div class="bg-white p-8 rounded-xl shadow-sm"> | |
| <h3 class="text-2xl font-semibold text-gray-800 mb-6 flex items-center"> | |
| <span class="bg-red-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-tablet-alt text-red-600"></i> | |
| </span> | |
| Dispositivo Portátil | |
| </h3> | |
| <div class="grid md:grid-cols-2 gap-8 items-center"> | |
| <div> | |
| <h4 class="text-lg font-medium text-gray-800 mb-3">Especificações Técnicas</h4> | |
| <ul class="text-gray-700 space-y-3"> | |
| <li class="flex items-start"> | |
| <span class="bg-red-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-battery-three-quarters text-red-600 text-xs"></i> | |
| </span> | |
| Bateria recarregável (8h autonomia) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="bg-red-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-temperature-high text-red-600 text-xs"></i> | |
| </span> | |
| Bloco térmico preciso (±0.5°C) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="bg-red-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-camera text-red-600 text-xs"></i> | |
| </span> | |
| Detecção colorimétrica por smartphone | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="bg-red-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-weight text-red-600 text-xs"></i> | |
| </span> | |
| Peso: <300g, dimensões: 12x8x4cm | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="flex justify-center"> | |
| <div class="relative"> | |
| <img src="https://img.icons8.com/color/512/test-tube.png" alt="Dispositivo Portátil" class="w-64 h-64"> | |
| <div class="absolute -bottom-5 -right-5 bg-white p-3 rounded-full shadow-lg"> | |
| <i class="fas fa-mobile-alt text-3xl text-blue-500"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Expected Results --> | |
| <section class="py-16 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Resultados Esperados</h2> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center"> | |
| <span class="bg-blue-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-chart-bar text-blue-600"></i> | |
| </span> | |
| Desempenho Técnico | |
| </h3> | |
| <div class="bg-gray-50 p-6 rounded-xl"> | |
| <div class="mb-4"> | |
| <h4 class="font-medium text-gray-700 mb-2">Sensibilidade</h4> | |
| <div class="w-full bg-gray-200 rounded-full h-4"> | |
| <div class="bg-blue-600 h-4 rounded-full" style="width: 95%"></div> | |
| </div> | |
| <p class="text-sm text-gray-600 mt-1">>95% comparado ao qPCR</p> | |
| </div> | |
| <div class="mb-4"> | |
| <h4 class="font-medium text-gray-700 mb-2">Especificidade</h4> | |
| <div class="w-full bg-gray-200 rounded-full h-4"> | |
| <div class="bg-green-600 h-4 rounded-full" style="width: 98%"></div> | |
| </div> | |
| <p class="text-sm text-gray-600 mt-1">>98% sem reação cruzada</p> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-700 mb-2">Limite de Detecção</h4> | |
| <div class="w-full bg-gray-200 rounded-full h-4"> | |
| <div class="bg-purple-600 h-4 rounded-full" style="width: 90%"></div> | |
| </div> | |
| <p class="text-sm text-gray-600 mt-1">1-10 cópias/μL</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center"> | |
| <span class="bg-green-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-globe-americas text-green-600"></i> | |
| </span> | |
| Impacto Esperado | |
| </h3> | |
| <div class="space-y-4"> | |
| <div class="flex items-start bg-green-50 p-4 rounded-lg"> | |
| <div class="bg-green-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-clinic-medical text-green-600"></i> | |
| </div> | |
| <p class="text-gray-700"> | |
| Redução de custos diagnósticos em até 70% comparado a qPCR, permitindo implementação em unidades básicas de saúde | |
| </p> | |
| </div> | |
| <div class="flex items-start bg-blue-50 p-4 rounded-lg"> | |
| <div class="bg-blue-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-microchip text-blue-600"></i> | |
| </div> | |
| <p class="text-gray-700"> | |
| Capacitação de profissionais para diagnóstico molecular em regiões remotas | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Arduino Implementation --> | |
| <section class="py-16 bg-gray-100"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Implementação Arduino</h2> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center"> | |
| <span class="bg-red-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-microchip text-red-600"></i> | |
| </span> | |
| Circuito do Dispositivo LAMP | |
| </h3> | |
| <div class="bg-white p-6 rounded-xl shadow-sm"> | |
| <h4 class="font-medium text-gray-700 mb-3">Componentes Principais:</h4> | |
| <ul class="text-gray-700 space-y-2"> | |
| <li class="flex items-start"> | |
| <span class="text-red-500 mr-2">•</span> Arduino Nano (controle principal) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-red-500 mr-2">•</span> Módulo Peltier (controle térmico) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-red-500 mr-2">•</span> Sensor DS18B20 (monitoramento de temperatura) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-red-500 mr-2">•</span> Módulo Bluetooth HC-05 (conexão com smartphone) | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="text-red-500 mr-2">•</span> LED RGB (indicação visual dos resultados) | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center"> | |
| <span class="bg-blue-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-code text-blue-600"></i> | |
| </span> | |
| Código Principal | |
| </h3> | |
| <div class="bg-gray-800 p-4 rounded-xl overflow-x-auto"> | |
| <pre class="text-sm text-gray-300"> | |
| #include <OneWire.h> | |
| #include <DallasTemperature.h> | |
| #define ONE_WIRE_BUS 2 | |
| OneWire oneWire(ONE_WIRE_BUS); | |
| DallasTemperature sensors(&oneWire); | |
| const int peltierPin = 3; | |
| const int ledPin = 4; | |
| float targetTemp = 65.0; | |
| void setup() { | |
| Serial.begin(9600); | |
| sensors.begin(); | |
| pinMode(peltierPin, OUTPUT); | |
| pinMode(ledPin, OUTPUT); | |
| } | |
| void loop() { | |
| sensors.requestTemperatures(); | |
| float currentTemp = sensors.getTempCByIndex(0); | |
| // Controle PID simplificado | |
| if(currentTemp < targetTemp - 0.5) { | |
| digitalWrite(peltierPin, HIGH); | |
| } else if(currentTemp > targetTemp + 0.5) { | |
| digitalWrite(peltierPin, LOW); | |
| } | |
| // Monitoramento serial | |
| Serial.print("Temperature: "); | |
| Serial.print(currentTemp); | |
| Serial.println(" °C"); | |
| delay(1000); | |
| }</pre> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-8 bg-white p-6 rounded-xl shadow-sm"> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center"> | |
| <span class="bg-green-100 p-2 rounded-full mr-3"> | |
| <i class="fas fa-project-diagram text-green-600"></i> | |
| </span> | |
| Fluxo de Operação | |
| </h3> | |
| <div class="grid md:grid-cols-4 gap-4 text-center"> | |
| <div class="bg-green-50 p-4 rounded-lg"> | |
| <div class="bg-green-100 w-12 h-12 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-power-off text-green-600"></i> | |
| </div> | |
| <p class="font-medium">1. Ligar dispositivo</p> | |
| </div> | |
| <div class="bg-blue-50 p-4 rounded-lg"> | |
| <div class="bg-blue-100 w-12 h-12 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-temperature-high text-blue-600"></i> | |
| </div> | |
| <p class="font-medium">2. Aquecer a 65°C</p> | |
| </div> | |
| <div class="bg-purple-50 p-4 rounded-lg"> | |
| <div class="bg-purple-100 w-12 h-12 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-vial text-purple-600"></i> | |
| </div> | |
| <p class="font-medium">3. Inserir amostra</p> | |
| </div> | |
| <div class="bg-red-50 p-4 rounded-lg"> | |
| <div class="bg-red-100 w-12 h-12 rounded-full flex items-center justify-center mx-auto mb-2"> | |
| <i class="fas fa-mobile-alt text-red-600"></i> | |
| </div> | |
| <p class="font-medium">4. Ler resultados</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Industrial Design and Assembly --> | |
| <div class="mt-12"> | |
| <h3 class="text-2xl font-bold text-center text-gray-800 mb-8">Desenho Industrial e Montagem</h3> | |
| <div class="bg-white p-8 rounded-xl shadow-lg"> | |
| <div class="grid md:grid-cols-2 gap-8 items-center mb-8"> | |
| <div> | |
| <h4 class="text-xl font-semibold text-gray-800 mb-4">Especificações do Design</h4> | |
| <ul class="text-gray-700 space-y-3"> | |
| <li class="flex items-start"> | |
| <span class="bg-blue-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-ruler-combined text-blue-600 text-xs"></i> | |
| </span> | |
| Dimensões: 120mm x 80mm x 40mm | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="bg-blue-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-box-open text-blue-600 text-xs"></i> | |
| </span> | |
| Carcaça em ABS impressa em 3D | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="bg-blue-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-thermometer-half text-blue-600 text-xs"></i> | |
| </span> | |
| Compartimento térmico isolado | |
| </li> | |
| <li class="flex items-start"> | |
| <span class="bg-blue-100 p-1 rounded-full mr-2"> | |
| <i class="fas fa-eye text-blue-600 text-xs"></i> | |
| </span> | |
| Janela transparente para observação | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="flex justify-center"> | |
| <img src="https://img.icons8.com/color/512/3d-print.png" alt="Design 3D" class="w-64 h-64"> | |
| </div> | |
| </div> | |
| <h4 class="text-xl font-semibold text-gray-800 mb-4">Diagrama de Montagem</h4> | |
| <div class="bg-gray-100 p-4 rounded-lg mb-8"> | |
| <img src="https://img.icons8.com/color/512/electrical.png" alt="Diagrama de Circuito" class="w-full max-w-2xl mx-auto"> | |
| </div> | |
| <h4 class="text-xl font-semibold text-gray-800 mb-4">Passo a Passo de Montagem</h4> | |
| <div class="space-y-4"> | |
| <div class="flex items-start bg-blue-50 p-4 rounded-lg"> | |
| <div class="bg-blue-100 p-2 rounded-full mr-4"> | |
| <span class="font-bold text-blue-800">1</span> | |
| </div> | |
| <div> | |
| <h5 class="font-medium text-blue-800">Preparação da Carcaça</h5> | |
| <p class="text-gray-700">Imprima as peças em 3D usando ABS. Lixe as rebarbas e encaixe as partes para verificar o ajuste.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-green-50 p-4 rounded-lg"> | |
| <div class="bg-green-100 p-2 rounded-full mr-4"> | |
| <span class="font-bold text-green-800">2</span> | |
| </div> | |
| <div> | |
| <h5 class="font-medium text-green-800">Instalação do Sistema Térmico</h5> | |
| <p class="text-gray-700">Cole o módulo Peltier no bloco de alumínio usando pasta térmica. Instale o sensor DS18B20 próximo ao centro.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-purple-50 p-4 rounded-lg"> | |
| <div class="bg-purple-100 p-2 rounded-full mr-4"> | |
| <span class="font-bold text-purple-800">3</span> | |
| </div> | |
| <div> | |
| <h5 class="font-medium text-purple-800">Montagem da Placa</h5> | |
| <p class="text-gray-700">Soldar todos os componentes na protoboard conforme diagrama. Conectar o Arduino Nano, módulo Bluetooth e LED RGB.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-yellow-50 p-4 rounded-lg"> | |
| <div class="bg-yellow-100 p-2 rounded-full mr-4"> | |
| <span class="font-bold text-yellow-800">4</span> | |
| </div> | |
| <div> | |
| <h5 class="font-medium text-yellow-800">Integração Final</h5> | |
| <p class="text-gray-700">Fixar a placa na carcaça inferior. Conectar os fios do Peltier e sensor. Ajustar a janela transparente.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-red-50 p-4 rounded-lg"> | |
| <div class="bg-red-100 p-2 rounded-full mr-4"> | |
| <span class="font-bold text-red-800">5</span> | |
| </div> | |
| <div> | |
| <h5 class="font-medium text-red-800">Testes Finais</h5> | |
| <p class="text-gray-700">Ligar o dispositivo e verificar: controle de temperatura, comunicação Bluetooth e indicação LED.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=formol2025/lamp" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |