NL

SAPIENS

door davidnurdin · Remakes
5,0 (1)
▶ Spelen 💬 Reacties van spelers Broncode 🕘 Versies Bewerken GitHub
. / site / pt / index.html · commit 6bc6915
<!doctype html><html lang="pt"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>SAPIENS — Há cem mil anos… | Jogue online</title><meta name="description" content="SAPIENS, o jogo de aventura pré-histórico de Didier e Olivier Guillion (1986), jogável de novo no navegador, no computador e no celular. Sobreviva, cace, negocie com as tribos e torne-se chefe dos Pieds-Agiles."><link rel="canonical" href="https://{{DOMAIN}}/pt/"><link rel="alternate" hreflang="fr" href="https://{{DOMAIN}}/"><link rel="alternate" hreflang="en" href="https://{{DOMAIN}}/en/"><link rel="alternate" hreflang="es" href="https://{{DOMAIN}}/es/"><link rel="alternate" hreflang="de" href="https://{{DOMAIN}}/de/"><link rel="alternate" hreflang="it" href="https://{{DOMAIN}}/it/"><link rel="alternate" hreflang="pt" href="https://{{DOMAIN}}/pt/"><link rel="alternate" hreflang="nl" href="https://{{DOMAIN}}/nl/"><link rel="alternate" hreflang="pl" href="https://{{DOMAIN}}/pl/"><link rel="alternate" hreflang="ru" href="https://{{DOMAIN}}/ru/"><link rel="alternate" hreflang="uk" href="https://{{DOMAIN}}/uk/"><link rel="alternate" hreflang="tr" href="https://{{DOMAIN}}/tr/"><link rel="alternate" hreflang="ja" href="https://{{DOMAIN}}/ja/"><link rel="alternate" hreflang="zh" href="https://{{DOMAIN}}/zh/"><link rel="alternate" hreflang="ko" href="https://{{DOMAIN}}/ko/"><link rel="alternate" hreflang="x-default" href="https://{{DOMAIN}}/"><meta name="theme-color" content="#1b120b"><meta property="og:type" content="website"><meta property="og:title" content="SAPIENS — Há cem mil anos…"><meta property="og:description" content="O jogo de aventura pré-histórico de 1986, portado para PHP e jogável no navegador."><meta property="og:url" content="https://{{DOMAIN}}/pt/"><meta property="og:locale" content="pt_BR"><meta property="og:image" content="https://{{DOMAIN}}/img/og.png"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="SAPIENS — Há cem mil anos…"><meta name="twitter:description" content="O jogo de aventura pré-histórico de 1986, portado para PHP e jogável no navegador."><link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect width='64' height='64' rx='12' fill='%231b120b'/%3E%3Cpath d='M20 50 L32 12 L44 50 Z' fill='%23d9822b'/%3E%3Cpath d='M28 50 L32 30 L36 50 Z' fill='%23f2c14e'/%3E%3C/svg%3E"><script type="application/ld+json">{"@context":"https://schema.org","@type":"VideoGame","name":"SAPIENS","url":"https://{{DOMAIN}}/pt/","description":"SAPIENS, o jogo de aventura pré-histórico de Didier e Olivier Guillion (1986), jogável de novo no navegador, no computador e no celular. Sobreviva, cace, negocie com as tribos e torne-se chefe dos Pieds-Agiles.","author":[{"@type":"Person","name":"Didier Guillion"},{"@type":"Person","name":"Olivier Guillion"}],"datePublished":"1986","genre":["Aventura","Sobrevivência"],"gamePlatform":["Navegador web","Celular"],"inLanguage":"pt","image":"https://{{DOMAIN}}/img/og.png","isAccessibleForFree":true,"license":"https://www.gnu.org/licenses/gpl-3.0.html"}</script><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Uncial+Antiqua&family=Alegreya+Sans:wght@400;700&display=swap" rel="stylesheet"><style>:root {  --night: #1b120b;  --rock: #3a2a1d;  --rock2: #4d3826;  --ochre: #d9822b;  --ochre-light: #f2c14e;  --blood: #9e2f1c;  --charcoal: #120c08;  --bone: #f1e4c8;  --bone-dim: #cdbb98;}* { box-sizing: border-box; }html { scroll-behavior: smooth; }body {  margin: 0;  background: var(--night);  color: var(--bone);  font: 18px/1.6 "Alegreya Sans", system-ui, sans-serif;}a { color: var(--ochre-light); }h1, h2, h3 { font-family: "Uncial Antiqua", Georgia, serif; font-weight: 400; letter-spacing: .02em; }/* --- the cave wall --- */.cave {  position: relative;  min-height: 100svh;  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  text-align: center;  padding: 48px 16px 64px;  overflow: hidden;  background:    radial-gradient(ellipse 60% 45% at 50% 55%, rgba(242,193,78,.18), transparent 70%),    radial-gradient(ellipse at 20% 20%, var(--rock2), transparent 55%),    radial-gradient(ellipse at 80% 70%, #4a3220, transparent 60%),    linear-gradient(160deg, var(--rock) 0%, #2b1e14 55%, var(--charcoal) 100%);}.cave::before {  /* the grain of the rock */  content: "";  position: absolute;  inset: 0;  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .07 0 0 0 0 .04 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");  mix-blend-mode: multiply;  opacity: .8;  pointer-events: none;}.paintings {  position: absolute;  inset: 0;  width: 100%;  height: 100%;  opacity: .55;  pointer-events: none;}.torch {  position: absolute;  inset: 0;  background: radial-gradient(circle at 50% 100%, rgba(255,160,60,.25), transparent 55%);  animation: flicker 3.2s infinite ease-in-out;  pointer-events: none;}@keyframes flicker {  0%, 100% { opacity: .85; }  20% { opacity: 1; }  45% { opacity: .7; }  60% { opacity: .95; }  80% { opacity: .78; }}.cave > *:not(.paintings):not(.torch) { position: relative; }.era { color: var(--ochre-light); letter-spacing: .3em; text-transform: uppercase; font-size: .85rem; margin: 0 0 8px; }.title {  margin: 0;  font-size: clamp(3.2rem, 14vw, 8rem);  line-height: 1;  color: var(--ochre);  text-shadow: 3px 3px 0 var(--blood), 0 0 30px rgba(217,130,43,.35);}.tagline { font-size: clamp(1.1rem, 3.5vw, 1.5rem); max-width: 34em; margin: 18px auto 30px; color: var(--bone); }.play {  display: inline-block;  padding: 18px 46px;  font: 1.6rem "Uncial Antiqua", Georgia, serif;  color: var(--charcoal);  text-decoration: none;  background: linear-gradient(145deg, #e9b863, var(--ochre) 55%, #a85d1c);  clip-path: polygon(6% 0, 94% 4%, 100% 48%, 95% 100%, 5% 96%, 0 52%);  box-shadow: 0 8px 0 #6b3a12;  transition: transform .15s, filter .15s;}.play:hover, .play:focus-visible { transform: translateY(-2px) scale(1.03); filter: brightness(1.1); }.hint { margin-top: 16px; font-size: .95rem; color: var(--bone-dim); }main { max-width: 1060px; margin: 0 auto; padding: 0 16px; }section { padding: 56px 0 8px; }h2 { font-size: clamp(1.8rem, 5vw, 2.6rem); color: var(--ochre-light); margin: 0 0 18px; }h2::after {  content: "";  display: block;  width: 120px;  height: 6px;  margin-top: 6px;  background: repeating-linear-gradient(90deg, var(--blood) 0 14px, transparent 14px 20px);  border-radius: 3px;}.shots { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; margin-top: 24px; }figure { margin: 0; background: var(--rock); border: 3px solid #5a4029; border-radius: 6px; overflow: hidden; }figure img { display: block; width: 100%; height: auto; image-rendering: pixelated; aspect-ratio: 8 / 5; object-fit: cover; }figcaption { padding: 10px 14px; color: var(--bone-dim); font-size: .95rem; }.tribes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }.tribe { background: linear-gradient(160deg, var(--rock2), var(--rock)); padding: 18px; border-radius: 8px; border-left: 6px solid var(--ochre); }.tribe h3 { margin: 0 0 4px; color: var(--ochre-light); font-size: 1.25rem; }.tribe p { margin: 0; color: var(--bone-dim); }ol.quest { counter-reset: q; list-style: none; padding: 0; }ol.quest li { counter-increment: q; position: relative; padding: 10px 0 10px 56px; border-bottom: 1px dashed #5a4029; }ol.quest li::before {  content: counter(q);  position: absolute; left: 0; top: 8px;  width: 40px; height: 40px;  display: grid; place-items: center;  font-family: "Uncial Antiqua", Georgia, serif;  color: var(--charcoal); background: var(--ochre);  border-radius: 50% 45% 55% 40%;}.controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }.panel { background: var(--rock); border-radius: 8px; padding: 18px 20px; }.panel h3 { margin: 0 0 10px; color: var(--ochre-light); }.panel dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 0; }.panel dt { color: var(--ochre-light); font-weight: 700; }.panel dd { margin: 0; }kbd { background: var(--bone); color: var(--charcoal); border-radius: 4px; padding: 0 6px; font: 700 .85rem/1.5 ui-monospace, monospace; box-shadow: 0 2px 0 #8a7a5c; }.timeline { border-left: 4px solid var(--ochre); margin: 0; padding: 0 0 0 22px; list-style: none; }.timeline li { position: relative; padding: 4px 0 12px; }.timeline li::before { content: ""; position: absolute; left: -31px; top: 12px; width: 14px; height: 14px; background: var(--blood); border-radius: 50%; border: 3px solid var(--night); }.timeline b { color: var(--ochre-light); }footer { margin-top: 64px; padding: 32px 16px 48px; text-align: center; color: var(--bone-dim); font-size: .9rem; background: var(--charcoal); }footer p { max-width: 760px; margin: 8px auto; }@media (prefers-reduced-motion: reduce) {  .torch { animation: none; }  html { scroll-behavior: auto; }}.langs { background: var(--charcoal); padding: 10px 12px; text-align: center; font-size: .9rem; line-height: 1.3; }.langs a { display: inline-block; margin: 2px 3px; padding: 3px 9px; border-radius: 12px; color: var(--bone-dim); text-decoration: none; border: 1px solid #5a4029; }.langs a:hover, .langs a:focus-visible { color: var(--ochre-light); border-color: var(--ochre); }.langs a[aria-current="true"] { background: var(--ochre); border-color: var(--ochre); color: var(--charcoal); font-weight: 700; }</style></head><body><nav class="langs" aria-label="Idiomas"><a href="../" hreflang="fr" lang="fr">Français</a><a href="../en/" hreflang="en" lang="en">English</a><a href="../es/" hreflang="es" lang="es">Español</a><a href="../de/" hreflang="de" lang="de">Deutsch</a><a href="../it/" hreflang="it" lang="it">Italiano</a><a href="./" hreflang="pt" lang="pt" aria-current="true">Português</a><a href="../nl/" hreflang="nl" lang="nl">Nederlands</a><a href="../pl/" hreflang="pl" lang="pl">Polski</a><a href="../ru/" hreflang="ru" lang="ru">Русский</a><a href="../uk/" hreflang="uk" lang="uk">Українська</a><a href="../tr/" hreflang="tr" lang="tr">Türkçe</a><a href="../ja/" hreflang="ja" lang="ja">日本語</a><a href="../zh/" hreflang="zh" lang="zh">中文</a><a href="../ko/" hreflang="ko" lang="ko">한국어</a></nav><header class="cave">  <svg class="paintings" viewBox="0 0 1200 800" preserveAspectRatio="xMidYMid slice" aria-hidden="true">    <defs>      <filter id="rough"><feTurbulence baseFrequency=".04" numOctaves="2" result="t"/><feDisplacementMap in="SourceGraphic" in2="t" scale="6"/></filter>    </defs>    <g filter="url(#rough)" fill="#b4492a">      <!-- bison -->      <path d="M120 250c30-50 120-60 170-40 30-25 70-20 85 10 10 20 0 40-15 50l10 60h-18l-12-45c-30 10-70 12-110 5l-10 45h-18l2-50c-30-5-60-10-74-35z"/>      <!-- horse -->      <path d="M880 170c40-30 110-30 150 0l40-30 15 10-25 40c10 20 5 40-15 50l8 60h-16l-12-50c-40 10-80 8-110 0l-12 50h-16l6-60c-20-15-25-45-13-70z" fill="#2a1a10"/>      <!-- deer -->      <path d="M780 560c30-25 80-28 110-10l20-40-30-30 12-8 30 28 20-45 12 6-22 50 18 14-12 40c4 20-6 30-18 35l6 50h-14l-10-42c-30 6-55 4-75-2l-8 44h-14l4-50c-20-10-24-26-24-40z"/>      <!-- hunters -->      <path d="M330 600l10-40-14-30 10-4 14 26 10-32h8l-6 34 20 22-6 8-20-18-8 36z" fill="#2a1a10"/>      <path d="M380 600l10-40-14-30 10-4 14 26 10-32h8l-6 34 20 22-6 8-20-18-8 36z" fill="#2a1a10"/>      <path d="M300 520l140-60" stroke="#2a1a10" stroke-width="4"/>    </g>    <!-- hands -->    <g fill="#d9822b" opacity=".7">      <path d="M560 120c-6-30-2-60 8-62s8 28 10 40c2-18 4-48 14-48s8 34 8 48c4-16 8-40 18-38s4 30 2 46c6-10 12-26 20-22s-6 30-14 46c-10 22-30 36-48 32s-16-20-18-42z"/>      <path d="M1040 520c-6-30-2-60 8-62s8 28 10 40c2-18 4-48 14-48s8 34 8 48c4-16 8-40 18-38s4 30 2 46c6-10 12-26 20-22s-6 30-14 46c-10 22-30 36-48 32s-16-20-18-42z" fill="#9e2f1c"/>    </g>    <g fill="none" stroke="#f1e4c8" stroke-width="3" opacity=".25">      <circle cx="140" cy="640" r="6"/><circle cx="160" cy="660" r="6"/><circle cx="182" cy="648" r="6"/><circle cx="204" cy="668" r="6"/>    </g>  </svg>  <div class="torch"></div>  <p class="era">Didier &amp; Olivier Guillion · 1986</p>  <h1 class="title">SAPIENS</h1>  <p class="tagline">Há cem mil anos, o dia amanhece sobre a tribo dos Pieds-Agiles. Sobreviva, cace, converse com as outras tribos e torne-se o chefe do seu clã.</p>  <a class="play" href="../play/">Jogar</a>  <p class="hint">Grátis, sem instalar nada · computador e celular (segure o aparelho na horizontal)</p></header><main>  <section id="jeu">    <h2>O jogo</h2>    <p>Você é <strong>Torgan</strong>, jovem caçador dos <strong>Pieds-Agiles</strong>. Você percorre um vasto vale em visão subjetiva: montanhas, florestas, nascentes, nuvens e tempestades. O dia sucede a noite, e a fome, a sede e o cansaço o consomem. Você encontra lobos, ursos, coelhos e homens de outras tribos: é hora de lutar, em vista lateral, com machado, azagaia ou mãos nuas… ou então conversar, trocar presentes e fazer aliados.</p>    <p>Lasque o sílex para fabricar suas armas, colha frutinhas e raízes, cuide dos ferimentos, durma perto do fogo. Aqui, a astúcia e a diplomacia muitas vezes valem mais do que a força.</p>    <div class="shots">      <figure><img src="../img/paysage.png" alt="A paisagem em visão subjetiva" loading="lazy" width="640" height="400"><figcaption>O vale em visão subjetiva, de dia e de noite</figcaption></figure>      <figure><img src="../img/combat.png" alt="Uma luta em vista lateral" loading="lazy" width="640" height="400"><figcaption>Caça e combate em vista lateral</figcaption></figure>      <figure><img src="../img/quete.png" alt="O chefe Hognor entrega uma missão" loading="lazy" width="640" height="400"><figcaption>A noite cai: o chefe Hognor entrega sua primeira missão</figcaption></figure>    </div>  </section>  <section id="quete">    <h2>A missão</h2>    <p>Hognor, o chefe da sua tribo, lhe entrega provas cada vez mais difíceis:</p>    <ol class="quest">      <li>Trazer comida: a tribo está com fome.</li>      <li>Conseguir a <strong>Poção da Vida</strong> dos Yeux-Malins, porque os jovens comeram frutinhas venenosas.</li>      <li>Aceitar o desafio dos Bras-de-Roc: derrotar o chefe deles e roubar o <strong>Machado de Marfim</strong>.</li>      <li>Recuperar o <strong>Cajado Sagrado</strong> roubado pelas Hyènes-Folles.</li>      <li>E, por fim… que a lei do mais forte escolha o novo chefe.</li>    </ol>    <div class="tribes">      <div class="tribe"><h3>Pieds-Agiles</h3><p>Sua tribo. Chefe: Hognor.</p></div>      <div class="tribe"><h3>Yeux-Malins</h3><p>Curandeiros astutos. Chefe: Sl-Oom.</p></div>      <div class="tribe"><h3>Bras-de-Roc</h3><p>Guerreiros temidos. Chefe: Grungh.</p></div>      <div class="tribe"><h3>Hyènes-Folles</h3><p>Saqueadores do Sul. Chefe: Krok-G.</p></div>    </div>  </section>  <section id="aide">    <h2>Controles</h2>    <div class="controls">      <div class="panel">        <h3>Computador</h3>        <dl>          <dt>Mouse</dt><dd>Escolha uma ação nos menus de baixo (setas ▲▼ para rolar), clique na imagem para observar</dd>          <dt><kbd>←</kbd> <kbd>→</kbd></dt><dd>Paisagem: virar · vista lateral: andar</dd>          <dt><kbd>↑</kbd> <kbd>↓</kbd></dt><dd>Paisagem: acelerar / desacelerar · vista lateral: levantar / agachar</dd>          <dt><kbd>Espaço</kbd></dt><dd>Paisagem: mapa · vista lateral: golpear</dd>          <dt><kbd>Enter</kbd></dt><dd>Trocar de arma (ou clique direito)</dd>          <dt><kbd>Esc</kbd></dt><dd>Sair da vista (ou clique)</dd>          <dt>Teclado num.</dt><dd>Segundo jogador (<kbd>8</kbd><kbd>2</kbd><kbd>4</kbd><kbd>6</kbd>, <kbd>1</kbd> golpear, <kbd>3</kbd> arma)</dd>        </dl>      </div>      <div class="panel">        <h3>Celular</h3>        <dl>          <dt>Toque</dt><dd>Como um clique do mouse: o jogo todo se joga pelos menus (Olhar › Paisagem para sair explorando)</dd>          <dt>Joystick</dt><dd>Faixa da esquerda: virar, avançar (paisagem), andar (vista lateral)</dd>          <dt>GOLPEAR</dt><dd>Vista lateral: golpear · paisagem: mapa</dd>          <dt>ARMA</dt><dd>Vista lateral: trocar de arma</dd>          <dt>SAIR</dt><dd>Sair da paisagem ou da vista atual (tocar na imagem também funciona)</dd>          <dt>MAPA</dt><dd>O mapa na paisagem</dd>        </dl>      </div>    </div>  </section>  <section id="histoire">    <h2>Uma longa história</h2>    <ul class="timeline">      <li><b>1986</b> — Primeira versão, escrita em assembly para os Thomson MO5 e TO7/8/9 e o Amstrad CPC, depois reescrita em C para PC.</li>      <li><b>1987</b> — Versão mais colorida para o Atari ST.</li>      <li><b>1996</b> — Os códigos-fonte em C saem das caixas: versão para MacOS e Windows.</li>      <li><b>2017</b> — Sapiens passa a ser freeware.</li>      <li><b>2018</b> — <a href="https://www.myriad-online.com/fr/products/sapiensopensource.htm">A Myriad publica o código-fonte</a> sob a licença GNU GPL v3.</li>      <li><b>Hoje</b> — Adaptação para PHP, jogável no navegador.</li>    </ul>  </section>  <section id="php">    <h2>100% PHP</h2>    <p>Esta versão é uma adaptação fiel, função por função, do código-fonte em C de 2018 para <strong>PHP</strong>, sobre o framework <a href="https://github.com/davidnurdin/jumPhp">JumPHP</a>. O mesmo código roda no computador (PHP + SDL2) e no navegador (PHP compilado para WebAssembly). Os sprites, os sons e os textos são os do jogo original.</p>    <p>Código-fonte: <a href="https://github.com/davidnurdin/sapiensPhp">github.com/davidnurdin/sapiensPhp</a> · código original: <a href="https://www.myriad-online.com/fr/products/sapiensopensource.htm">a página Sapiens open source da Myriad</a>.</p>  </section></main><footer>  <p><strong>SAPIENS</strong> © Didier &amp; Olivier Guillion — Myriad, 1986-2017. Músicas originais de Gilles Soulet.</p>  <p>Código-fonte publicado sob a licença <a href="https://www.gnu.org/licenses/gpl-3.0.html">GNU GPL v3</a>; esta adaptação é distribuída sob a mesma licença.</p>  <p>Site de fãs não oficial.</p></footer></body></html>