Engenharia da Página Web do LAC

1. Origem da investigação

A investigação começou pela análise de uma página Web do LAC como sistema. A primeira separação foi entre anatomia e fisiologia; em seguida surgiram função e finalidade. O aprofundamento revelou que uma página não pode ser compreendida apenas pelo HTML ou pelo layout: ela é um artefato sociotécnico de conhecimento, usado por pessoas, executado por tecnologia e modificado ao longo do tempo.

2. Problema resolvido pela Engenharia da Página Web

Pergunta-problema

Como conceber, especificar, projetar, implementar, validar, publicar e evoluir uma página Web do LAC, assegurando que sua estrutura, comportamento, conteúdo, experiência e tecnologia atendam às finalidades estabelecidas, com evidências de qualidade, rastreabilidade e governança humana, inclusive quando houver participação de IA?

Situação motivadora

Uma demanda de comunicação, pesquisa, organização do conhecimento ou aprendizagem pode começar incompleta, ambígua ou dispersa. Produzir HTML não garante, por si só, que a página represente adequadamente o conhecimento, seja útil às pessoas ou atenda aos objetivos definidos.

Estado inicial × estado pretendido

Fronteira e escopo

A engenharia trata do método de transformar uma intenção em uma página Web adequada e verificável: investigação, Brief/Briefing, especificação, modelos, arquitetura, UX/UI, implementação, validação, publicação e evolução. O problema específico de cada página pertence ao domínio e à situação motivadora daquela página; não deve ser confundido com o problema metodológico da engenharia.

Transformação e entregáveis

Critérios de aceitação e evidências

A engenharia atende ao problema quando é possível rastrear a necessidade até os requisitos, decisões, componentes, testes e resultados; demonstrar o atendimento às tarefas e finalidades; registrar evidências de qualidade; e explicar responsabilidades e mudanças, inclusive da IA. A mera execução técnica da página não comprova o valor entregue.

Dois problemas diferentes

Problema da engenharia: como produzir e evoluir páginas adequadas, verificáveis e governadas? Problema da página: que pergunta, necessidade ou oportunidade particular esta página deve atender? Por exemplo, uma página sobre organoides pode buscar apoiar a compreensão da computação biológica; a engenharia fornece o método para concebê-la, validá-la e evoluí-la.

O próprio documento é um caso de aplicação: a página “Engenharia da Página Web do LAC” é simultaneamente objeto de estudo, produto da engenharia e ambiente de experimentação e avaliação do método descrito.

3. Cortes fundamentais

Critério de aceitação não é uma quinta análise. É transversal: finalidade → resultado esperado → critério → evidência → teste/avaliação → aceitação ou ajuste.

4. Vida, estados e mudanças

O processo de projeto não deve ser confundido com o estado da página. O ciclo de vida fornece a visão temporal; a máquina de estados formaliza as transições.

Estados adicionais podem incluir SuspensaObsoletaSubstituídaArquivada. A regra básica é: Estado atual + evento/gatilho + condição/regra + ação → novo estado. Página e versão também são distintas: uma versão publicada pode coexistir com outra em validação.

5. Brief, briefing e participação da IA

Brief é o artefato que registra a demanda e a intenção; briefing é o processo colaborativo de investigação, esclarecimento e alinhamento que produz ou revisa esse artefato. O brief consolidado fundamenta finalidade, escopo, requisitos e critérios de aceitação, sem substituir a especificação completa.

Atuação da IA ao longo do ciclo de vida

IA e categorias de páginas

Estática: pode ter sido criada com IA, mas não executá-la. Dinâmica: pode atualizar conteúdo com ou sem IA. Interativa: pode oferecer diálogo com IA, mas não depende dele. Ajustável: pode ajustar-se por preferências, regras determinísticas ou apoio de IA. Ajustabilidade não implica autonomia nem IA.

Contrato de atuação e rastreabilidade

Para cada atividade apoiada por IA, registrar, quando pertinente: tarefa, papel, contexto, fontes/proveniência, ferramentas ou modelo utilizados, permissões, saída produzida, limitações, evidências, revisão e decisão do responsável humano.

Inserção no metamodelo: Brief é um artefato de origem e evolução; briefing é um processo do ciclo de vida. IA é tipo de agente e perspectiva transversal, não um quinto nível de abstração. Distinguir IA que apoia a engenharia de IA incorporada à operação da página.

6. Categorias de páginas: estática, dinâmica, interativa e ajustável

