{"id":1557,"date":"2024-02-08T18:00:00","date_gmt":"2024-02-08T17:00:00","guid":{"rendered":"https:\/\/stephanekraus.com\/?p=1557"},"modified":"2024-09-30T14:05:44","modified_gmt":"2024-09-30T12:05:44","slug":"djinnsduel-progressyearunity","status":"publish","type":"post","link":"https:\/\/stephanekraus.com\/fr\/djinnsduel-progressyearunity\/","title":{"rendered":"Une ann\u00e9e de progr\u00e8s sur Unity"},"content":{"rendered":"<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_f29134-93, .wp-block-kadence-advancedheading.kt-adv-heading1557_f29134-93[data-kb-block=\"kb-adv-heading1557_f29134-93\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_f29134-93 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_f29134-93[data-kb-block=\"kb-adv-heading1557_f29134-93\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_f29134-93 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_f29134-93[data-kb-block=\"kb-adv-heading1557_f29134-93\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_f29134-93 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_f29134-93\">Do you remember my prototype on R? If so, you&#8217;ll be happy to know that after that I\u2019ve decided to continue it on Unity (and if not, you can <a href=\"https:\/\/stephanekraus.com\/djinnsduel-prototypeonr\/\">read more about it here<\/a>). But it was still new to me because I&#8217;d never touched it before. So it was time to learn, to watch tutorials and to experiment.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_cbff97-7c, .wp-block-kadence-advancedheading.kt-adv-heading1557_cbff97-7c[data-kb-block=\"kb-adv-heading1557_cbff97-7c\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_cbff97-7c mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_cbff97-7c[data-kb-block=\"kb-adv-heading1557_cbff97-7c\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_cbff97-7c img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_cbff97-7c[data-kb-block=\"kb-adv-heading1557_cbff97-7c\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_cbff97-7c wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_cbff97-7c\">Usually, you start with the basics, like how do you code a character that moves? Well, not for me! I was just finishing Hollow Knight, whose universe I loved to explore. I wanted to create a similar sensation with my environment in 2D. I wanted parallax! So I did it.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_913083-88, .wp-block-kadence-advancedheading.kt-adv-heading1557_913083-88[data-kb-block=\"kb-adv-heading1557_913083-88\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_913083-88 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_913083-88[data-kb-block=\"kb-adv-heading1557_913083-88\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_913083-88 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_913083-88[data-kb-block=\"kb-adv-heading1557_913083-88\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_913083-88 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_913083-88\">First, I modeled a canyon environment (why not) in Blender. I divided it into several planes, then stacked them in Unity. All that was left for me to do was to calculate a movement speed for each stack in relation to the camera, depending on their relative distance. And thus, my first mission was a great success!<\/p>\n\n\n<style>.kb-row-layout-id1557_92a4bf-27 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id1557_92a4bf-27 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id1557_92a4bf-27 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-none, 0rem );row-gap:var(--global-kb-gap-none, 0rem );padding-top:0px;padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, calc(36% - ((var(--global-kb-gap-none, 0rem ) * 1 )\/2)))minmax(0, calc(64% - ((var(--global-kb-gap-none, 0rem ) * 1 )\/2)));}.kb-row-layout-id1557_92a4bf-27 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id1557_92a4bf-27 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id1557_92a4bf-27 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id1557_92a4bf-27 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column1557_1afe9d-91 > .kt-inside-inner-col,.kadence-column1557_1afe9d-91 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_1afe9d-91 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_1afe9d-91 > .kt-inside-inner-col{flex-direction:column;}.kadence-column1557_1afe9d-91 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column1557_1afe9d-91 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_1afe9d-91{position:relative;}@media all and (max-width: 1024px){.kadence-column1557_1afe9d-91 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column1557_1afe9d-91 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_1afe9d-91\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_39681f-33 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image1557_39681f-33 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"500\" height=\"500\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_environment.webp\" alt=\"\" class=\"kb-img wp-image-2414\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_environment.webp 500w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_environment-300x300.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_environment-150x150.webp 150w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_environment-12x12.webp 12w\" sizes=\"auto, (max-width: 500px) 100vw, 500px\" \/><\/figure>\n<\/div><\/div>\n\n\n<style>.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{display:flex;}.kadence-column1557_4674d8-f9 > .kt-inside-inner-col,.kadence-column1557_4674d8-f9 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_4674d8-f9 > .kt-inside-inner-col > .aligncenter{width:100%;}.kt-row-column-wrap > .kadence-column1557_4674d8-f9{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_4674d8-f9{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_4674d8-f9 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_4674d8-f9{position:relative;}@media all and (max-width: 1024px){.kt-row-column-wrap > .kadence-column1557_4674d8-f9{align-self:center;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_4674d8-f9{align-self:auto;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 1024px){.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kt-row-column-wrap > .kadence-column1557_4674d8-f9{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_4674d8-f9{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_4674d8-f9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_4674d8-f9\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_f3aae4-a0 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_f3aae4-a0\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"338\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_parallax.webp\" alt=\"\" class=\"kb-img wp-image-2438\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_parallax.webp 600w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_parallax-300x169.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_parallax-18x10.webp 18w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_abcfba-3c, .wp-block-kadence-advancedheading.kt-adv-heading1557_abcfba-3c[data-kb-block=\"kb-adv-heading1557_abcfba-3c\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_abcfba-3c mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_abcfba-3c[data-kb-block=\"kb-adv-heading1557_abcfba-3c\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_abcfba-3c img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_abcfba-3c[data-kb-block=\"kb-adv-heading1557_abcfba-3c\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_abcfba-3c wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_abcfba-3c\">I ended up learning how to code the basics, i.e. how to make a character move with my keyboard. I went even further. To make the whole thing more attractive, you have to dress your monster with its own sprite. You have to animate it according to its movement. And why not add another djinn controlled by the computer with some basic actions? It was all done.<\/p>\n\n\n<style>.kb-image1557_565f32-8e.kb-image-is-ratio-size, .kb-image1557_565f32-8e .kb-image-is-ratio-size{max-width:600px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image1557_565f32-8e.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image1557_565f32-8e .kb-image-is-ratio-size{align-self:unset;}.kb-image1557_565f32-8e figure{max-width:600px;}.kb-image1557_565f32-8e .image-is-svg, .kb-image1557_565f32-8e .image-is-svg img{width:100%;}.kb-image1557_565f32-8e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_565f32-8e\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"338\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_firstprotomove.webp\" alt=\"\" class=\"kb-img wp-image-2431\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_firstprotomove.webp 600w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_firstprotomove-300x169.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_firstprotomove-18x10.webp 18w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure><\/div>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_baffd0-f4, .wp-block-kadence-advancedheading.kt-adv-heading1557_baffd0-f4[data-kb-block=\"kb-adv-heading1557_baffd0-f4\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_baffd0-f4 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_baffd0-f4[data-kb-block=\"kb-adv-heading1557_baffd0-f4\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_baffd0-f4 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_baffd0-f4[data-kb-block=\"kb-adv-heading1557_baffd0-f4\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_baffd0-f4 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_baffd0-f4\">So far, I&#8217;m making some good progress! On the other hand, I realize how much time I\u2019ve spent on it. Each little implementation contains a lot more code than I imagined. There&#8217;s no such experience to see the work behind each game. I realized that I still had a lot to learn about interfaces, canvas, event systems, and so on. It was winter time, and I ended up getting discouraged (a good excuse, isn&#8217;t it?). So I put the project on hold for a while.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_7fd945-a4, .wp-block-kadence-advancedheading.kt-adv-heading1557_7fd945-a4[data-kb-block=\"kb-adv-heading1557_7fd945-a4\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_7fd945-a4 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_7fd945-a4[data-kb-block=\"kb-adv-heading1557_7fd945-a4\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_7fd945-a4 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_7fd945-a4[data-kb-block=\"kb-adv-heading1557_7fd945-a4\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_7fd945-a4 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_7fd945-a4\">So now what?<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_dd6b54-92, .wp-block-kadence-advancedheading.kt-adv-heading1557_dd6b54-92[data-kb-block=\"kb-adv-heading1557_dd6b54-92\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_dd6b54-92 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_dd6b54-92[data-kb-block=\"kb-adv-heading1557_dd6b54-92\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_dd6b54-92 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_dd6b54-92[data-kb-block=\"kb-adv-heading1557_dd6b54-92\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_dd6b54-92 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_dd6b54-92\">A year has gone by and I&#8217;ve decided to dig my prototypes out of the dust to rework them and see what I&#8217;ve learned along the way.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_ac890d-b6, .wp-block-kadence-advancedheading.kt-adv-heading1557_ac890d-b6[data-kb-block=\"kb-adv-heading1557_ac890d-b6\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_ac890d-b6 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_ac890d-b6[data-kb-block=\"kb-adv-heading1557_ac890d-b6\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_ac890d-b6 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_ac890d-b6[data-kb-block=\"kb-adv-heading1557_ac890d-b6\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_ac890d-b6 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_ac890d-b6\">My monsters, or djinns as they&#8217;re actually called? These will be basic shapes. Keeping it simple for greater efficiency. And simple shapes don&#8217;t mean lifeless. I started programming the movements and their management very quickly. I added an interface using lines of code already written for other projects. I implemented the combat logic and the calculation of statistics. And in less than two days, I had a working prototype. It&#8217;s based on what I&#8217;d done in R, without any superfluous parts.<\/p>\n\n\n<style>.kb-row-layout-id1557_7aa645-0d > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id1557_7aa645-0d > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id1557_7aa645-0d > .kt-row-column-wrap{column-gap:var(--global-kb-gap-none, 0rem );row-gap:var(--global-kb-gap-none, 0rem );padding-top:0px;padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, calc(46% - ((var(--global-kb-gap-none, 0rem ) * 1 )\/2)))minmax(0, calc(54% - ((var(--global-kb-gap-none, 0rem ) * 1 )\/2)));}.kb-row-layout-id1557_7aa645-0d > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id1557_7aa645-0d > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id1557_7aa645-0d > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id1557_7aa645-0d alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{display:flex;}.kadence-column1557_de4b73-d2 > .kt-inside-inner-col,.kadence-column1557_de4b73-d2 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_de4b73-d2 > .kt-inside-inner-col > .aligncenter{width:100%;}.kt-row-column-wrap > .kadence-column1557_de4b73-d2{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_de4b73-d2{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_de4b73-d2 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_de4b73-d2{position:relative;}@media all and (max-width: 1024px){.kt-row-column-wrap > .kadence-column1557_de4b73-d2{align-self:center;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_de4b73-d2{align-self:auto;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 1024px){.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kt-row-column-wrap > .kadence-column1557_de4b73-d2{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_de4b73-d2{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_de4b73-d2 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_de4b73-d2\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_220e5a-e3 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_220e5a-e3\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"395\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newprotomovement.webp\" alt=\"\" class=\"kb-img wp-image-2390\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newprotomovement.webp 600w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newprotomovement-300x198.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newprotomovement-18x12.webp 18w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n\n<style>.kadence-column1557_1b2240-81 > .kt-inside-inner-col{display:flex;}.kadence-column1557_1b2240-81 > .kt-inside-inner-col,.kadence-column1557_1b2240-81 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_1b2240-81 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_1b2240-81 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_1b2240-81 > .kt-inside-inner-col > .aligncenter{width:100%;}.kt-row-column-wrap > .kadence-column1557_1b2240-81{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1b2240-81{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1b2240-81 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_1b2240-81 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_1b2240-81{position:relative;}@media all and (max-width: 1024px){.kt-row-column-wrap > .kadence-column1557_1b2240-81{align-self:center;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1b2240-81{align-self:auto;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1b2240-81 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 1024px){.kadence-column1557_1b2240-81 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kt-row-column-wrap > .kadence-column1557_1b2240-81{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1b2240-81{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1b2240-81 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_1b2240-81 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_1b2240-81\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_770ccb-08 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_770ccb-08\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"961\" height=\"539\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newproto.webp\" alt=\"\" class=\"kb-img wp-image-2389\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newproto.webp 961w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newproto-300x168.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newproto-768x431.webp 768w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_newproto-18x10.webp 18w\" sizes=\"auto, (max-width: 961px) 100vw, 961px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_c80780-49, .wp-block-kadence-advancedheading.kt-adv-heading1557_c80780-49[data-kb-block=\"kb-adv-heading1557_c80780-49\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_c80780-49 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_c80780-49[data-kb-block=\"kb-adv-heading1557_c80780-49\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_c80780-49 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_c80780-49[data-kb-block=\"kb-adv-heading1557_c80780-49\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_c80780-49 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_c80780-49\">To this point, I let myself add a little bit of fun, to make the whole thing prettier. But to do it quickly, I&#8217;m assembling <a href=\"https:\/\/www.kenney.nl\/assets\" target=\"_blank\" rel=\"noreferrer noopener\">Kenney&#8217;s assets<\/a> for the backgrounds (seriously, this site is the Holy Grail, thank you to the geniuses who share everything freely). I&#8217;m even working on a procedural animation system that I can customize to suit the djinns. I&#8217;ll probably talk about that in another post later.<\/p>\n\n\n<style>.kb-row-layout-id1557_7ae012-09 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id1557_7ae012-09 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id1557_7ae012-09 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-none, 0rem );row-gap:var(--global-kb-gap-none, 0rem );padding-top:0px;padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, calc(64% - ((var(--global-kb-gap-none, 0rem ) * 1 )\/2)))minmax(0, calc(36% - ((var(--global-kb-gap-none, 0rem ) * 1 )\/2)));}.kb-row-layout-id1557_7ae012-09 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id1557_7ae012-09 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id1557_7ae012-09 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id1557_7ae012-09 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{display:flex;}.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col,.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col > .aligncenter{width:100%;}.kt-row-column-wrap > .kadence-column1557_2c1b9a-23{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_2c1b9a-23{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_2c1b9a-23{position:relative;}@media all and (max-width: 1024px){.kt-row-column-wrap > .kadence-column1557_2c1b9a-23{align-self:center;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_2c1b9a-23{align-self:auto;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 1024px){.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kt-row-column-wrap > .kadence-column1557_2c1b9a-23{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_2c1b9a-23{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_2c1b9a-23 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_2c1b9a-23\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_196912-3d .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_196912-3d\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"338\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_kenneydecor.webp\" alt=\"\" class=\"kb-img wp-image-2386\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_kenneydecor.webp 600w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_kenneydecor-300x169.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_kenneydecor-18x10.webp 18w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n\n<style>.kadence-column1557_1aae11-3b > .kt-inside-inner-col{display:flex;}.kadence-column1557_1aae11-3b > .kt-inside-inner-col,.kadence-column1557_1aae11-3b > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_1aae11-3b > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_1aae11-3b > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_1aae11-3b > .kt-inside-inner-col > .aligncenter{width:100%;}.kt-row-column-wrap > .kadence-column1557_1aae11-3b{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1aae11-3b{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1aae11-3b > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_1aae11-3b > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_1aae11-3b{position:relative;}@media all and (max-width: 1024px){.kt-row-column-wrap > .kadence-column1557_1aae11-3b{align-self:center;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1aae11-3b{align-self:auto;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1aae11-3b > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 1024px){.kadence-column1557_1aae11-3b > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kt-row-column-wrap > .kadence-column1557_1aae11-3b{align-self:center;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1aae11-3b{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_1aae11-3b > .kt-inside-inner-col{flex-direction:column;justify-content:center;}.kadence-column1557_1aae11-3b > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_1aae11-3b\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_81247a-fa .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_81247a-fa\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"600\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_anim.webp\" alt=\"\" class=\"kb-img wp-image-2456\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_anim.webp 600w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_anim-300x300.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_anim-150x150.webp 150w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_anim-12x12.webp 12w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading1557_2744c1-39, .wp-block-kadence-advancedheading.kt-adv-heading1557_2744c1-39[data-kb-block=\"kb-adv-heading1557_2744c1-39\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_2744c1-39 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_2744c1-39[data-kb-block=\"kb-adv-heading1557_2744c1-39\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_2744c1-39 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_2744c1-39[data-kb-block=\"kb-adv-heading1557_2744c1-39\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading1557_2744c1-39 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading1557_2744c1-39\">In just four days I had a relatively clean prototype. And I have to admit that is satisfying. I can feel my progress curve and that gives me a breath of joy. Even though I still have some work to do on it, e.g. on the animations, on adding djinns, attacks and a multiplayer mode, here&#8217;s a concrete prototype for <a href=\"https:\/\/space-krokett.itch.io\/djinns-duel\" target=\"_blank\" rel=\"noreferrer noopener\">you to try out!<\/a><\/p>\n\n\n<style>.kb-image1557_3715c3-7b.kb-image-is-ratio-size, .kb-image1557_3715c3-7b .kb-image-is-ratio-size{max-width:600px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image1557_3715c3-7b.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image1557_3715c3-7b .kb-image-is-ratio-size{align-self:unset;}.kb-image1557_3715c3-7b figure{max-width:600px;}.kb-image1557_3715c3-7b .image-is-svg, .kb-image1557_3715c3-7b .image-is-svg img{width:100%;}.kb-image1557_3715c3-7b .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image1557_3715c3-7b\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"338\" src=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_protoclean.webp\" alt=\"\" class=\"kb-img wp-image-2374\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_protoclean.webp 600w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_protoclean-300x169.webp 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_protoclean-18x10.webp 18w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure><\/div>\n\n\n\n<blockquote class=\"wp-block-quote is-style-default is-layout-flow wp-block-quote-is-layout-flow\">\n<p><em><strong>What&#8217;s to be learned? <\/strong><\/em><\/p>\n<cite><strong><strong>Watching your progress is a great source of motivation. Sorry, that&#8217;s a bit of a Linkedin line\u2026<\/strong><\/strong><\/cite><\/blockquote>\n\n\n<style>.kb-row-layout-id1557_609483-94 > .kt-row-column-wrap{align-content:end;}:where(.kb-row-layout-id1557_609483-94 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:end;}.kb-row-layout-id1557_609483-94 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-sm, 1rem);row-gap:var(--global-kb-gap-sm, 1rem);padding-top:0px;padding-bottom:0px;grid-template-columns:minmax(0, calc(75% - ((var(--global-kb-gap-sm, 1rem) * 1 )\/2)))minmax(0, calc(25% - ((var(--global-kb-gap-sm, 1rem) * 1 )\/2)));}.kb-row-layout-id1557_609483-94 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id1557_609483-94 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id1557_609483-94 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id1557_609483-94 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-bottom\">\n<style>.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{display:flex;}.kadence-column1557_6e06ae-cc > .kt-inside-inner-col,.kadence-column1557_6e06ae-cc > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{flex-direction:column;justify-content:flex-end;}.kadence-column1557_6e06ae-cc > .kt-inside-inner-col > .aligncenter{width:100%;}.kt-row-column-wrap > .kadence-column1557_6e06ae-cc{align-self:flex-end;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_6e06ae-cc{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{flex-direction:column;justify-content:flex-end;}.kadence-column1557_6e06ae-cc > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_6e06ae-cc{position:relative;}@media all and (max-width: 1024px){.kt-row-column-wrap > .kadence-column1557_6e06ae-cc{align-self:flex-end;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_6e06ae-cc{align-self:auto;}}@media all and (max-width: 1024px){.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{flex-direction:column;justify-content:flex-end;}}@media all and (max-width: 1024px){.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{flex-direction:column;justify-content:flex-end;}}@media all and (max-width: 767px){.kt-row-column-wrap > .kadence-column1557_6e06ae-cc{align-self:flex-end;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_6e06ae-cc{align-self:auto;}.kt-inner-column-height-full:not(.kt-has-1-columns) > .wp-block-kadence-column.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{flex-direction:column;justify-content:flex-end;}.kadence-column1557_6e06ae-cc > .kt-inside-inner-col{flex-direction:column;justify-content:flex-end;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_6e06ae-cc\"><div class=\"kt-inside-inner-col\"><\/div><\/div>\n\n\n<style>.kadence-column1557_ef091f-af > .kt-inside-inner-col,.kadence-column1557_ef091f-af > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_ef091f-af > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_ef091f-af > .kt-inside-inner-col{flex-direction:column;}.kadence-column1557_ef091f-af > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column1557_ef091f-af > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_ef091f-af{position:relative;}@media all and (max-width: 1024px){.kadence-column1557_ef091f-af > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column1557_ef091f-af > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_ef091f-af\"><div class=\"kt-inside-inner-col\"><style>.kb-row-layout-id1557_ebd685-26 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id1557_ebd685-26 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id1557_ebd685-26 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-sm, 1rem);row-gap:var(--global-kb-gap-sm, 1rem);padding-top:0px;padding-bottom:0px;grid-template-columns:minmax(0, 1fr);}.kb-row-layout-id1557_ebd685-26 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id1557_ebd685-26 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id1557_ebd685-26 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id1557_ebd685-26 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-row kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column1557_3d250e-ca > .kt-inside-inner-col,.kadence-column1557_3d250e-ca > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_3d250e-ca > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_3d250e-ca > .kt-inside-inner-col{flex-direction:column;}.kadence-column1557_3d250e-ca > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column1557_3d250e-ca > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_3d250e-ca{position:relative;}@media all and (max-width: 1024px){.kadence-column1557_3d250e-ca > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column1557_3d250e-ca > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_3d250e-ca\"><div class=\"kt-inside-inner-col\"><style>.wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2, .wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2[data-kb-block=\"kb-adv-heading1557_6806fa-b2\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2[data-kb-block=\"kb-adv-heading1557_6806fa-b2\"]{display:flex;gap:0.25em;align-items:center;}.wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2[data-kb-block=\"kb-adv-heading1557_6806fa-b2\"] .kb-adv-heading-icon svg{width:1em;height:1em;}.wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2[data-kb-block=\"kb-adv-heading1557_6806fa-b2\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading1557_6806fa-b2[data-kb-block=\"kb-adv-heading1557_6806fa-b2\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style><h6 class=\"kt-adv-heading1557_6806fa-b2 wp-block-kadence-advancedheading kt-adv-heading-has-icon\" data-kb-block=\"kb-adv-heading1557_6806fa-b2\"><span class=\"kb-adv-text-inner\">Posted from<\/span><span class=\"kb-svg-icon-wrap kb-adv-heading-icon kb-svg-icon-ic_redo kb-adv-heading-icon-side-right\"><svg viewBox=\"0 0 8 8\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M3.5 0c-1.93 0-3.5 1.57-3.5 3.5 0-1.38 1.12-2.5 2.5-2.5s2.5 1.12 2.5 2.5v.5h-1l2 2 2-2h-1v-.5c0-1.93-1.57-3.5-3.5-3.5z\" transform=\"translate(0 1)\"\/><\/svg><\/span><\/h6><\/div><\/div>\n\n\n<style>.kadence-column1557_c19344-1f > .kt-inside-inner-col,.kadence-column1557_c19344-1f > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_c19344-1f > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_c19344-1f > .kt-inside-inner-col{flex-direction:column;}.kadence-column1557_c19344-1f > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column1557_c19344-1f > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column1557_c19344-1f{position:relative;}@media all and (max-width: 1024px){.kadence-column1557_c19344-1f > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column1557_c19344-1f > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_c19344-1f\"><div class=\"kt-inside-inner-col\"><style>.kadence-column1557_f92e5b-46 > .kt-inside-inner-col{box-shadow:0px 0px 14px 0px var(--global-palette3, #1A202C);}.kadence-column1557_f92e5b-46 > .kt-inside-inner-col,.kadence-column1557_f92e5b-46 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column1557_f92e5b-46 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column1557_f92e5b-46 > .kt-inside-inner-col{flex-direction:column;}.kadence-column1557_f92e5b-46 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column1557_f92e5b-46 > .kt-inside-inner-col{background-image:url('https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/djinnsduel_vignette.webp');background-size:cover;background-position:center center;background-attachment:scroll;background-repeat:no-repeat;}.kadence-column1557_f92e5b-46 > .kt-inside-inner-col:before{opacity:0.3;background-image:url('https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/12\/empty_playandwrite.png');background-size:cover;background-position:center center;background-attachment:scroll;background-repeat:no-repeat;}.kadence-column1557_f92e5b-46:hover > .kt-inside-inner-col:before{opacity:0.9;}.kadence-column1557_f92e5b-46:hover > .kt-inside-inner-col:before{background-image:url('https:\/\/stephanekraus.com\/wp-content\/uploads\/2024\/02\/djinnsduel_title.png');background-size:cover;background-position:50% 90%;background-attachment:scroll;background-repeat:no-repeat;}.kadence-column1557_f92e5b-46{position:relative;}@media all and (max-width: 1024px){.kadence-column1557_f92e5b-46 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column1557_f92e5b-46 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column1557_f92e5b-46 kb-section-has-link kb-section-has-overlay\"><div class=\"kt-inside-inner-col\"><style>.kb-image1557_ea20e7-d2.kb-image-is-ratio-size, .kb-image1557_ea20e7-d2 .kb-image-is-ratio-size{max-width:150px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image1557_ea20e7-d2.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image1557_ea20e7-d2 .kb-image-is-ratio-size{align-self:unset;}.kb-image1557_ea20e7-d2{max-width:150px;}.image-is-svg.kb-image1557_ea20e7-d2{-webkit-flex:0 1 100%;flex:0 1 100%;}.image-is-svg.kb-image1557_ea20e7-d2 img{width:100%;}.kb-image1557_ea20e7-d2 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image1557_ea20e7-d2 size-full kb-image-is-ratio-size\"><div class=\"kb-is-ratio-image kb-image-ratio-square\"><img loading=\"lazy\" decoding=\"async\" width=\"704\" height=\"396\" src=\"http:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/11\/Empty.png\" alt=\"\" class=\"kb-img wp-image-1300\" srcset=\"https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/11\/Empty.png 704w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/11\/Empty-300x169.png 300w, https:\/\/stephanekraus.com\/wp-content\/uploads\/2023\/11\/Empty-18x10.png 18w\" sizes=\"auto, (max-width: 704px) 100vw, 704px\" \/><\/div><\/figure>\n<\/div><a href=\"https:\/\/stephanekraus.com\/project-djinnsduel\/\" class=\"kb-section-link-overlay\"><\/a><\/div>\n<\/div><\/div>\n\n<\/div><\/div><\/div><\/div>\n\n<\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>J'ai commenc\u00e9 \u00e0 apprendre Unity avec Djinns Duel avant de passer \u00e0 d'autres projets. Un an plus tard, il est temps de s'y remettre et de voir ce que je peux faire maintenant.<\/p>","protected":false},"author":1,"featured_media":2464,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"categories":[44],"tags":[43],"class_list":["post-1557","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-devlog","tag-djinns-duel"],"_links":{"self":[{"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/posts\/1557","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/comments?post=1557"}],"version-history":[{"count":61,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/posts\/1557\/revisions"}],"predecessor-version":[{"id":2463,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/posts\/1557\/revisions\/2463"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/media\/2464"}],"wp:attachment":[{"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/media?parent=1557"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/categories?post=1557"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephanekraus.com\/fr\/wp-json\/wp\/v2\/tags?post=1557"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}