2:I[8173,["173","static/chunks/173-424fa9be91923976.js","243","static/chunks/app/blog/no-code-creative-coding-generative-art/page-247481f046f5df14.js"],"Image"]
3:I[9275,[],""]
4:I[1343,[],""]
5:I[2650,["173","static/chunks/173-424fa9be91923976.js","231","static/chunks/231-1e7bbdc770c66fc3.js","521","static/chunks/521-7266f541e89dccd7.js","185","static/chunks/app/layout-1a67d20efb7fbcee.js"],"Providers"]
6:I[7848,["173","static/chunks/173-424fa9be91923976.js","231","static/chunks/231-1e7bbdc770c66fc3.js","521","static/chunks/521-7266f541e89dccd7.js","185","static/chunks/app/layout-1a67d20efb7fbcee.js"],"Header"]
7:I[231,["173","static/chunks/173-424fa9be91923976.js","49","static/chunks/49-d41f7eeba1de0524.js","231","static/chunks/231-1e7bbdc770c66fc3.js","847","static/chunks/847-d03f1a8cba4db626.js","404","static/chunks/app/blog/page-527c30508ff17cd7.js"],""]
0:["zCwPuQV_WbLEohhlcHJz-",[[["",{"children":["blog",{"children":["no-code-creative-coding-generative-art",{"children":["__PAGE__",{}]}]}]},"$undefined","$undefined",true],["",{"children":["blog",{"children":["no-code-creative-coding-generative-art",{"children":["__PAGE__",{},[["$L1",["$","div",null,{"className":"sm:px-8 mt-16 lg:mt-32","children":["$","div",null,{"className":"mx-auto w-full max-w-7xl lg:px-8","children":["$","div",null,{"className":"relative px-4 sm:px-8 lg:px-12","children":["$","div",null,{"className":"mx-auto max-w-2xl lg:max-w-5xl","children":["$","div",null,{"className":"xl:relative","children":["$","div",null,{"className":"mx-auto max-w-2xl","children":["$","article",null,{"children":[["$","header",null,{"className":"flex flex-col","children":[["$","h1",null,{"className":"mt-6 text-4xl font-bold tracking-tight text-zinc-800 sm:text-5xl dark:text-zinc-100","children":"No Code Creative Coding: A Case Study"}],["$","time",null,{"dateTime":"2024-01-31T19:30:00.000Z","className":"order-first flex items-center text-base text-zinc-400 dark:text-zinc-500","children":[["$","span",null,{"className":"h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-500"}],["$","span",null,{"className":"ml-3","children":"31 January 2024"}]]}]]}],["$","div",null,{"className":"mt-8 prose dark:prose-invert","data-mdx-content":true,"children":[["$","p",null,{"children":"When we create generative art, or engage in creative coding, we are creating systems that create art. The process is iterative and we likely engage with the tools as a sort of collaborator. We might be surprised by some results and inspired to build further on those. We leverage randomness to generate alternatives."}],"\n",["$","p",null,{"children":"No code tools are a way to create software using little or no 'code'. Like serverless computing obviously there is code, but the users compose some kind of simplified primitives, at least when compared with a typical programming language."}],"\n",["$","p",null,{"children":"So what about no code creative coding? Is that an oxymoron? Well often generative art exposes some control of parameters to users, though typically this is quite limited and would certainly not be considered coding. Furthermore creative coding implies abstractness which is at odds with the more direct manipulation favoured by no code. However, if we create a system that allows users to compose rules of their choice in a flexible yet simple way to create a very wide variety of outputs, then we seem to have addressed a major part of creative coding with 'no code'. If we go further and allow for the use of randomness and noise we've covered even more of the creative coding space. The final key area would be engaging with the tools in a collaborative way, where we see ways of tweaking or improving our work."}],"\n",["$","p",null,{"children":"For the last few years I've worked on number of projects that explore this space. The one I will look at here, Pattern Maker, is the most mature and does all of the above."}],"\n",["$","h2",null,{"children":"Pattern Maker"}],"\n",["$","p",null,{"children":[["$","a",null,{"href":"https://apps.apple.com/gb/app/pattern-maker/id1484249212","children":"Pattern Maker"}]," is a iPhone, iPad and MacOS App for No Code Creative Coding. It is a free download, with a one off in app purchase to unlock some advanced features, like high resolution exports."]}],"\n",["$","$L2",null,{"src":{"src":"/_next/static/media/pm_01.9ba8ccd7.jpg","height":520,"width":800,"blurDataURL":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wgARCAAFAAgDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAT/xAAUAQEAAAAAAAAAAAAAAAAAAAAB/9oADAMBAAIQAxAAAAGAJ//EABUQAQEAAAAAAAAAAAAAAAAAAAIS/9oACAEBAAEFAoKf/8QAFREBAQAAAAAAAAAAAAAAAAAAADH/2gAIAQMBAT8Bj//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Bf//EABYQAQEBAAAAAAAAAAAAAAAAAAEAAv/aAAgBAQAGPwIHJf/EABYQAAMAAAAAAAAAAAAAAAAAAAARIf/aAAgBAQABPyGMtn//2gAMAwEAAgADAAAAEAP/xAAXEQEAAwAAAAAAAAAAAAAAAAABABEh/9oACAEDAQE/EHVE/8QAFxEAAwEAAAAAAAAAAAAAAAAAAAERIf/aAAgBAgEBPxCXWf/EABkQAQEBAAMAAAAAAAAAAAAAAAERIQBBgf/aAAgBAQABPxAlEdBGGy27h5z/2Q==","blurWidth":8,"blurHeight":5},"alt":"","unoptimized":true}],"\n",["$","p",null,{"children":"To get started with in Pattern Maker you are presented with a canvas. There is a shape on it, for example a triangle. You choose colours. But then everything you create must be via applying individually simple rules on top of this."}],"\n",["$","$L2",null,{"src":{"src":"/_next/static/media/pm_02.72126134.png","height":1040,"width":480,"blurDataURL":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAICAMAAADp7a43AAAAM1BMVEUBAQG/uaj/zML/288gICA4NDTl5M/b4M4tMDMiNkZAKy6mpJfJy7vJyrhBPzulopQSEhKhAZAiAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAKUlEQVR4nB3Bhw0AMAgDsDADnf9/W6k25toXNCOoSkim4IxuRHTh8yp/EbwAxRKvKR4AAAAASUVORK5CYII=","blurWidth":4,"blurHeight":8},"alt":"","unoptimized":true}],"\n",["$","p",null,{"children":"Each rule can be applied multiple times and can update qualities of the colour: hue, saturation, brightness and opacity. So for example we can create a simple pattern by applying the rotate rule 3 times with a hue modification of +2."}],"\n",["$","$L2",null,{"src":{"src":"/_next/static/media/pm_03.33a959db.jpg","height":1040,"width":480,"blurDataURL":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wgARCAAIAAQDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAP/xAAVAQEBAAAAAAAAAAAAAAAAAAAAAf/aAAwDAQACEAMQAAABmI//xAAXEAADAQAAAAAAAAAAAAAAAAAAAQIF/9oACAEBAAEFAnpyf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQMBAT8Bf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Bf//EABgQAAIDAAAAAAAAAAAAAAAAAAABM4Hw/9oACAEBAAY/AolqP//EABgQAAIDAAAAAAAAAAAAAAAAAAABETFx/9oACAEBAAE/IZNutj//2gAMAwEAAgADAAAAEPv/xAAVEQEBAAAAAAAAAAAAAAAAAAAAIf/aAAgBAwEBPxCv/8QAFxEAAwEAAAAAAAAAAAAAAAAAAAERUf/aAAgBAgEBPxCLD//EABgQAQEBAQEAAAAAAAAAAAAAAAERYQAh/9oACAEBAAE/EJy1FLph4hnf/9k=","blurWidth":4,"blurHeight":8},"alt":"","unoptimized":true}],"\n",["$","p",null,{"children":"Typically rules have some direct control built in. For rotation we can control the amount of rotation. By combining scale, rotation, translations and other straightforward rules we can create lots of simple patterns. Things get more interesting when we start to use rules that leverage noise or process that create multiple shapes from one input, such as transforming lines via fractal rules."}],"\n",["$","$L2",null,{"src":{"src":"/_next/static/media/pm_04.b06da318.jpg","height":1040,"width":480,"blurDataURL":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wgARCAAIAAQDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAX/xAAUAQEAAAAAAAAAAAAAAAAAAAAB/9oADAMBAAIQAxAAAAGEB//EABYQAQEBAAAAAAAAAAAAAAAAAAEAAv/aAAgBAQABBQJ2X//EABYRAAMAAAAAAAAAAAAAAAAAAAABEf/aAAgBAwEBPwGs/8QAFhEAAwAAAAAAAAAAAAAAAAAAAAER/9oACAECAQE/AYj/xAAVEAEBAAAAAAAAAAAAAAAAAAAAMv/aAAgBAQAGPwKn/8QAGRAAAQUAAAAAAAAAAAAAAAAAAAEhUWHR/9oACAEBAAE/IWVIXD//2gAMAwEAAgADAAAAEAv/xAAVEQEBAAAAAAAAAAAAAAAAAAAAYf/aAAgBAwEBPxCz/8QAFREBAQAAAAAAAAAAAAAAAAAAAGH/2gAIAQIBAT8Qg//EABgQAAIDAAAAAAAAAAAAAAAAABExAAHB/9oACAEBAAE/EHNEA1j/2Q==","blurWidth":4,"blurHeight":8},"alt":"","unoptimized":true}],"\n",["$","p",null,{"children":"This is created from 3 rules and simple base shape (it is one of the example patterns in the App)."}],"\n",["$","$L2",null,{"src":{"src":"/_next/static/media/pm_05.03ded57e.jpg","height":1040,"width":480,"blurDataURL":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wgARCAAIAAQDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAT/xAAUAQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIQAxAAAAGcH//EABYQAQEBAAAAAAAAAAAAAAAAAAEABf/aAAgBAQABBQJ0S//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQMBAT8Bf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Bf//EABYQAAMAAAAAAAAAAAAAAAAAAAAyof/aAAgBAQAGPwJaf//EABcQAAMBAAAAAAAAAAAAAAAAAAARYdH/2gAIAQEAAT8hZqsP/9oADAMBAAIAAwAAABDz/8QAFhEAAwAAAAAAAAAAAAAAAAAAAAER/9oACAEDAQE/EKz/xAAWEQADAAAAAAAAAAAAAAAAAAAAARH/2gAIAQIBAT8QiP/EABgQAAMBAQAAAAAAAAAAAAAAAAERIQBx/9oACAEBAAE/EFRtHTrjnf/Z","blurWidth":4,"blurHeight":8},"alt":"","unoptimized":true}],"\n",["$","h3",null,{"children":"Generative Variations"}],"\n",["$","p",null,{"children":"Once we have a pattern we can ask the App to generate variations, by adjusting rules. If we like something we can use it as the basis for more changes."}],"\n",["$","$L2",null,{"src":{"src":"/_next/static/media/pm_06.3289f94e.jpg","height":1040,"width":480,"blurDataURL":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wgARCAAIAAQDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAX/xAAUAQEAAAAAAAAAAAAAAAAAAAAD/9oADAMBAAIQAxAAAAGeGH//xAAXEAADAQAAAAAAAAAAAAAAAAAAAgQU/9oACAEBAAEFAtErH//EABYRAQEBAAAAAAAAAAAAAAAAAAEAAv/aAAgBAwEBPwF2jf/EABcRAQADAAAAAAAAAAAAAAAAAAEAAhH/2gAIAQIBAT8BKmT/xAAXEAEAAwAAAAAAAAAAAAAAAAABADOR/9oACAEBAAY/AqAyf//EABgQAQADAQAAAAAAAAAAAAAAAAEAESFB/9oACAEBAAE/IaonFpH/2gAMAwEAAgADAAAAEPP/xAAVEQEBAAAAAAAAAAAAAAAAAAABAP/aAAgBAwEBPxBoDf/EABURAQEAAAAAAAAAAAAAAAAAAAEA/9oACAECAQE/EHBb/8QAFhABAQEAAAAAAAAAAAAAAAAAASEA/9oACAEBAAE/EAhQIMzf/9k=","blurWidth":4,"blurHeight":8},"alt":"","unoptimized":true}]]}]]}]}]}]}]}]}]}]],null],null]},["$","$L3",null,{"parallelRouterKey":"children","segmentPath":["children","blog","children","no-code-creative-coding-generative-art","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L4",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined","styles":null}],null]},["$","$L3",null,{"parallelRouterKey":"children","segmentPath":["children","blog","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L4",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined","styles":null}],null]},[["$","html",null,{"lang":"en","className":"h-full antialiased","suppressHydrationWarning":true,"children":["$","body",null,{"className":"flex h-full bg-zinc-200 dark:bg-black","children":["$","$L5",null,{"children":["$","div",null,{"className":"flex w-full","children":[["$","div",null,{"className":"fixed inset-0 flex justify-center sm:px-8","children":["$","div",null,{"className":"flex w-full max-w-7xl lg:px-8","children":["$","div",null,{"className":"w-full bg-white ring-1 ring-zinc-100 dark:bg-zinc-900 dark:ring-zinc-300/20"}]}]}],["$","div",null,{"className":"relative flex w-full flex-col","children":[["$","$L6",null,{}],["$","main",null,{"className":"flex-auto","children":["$","$L3",null,{"parallelRouterKey":"children","segmentPath":["children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L4",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":["$","div",null,{"className":"sm:px-8 flex h-full items-center pt-16 sm:pt-32","children":["$","div",null,{"className":"mx-auto w-full max-w-7xl lg:px-8","children":["$","div",null,{"className":"relative px-4 sm:px-8 lg:px-12","children":["$","div",null,{"className":"mx-auto max-w-2xl lg:max-w-5xl","children":["$","div",null,{"className":"flex flex-col items-center","children":[["$","p",null,{"className":"text-base font-semibold text-zinc-400 dark:text-zinc-500","children":"404"}],["$","h1",null,{"className":"mt-4 text-4xl font-bold tracking-tight text-rose-800 sm:text-5xl dark:text-rose-100","children":"Page not found"}],["$","p",null,{"className":"mt-4 text-base text-zinc-600 dark:text-zinc-400","children":"Sorry, we couldn’t find the page you’re looking for."}],["$","p",null,{"className":"mt-4 text-base text-zinc-600 dark:text-zinc-400","children":["You may want to try"," ",["$","a",null,{"href":"https://archive.amimetic.co.uk","className":"font-semibold text-rose-600 hover:text-rose-500","children":"the old version of this website"}]," ","as not everything was included here."]}],["$","$L7",null,{"className":"inline-flex items-center gap-2 justify-center rounded-md py-2 px-3 text-sm outline-offset-2 transition active:transition-none bg-zinc-50 font-medium text-zinc-900 hover:bg-zinc-100 active:bg-zinc-100 active:text-zinc-900/60 dark:bg-zinc-800/50 dark:text-zinc-300 dark:hover:bg-zinc-800 dark:hover:text-zinc-50 dark:active:bg-zinc-800/50 dark:active:text-zinc-50/70 mt-4","href":"/","children":"Go back home"}]]}]}]}]}]}],"notFoundStyles":[],"styles":null}]}],["$","footer",null,{"className":"mt-32 flex-none","children":["$","div",null,{"className":"sm:px-8","children":["$","div",null,{"className":"mx-auto w-full max-w-7xl lg:px-8","children":["$","div",null,{"className":"border-t border-zinc-100 pb-16 pt-10 dark:border-zinc-700/40","children":["$","div",null,{"className":"relative px-4 sm:px-8 lg:px-12","children":["$","div",null,{"className":"mx-auto max-w-2xl lg:max-w-5xl","children":["$","div",null,{"className":"flex flex-col items-center justify-between gap-6 sm:flex-row","children":[["$","div",null,{"className":"flex flex-wrap justify-center gap-x-6 gap-y-1 text-sm font-medium text-zinc-800 dark:text-zinc-200","children":[["$","$L7",null,{"href":"/about","className":"transition hover:text-sky-500 dark:hover:text-sky-400","children":"About"}],["$","$L7",null,{"href":"/blog","className":"transition hover:text-sky-500 dark:hover:text-sky-400","children":"Writing"}],["$","$L7",null,{"href":"/projects","className":"transition hover:text-sky-500 dark:hover:text-sky-400","children":"Projects"}]]}],["$","p",null,{"className":"text-sm text-zinc-400 dark:text-zinc-500","children":["© ",2024," James Porter"]}]]}]}]}]}]}]}]}]]}]]}]}]}]}],null],null],[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/3dda7107ffc2265a.css","precedence":"next","crossOrigin":"$undefined"}]],"$L8"]]]]
8:[["$","meta","0",{"name":"viewport","content":"width=device-width, initial-scale=1"}],["$","meta","1",{"charSet":"utf-8"}],["$","title","2",{"children":"No Code Creative Coding: A Case Study - James Porter"}],["$","meta","3",{"name":"description","content":"Projects and thoughts from James Porter"}]]
1:null