Esta categorização descreve propriedades de comportamento e adaptação da página, não sua finalidade editorial, tipologia (landing page, hub, dashboard) nem arquitetura técnica (SPA, MPA etc.). As categorias podem coexistir: interatividade não exige adaptação e uma página ajustável pode também ser dinâmica e interativa.

Critérios para classificar uma página

Regra de classificação: registrar as propriedades presentes e suas evidências, em vez de impor um único rótulo. Ajustável não significa necessariamente inteligente ou autônoma; a adaptação pode ser definida pelo usuário ou por regras determinísticas. Uma página SPA não é automaticamente ajustável.

Relação com os modelos do LAC

Mental: experiência pretendida por cada ator. Conceitual: categorias, critérios, contexto e ajuste. Semântico: definição de estática, dinâmica, interativa, ajustável e adaptativa, incluindo suas condições de interpretação. Lógico: eventos, regras, estados e perfis. Físico: HTML/CSS/JS, armazenamento, APIs e mecanismos implementados.

7. Arquitetura da Informação e Navegação

A Arquitetura da Informação (AI) organiza, classifica, rotula e torna encontráveis conteúdos e relações de conhecimento. A Navegação define como pessoas percorrem esse espaço, encontram destinos e mantêm orientação. São perspectivas relacionadas, mas distintas de UX, UI, arquitetura de software e estrutura física de arquivos.

Três níveis de navegação no LAC

Da necessidade ao percurso implementado

Relação com os quatro modelos

Participação da IA

Na engenharia: pode sugerir taxonomias, detectar redundâncias, avaliar rótulos, propor percursos e apoiar testes, com revisão humana. Na operação: pode auxiliar busca semântica, explicar relações, recomendar conteúdos e propor caminhos personalizados, quando essas funções forem implementadas e autorizadas.

Critérios de aceitação e evidências

Distinção essencial: o mapa de conhecimento descreve relações semânticas; a arquitetura da informação estrutura seu acesso; a navegação oferece percursos; a interface os torna operáveis. Não são a mesma coisa.

8. Design e Gestão da Página Web

Design concebe e projeta soluções para atender finalidades e requisitos; Gestão planeja, coordena e acompanha atividades, entregáveis, riscos, mudanças e evolução. Governança estabelece políticas, responsabilidades e direitos de decisão; Engenharia integra essas atividades em um processo verificável.

IA: pode propor alternativas, apoiar protótipos e verificar coerência, além de auxiliar no planejamento e na análise de riscos; a aceitação e a responsabilidade permanecem sob governança humana.

9. Arquitetura do Sistema e Arquitetura de Software

Arquitetura do Sistema organiza o sistema sociotécnico completo, conforme sua fronteira: pessoas, papéis, processos, conteúdo, página, software, dispositivos, infraestrutura, interfaces e ambiente. Arquitetura de Software organiza a parte computacional: módulos, componentes, serviços, dados, APIs, contratos e dependências. A segunda é uma visão especializada da primeira quando há software no sistema.

Arquiteturas complementares

Distinção dos objetos: Página Web = artefato digital; Sistema da Página Web = elementos técnicos e sociotécnicos envolvidos conforme a fronteira adotada; Engenharia da Página Web = disciplina e processo de concepção, realização, verificação e evolução.

Aplicação à página atual

O arquivo HTML com CSS, âncoras e imagens constitui uma implementação Web simples. Uma SPA, back-end, API ou serviço de IA são opções arquiteturais, não consequências obrigatórias de uma página interativa ou ajustável.

Critérios de aceitação: fronteira e responsabilidades explícitas; interfaces identificadas; decisões justificadas; rastreabilidade com requisitos; integração testada; segurança, acessibilidade e operação compatíveis com o escopo.

10. Tipologia, arquitetura e infraestrutura

O corte OSI/TCP-IP observa a comunicação: aplicação, apresentação, sessão, transporte, rede, enlace e física. Ele é complementar aos cortes de conhecimento, UX/UI, software, dados e implantação.

11. Cinco níveis de representação e refinamento

Convenção metodológica proposta para o LAC: Mental → Conceitual → Semântico → Lógico → Físico. São responsabilidades distinguíveis, mas interdependentes; não são etapas lineares obrigatórias nem níveis universalmente independentes. O refinamento acrescenta precisão e decisões, não apenas concretude.

Imagens de referência: os quatro diagramas originais foram preservados em assets/img/ e ainda não incorporam visualmente o Modelo Semântico. A atualização desses arquivos gráficos depende de revisão específica.

12. Contrato de Referência dos Cinco Modelos — v1.0

