{"id":8759,"date":"2025-02-04T15:01:21","date_gmt":"2025-02-04T14:01:21","guid":{"rendered":"https:\/\/www.yos-studio.com\/?page_id=8759"},"modified":"2025-04-13T13:46:49","modified_gmt":"2025-04-13T11:46:49","slug":"shadow-tests","status":"publish","type":"page","link":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/","title":{"rendered":"shadow tests"},"content":{"rendered":"","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":7,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>shadow tests - YOS Studio graficzne Pozna\u0144 - Agencja graficzna<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"shadow tests - YOS Studio graficzne Pozna\u0144 - Agencja graficzna\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/\" \/>\n<meta property=\"og:site_name\" content=\"YOS Studio graficzne Pozna\u0144 - Agencja graficzna\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/YOS.studio\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-13T11:46:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.yos-studio.com\/wp-content\/uploads\/2020\/10\/yos-okladka-strony-02.png\" \/>\n\t<meta property=\"og:image:width\" content=\"651\" \/>\n\t<meta property=\"og:image:height\" content=\"343\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/\",\"url\":\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/\",\"name\":\"shadow tests - YOS Studio graficzne Pozna\u0144 - Agencja graficzna\",\"isPartOf\":{\"@id\":\"https:\/\/www.yos-studio.com\/en\/#website\"},\"datePublished\":\"2025-02-04T14:01:21+00:00\",\"dateModified\":\"2025-04-13T11:46:49+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[[\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/\"]]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.yos-studio.com\/en\/shadow-tests\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.yos-studio.com\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"shadow tests\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.yos-studio.com\/en\/#website\",\"url\":\"https:\/\/www.yos-studio.com\/en\/\",\"name\":\"YOS Studio graficzne Pozna\u0144 - Agencja graficzna\",\"description\":\"YOS to studio graficzne i agencja graficzna z Poznania. Wyposa\u017camy firmy w systemy identyfikacji wizualnej. Kreujemy rozpoznawalne, mocne marki dla nowych firm, korporacji, produkt\u00f3w, instytucji i wydarze\u0144 kulturalnych.\",\"publisher\":{\"@id\":\"https:\/\/www.yos-studio.com\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.yos-studio.com\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.yos-studio.com\/en\/#organization\",\"name\":\"YOS - Studio graficzne \/ Agencja reklamowa Pozna\u0144\",\"alternateName\":\"Studio graficzne Poznan\",\"url\":\"https:\/\/www.yos-studio.com\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.yos-studio.com\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.yos-studio.com\/wp-content\/uploads\/2022\/03\/yos-studio-graficzne-poznan-projekt-logo.png\",\"contentUrl\":\"https:\/\/www.yos-studio.com\/wp-content\/uploads\/2022\/03\/yos-studio-graficzne-poznan-projekt-logo.png\",\"width\":501,\"height\":501,\"caption\":\"YOS - Studio graficzne \/ Agencja reklamowa Pozna\u0144\"},\"image\":{\"@id\":\"https:\/\/www.yos-studio.com\/en\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/YOS.studio\",\"https:\/\/www.instagram.com\/yos.studio\/?hl=pl\",\"https:\/\/www.linkedin.com\/in\/karolpawelek\/?originalSubdomain=pl\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"shadow tests - YOS Studio graficzne Pozna\u0144 - Agencja graficzna","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/","og_locale":"en_US","og_type":"article","og_title":"shadow tests - YOS Studio graficzne Pozna\u0144 - Agencja graficzna","og_url":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/","og_site_name":"YOS Studio graficzne Pozna\u0144 - Agencja graficzna","article_publisher":"https:\/\/www.facebook.com\/YOS.studio","article_modified_time":"2025-04-13T11:46:49+00:00","og_image":[{"width":651,"height":343,"url":"https:\/\/www.yos-studio.com\/wp-content\/uploads\/2020\/10\/yos-okladka-strony-02.png","type":"image\/png"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/","url":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/","name":"shadow tests - YOS Studio graficzne Pozna\u0144 - Agencja graficzna","isPartOf":{"@id":"https:\/\/www.yos-studio.com\/en\/#website"},"datePublished":"2025-02-04T14:01:21+00:00","dateModified":"2025-04-13T11:46:49+00:00","breadcrumb":{"@id":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":[["https:\/\/www.yos-studio.com\/en\/shadow-tests\/"]]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.yos-studio.com\/en\/shadow-tests\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.yos-studio.com\/en\/"},{"@type":"ListItem","position":2,"name":"shadow tests"}]},{"@type":"WebSite","@id":"https:\/\/www.yos-studio.com\/en\/#website","url":"https:\/\/www.yos-studio.com\/en\/","name":"YOS Studio graficzne Pozna\u0144 - Agencja graficzna","description":"YOS to studio graficzne i agencja graficzna z Poznania. Wyposa\u017camy firmy w systemy identyfikacji wizualnej. Kreujemy rozpoznawalne, mocne marki dla nowych firm, korporacji, produkt\u00f3w, instytucji i wydarze\u0144 kulturalnych.","publisher":{"@id":"https:\/\/www.yos-studio.com\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.yos-studio.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.yos-studio.com\/en\/#organization","name":"YOS - Studio graficzne \/ Agencja reklamowa Pozna\u0144","alternateName":"Studio graficzne Poznan","url":"https:\/\/www.yos-studio.com\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.yos-studio.com\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.yos-studio.com\/wp-content\/uploads\/2022\/03\/yos-studio-graficzne-poznan-projekt-logo.png","contentUrl":"https:\/\/www.yos-studio.com\/wp-content\/uploads\/2022\/03\/yos-studio-graficzne-poznan-projekt-logo.png","width":501,"height":501,"caption":"YOS - Studio graficzne \/ Agencja reklamowa Pozna\u0144"},"image":{"@id":"https:\/\/www.yos-studio.com\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/YOS.studio","https:\/\/www.instagram.com\/yos.studio\/?hl=pl","https:\/\/www.linkedin.com\/in\/karolpawelek\/?originalSubdomain=pl"]}]}},"grid":"{\r\n  \"colCount\": 12,\r\n  \"colGutter\": 1,\r\n  \"rowGutters\": [\r\n    5\r\n  ],\r\n  \"frameMargin\": 5,\r\n  \"leftFrameMargin\": 5,\r\n  \"rightFrameMargin\": 5,\r\n  \"topFrameMargin\": 96,\r\n  \"mus\": {\r\n    \"colGutterMu\": \"%\",\r\n    \"rowGutterMu\": \"%\",\r\n    \"topFrameMu\": \"px\",\r\n    \"bottomFrameMu\": \"%\",\r\n    \"frameMu\": \"%\"\r\n  },\r\n  \"bottomFrameMargin\": 5,\r\n  \"rowAttrs\": [\r\n    {\r\n      \"rowcustomheight\": \"\",\r\n      \"relid\": 5\r\n    },\r\n    {\r\n      \"relid\": 1\r\n    }\r\n  ],\r\n  \"bgColor\": null,\r\n  \"bgImage\": null,\r\n  \"cont\": [\r\n    {\r\n      \"type\": \"html\",\r\n      \"cont\": \"<div id=\\\"p5-container\\\"><\/div>\\n<script src=\\\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/p5.js\/1.6.0\/p5.min.js\\\"><\/script>\\n<script>\\n    \\\"use strict\\\";\\n\\n\/\/ --------------------\\n\/\/ 1) \u041f\u0410\u0420\u0410\u041c\u0415\u0422\u0420\u042b \u0414\u041b\u042f \u0411\u041b\u041e\u041a\u041e\u0412 (\u0443\u043c\u0435\u043d\u044c\u0448\u0430\u0435\u043c \u043a\u043e\u043b-\u0432\u043e)\\n\/\/ --------------------\\nlet tileW = 30;  \\nlet tileH = 15;  \\nlet maxH  = 40;  \\nlet cols = 40;  \/\/ \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u0447\u0438\u0441\u043b\u043e \u043a\u043e\u043b\u043e\u043d\u043e\u043a\\nlet rows = 40;  \/\/ \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u0447\u0438\u0441\u043b\u043e \u0440\u044f\u0434\u043e\u0432\\n\\n\/\/ \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 domain warping\\nlet baseFreq   = 0.04;\\nlet warpAmp    = 0.5;\\nlet timeFactor = 0.3;\\n\\n\/\/ \u0426\u0432\u0435\u0442\u0430\/\u0442\u043e\u043b\u0449\u0438\u043d\u0430 \u043a\u043e\u043d\u0442\u0443\u0440\u043e\u0432\\nlet blockStrokeWeight = 1;\\nlet topStrokeColor    = [200, 255];\\nlet leftStrokeColor   = [160, 255];\\nlet rightStrokeColor  = [120, 255];\\n\\n\/\/ --------------------\\n\/\/ 2) \u041f\u0410\u0420\u0410\u041c\u0415\u0422\u0420\u042b \\\"\u041f\u041b\u0410\u0412\u041d\u041e\u0413\u041e \u041f\u0420\u041e\u0416\u0418\u041c\u0410\u041d\u0418\u042f\\\" (\u0433\u0430\u0443\u0441\u0441\u0438\u0430\u043d\u0430)\\n\/\/ --------------------\\nlet maxSink = 40; \\nlet sigma   = 80;  \\n\\n\/\/ --------------------\\n\/\/ 3) \u041d\u0415\u0421\u041a\u041e\u041b\u042c\u041a\u041e \u0411\u0415\u0413\u0423\u041d\u041a\u041e\u0412 (Random Walkers)\\n\/\/ --------------------\\n\\n\/\/ \u041a\u0430\u0436\u0434\u043e\u0433\u043e \\\"\u0431\u0435\u0433\u0443\u043d\u043a\u0430\\\" \u043e\u043f\u0438\u0448\u0435\u043c \u0432 \u0432\u0438\u0434\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430.\\nlet walkers = [\\n  {\\n    x: 0,         \/\/ \u0441\u0442\u0430\u0440\u0442\u043e\u0432\u0430\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u044f\\n    y: 0,\\n    stepsPerFrame: 500,  \/\/ \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0448\u0430\u0433\u043e\u0432 \u0434\u0435\u043b\u0430\u0435\u0442 \u0432 \u043a\u0430\u0434\u0440\\n    stepSize: 1,         \/\/ \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\\n    diameter: 2,         \/\/ \u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u044f\u0442\u043d\u0430\\n    alpha: 50            \/\/ \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u043f\u044f\u0442\u043d\u0430\\n  },\\n  {\\n    x: 0,         \\n    y: 0,\\n    stepsPerFrame: 500,\\n    stepSize: 1,\\n    diameter: 2,\\n    alpha: 60\\n  },\\n  {\\n    x: 0,         \\n    y: 0,\\n    stepsPerFrame: 200,\\n    stepSize: 1,\\n    diameter: 2,\\n    alpha: 70\\n  }\\n];\\n\\n\/\/ --------------------\\n\/\/ 4) \u0425\u041e\u041b\u0421\u0422 \u0414\u041b\u042f \\\"\u0421\u041b\u0415\u0414\u0410\\\" (\u043e\u0431\u0449\u0438\u0439 \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u0431\u0435\u0433\u0443\u043d\u043a\u043e\u0432)\\n\/\/ --------------------\\nlet walkerLayer;\\n\\nfunction setup() {\\n  createCanvas(windowWidth, windowHeight);\\n  noSmooth();\\n\\n  \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u043c walkerLayer\\n  walkerLayer = createGraphics(width, height);\\n  walkerLayer.noStroke();\\n  walkerLayer.background(255);\\n\\n  \/\/ \u0414\u043b\u044f \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u0438\u044f \u0440\u0430\u0437\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0431\u0435\u0433\u0443\u043d\u043a\u043e\u0432 \u043f\u043e \u0440\u0430\u0437\u043d\u044b\u043c \u0442\u043e\u0447\u043a\u0430\u043c\\n  walkers.forEach((w) => {\\n    w.x = random(width);\\n    w.y = random(height);\\n  });\\n\\n  noiseDetail(4, 0.5);\\n}\\n\\nfunction draw() {\\n  \/\/ 1) \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0432\u0441\u0435\u0445 \u0431\u0435\u0433\u0443\u043d\u043a\u043e\u0432\\n  updateWalkers();\\n\\n  \/\/ 2) \u0412\u044b\u0432\u043e\u0434\u0438\u043c \u0441\u043b\u043e\u0439 \u0431\u0435\u0433\u0443\u043d\u043a\u0430\\n  image(walkerLayer, 0, 0);\\n\\n  \/\/ 3) \u0420\u0438\u0441\u0443\u0435\u043c \u0438\u0437\u043e\u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0431\u043b\u043e\u043a\u0438 (\u043f\u0440\u043e\u0432\u043e\u043b\u043e\u043a\u0430)\\n  drawIsometricBlocks();\\n}\\n\\n\/\/ --------------------\\n\/\/ \u041e\u0411\u041d\u041e\u0412\u041b\u0415\u041d\u0418\u0415 \u0412\u0421\u0415\u0425 \u0411\u0415\u0413\u0423\u041d\u041a\u041e\u0412\\n\/\/ --------------------\\nfunction updateWalkers() {\\n  \/\/ \u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e walker \u0434\u0435\u043b\u0430\u0435\u043c stepsPerFrame \u0448\u0430\u0433\u043e\u0432\\n  for (let w of walkers) {\\n    for (let i = 0; i < w.stepsPerFrame; i++) {\\n      \/\/ \u0412\u044b\u0431\u0438\u0440\u0430\u0435\u043c \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u043e\\n      let dir = int(random(8));\\n\\n      if (dir === 0) {\\n        w.y -= w.stepSize;           \/\/ NORTH\\n      } else if (dir === 1) {\\n        w.x += w.stepSize; w.y -= w.stepSize; \/\/ NE\\n      } else if (dir === 2) {\\n        w.x += w.stepSize;          \/\/ EAST\\n      } else if (dir === 3) {\\n        w.x += w.stepSize; w.y += w.stepSize; \/\/ SE\\n      } else if (dir === 4) {\\n        w.y += w.stepSize;          \/\/ SOUTH\\n      } else if (dir === 5) {\\n        w.x -= w.stepSize; w.y += w.stepSize; \/\/ SW\\n      } else if (dir === 6) {\\n        w.x -= w.stepSize;          \/\/ WEST\\n      } else if (dir === 7) {\\n        w.x -= w.stepSize; w.y -= w.stepSize; \/\/ NW\\n      }\\n\\n      \/\/ \u0422\u043e\u0440\u043e\u0438\u0434\u0430\u043b\u044c\u043d\u044b\u0435 \u0433\u0440\u0430\u043d\u0438\u0446\u044b\\n      if (w.x >= width)  w.x = 0;\\n      if (w.x < 0)       w.x = width - 1;\\n      if (w.y >= height) w.y = 0;\\n      if (w.y < 0)       w.y = height - 1;\\n\\n      \/\/ \u0420\u0438\u0441\u0443\u0435\u043c \u043f\u044f\u0442\u043d\u043e\\n      walkerLayer.fill(0, w.alpha);\\n      walkerLayer.ellipse(w.x, w.y, w.diameter, w.diameter);\\n    }\\n  }\\n}\\n\\n\/\/ --------------------\\n\/\/ \u0420\u0418\u0421\u0423\u0415\u041c \u0411\u041b\u041e\u041a\u0418 (wireframe)\\n\/\/ --------------------\\nfunction drawIsometricBlocks() {\\n  push();\\n  \/\/ \u0421\u043c\u0435\u0441\u0442\u0438\u043c \u0441\u0446\u0435\u043d\u0443 \u0447\u0443\u0442\u044c \u0432\u043d\u0438\u0437\/\u0432\u043f\u0440\u0430\u0432\u043e\\n  translate(width * 0.5, 80);\\n\\n  let t = frameCount * 0.01;\\n\\n  for (let j = 0; j < rows; j++) {\\n    for (let i = 0; i < cols; i++) {\\n      let val = domainWarpHeight(i, j, t);\\n      let h   = map(val, 0, 1, 0, maxH);\\n\\n      let x = (i - j) * (tileW \/ 2);\\n      let y = (i + j) * (tileH \/ 2);\\n\\n      \/\/ \u0413\u0430\u0443\u0441\u0441\u043e\u0432\u043e \u043f\u0440\u043e\u0436\u0438\u043c\u0430\u043d\u0438\u0435\\n      let h2 = applySmoothSink(x, y, h);\\n\\n      drawBlockWireframe(x, y, h2);\\n    }\\n  }\\n\\n  pop();\\n}\\n\\n\/\/ --------------------\\n\/\/ DOMAIN WARPING\\n\/\/ --------------------\\nfunction domainWarpHeight(i, j, t) {\\n  let nx = i * baseFreq + t * timeFactor;\\n  let ny = j * baseFreq + t * timeFactor;\\n\\n  let warp = noise(nx, ny) * warpAmp;\\n  let nx2  = nx + warp;\\n  let ny2  = ny + warp;\\n\\n  return noise(nx2, ny2);\\n}\\n\\n\/\/ --------------------\\n\/\/ \u0413\u0410\u0423\u0421\u0421\u041e\u0412\u041e \u041f\u0420\u041e\u0416\u0418\u041c\u0410\u041d\u0418\u0415 (\u0432\u043c\u0435\u0441\u0442\u043e \u043b\u0438\u043d\u0435\u0439\u043d\u043e\u0433\u043e)\\n\/\/ --------------------\\nfunction applySmoothSink(x, y, h) {\\n  let absX = x + width * 0.5;\\n  let absY = (y - h) + 80;\\n\\n  let d = dist(absX, absY, mouseX, mouseY);\\n\\n  let gauss = Math.exp(-(d*d) \/ (2*sigma*sigma));\\n  let sink  = maxSink * gauss;\\n\\n  let h2 = h - sink;\\n  return max(h2, 0);\\n}\\n\\n\/\/ --------------------\\n\/\/ \u0420\u0418\u0421\u0423\u0415\u041c \u041e\u0414\u0418\u041d \u0411\u041b\u041e\u041a (\u043a\u043e\u043d\u0442\u0443\u0440\u043e\u043c)\\n\/\/ --------------------\\nfunction drawBlockWireframe(x, y, h) {\\n  strokeWeight(blockStrokeWeight);\\n\\n  \/\/ top face\\n  stroke(topStrokeColor[0], topStrokeColor[1]);\\n  noFill();\\n  beginShape();\\n    vertex(x,            y - h);\\n    vertex(x + tileW\/2, y - tileH\/2 - h);\\n    vertex(x,            y - tileH - h);\\n    vertex(x - tileW\/2, y - tileH\/2 - h);\\n  endShape(CLOSE);\\n\\n  \/\/ left face\\n  stroke(leftStrokeColor[0], leftStrokeColor[1]);\\n  beginShape();\\n    vertex(x,            y);\\n    vertex(x,            y - h);\\n    vertex(x - tileW\/2, y - tileH\/2 - h);\\n    vertex(x - tileW\/2, y - tileH\/2);\\n  endShape(CLOSE);\\n\\n  \/\/ right face\\n  stroke(rightStrokeColor[0], rightStrokeColor[1]);\\n  beginShape();\\n    vertex(x,            y);\\n    vertex(x,            y - h);\\n    vertex(x + tileW\/2, y - tileH\/2 - h);\\n    vertex(x + tileW\/2, y - tileH\/2);\\n  endShape(CLOSE);\\n}\\n\\n\/\/ --------------------\\n\/\/ \u041a\u041b\u0410\u0412\u0418\u0428\u0418\\n\/\/ --------------------\\nfunction keyReleased() {\\n  if (key === 's' || key === 'S') {\\n    saveCanvas('multiWalkers_wireframe', 'png');\\n  }\\n  if (keyCode === DELETE || keyCode === BACKSPACE) {\\n    walkerLayer.background(255);\\n  }\\n}\\n\\n<\/script>\",\r\n      \"align\": \"top\",\r\n      \"row\": 0,\r\n      \"col\": 0,\r\n      \"colspan\": 12,\r\n      \"offsetx\": 0,\r\n      \"offsety\": 0,\r\n      \"spaceabove\": 0,\r\n      \"spacebelow\": 0,\r\n      \"yvel\": 1,\r\n      \"push\": 0,\r\n      \"relid\": 6,\r\n      \"absolute_position\": false,\r\n      \"frameOverflow\": \"\"\r\n    },\r\n    {\r\n      \"type\": \"text\",\r\n      \"cont\": \"<div class=\\\"button-container button-container-1\\\" style=\\\"text-align: center;\\\"><span class=\\\"mas\\\">MASK1<\/span> <button>MASK1<\/button><\/div><div class=\\\"button-container button-container-2\\\" style=\\\"text-align: center;\\\"><span class=\\\"mas\\\">MASK2<\/span> <button>MASK2<\/button><\/div><div class=\\\"button-container button-container-3\\\" style=\\\"text-align: center;\\\"><span class=\\\"mas\\\">MASK3<\/span> <button>MASK3<\/button><\/div>\",\r\n      \"align\": \"middle\",\r\n      \"row\": 1,\r\n      \"col\": 0,\r\n      \"colspan\": 12,\r\n      \"offsetx\": 0,\r\n      \"offsety\": 0,\r\n      \"spaceabove\": 0,\r\n      \"spacebelow\": 0,\r\n      \"yvel\": 1,\r\n      \"push\": 0,\r\n      \"relid\": 2,\r\n      \"absolute_position\": false,\r\n      \"frameOverflow\": \"\"\r\n    }\r\n  ]\r\n}","phonegrid":"","_links":{"self":[{"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/pages\/8759"}],"collection":[{"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/comments?post=8759"}],"version-history":[{"count":0,"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/pages\/8759\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.yos-studio.com\/en\/wp-json\/wp\/v2\/media?parent=8759"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}