EuConquisto Composer MCP

/** * @document Fotossíntese Composer JSON * @version 1.1.0 * @status active * @author Claude * @created 2025-06-29 * @last_updated 2025-06-29 * @description Composer-compatible JSON structure for photosynthesis educational composition */ // ============================================================================= // COMPOSER-COMPATIBLE JSON STRUCTURE // Based on json-example patterns and localStorage injection requirements // ============================================================================= export const fotossintesesComposerJSON = { "composition": { "id": "fotossintese-7ano-2025", "title": "Fotossíntese: Como as Plantas Produzem Alimento", "description": "Composição educacional interativa sobre fotossíntese para estudantes do 7º ano", "author": "Prof. Ricardo Kawasaki", "created": "2025-06-29", "version": "1.1.0", "metadata": { "disciplina": "Ciências Naturais", "serie": "7º ano do Ensino Fundamental", "duracao_estimada": "50 minutos", "tags": ["fotossíntese", "plantas", "biologia", "ciências", "7º ano"] }, "elements": [ { "id": "header-fotossintese-001", "type": "head-1", "content_title": "Apresentação da Aula", "padding_top": 0, "padding_bottom": 30, "background_color": "#228B22", "primary_color": "#228B22", "font_family": "Lato", "category": "🌱 CIÊNCIAS NATURAIS - 7º ANO", "show_category": true, "show_author_name": true, "author_name": "Prof. Ricardo Kawasaki", "author_office": "Professor de Ciências", "avatar": "https://via.placeholder.com/120x120/228B22/FFFFFF?text=RK", "avatar_border_color": "#32CD32", "show_divider": true, "progress_tracking": true }, { "id": "text-introducao-001", "type": "text-1", "content_title": "Introdução e Objetivos", "padding_top": 30, "padding_bottom": 30, "font_family": "Lato", "primary_color": "#228B22", "progress_tracking": true, "content": "<div style='background: linear-gradient(135deg, #F0FFF0 0%, #E8F5E8 100%); padding: 25px; border-radius: 15px; border: 3px solid #228B22;'><h2 style='color: #228B22; text-align: center; margin-top: 0;'>🎯 O que vamos aprender hoje?</h2><div style='background-color: #FFF; padding: 20px; border-radius: 10px; margin: 20px 0; box-shadow: 0 2px 5px rgba(0,0,0,0.1);'><h3 style='color: #1E6B1E; margin-top: 0;'>Objetivos da Aula:</h3><ul style='line-height: 1.8; font-size: 16px;'><li>🔍 <strong>Compreender</strong> o que é fotossíntese</li><li>🧪 <strong>Identificar</strong> os ingredientes necessários</li><li>🌍 <strong>Reconhecer</strong> a importância para a vida na Terra</li><li>📍 <strong>Localizar</strong> onde acontece nas plantas</li><li>💡 <strong>Aplicar</strong> em situações do dia a dia</li></ul></div><div style='background-color: #FFFACD; padding: 15px; border-radius: 10px; text-align: center;'><p style='margin: 0; color: #B8860B; font-weight: bold; font-size: 18px;'>🤔 Curiosidade inicial: Você sabia que as plantas são as únicas que conseguem 'cozinhar' seu próprio alimento usando apenas luz solar?</p></div></div>" }, { "id": "text-atividade-inicial-001", "type": "text-1", "content_title": "Atividade de Ativação", "padding_top": 30, "padding_bottom": 30, "font_family": "Lato", "primary_color": "#1E90FF", "progress_tracking": true, "content": "<div style='background: linear-gradient(135deg, #E6F3FF 0%, #CCE5FF 100%); padding: 25px; border-radius: 15px; border: 3px solid #1E90FF;'><h3 style='color: #1E6B96; text-align: center; margin-top: 0;'>🧠 Ativação do Conhecimento</h3><div style='background-color: #FFF; padding: 20px; border-radius: 10px; margin: 20px 0;'><h4 style='color: #1E90FF; margin-top: 0;'>💭 Pense e Responda (5 minutos):</h4><ol style='line-height: 1.8; font-size: 16px;'><li><strong>O que você acha que as plantas comem?</strong> 🤔</li><li><strong>Por que as plantas precisam de luz solar?</strong> ☀️</li><li><strong>O que acontece com uma planta no escuro?</strong> 🌚</li><li><strong>De onde vem o oxigênio que respiramos?</strong> 💨</li></ol></div><div style='background-color: #F0F8FF; padding: 15px; border-radius: 10px; border-left: 5px solid #1E90FF;'><p style='margin: 0; color: #1E6B96; font-style: italic;'>💡 <strong>Dica:</strong> Não se preocupe se não souber todas as respostas! Ao final da aula, você será um expert em fotossíntese!</p></div></div>" }, { "id": "text-conceito-001", "type": "text-1", "content_title": "Conceito de Fotossíntese", "padding_top": 30, "padding_bottom": 30, "font_family": "Lato", "primary_color": "#228B22", "progress_tracking": true, "content": "<div style='background: linear-gradient(135deg, #F0FFF0 0%, #E0FFE0 100%); padding: 30px; border-radius: 15px; border: 4px solid #228B22;'><h2 style='color: #228B22; text-align: center; margin-top: 0; font-size: 28px;'>🌿 O QUE É FOTOSSÍNTESE?</h2><div style='background-color: #FFF; padding: 25px; border-radius: 12px; margin: 20px 0; box-shadow: 0 4px 8px rgba(0,0,0,0.1);'><h3 style='color: #1E6B1E; margin-top: 0; text-align: center;'>📖 Definição Científica</h3><p style='font-size: 18px; line-height: 1.6; text-align: center; background-color: #F8FFF8; padding: 20px; border-radius: 8px; border-left: 5px solid #228B22;'><strong>Fotossíntese é o processo pelo qual as plantas produzem seu próprio alimento (glicose) usando luz solar, água, gás carbônico e clorofila.</strong></p></div><div style='display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 25px 0;'><div style='background-color: #FFFACD; padding: 20px; border-radius: 10px; border: 2px solid #DAA520;'><h4 style='color: #B8860B; margin-top: 0; text-align: center;'>🔤 Etimologia</h4><p style='text-align: center; line-height: 1.6;'><strong>FOTO</strong> = Luz<br><strong>SÍNTESE</strong> = Juntar/Produzir<br><br>💡 <em>Produzir com luz!</em></p></div><div style='background-color: #E6FFE6; padding: 20px; border-radius: 10px; border: 2px solid #32CD32;'><h4 style='color: #228B22; margin-top: 0; text-align: center;'>🏭 Analogia</h4><p style='text-align: center; line-height: 1.6;'>As plantas são como <strong>fábricas de alimento</strong> que funcionam com energia solar!<br><br>🌞 Entrada: Luz + Água + CO₂<br>🍯 Saída: Glicose + Oxigênio</p></div></div></div>" }, { "id": "list-componentes-001", "type": "list-1", "content_title": "Componentes da Fotossíntese", "padding_top": 30, "padding_bottom": 30, "font_family": "Lato", "primary_color": "#FF6347", "progress_tracking": true, "items": [ { "id": "item-luz", "content": "<strong>☀️ LUZ SOLAR</strong><br>A energia que move todo o processo. Sem luz, não há fotossíntese!<br><span style='color: #FF6347; font-style: italic;'>Função: Fornece energia para as reações químicas</span>" }, { "id": "item-agua", "content": "<strong>💧 ÁGUA (H₂O)</strong><br>Absorvida pelas raízes do solo. É quebrada para formar oxigênio.<br><span style='color: #FF6347; font-style: italic;'>Função: Fonte de hidrogênio e elétrons</span>" }, { "id": "item-co2", "content": "<strong>💨 GÁS CARBÔNICO (CO₂)</strong><br>Absorvido pelas folhas do ar atmosférico através dos estômatos.<br><span style='color: #FF6347; font-style: italic;'>Função: Fonte de carbono para produzir glicose</span>" }, { "id": "item-clorofila", "content": "<strong>🌱 CLOROFILA</strong><br>Pigmento verde presente nos cloroplastos que captura a luz solar.<br><span style='color: #FF6347; font-style: italic;'>Função: Absorve energia luminosa e converte em energia química</span>" } ] }, { "id": "image-folha-001", "type": "image-1", "content_title": "Estrutura da Folha", "padding_top": 30, "padding_bottom": 30, "image_url": "https://via.placeholder.com/600x400/228B22/FFFFFF?text=ESTRUTURA+DA+FOLHA", "image_width": 600, "caption_text": "Anatomia de uma folha: onde acontece a fotossíntese", "caption_color": "#228B22", "caption_size": 16, "caption_alignment": "Centro", "zoom": "Habilitado", "progress_tracking": true }, { "id": "hotspot-clorofila-001", "type": "hotspots-1", "content_title": "Exploração Interativa: Clorofila", "padding_top": 30, "padding_bottom": 30, "background_image": "https://via.placeholder.com/700x400/228B22/FFFFFF?text=CLOROPLASTO+AMPLIADO", "hotspot_color": "#FF6347", "image_width": "Largura total", "title_font": "Lato", "text_font": "Lato", "mandatory_interaction": true, "progress_feedback": true, "progress_tracking": true, "hotspots": [ { "id": "hotspot-1", "title": "Cloroplasto", "description": "<strong>Centro de produção!</strong><br>Organela onde acontece a fotossíntese. Contém as moléculas de clorofila que capturam a luz solar.", "position": {"x": 30, "y": 40}, "icon": "info" }, { "id": "hotspot-2", "title": "Clorofila", "description": "<strong>Pigmento mágico!</strong><br>Substância verde que absorve a luz solar. É ela que dá a cor verde às plantas!", "position": {"x": 60, "y": 30}, "icon": "star" }, { "id": "hotspot-3", "title": "Tilacoides", "description": "<strong>Usinas de energia!</strong><br>Estruturas em forma de discos onde a luz é convertida em energia química.", "position": {"x": 45, "y": 60}, "icon": "target" } ] }, { "id": "text-equacao-001", "type": "text-1", "content_title": "Equação da Fotossíntese", "padding_top": 30, "padding_bottom": 30, "font_family": "Lato", "primary_color": "#4169E1", "progress_tracking": true, "content": "<div style='background: linear-gradient(135deg, #E6E6FA 0%, #DDD0FF 100%); padding: 30px; border-radius: 15px; border: 3px solid #4169E1;'><h2 style='color: #4169E1; text-align: center; margin-top: 0;'>🧮 A EQUAÇÃO DA FOTOSSÍNTESE</h2><div style='background-color: #FFF; padding: 25px; border-radius: 12px; margin: 20px 0; text-align: center; box-shadow: 0 4px 8px rgba(0,0,0,0.1);'><h3 style='color: #2E2E8B; margin-top: 0;'>⚗️ Versão Química Completa</h3><div style='font-size: 24px; font-weight: bold; color: #4169E1; background-color: #F0F8FF; padding: 20px; border-radius: 8px; margin: 15px 0;'>6CO₂ + 6H₂O + <span style='color: #FFD700;'>Luz Solar</span><br>↓ <span style='color: #228B22; font-size: 18px;'>clorofila</span><br>C₆H₁₂O₆ + 6O₂</div></div><div style='display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 25px 0;'><div style='background-color: #FFFACD; padding: 20px; border-radius: 10px; border-left: 5px solid #DAA520;'><h4 style='color: #B8860B; margin-top: 0;'>📥 REAGENTES (Entram)</h4><ul style='line-height: 1.6;'><li><strong>6CO₂</strong> = 6 moléculas de gás carbônico</li><li><strong>6H₂O</strong> = 6 moléculas de água</li><li><strong>☀️ Luz Solar</strong> = Energia</li><li><strong>🌱 Clorofila</strong> = Catalisador</li></ul></div><div style='background-color: #E0FFE0; padding: 20px; border-radius: 10px; border-left: 5px solid #228B22;'><h4 style='color: #1E6B1E; margin-top: 0;'>📤 PRODUTOS (Saem)</h4><ul style='line-height: 1.6;'><li><strong>C₆H₁₂O₆</strong> = 1 molécula de glicose (açúcar)</li><li><strong>6O₂</strong> = 6 moléculas de oxigênio</li></ul></div></div><div style='background-color: #F0F8FF; padding: 15px; border-radius: 10px; text-align: center;'><p style='margin: 0; color: #4169E1; font-weight: bold; font-size: 16px;'>💡 Resumo: CO₂ + H₂O + Luz → Glicose + O₂</p></div></div>" }, { "id": "quiz-fotossintese-001", "type": "quiz-1", "content_title": "Quiz Interativo de Fotossíntese", "padding_top": 30, "padding_bottom": 30, "font_family": "Lato", "primary_color": "#FF6347", "progress_tracking": true, "question": "Qual é o principal produto da fotossíntese que serve como alimento para a planta?", "options": [ "Oxigênio", "Glicose", "Água", "Gás carbônico" ], "correct_answer": 1, "feedback": { "correct": "🎉 Correto! A glicose é o 'alimento' que a planta produz durante a fotossíntese!", "incorrect": "🤔 Não é bem assim... Lembre-se: a fotossíntese produz o 'alimento' da planta!" } } ], "theme": { "primary_color": "#228B22", "secondary_color": "#32CD32", "accent_color": "#FF6347", "background_color": "#FFFFFF", "font_family": "Lato" }, "settings": { "progress_tracking": true, "progress_feedback": true, "estimated_duration": 50, "mandatory_elements": [ "header-fotossintese-001", "text-conceito-001", "list-componentes-001", "hotspot-clorofila-001", "quiz-fotossintese-001" ] } } }; // ============================================================================= // FUNÇÃO PARA INJEÇÃO NO COMPOSER // ============================================================================= export function injectCompositionToComposer() { // Formato específico para localStorage do Composer const composerData = { currentComposition: fotossintesesComposerJSON.composition, timestamp: new Date().toISOString(), version: "1.1.0" }; return composerData; } // Log de criação console.log('✅ Composer JSON v1.1.0 criado com sucesso!'); console.log('📊 Total de elementos:', fotossintesesComposerJSON.composition.elements.length); console.log('⏱️ Duração estimada:', fotossintesesComposerJSON.composition.settings.estimated_duration, 'minutos');