O contrato formaliza objeto, responsabilidade, entradas, saídas, artefato, invariantes, validação, relações entre modelos, rastreabilidade e tratamento de exceções. É uma proposta para validação, não evidência de independência empírica já comprovada.

Abrir Contrato de Referência dos Cinco Modelos — v1.0 (arquivo associado, previsto nesta mesma pasta)

Invariantes e exceções

Invariantes transversais: identidade do artefato, proveniência, rastreabilidade bidirecional, coerência entre níveis, controle de versões e responsabilidade por validação. Exceções: modelo inaplicável, informação insuficiente, divergência de significado, conflito entre modelos, implementação sem requisito e evidência ausente devem ser registrados, justificados e encaminhados para revisão; não devem ser silenciosamente considerados aprovados.

Regra de decisão: distinguir validado, aceito com ressalvas e pendente de validação. A presença de um artefato não comprova sua qualidade. A formalização deve ser proporcional à complexidade e à finalidade da página.

13. UX e UI atravessam os modelos

UX e UI não são níveis adicionais ao lado de Mental, Conceitual, Semântico, Lógico e Físico. São perspectivas transversais. UX observa a experiência da pessoa ao encontrar, explorar, compreender, relacionar, aplicar e construir conhecimento; UI oferece parte dos meios para essa experiência.

14. Metamodelo da Página Web do LAC

O Metamodelo articula três eixos: níveis de representação/refinamento × perspectivas/cortes × ciclo de vida. Os cinco níveis são distinguíveis por responsabilidade, mas dependentes e sujeitos a revisões iterativas. Requisitos, evidências, rastreabilidade, governança, qualidade, segurança e versionamento atravessam o conjunto. A formalização semântica é proporcional à necessidade.

Imagem histórica: assets/img/metamodelo.png ainda representa a versão anterior com quatro níveis. A tabela acima é a referência textual atualizada, sujeita à validação pelo contrato.

15. Knowgrama-Mãe da Página Web do LAC

O Knowgrama-Mãe não é a soma mecânica das caixas anteriores. É o modelo de conhecimento de referência que integra a razão de existir da página, transformação pretendida, escopo, conhecimento, experiência, funções, estrutura, comportamento, tecnologia, infraestrutura, qualidade, governança e evolução. A categorização estática, dinâmica, interativa e ajustável acrescenta uma perspectiva transversal: que tipo de resposta e ajuste a página oferece. A IA pode apoiar a engenharia ou integrar a operação da página; brief e briefing fundamentam sua origem e revisões, sob governança humana. A Arquitetura da Informação organiza e torna encontrável o conhecimento; a Navegação oferece percursos e preserva a orientação da pessoa. O Knowgrama pode também funcionar como interface de navegação semântica.

Cinco modelos e contrato: o Knowgrama-Mãe deve relacionar Mental, Conceitual, Semântico, Lógico e Físico, registrando a origem, o significado, a operacionalização e a concretização dos conceitos, com critérios de validação e exceções. A imagem preservada abaixo ainda não reflete integralmente esta ampliação.

Problema da engenharia: assegurar a transformação rastreável de intenção em uma página adequada, verificável e evolutiva; distinto do problema específico que cada página procura atender.

Relações arquiteturais e de realização: o Design concebe a solução; a Gestão coordena sua realização e evolução; a Arquitetura do Sistema organiza o todo; a Arquitetura de Software organiza os componentes computacionais; a Governança define limites e responsabilidades. Essas relações complementam Brief, Briefing, IA, informação e navegação.

Critério de completeza

O modelo é suficientemente completo quando permite explicar por que a página existe, para que existe, o que representa, qual é seu escopo, quem a utiliza, o que faz, como funciona, de que é constituída, como é realizada, como chega ao usuário, como sabemos se atende ao pretendido e como evolui ao longo do tempo, e quais propriedades de dinamismo, interação e ajuste apresenta.

Pergunta-mãe: O que é uma Página Web do LAC, por que e para que ela existe, como é concebida, estruturada, realizada, utilizada, avaliada e evoluída?

16. Rastreabilidade: do propósito ao físico

Qualquer elemento físico deve poder ser rastreado até uma justificativa. Isso permite verificar essência, reduzir redundâncias e apoiar otimização.

O caminho inverso também deve ser possível: arquivo → componente → função → capacidade → tarefa/experiência → finalidade → transformação pretendida. Se um elemento não possui justificativa funcional, epistemológica ou técnica, torna-se candidato a revisão ou remoção.

Para cada passagem, registrar identificação, versão, fonte, justificativa, critérios de aceitação, evidência e exceções. O refinamento é iterativo e pode exigir retorno a níveis anteriores.