/*@jsxRuntime automatic @jsxImportSource react*/
const {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];
function MDXContent(props = {}) {
  const {wrapper: MDXLayout} = props.components || ({});
  return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {
    children: _jsx(_createMdxContent, {})
  })) : _createMdxContent();
  function _createMdxContent() {
    const _components = Object.assign({
      p: "p",
      a: "a",
      blockquote: "blockquote",
      h2: "h2",
      img: "img",
      h3: "h3",
      code: "code",
      ul: "ul",
      li: "li",
      strong: "strong"
    }, props.components);
    return _jsxs(_Fragment, {
      children: [_jsxs(_components.p, {
        children: ["It has been almost an entire year ago since I have visited the Bonsai platform that I covered in my ", _jsx(_components.a, {
          href: "/post/2020/5/5/ai-ml-rl-introduction",
          children: "previous post"
        }), ". Since then a lot changed on the platform, so the time has come to revisit it and see in more detail what exactly changed (on the surface of course)!"]
      }), "\n", _jsxs(_components.blockquote, {
        children: ["\n", _jsx(_components.p, {
          children: "Next to that, I have been working on a new project - more details soon 😉 - which made me revisit the introduction I made last time of the Bonsai platform."
        }), "\n"]
      }), "\n", _jsx(_components.p, {
        children: "From personal experience, I can definitely say that user experience is everything in platforms such as this one! It is not easy to combine the personas of a Data Scientist, Application Developer and Subject Matter Expert (SME) into a platform that allows the latter to define their own experiments."
      }), "\n", _jsx(_components.h2, {
        children: "Azure Deployment"
      }), "\n", _jsx(_components.p, {
        children: "Deploying is as easy as going to the Azure portal, searching for Bonsai and filling in the parameters!"
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-create-1.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-create-2.png",
          alt: ""
        })
      }), "\n", _jsx(_components.h2, {
        children: "Bonsai - First Launch"
      }), "\n", _jsx(_components.p, {
        children: "Upon launching the Bonsai platform for the first time, we are greated by an amazing getting started page! So let's click on the Cartpole example again and create our cartpole example."
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-getting-started-1.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-getting-started-2.png",
          alt: ""
        })
      }), "\n", _jsx(_components.h2, {
        children: "Bonsai - Interface"
      }), "\n", _jsx(_components.p, {
        children: "Now our example has been deployed, let's see what we notice on first sight when comparing them to the old version!"
      }), "\n", _jsx(_components.h3, {
        children: "Initial Findings"
      }), "\n", _jsxs(_components.p, {
        children: ["The first thing I noticed is that the code got defined a bit simpler, removing the boundaries that were put on there (which we would mathematically represent as ", _jsx(_components.code, {
          children: "[ -30, 30 ]"
        }), " for example)."]
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-diff-1.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: "But the biggest difference is the concept graph! 😍 This one became super sleek! Clearly defining the inputs, what it will stop upon and the outputs."
      }), "\n", _jsxs(_components.blockquote, {
        children: ["\n", _jsx(_components.p, {
          children: "Note: My OCD did catch a out-of-center point definition 😉"
        }), "\n"]
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-diff-2.png",
          alt: ""
        })
      }), "\n", _jsx(_components.h3, {
        children: "Concept Graph - A more in-depth view"
      }), "\n", _jsx(_components.p, {
        children: "Going a bit deeper on the Concept Graph, we can clearly see:"
      }), "\n", _jsxs(_components.ul, {
        children: ["\n", _jsx(_components.li, {
          children: "The amount of inputs"
        }), "\n", _jsxs(_components.li, {
          children: ["The Goals on which is should learn on -> what do we want to avoid?", "\n", _jsxs(_components.ul, {
            children: ["\n", _jsx(_components.li, {
              children: "Pole should not fall over"
            }), "\n", _jsx(_components.li, {
              children: "Cart should stay within the track length"
            }), "\n"]
          }), "\n"]
        }), "\n"]
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-deep-dive.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: "More amazingly is that when we add inputs and outputs, the interface changes accordingly!"
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-deep-dive-2.png",
          alt: ""
        })
      }), "\n", _jsx(_components.h2, {
        children: "Training"
      }), "\n", _jsx(_components.p, {
        children: "The biggest change is the friendliness in training. When we are training, we can now clearly see our reward and the blue line more expressed showing what we as a user should care about the most (average performance) and our goal score."
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-training-diff-1.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: "Next to that, the concept graph was implemented here as well for progress tracking. What is unclear for me however is what \"assessments\" mean."
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-training-diff-2.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: "In more detail we can see training below"
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-training-1.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-training-4.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: "Which lets us check our experiment running and the parameters it is seeing in more detail! It's simply amazing to be able to see why certain actions are being taken based on the observations received."
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-training-2.png",
          alt: ""
        })
      }), "\n", _jsx(_components.p, {
        children: _jsx(_components.img, {
          src: "./bonsai-training-3.png",
          alt: ""
        })
      }), "\n", _jsx(_components.h2, {
        children: "Remarks"
      }), "\n", _jsxs(_components.ul, {
        children: ["\n", _jsxs(_components.li, {
          children: ["Personally, I think that ", _jsx(_components.strong, {
            children: "Inkling is necessary for the ecosystem, but might be scaring people off"
          }), ". It's an easy language to pick up, if you are a programmer. But when you are new to it and never coded before, it might be too much. I would personally love to see this evolve to a no-code solution."]
        }), "\n", _jsx(_components.li, {
          children: "When first starting the interface, the concept of \"Brain\" is used. Knowing this platform from before, I am comfortable with it, but it might be confusing for newer people."
        }), "\n", _jsx(_components.li, {
          children: "The live visualization is very cool but its working could be clearer, which instance is it showing? Why is it only changing once every 10 seconds? ..."
        }), "\n", _jsxs(_components.li, {
          children: [_jsx(_components.strong, {
            children: "Spinning up a certain amount of simulators is slow"
          }), " with no progress showing what is happening (it just states that it is looking for simulators)"]
        }), "\n", _jsxs(_components.li, {
          children: [_jsx(_components.strong, {
            children: "Performance in training increased a lot!"
          }), " I only had to spend 7 minutes to get to a decent level"]
        }), "\n", _jsxs(_components.li, {
          children: [_jsx(_components.strong, {
            children: "Export brain / integration is not as straightforward"
          }), " with just a simple small button on the right top that looks hidden. ", _jsx(_components.strong, {
            children: "I would love to see a 3th tab that says \"integrate\""
          })]
        }), "\n"]
      }), "\n", _jsx(_components.h2, {
        children: "Summary"
      }), "\n", _jsx(_components.p, {
        children: "The Bonsai platform definitely evolved for the better and became more user friendly! Before the concept graph was not that clear, not showing the amount of inputs or outputs, which has been tackled now."
      }), "\n", _jsx(_components.p, {
        children: "In this revisitation of the platform I just wanted to see the instant changes when opening the platform. Of course this is not the only thing, so stay tuned for more in-depth coverage as I continue using it 😉"
      })]
    });
  }
}
return {
  default: MDXContent
};


Let’s take a look at the Azure Project Bonsai platform to see what changed the past year.

Xavier Geerinck

The Azure Project Bonsai Platform Revisited

Are you struggling with testing and integrating AI into your product?

Are you struggling with testing and integrating AI into your product?