{"id":501,"date":"2026-02-26T21:49:29","date_gmt":"2026-02-26T21:49:29","guid":{"rendered":"https:\/\/elprofebernardo.cl\/?page_id=501"},"modified":"2026-06-29T05:11:51","modified_gmt":"2026-06-29T05:11:51","slug":"techne-y-como-percibimos-mediaos-en-ellas","status":"publish","type":"page","link":"https:\/\/elprofebernardo.cl\/?page_id=501","title":{"rendered":"Comprendiendo el mundo que co habitamos"},"content":{"rendered":"\n<h5 class=\"wp-block-heading\">Sentidos, L\u00f3gica y Cosmos<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">El conocimiento humano es una construcci\u00f3n colectiva. Lo que nuestros ojos no ven, lo detectan nuestros instrumentos; lo que nuestros instrumentos captan, nuestra l\u00f3gica lo organiza. Al reconstruir estos recursos de <strong>Atenas<\/strong> y <strong>L\u00f3gica<\/strong>, no solo preservamos herramientas pedag\u00f3gicas valiosas, sino que reafirmamos la importancia de las \u00abcomunidades en la diferencia\u00bb: donde cada perspectiva suma para entender el cosmos.<\/p>\n\n\n\n<div id=\"ecosistema-pedagogico-bernardo\" style=\"background-color: #f0e6d2; color: #1a1a1a; font-family: 'Comic Sans MS', 'Chalkboard SE', cursive; padding: 40px 20px; border: 5px solid #000; max-width: 950px; margin: 20px auto; box-shadow: 15px 15px 0px #000; position: relative; background-image: radial-gradient(#dcd1b8 15%, transparent 16%); background-size: 8px 8px;\">\n\n    <!-- Encabezado Estilo Banner de Acci\u00f3n -->\n    <header style=\"text-align: center; margin-bottom: 45px; border: 4px solid #000; background: #ffde00; padding: 20px; transform: rotate(-1deg); box-shadow: 8px 8px 0px #e63946;\">\n        <h1 style=\"color: #000; font-size: 2.5rem; margin: 0; text-transform: uppercase; font-weight: 900; -webkit-text-stroke: 1px #000;\">\u00a1Sentidos, L\u00f3gica y Cosmos!<\/h1>\n        <p style=\"font-size: 1.1rem; color: #000; max-width: 750px; margin: 10px auto 0; font-weight: bold; background: white; display: inline-block; padding: 5px 10px; border: 2px solid #000;\">\n            Preservaci\u00f3n y reconstrucci\u00f3n bajo la \u00e9tica de Comunidades en la Diferencia.\n        <\/p>\n    <\/header>\n\n    <!-- Secci\u00f3n de Cuadr\u00edcula Estilo Vi\u00f1etas -->\n    <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-bottom: 45px;\">\n        \n        <!-- Vi\u00f1eta 1: Atenas -->\n        <div style=\"background: #fff; border: 4px solid #000; box-shadow: 10px 10px 0px #2563eb; display: flex; flex-direction: column; overflow: hidden;\">\n            <div style=\"position: relative; border-bottom: 4px solid #000;\">\n                <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1543731068-7e0f5beff43a?auto=format&#038;fit=crop&#038;q=80&#038;w=500\" alt=\"Atenas\" style=\"width: 100%; height: 200px; object-fit: cover; filter: contrast(1.2) saturate(1.5);\">\n                <div style=\"position: absolute; top: 0; left: 0; background: #000; color: #fff; padding: 5px 10px; font-size: 0.7rem; font-weight: bold; text-transform: uppercase;\">Cr\u00e9dito: ITE\/INTEF<\/div>\n            <\/div>\n            <div style=\"padding: 20px; flex-grow: 1;\">\n                <h3 style=\"color: #e63946; margin-top: 0; text-transform: uppercase; font-size: 1.4rem;\">\u00a1Atenas: Filosof\u00eda!<\/h3>\n                <p style=\"font-size: 0.95rem; line-height: 1.3;\">Di\u00e1logo y pensamiento cl\u00e1sico reconstruido para el futuro.<\/p>\n                <a href=\"https:\/\/elprofebernardo.cl\/atenas\" target=\"_blank\" style=\"display: block; margin-top: 15px; background: #2563eb; color: white; text-decoration: none; padding: 12px; border: 3px solid #000; font-weight: bold; text-align: center; text-transform: uppercase; box-shadow: 4px 4px 0px #000;\">Ingresar ahora<\/a>\n            <\/div>\n        <\/div>\n\n        <!-- Vi\u00f1eta 2: L\u00f3gica -->\n        <div style=\"background: #fff; border: 4px solid #000; box-shadow: 10px 10px 0px #059669; display: flex; flex-direction: column; overflow: hidden;\">\n            <div style=\"position: relative; border-bottom: 4px solid #000;\">\n                <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1518770660439-4636190af475?auto=format&#038;fit=crop&#038;q=80&#038;w=500\" alt=\"L\u00f3gica\" style=\"width: 100%; height: 200px; object-fit: cover; filter: contrast(1.2) saturate(1.5);\">\n                <div style=\"position: absolute; top: 0; left: 0; background: #000; color: #fff; padding: 5px 10px; font-size: 0.7rem; font-weight: bold; text-transform: uppercase;\">Autor: Paco Calzado<\/div>\n            <\/div>\n            <div style=\"padding: 20px; flex-grow: 1;\">\n                <h3 style=\"color: #059669; margin-top: 0; text-transform: uppercase; font-size: 1.4rem;\">Aprende L\u00f3gica<\/h3>\n                <p style=\"font-size: 0.95rem; line-height: 1.3;\">Pruebas de escritorio y razonamiento. \u00a1La base del Microtaller!<\/p>\n                <a href=\"https:\/\/elprofebernardo.cl\/aprendelogica\" target=\"_blank\" style=\"display: block; margin-top: 15px; background: #059669; color: white; text-decoration: none; padding: 12px; border: 3px solid #000; font-weight: bold; text-align: center; text-transform: uppercase; box-shadow: 4px 4px 0px #000;\">Explorar L\u00f3gica<\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- Secci\u00f3n Interactiva: El Visor -->\n    <section style=\"background: #fff; padding: 30px; border: 4px solid #000; margin-bottom: 45px; position: relative; box-shadow: 10px 10px 0px #f59e0b;\">\n        <div style=\"position: absolute; top: -15px; left: 20px; background: #000; color: #fff; padding: 5px 15px; transform: skew(-10deg); font-weight: bold;\">EXPLORADOR DE PERCEPCI\u00d3N<\/div>\n        <div style=\"display: flex; justify-content: center; gap: 15px; margin: 25px 0; flex-wrap: wrap;\">\n            <button onclick=\"cambiarFoco('humano')\" style=\"background: #fff; color: black; border: 3px solid #000; padding: 10px 20px; cursor: pointer; font-weight: 900; text-transform: uppercase; box-shadow: 4px 4px 0px #000;\">Humano<\/button>\n            <button onclick=\"cambiarFoco('tecnologia')\" style=\"background: #e63946; color: white; border: 3px solid #000; padding: 10px 20px; cursor: pointer; font-weight: 900; text-transform: uppercase; box-shadow: 4px 4px 0px #000;\">Telescopio<\/button>\n            <button onclick=\"cambiarFoco('animal')\" style=\"background: #fbbf24; color: black; border: 3px solid #000; padding: 10px 20px; cursor: pointer; font-weight: 900; text-transform: uppercase; box-shadow: 4px 4px 0px #000;\">Abeja (UV)<\/button>\n        <\/div>\n        <div id=\"barra-espectro\" style=\"height: 60px; background: linear-gradient(to right, #4b0082, #0000ff, #00ff00, #ffff00, #ff7f00, #ff0000); border: 4px solid #000; position: relative; overflow: hidden;\">\n            <div id=\"cortina-izq\" style=\"position: absolute; left: 0; width: 35%; height: 100%; background: rgba(0,0,0,0.9); transition: 0.5s; border-right: 2px solid #fff;\"><\/div>\n            <div id=\"cortina-der\" style=\"position: absolute; right: 0; width: 35%; height: 100%; background: rgba(0,0,0,0.9); transition: 0.5s; border-left: 2px solid #fff;\"><\/div>\n        <\/div>\n        <p id=\"label-foco\" style=\"text-align: center; font-weight: 900; margin-top: 20px; color: #000; font-size: 1.2rem; text-transform: uppercase;\">Espectro Visible (Humano)<\/p>\n    <\/section>\n\n    <!-- Nota CC estilo \"Caja de aviso legal de c\u00f3mic\" -->\n    <div style=\"background: #eee; border: 2px dashed #000; padding: 15px; margin-bottom: 45px; display: flex; align-items: center; gap: 15px;\">\n        <img decoding=\"async\" src=\"https:\/\/mirrors.creativecommons.org\/presskit\/buttons\/88x31\/svg\/by-nc.svg\" alt=\"CC BY-NC\" style=\"height: 31px; filter: grayscale(1) contrast(2);\">\n        <p style=\"font-size: 0.85rem; color: #000; margin: 0; font-style: italic;\">\n            <strong>\u00a1ATENCI\u00d3N!<\/strong> Materiales adaptados para fines pedag\u00f3gicos exclusivos de la comunidad de elprofebernardo.cl.\n        <\/p>\n    <\/div>\n\n    <!-- Bibliograf\u00eda Estilo \"Cartas del Lector\" -->\n    <footer style=\"background: #fff; border: 4px solid #000; padding: 25px; font-size: 0.9rem;\">\n        <h4 style=\"color: #000; text-transform: uppercase; font-weight: 900; border-bottom: 3px solid #000; display: inline-block; margin-bottom: 15px;\">Cr\u00e9ditos y Bibliograf\u00eda (2026)<\/h4>\n        <ul style=\"list-style: square; padding-left: 20px;\">\n            <li style=\"margin-bottom: 8px;\"><strong>Calzado, F. J.:<\/strong> Aprende L\u00f3gica (Reconstrucci\u00f3n digital).<\/li>\n            <li style=\"margin-bottom: 8px;\"><strong>INTEF:<\/strong> Atenas y el pensamiento griego.<\/li>\n            <li style=\"margin-bottom: 8px;\"><strong>Jara Pereira, B.:<\/strong> Comunidades en la diferencia (Ed. Microtaller).<\/li>\n            <li style=\"margin-bottom: 8px;\"><strong>NASA\/ESA:<\/strong> Datos de Percepci\u00f3n James Webb.<\/li>\n        <\/ul>\n    <\/footer>\n\n<\/div>\n\n<script>\nfunction cambiarFoco(tipo) {\n    const izq = document.getElementById('cortina-izq');\n    const der = document.getElementById('cortina-der');\n    const label = document.getElementById('label-foco');\n    if (tipo === 'humano') {\n        izq.style.width = \"35%\"; der.style.width = \"35%\";\n        label.innerText = \"\u00a1Espectro Visible (Humano)!\"; label.style.color = \"#000\";\n    } else if (tipo === 'tecnologia') {\n        izq.style.width = \"75%\"; der.style.width = \"0%\";\n        label.innerText = \"\u00a1Infrarrojo Activado!\"; label.style.color = \"#e63946\";\n    } else if (tipo === 'animal') {\n        izq.style.width = \"0%\"; der.style.width = \"75%\";\n        label.innerText = \"\u00a1Visi\u00f3n de Abeja (UV)!\"; label.style.color = \"#2563eb\";\n    }\n}\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sentidos, L\u00f3gica y Cosmos El conocimiento humano es una construcci\u00f3n colectiva. Lo que nuestros ojos no ven, lo detectan nuestros instrumentos; lo que nuestros instrumentos captan, nuestra l\u00f3gica lo organiza. Al reconstruir estos recursos de Atenas y L\u00f3gica, no solo preservamos herramientas pedag\u00f3gicas valiosas, sino que reafirmamos la importancia de las \u00abcomunidades en la diferencia\u00bb: donde cada perspectiva suma para [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":6,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_joinchat":[],"footnotes":""},"class_list":["post-501","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=\/wp\/v2\/pages\/501","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=501"}],"version-history":[{"count":12,"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=\/wp\/v2\/pages\/501\/revisions"}],"predecessor-version":[{"id":880,"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=\/wp\/v2\/pages\/501\/revisions\/880"}],"wp:attachment":[{"href":"https:\/\/elprofebernardo.cl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=501"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}