{"id":4,"date":"2026-03-13T22:42:50","date_gmt":"2026-03-13T22:42:50","guid":{"rendered":"https:\/\/harmonic-framework.com\/?page_id=4"},"modified":"2026-04-08T13:49:42","modified_gmt":"2026-04-08T18:49:42","slug":"home","status":"publish","type":"page","link":"https:\/\/harmonic-framework.com\/es\/","title":{"rendered":"Harmonic Framework"},"content":{"rendered":"<div class=\"wp-block-group hf-hero\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n\n\n<h1 class=\"wp-block-heading hf-hero__heading\" style=\"font-size:52px\">One Structure. Every Layer.<\/h1>\n\n\n\n<p class=\"hf-hero__lede\" style=\"font-size:21px\">Harmonic Design is a unified software engineering framework. It applies a single organizing principle \u2014 <strong>isolate change along its natural axes<\/strong> \u2014 consistently across backend architecture, interface architecture, test strategy, and project planning.<\/p>\n\n\n\n<p class=\"hf-hero__body\">Every long-lived software system has a backend that must evolve, an interface that must evolve, tests that must survive both kinds of evolution, and a project plan that must anticipate, sequence, and resource all three. These concerns are typically governed by separate frameworks and separate mental models. Harmonic Design unifies them under a single structural discipline.<\/p>\n\n\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group hf-section hf-section--methods\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n\n\n<h2 class=\"wp-block-heading hf-section__heading\">Methodologies<\/h2>\n\n\n\n<p class=\"hf-section__intro\">Four methodologies, one structural principle. Each governs a different architectural concern. All share the same decomposition logic.<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"hf-method-card hf-method-card--vbd\">\n<div class=\"hf-method-icon\">\n<svg viewbox=\"0 0 48 48\" width=\"40\" height=\"40\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"\/><rect x=\"28\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"\/><rect x=\"4\" y=\"28\" width=\"16\" height=\"16\" rx=\"2\"\/><rect x=\"28\" y=\"28\" width=\"16\" height=\"16\" rx=\"2\"\/><line x1=\"20\" y1=\"12\" x2=\"28\" y2=\"12\" stroke-dasharray=\"2 2\"\/><line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"28\" stroke-dasharray=\"2 2\"\/><\/svg>\n<\/div>\n<h3><a href=\"\/es\/methodologies\/volatility-based-decomposition\/\">Volatility-Based Decomposition<\/a><\/h3>\n<p>Backend systems organized around anticipated change, not current functionality. Components that change for the same reason belong together; components that change for different reasons belong apart.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"hf-method-card hf-method-card--ebd\">\n<div class=\"hf-method-icon\">\n<svg viewbox=\"0 0 48 48\" width=\"40\" height=\"40\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"24\" cy=\"8\" r=\"5\"\/><circle cx=\"10\" cy=\"28\" r=\"5\"\/><circle cx=\"38\" cy=\"28\" r=\"5\"\/><circle cx=\"24\" cy=\"42\" r=\"4\"\/><line x1=\"24\" y1=\"13\" x2=\"10\" y2=\"23\"\/><line x1=\"24\" y1=\"13\" x2=\"38\" y2=\"23\"\/><line x1=\"10\" y1=\"33\" x2=\"24\" y2=\"38\"\/><line x1=\"38\" y1=\"33\" x2=\"24\" y2=\"38\"\/><\/svg>\n<\/div>\n<h3><a href=\"\/es\/methodologies\/experience-based-decomposition\/\">Experience-Based Decomposition<\/a><\/h3>\n<p>Interface architecture structured around human intent, not screens. Experiences represent complete user journeys. Flows own goal-directed sequences. Interactions are atomic.<\/p>\n<\/div>\n<\/div>\n\n\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"hf-method-card hf-method-card--bdt\">\n<div class=\"hf-method-icon\">\n<svg viewbox=\"0 0 48 48\" width=\"40\" height=\"40\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"24\" cy=\"24\" r=\"20\"\/><circle cx=\"24\" cy=\"24\" r=\"13\"\/><circle cx=\"24\" cy=\"24\" r=\"6\"\/><line x1=\"24\" y1=\"4\" x2=\"24\" y2=\"2\"\/><line x1=\"24\" y1=\"46\" x2=\"24\" y2=\"44\"\/><line x1=\"4\" y1=\"24\" x2=\"2\" y2=\"24\"\/><line x1=\"46\" y1=\"24\" x2=\"44\" y2=\"24\"\/><\/svg>\n<\/div>\n<h3><a href=\"\/es\/methodologies\/behavior-driven-testing\/\">Boundary-Driven Testing<\/a><\/h3>\n<p>Testing difficulty is architectural evidence. The test spiral is a structural map, not a testing methodology. Correct boundaries produce testable systems; incorrect boundaries produce test friction.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"hf-method-card hf-method-card--pd\">\n<div class=\"hf-method-icon\">\n<svg viewbox=\"0 0 48 48\" width=\"40\" height=\"40\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><rect x=\"2\" y=\"8\" width=\"12\" height=\"8\" rx=\"2\"\/><rect x=\"18\" y=\"18\" width=\"12\" height=\"8\" rx=\"2\"\/><rect x=\"34\" y=\"8\" width=\"12\" height=\"8\" rx=\"2\"\/><rect x=\"18\" y=\"34\" width=\"12\" height=\"8\" rx=\"2\"\/><line x1=\"14\" y1=\"12\" x2=\"34\" y2=\"12\"\/><line x1=\"24\" y1=\"26\" x2=\"24\" y2=\"34\"\/><line x1=\"14\" y1=\"14\" x2=\"18\" y2=\"20\"\/><line x1=\"34\" y1=\"14\" x2=\"30\" y2=\"20\"\/><\/svg>\n<\/div>\n<h3><a href=\"\/es\/methodologies\/process-design\/\">Project Design<\/a><\/h3>\n<p>Project plans derived from architecture. Components become work packages. Dependencies become the project network. Estimation follows from structural analysis, not intuition.<\/p>\n<\/div>\n<\/div>\n\n\n<\/div>\n\n\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group hf-section hf-section--isomorphism\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n\n\n<h2 class=\"wp-block-heading hf-section__heading\">How They Connect<\/h2>\n\n\n\n<p class=\"hf-section__intro\">The same structural map, read across four frameworks. Select an axis to see which roles absorb that category of change.<\/p>\n\n\n\n<div class=\"hf-iso-filters\">\n  <button class=\"hf-iso-filter\" data-axis=\"functional\">Functional<\/button>\n  <button class=\"hf-iso-filter\" data-axis=\"nonfunctional\">Non-functional<\/button>\n  <button class=\"hf-iso-filter\" data-axis=\"environmental\">Environmental<\/button>\n  <button class=\"hf-iso-filter\" data-axis=\"crosscutting\">Cross-cutting<\/button>\n  <button class=\"hf-iso-filter\" data-axis=\"replan\">Planning<\/button>\n<\/div>\n\n<div class=\"hf-iso-change\" data-axis=\"functional\">A business rule changes, a new workflow is added, or orchestration logic shifts \u2014 absorbed by Manager and Engine, leaving infrastructure and shared concerns untouched.<\/div>\n<div class=\"hf-iso-change\" data-axis=\"replan\">An estimate was wrong or new work has been added to the schedule. Nothing in the code changes \u2014 the architecture is intact. You adjust the work packages, recalculate the critical path, and re-evaluate float. The same structural decomposition that produced the original plan still governs the updated one.<\/div>\n<div class=\"hf-iso-change\" data-axis=\"nonfunctional\">Non-functional volatility covers the stability qualities: performance, scalability, reliability, availability, extensibility, maintainability, security, and observability. Most are addressed outside the application \u2014 scalability through infrastructure, security and observability through cross-cutting Utilities. Extensibility requires a one-time structural investment: expose configuration points, support injection where hardcoded behaviour exists. Once done, new behaviours arrive as configuration, not code. The design itself is the primary answer to most non-functional concerns \u2014 which is why a well-decomposed system rarely generates ongoing churn from them.<\/div>\n<div class=\"hf-iso-change\" data-axis=\"environmental\">An external API changes, a database is migrated, a vendor is replaced \u2014 absorbed entirely by the Resource Accessor. Nothing above it changes.<\/div>\n<div class=\"hf-iso-change\" data-axis=\"crosscutting\">Logging standards change, auth conventions shift, observability tooling is replaced \u2014 absorbed by Utilities, which are consumed by all tiers but owned by none.<\/div>\n\n<div class=\"hf-iso-cards\">\n\n  <div class=\"hf-iso-card hf-iso-card--orch\" data-absorbs=\"functional\">\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">VBD<\/span>\n      <span class=\"hf-iso-cell__value\">Manager<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">EBD<\/span>\n      <span class=\"hf-iso-cell__value\">Experience<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">BDT<\/span>\n      <span class=\"hf-iso-cell__value\">Unit \u00b7 Integration<\/span>\n      <span class=\"hf-iso-cell__sub\">E2E \u00b7 UAT<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell hf-iso-cell--pd\">\n      <span class=\"hf-iso-cell__label\">Project Design<\/span>\n      <span class=\"hf-iso-cell__value\">Integration Milestone<\/span>\n    <\/div>\n  <\/div>\n\n  <div class=\"hf-iso-card hf-iso-card--exec\" data-absorbs=\"functional\">\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">VBD<\/span>\n      <span class=\"hf-iso-cell__value\">Engine<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">EBD<\/span>\n      <span class=\"hf-iso-cell__value\">Flow \u00b7 Interaction<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">BDT<\/span>\n      <span class=\"hf-iso-cell__value\">Unit \u00b7 Integration<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell hf-iso-cell--pd\">\n      <span class=\"hf-iso-cell__label\">Project Design<\/span>\n      <span class=\"hf-iso-cell__value\">Core Work Package<\/span>\n    <\/div>\n  <\/div>\n\n  <div class=\"hf-iso-card hf-iso-card--boundary\" data-absorbs=\"environmental\">\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">VBD<\/span>\n      <span class=\"hf-iso-cell__value\">Resource Accessor<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell hf-iso-cell--dash\">\n      <span class=\"hf-iso-cell__label\">EBD<\/span>\n      <span class=\"hf-iso-cell__value\">\u2014<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">BDT<\/span>\n      <span class=\"hf-iso-cell__value\">Unit<\/span>\n      <span class=\"hf-iso-cell__sub\">translation only<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell hf-iso-cell--pd\">\n      <span class=\"hf-iso-cell__label\">Project Design<\/span>\n      <span class=\"hf-iso-cell__value\">Boundary Work Package<\/span>\n    <\/div>\n  <\/div>\n\n  <div class=\"hf-iso-card hf-iso-card--xcut\" data-absorbs=\"crosscutting\">\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">VBD<\/span>\n      <span class=\"hf-iso-cell__value\">Utility<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">EBD<\/span>\n      <span class=\"hf-iso-cell__value\">Utility<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell\">\n      <span class=\"hf-iso-cell__label\">BDT<\/span>\n      <span class=\"hf-iso-cell__value\">Unit<\/span>\n    <\/div>\n    <div class=\"hf-iso-cell hf-iso-cell--pd\">\n      <span class=\"hf-iso-cell__label\">Project Design<\/span>\n      <span class=\"hf-iso-cell__value\">Shared Infrastructure<\/span>\n    <\/div>\n  <\/div>\n\n<\/div>\n\n<script>\n(function() {\n  var wrap = document.currentScript.parentElement;\n  var filters = wrap.querySelectorAll('.hf-iso-filter');\n  var cards   = wrap.querySelector('.hf-iso-cards');\n  var changes = wrap.querySelectorAll('.hf-iso-change');\n  var active  = null;\n  filters.forEach(function(btn) {\n    btn.addEventListener('click', function() {\n      var axis = btn.dataset.axis;\n      if (active === axis) {\n        active = null;\n        btn.classList.remove('active');\n        cards.classList.remove('filtering', 'replan-mode');\n        cards.querySelectorAll('.hf-iso-card').forEach(function(c) { c.classList.remove('lit'); });\n        changes.forEach(function(c) { c.classList.remove('visible'); });\n      } else {\n        active = axis;\n        filters.forEach(function(b) { b.classList.remove('active'); });\n        btn.classList.add('active');\n        cards.classList.remove('filtering', 'replan-mode');\n        if (axis === 'replan') {\n          cards.classList.add('replan-mode');\n        } else {\n          cards.classList.add('filtering');\n          cards.querySelectorAll('.hf-iso-card').forEach(function(c) {\n            var absorbs = c.dataset.absorbs ? c.dataset.absorbs.split(' ') : [];\n            c.classList.toggle('lit', absorbs.indexOf(axis) !== -1);\n          });\n        }\n        changes.forEach(function(c) { c.classList.toggle('visible', c.dataset.axis === axis); });\n      }\n    });\n  });\n})();\n<\/script>\n\n\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group hf-cta\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n\n\n<h3 class=\"wp-block-heading hf-cta__heading\">Read the framework. Apply the structure.<\/h3>\n\n\n\n<p class=\"hf-cta__body\">Start with the methodology that matches your current concern, or read the white papers for the theoretical foundation.<\/p>\n\n\n\n<div class=\"wp-block-buttons hf-cta__buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-16018d1d wp-block-buttons-is-layout-flex\">\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-vivid-cyan-blue-background-color has-background\" href=\"\/es\/methodologies\/\">Methodologies<\/a><\/div>\n\n\n<div class=\"wp-block-button is-style-outline is-style-outline--1\"><a class=\"wp-block-button__link\" href=\"\/es\/whitepapers\/\">White Papers<\/a><\/div>\n\n<\/div>\n\n\n<\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>One Structure. Every Layer. Harmonic Design is a unified software engineering framework. It applies a single organizing principle \u2014 isolate change along its natural axes \u2014 consistently across backend architecture, interface architecture, test strategy, and project planning. Every long-lived software system has a backend that must evolve, an interface that must evolve, tests that must &#8230; <a title=\"Harmonic Framework\" class=\"read-more\" href=\"https:\/\/harmonic-framework.com\/es\/\" aria-label=\"Read more about Harmonic Framework\">Read more<\/a><\/p>","protected":false},"author":0,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","footnotes":""},"methodology":[],"class_list":["post-4","page","type-page","status-publish"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false,"post-thumbnail":false,"hf-card":false,"hf-hero":false},"uagb_author_info":{"display_name":"","author_link":"https:\/\/harmonic-framework.com\/es\/author\/"},"uagb_comment_info":0,"uagb_excerpt":"One Structure. Every Layer. Harmonic Design is a unified software engineering framework. It applies a single organizing principle \u2014 isolate change along its natural axes \u2014 consistently across backend architecture, interface architecture, test strategy, and project planning. Every long-lived software system has a backend that must evolve, an interface that must evolve, tests that must&hellip;","_links":{"self":[{"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/pages\/4","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/comments?post=4"}],"version-history":[{"count":8,"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/pages\/4\/revisions"}],"predecessor-version":[{"id":652,"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/pages\/4\/revisions\/652"}],"wp:attachment":[{"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/media?parent=4"}],"wp:term":[{"taxonomy":"methodology","embeddable":true,"href":"https:\/\/harmonic-framework.com\/es\/wp-json\/wp\/v2\/methodology?post=4"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}