{"id":8866,"date":"2023-06-18T20:27:54","date_gmt":"2023-06-19T03:27:54","guid":{"rendered":"https:\/\/mattfife.com\/?p=8866"},"modified":"2023-06-19T15:08:40","modified_gmt":"2023-06-19T22:08:40","slug":"non-euclidean-rendering","status":"publish","type":"post","link":"https:\/\/mattfife.com\/?p=8866","title":{"rendered":"Non-Euclidean rendering"},"content":{"rendered":"\n<p><a rel=\"noreferrer noopener\" href=\"https:\/\/mcescher.com\/\" data-type=\"URL\" data-id=\"https:\/\/mcescher.com\/\" target=\"_blank\">M.C. Escher<\/a> was famous for his wonderful mind-bending images. I loved his drawings as a kid because it created a sense of wonder, playfulness, and unlocked interesting new viewpoints and possibilities simply by violating a single physical or geometric expectation.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/brightspotcdn.byu.edu\/dims4\/default\/b250bc7\/2147483647\/strip\/true\/crop\/1024x981+0+0\/resize\/840x805!\/quality\/90\/?url=https%3A%2F%2Fbrigham-young-brightspot.s3.amazonaws.com%2Fbb%2Fdc%2F8cac22222d208884ba9dc770cdc8%2Fescher-relativity-1024x981.jpg\" alt=\"\" width=\"710\" height=\"680\"\/><\/figure>\n<\/div>\n\n\n<p>We&#8217;re used to the world following rules. If we leave a room, we would expect to go back into that same room if we opened the door. But in rendered scenes, none of those rules needs to be followed. We can actually make M.C. Escher like worlds a reality. But how &#8211; and more importantly &#8211; how could we use them to make an interesting gaming experience?<\/p>\n\n\n\n<p><a href=\"https:\/\/www.youtube.com\/@CodeParade\">CodeParade<\/a> walks us through many interesting effects that can be created using some simple non-Euclidian rendering and movement techniques.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/kEB11PQ9Eo8?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n\n\n\n<p>As it turns out &#8211; games have been doing this for a little while. One of the first examples of slightly violating the rules of Euclidean space was the use of portals in the mega-hit game <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=tsf5D87msnc\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=tsf5D87msnc\" target=\"_blank\">Portal (<\/a>well, <a href=\"https:\/\/en.wikipedia.org\/wiki\/Narbacular_Drop\" data-type=\"URL\" data-id=\"https:\/\/en.wikipedia.org\/wiki\/Narbacular_Drop\" target=\"_blank\" rel=\"noreferrer noopener\">Narbacular Drop<\/a> if you want to get technical). I say slightly because Portal actually does a very good job trying to maintain the physical properties of size, gravity, momentum, and physics of our everyday world when interacting with the portal. <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=jSMZoLjB9JE\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=jSMZoLjB9JE\" target=\"_blank\">But, there are still problems like when you try to pass a portal into itself&#8230;<\/a> or if you <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=B19nlhbA7-E\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=B19nlhbA7-E\" target=\"_blank\">start messing with momentum<\/a>&#8230;or <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=zDAE9A_1NA4\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=zDAE9A_1NA4\" target=\"_blank\">if you start sandwiching the portals<\/a>, etc.<\/p>\n\n\n\n<p>Others started really twisting other rules of Euclidean space and exploring the results. Non-Euclidean spaces seemed ripe to create innovative and interesting puzzle games. I remember seeing early drops of <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=aGsnm2nOnso\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=aGsnm2nOnso\" target=\"_blank\">Antichamber<\/a> and being really fascinated by the simple, yet mind bending puzzles. As <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/@DigiDigger\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/@DigiDigger\" target=\"_blank\">Digidigger<\/a> explains, these <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=lFEIUcXCEvI\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=lFEIUcXCEvI\" target=\"_blank\">tricks are accomplished with a combination of teleportation, creative use of the stencil buffers, and so forth.<\/a> <\/p>\n\n\n\n<p>Other games quickly followed like <a rel=\"noreferrer noopener\" href=\"https:\/\/youtu.be\/jZ_yxZwAoCg\" data-type=\"URL\" data-id=\"https:\/\/youtu.be\/jZ_yxZwAoCg\" target=\"_blank\">Manifold Garden<\/a> that added the concept of infinite world wrap-around. <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=VYfWfrk5P7w\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=VYfWfrk5P7w\" target=\"_blank\">Hyperbolica<\/a> uses hyperbolic projection mapping. Then there were forced perspective games like <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=BTdls2PySC0\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=BTdls2PySC0\" target=\"_blank\">Superliminal<\/a>. As we quickly see, there is more than one rule to break in Euclidian space. <\/p>\n\n\n\n<p>More recently and to greater effect &#8211; non-Euclidean tricks are being used in horror games. The experience of the world shifting around you definitely can create a very unsettling emotional response. Paintings that become doorways, rooms that change when you look away. <a rel=\"noreferrer noopener\" href=\"https:\/\/youtu.be\/MnMJ0urMz54\" data-type=\"URL\" data-id=\"https:\/\/youtu.be\/MnMJ0urMz54\" target=\"_blank\">Whole games have become based on these simple effects<\/a>. Non-Euclidean techniques are here to stay. The real question is, how will we think of using them next?<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/JieaX-bjAA4?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n\n\n\n<p><strong>Learning more:<\/strong><\/p>\n\n\n\n<p>Issues Valve ran into when making the game Portal:<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/riijspB9DIQ?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/lFEIUcXCEvI?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n\n\n\n<p>How to create portals and solving the most common perspective, distance, scaling, collision detection, and physics issues you&#8217;ll encounter:<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/_SmPR5mvH7w?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n\n\n\n<p>Hyperbolica devlog (13 video playlist):<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/EMKLeS-Uq_8?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent&#038;listType=playlist&#038;list=PLh9DXIT3m6N4qJK9GKQB3yk61tVe6qJvA\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n\n\n\n<p>Secrets behind how P.T. works. There&#8217;s also some pretty <a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=nJHg1gmySTs&amp;list=PL2LIfEkuP8BuZ9tO9YP4WbRjjWO9uqec8&amp;pp=iAQB\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=nJHg1gmySTs&amp;list=PL2LIfEkuP8BuZ9tO9YP4WbRjjWO9uqec8&amp;pp=iAQB\" target=\"_blank\">awesome exploration and disassembly by<\/a><a href=\"https:\/\/www.youtube.com\/watch?v=nJHg1gmySTs&amp;list=PL2LIfEkuP8BuZ9tO9YP4WbRjjWO9uqec8&amp;pp=iAQB\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=nJHg1gmySTs&amp;list=PL2LIfEkuP8BuZ9tO9YP4WbRjjWO9uqec8&amp;pp=iAQB\" target=\"_blank\" rel=\"noreferrer noopener\"> <\/a><a rel=\"noreferrer noopener\" href=\"https:\/\/www.youtube.com\/watch?v=nJHg1gmySTs&amp;list=PL2LIfEkuP8BuZ9tO9YP4WbRjjWO9uqec8&amp;pp=iAQB\" data-type=\"URL\" data-id=\"https:\/\/www.youtube.com\/watch?v=nJHg1gmySTs&amp;list=PL2LIfEkuP8BuZ9tO9YP4WbRjjWO9uqec8&amp;pp=iAQB\" target=\"_blank\">Lance McDonald<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<span class=\"embed-youtube\" style=\"text-align:center; display: block;\"><iframe loading=\"lazy\" class=\"youtube-player\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/c7M2pMDHEVE?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent\" allowfullscreen=\"true\" style=\"border:0;\" sandbox=\"allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox\"><\/iframe><\/span>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>M.C. Escher was famous for his wonderful mind-bending images. I loved his drawings as a kid because it created a sense of wonder, playfulness, and unlocked interesting new viewpoints and possibilities simply by violating a single physical or geometric expectation. We&#8217;re used to the world following rules. If we leave a room, we would expect to go back into that same room if we opened the door. But in rendered scenes, none of those rules needs to be followed. We&#8230;<\/p>\n<p class=\"read-more\"><a class=\"btn btn-default\" href=\"https:\/\/mattfife.com\/?p=8866\"> Read More<span class=\"screen-reader-text\">  Read More<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[22,9,5],"tags":[],"class_list":["post-8866","post","type-post","status-publish","format-standard","hentry","category-artdesign","category-cool","category-technical"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p4WECr-2j0","jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/mattfife.com\/index.php?rest_route=\/wp\/v2\/posts\/8866","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mattfife.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mattfife.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mattfife.com\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/mattfife.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8866"}],"version-history":[{"count":4,"href":"https:\/\/mattfife.com\/index.php?rest_route=\/wp\/v2\/posts\/8866\/revisions"}],"predecessor-version":[{"id":8878,"href":"https:\/\/mattfife.com\/index.php?rest_route=\/wp\/v2\/posts\/8866\/revisions\/8878"}],"wp:attachment":[{"href":"https:\/\/mattfife.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8866"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mattfife.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=8866"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mattfife.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=8866"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}