[{"data":1,"prerenderedAt":483},["ShallowReactive",2],{"content-dir-\u002Fhome":3,"nav-config":122,"home-featured-projects":146},[4,45,88],{"id":5,"title":6,"body":7,"description":33,"extension":37,"meta":38,"navigation":40,"path":41,"seo":42,"stem":43,"__hash__":44},"content\u002Fhome\u002Ffirstsectionexample.md","Firstsectionexample",{"type":8,"value":9,"toc":32},"minimark",[10,15,20],[11,12,14],"h2",{"id":13},"this-website","This Website",[16,17],"svg-divider",{"seed":18,"width":19},"59312","w-3\u002F4",[21,22,23,24,31],"p",{},"This website showcases some of my experience with modern web development, built using Vue, Tailwind CSS, Nuxt, Node.js, and TypeScript. Read more in the ",[25,26],"svg-under-line-link",{"always-visible":27,"link-to":28,"seed":29,"text":30},"true","\u002Fprojects\u002F007-portfolio-website","312324","website project write-up",".",{"title":33,"searchDepth":34,"depth":34,"links":35},"",2,[36],{"id":13,"depth":34,"text":14},"md",{"routable":39},false,true,"\u002Fhome\u002Ffirstsectionexample",{"description":33},"home\u002Ffirstsectionexample","kwlO5ce4gQ1ZT_i2AgMxJ8__KfX9fsw6xvZN-SboX6o",{"id":46,"title":47,"body":48,"description":33,"extension":37,"meta":77,"navigation":40,"path":84,"seo":85,"stem":86,"__hash__":87},"content\u002Fhome\u002Findex.md","About",{"type":8,"value":49,"toc":74},[50,54,58,61,70],[11,51,53],{"id":52},"hi-im-carter-brimeyer-and-this-is-my-website","Hi, I'm Carter Brimeyer and this is my website",[16,55],{"seed":56,"width":57},"1235092","w-1\u002F2",[21,59,60],{},"I am a professional software developer with a degree in computer science. Check out this website to learn more.",[21,62,63,64,69],{},"Take a look at my ",[25,65],{"always-visible":27,"link-to":66,"seed":67,"text":68},"\u002Fprojects","1231","projects page"," to see some examples of what I have been working on.",[71,72,73],"style",{},"\n    #demo-space {\n        padding: clamp(200px, 10.42vw, 250px);\n    }\n    #bottom-demo-space {\n        padding: clamp(30px, 3.91vw, 75px);\n        margin-top: clamp(50px, 5.21vw, 100px);\n    }\n",{"title":33,"searchDepth":34,"depth":34,"links":75},[76],{"id":52,"depth":34,"text":53},{"view":78,"childrenRouting":39,"projectsToDisplay":79},"HomeView",[80,81,82,83],"\u002Fprojects\u002F004-portfolio-space-scroller","\u002Fprojects\u002F003-portfolio-ai-othello","\u002Fprojects\u002F006-portfolio-matter-js","\u002Fprojects\u002F008-portfolio-kaios-space-scroller","\u002Fhome",{"title":47,"description":33},"home\u002Findex","bFvy8XGpPZke-Xe_3I5JiyEXK5KTULRVaoVEFvq0_0I",{"id":89,"title":90,"body":91,"description":33,"extension":37,"meta":117,"navigation":40,"path":118,"seo":119,"stem":120,"__hash__":121},"content\u002Fhome\u002Fsecondsectionexample.md","Secondsectionexample",{"type":8,"value":92,"toc":114},[93,97,100,108],[11,94,96],{"id":95},"projects","Projects",[16,98],{"seed":99,"width":19},"3123",[21,101,102,103],{},"This website has examples of some of my projects that you can demo. Try out my space scroller game, written in JavaScript using P5.js: ",[25,104],{"always-visible":27,"link-to":105,"seed":106,"text":107},"\u002Fprojects\u002F004-portfolio-space-scroller#try-it","231235","Play the Space Scroller game",[21,109,110,111,113],{},"Check out my ",[25,112],{"always-visible":27,"link-to":66,"seed":29,"text":95}," page!",{"title":33,"searchDepth":34,"depth":34,"links":115},[116],{"id":95,"depth":34,"text":96},{"routable":39},"\u002Fhome\u002Fsecondsectionexample",{"description":33},"home\u002Fsecondsectionexample","Y-aeDo-z0g4SrSbhKQPtxLsetBNMsrs7n1M-eyVckow",{"id":123,"title":124,"body":125,"description":125,"extension":126,"meta":127,"navigation":40,"path":142,"seo":143,"stem":144,"__hash__":145},"content\u002Fnavigation.yml","Navigation",null,"yml",{"navbar":128,"footer":134},{"signatureNavItem":129,"navItems":132},{"title":130,"href":131},"Home","\u002F",[133],{"title":96,"href":66},{"navItems":135,"imageNavItems":139},[136],{"title":137,"href":138},"Contact Me","\u002Fcontact",{"githubUrl":140,"linkedinUrl":141},"https:\u002F\u002Fgithub.com\u002Fcarterbrimeyer","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Fcarterbrimeyer\u002F","\u002Fnavigation",{},"navigation","B6uyhDhz7a64WFj-KprkHg5qQIVtyIvj_Pij7Zq0r_o",[147,236,308,364],{"id":148,"title":149,"body":150,"description":154,"extension":37,"meta":217,"navigation":40,"path":80,"seo":233,"stem":234,"__hash__":235},"content\u002Fprojects\u002F004-portfolio-Space-Scroller.md","Space Scroller using P5",{"type":8,"value":151,"toc":208},[152,155,163,167,170,174,177,181,184,188,191,194,199,202,205],[21,153,154],{},"Read about the development of my space scroller game I made with P5.js.",[21,156,157,158,31],{},"I developed a simple side-scrolling space shooter game built with p5.js and JavaScript. What started as a fun experiment with vector-based graphics has evolved into an interactive experience integrated directly into this page as a Vue component. View this code on github ",[25,159],{"always-visible":27,"link-to":160,"seed":161,"text":162},"https:\u002F\u002Fgithub.com\u002Fcarterbrimeyer\u002FSpaceScroller","884124","here",[11,164,166],{"id":165},"from-idea-to-implementation","From Idea to Implementation",[21,168,169],{},"The idea was to create a basic side-scrolling game, leveraging the vector graphic capabilities of p5.js. The project started as just a way to use p5.js using simple JavaScript and HTML. I reached a point where I wanted to showcase my work in a dynamic and accessible way. This led to converting the original pure JavaScript code to align with Vue and ES6 standards. The conversion process presented its challenges, but the outcome was a functional game that retained the core mechanics of the original version.",[11,171,173],{"id":172},"tackling-vector-graphics-and-math-challenges","Tackling Vector Graphics and Math Challenges",[21,175,176],{},"Learning to work with vector graphics introduced a fascinating layer of complexity. It required a lot of math, experimentation, and perseverance. However, the effort paid off as I created a project that felt truly unique and that I could showcase in a different way.",[11,178,180],{"id":179},"addressing-collision-detection-efficiency","Addressing Collision Detection Efficiency",[21,182,183],{},"One of the more challenging aspects of development was implementing collision detection for the asteroids. Their irregular shapes made precise intersection calculations for lasers and ships resource-intensive. To strike a balance between accuracy and performance, I opted for a proximity-based collision system. If an object comes within a specific distance of an asteroid or ship, it registers as a hit. While this approach involves some compromises, it proved to be the most efficient solution for my use case.",[11,185,187],{"id":186},"lessons-learned","Lessons Learned",[21,189,190],{},"Reflecting on this project, I realized the importance of considering the broader scope of a project from the outset. Adapting the game for deployment on a website introduced scope creep, adding unanticipated complexity to the development process. In the future, I plan to keep compatibility and deployment in mind from the beginning to streamline the development workflow.",[21,192,193],{},"Reading about this project is one thing, but its a lot more fun to try it out.",[195,196,198],"h3",{"id":197},"try-it","Try it",[21,200,201],{},"Try it below!",[203,204],"scroller-game",{},[71,206,207],{},"\n#post-view {\n  margin-bottom: 800px;\n}\n\n#all-content {\n  background-color: black;\n}\n",{"title":33,"searchDepth":34,"depth":34,"links":209},[210,211,212,213],{"id":165,"depth":34,"text":166},{"id":172,"depth":34,"text":173},{"id":179,"depth":34,"text":180},{"id":186,"depth":34,"text":187,"children":214},[215],{"id":197,"depth":216,"text":198},3,{"identity":218,"slug":219,"image":220,"view":221,"tags":222,"excerpt":229},4,"spacescroller","feature-images\u002Fblogimage4.webp","PostView",[223,226],{"name":224,"color":225},"Personal Project","#21593c",{"name":227,"color":228},"Try It","#434194",{"type":8,"value":230},[231],[21,232,154],{},{"title":149,"description":154},"projects\u002F004-portfolio-Space-Scroller","d_S2hVhlK8c8l-KGMBwfOpJNZj5M53tyPeTcY3mzDGw",{"id":237,"title":238,"body":239,"description":243,"extension":37,"meta":293,"navigation":40,"path":81,"seo":305,"stem":306,"__hash__":307},"content\u002Fprojects\u002F003-portfolio-AI-Othello.md","AI for Othello in Javascript",{"type":8,"value":240,"toc":286},[241,244,248,254,257,260,264,267,271,274,276],[21,242,243],{},"Learn more about my development of an othello AI opponent.",[11,245,247],{"id":246},"overview","Overview",[21,249,250,251,31],{},"I originally wrote this simple HTML and Javascript program for a project in my principles of artificial intelligence class at Iowa State University. The user interface is simple HTML and ES6 Javascript, but the artificial intelligence of the computer player is much more interesting. View this code on github ",[25,252],{"always-visible":27,"link-to":253,"seed":161,"text":162},"https:\u002F\u002Fgithub.com\u002Fcarterbrimeyer\u002FMinimaxOthelloJS",[21,255,256],{},"For this project, I implemented a minimax algorithm with alpha beta pruning for the othello AI algorithm. Even with the pruning, the artificial intelligence algorithm can be inefficient while attempting to process a move on higher depths. This issue became exponential as the algorithm would initially map out the entire possible game and attempt to find the best move. I decided to implement a limit of how far the algorithm would map the game out, similar to how most casual players would consider their moves.",[21,258,259],{},"You can think of depths as how far the computer player is looking into the future. At a depth of four, where the below implementation is set, the artificial intelligence is looking up to four moves ahead.",[11,261,263],{"id":262},"design-considerations","Design Considerations",[21,265,266],{},"I decided to program this simple application in ES6 Javascript, CSS and HTML not for a performance or UI based reason. This project was one of my early experiments in using Javascript and familiarizing myself in how the language works. This ultimately led to my interest in learning the more type safe Typescript.",[11,268,270],{"id":269},"what-i-learned","What I learned",[21,272,273],{},"I value what I learned from this project a lot. This was a great way for me start programming in Javascript and continue to develop my skills. If I were to solve this problem again, I would definitely try to use a completely different programming language in order to learn more about it.",[195,275,198],{"id":197},[277,278],"iframe",{"id":279,"src":280,"width":281,"height":282,"style":283,"scrolling":284,"title":285},"othello-frame","\u002Fcontent\u002Fprojects\u002Fstatic\u002Fothello\u002Fothello.html","100%","800px","border: 2px solid #ccc; border-radius: 8px;","no","Othello Game",{"title":33,"searchDepth":34,"depth":34,"links":287},[288,289,290],{"id":246,"depth":34,"text":247},{"id":262,"depth":34,"text":263},{"id":269,"depth":34,"text":270,"children":291},[292],{"id":197,"depth":216,"text":198},{"identity":216,"slug":294,"image":295,"view":221,"tags":296,"excerpt":301},"minimax-othello","feature-images\u002Fblogimage3.webp",[297,300],{"name":298,"color":299},"Class Work","#9B1B23",{"name":227,"color":228},{"type":8,"value":302},[303],[21,304,243],{},{"title":238,"description":243},"projects\u002F003-portfolio-AI-Othello","H73YUt6jxmDL-Le6NsPaVm3YHCurs4Ybd39vFXb094A",{"id":309,"title":310,"body":311,"description":315,"extension":37,"meta":351,"navigation":40,"path":82,"seo":361,"stem":362,"__hash__":363},"content\u002Fprojects\u002F006-portfolio-matter-js.md","Matter.js C# translation",{"type":8,"value":312,"toc":346},[313,316,318,324,327,331,334,337,340,343],[21,314,315],{},"Find out more about my side project with converting Matter.js to C#.",[11,317,247],{"id":246},[21,319,320,321,31],{},"I wanted to familiarize myself more with Matter.js and C# so I decided to convert the Matter.js github repo from javascript to C#. View this code on github ",[25,322],{"always-visible":27,"link-to":323,"seed":161,"text":162},"https:\u002F\u002Fgithub.com\u002Fcarterbrimeyer\u002FMatterDotNet",[21,325,326],{},"I started by reviewing the many different javascript files and converting them to C# classes. This was difficult as the Matter.js at the type was not strongly typed. This led to some issues with some properties that were not easily converted to C#.",[11,328,330],{"id":329},"my-goals","My Goals",[21,332,333],{},"I wanted to work on a project that combined my practice with Javascript with C# as I was interested in refining my experience with C#. Additionally I wanted to learned more about simple graphics and I decided on using SDL2. SDL2 is a simple graphics library for drawing lines and simple shapes in a rendered window. The library was originally written in C++ but I was able to use a C# wrapper to use the library with C# and all of its benefits. By converting this from Matter.js I was ultimately able to simulate simple physics and generate complex polygons with collision. I was also able to have the same collision work for composites, which were a collection of physics bodies.",[11,335,336],{"id":269},"What I Learned",[21,338,339],{},"I had some success with converting this project from javascript to C# but ultimately I had to archive this project as I did not have the time to keep working on it. Ultimately I learned a lot about both Javascript and C# while working on this application.",[21,341,342],{},"Ultimately the scope of this project got more and more complex as it went on. Since Javascript is not strictly typed, It was difficult to accurately define properties and classes in C# that would work as expected. Often, there would be properties that stored many different types depending on the scenario and event that was being passed into a function.",[21,344,345],{},"Another part I found interesting about working on this was learning more about SVG and vector paths. I was able to recreate SVG files as polygons by recreating the path logic code of the SVG file to create a composite physics body. This introduced me to working with the SVG format and you can now see the results of this experimentation on this website in the dividers and link underlines.",{"title":33,"searchDepth":34,"depth":34,"links":347},[348,349,350],{"id":246,"depth":34,"text":247},{"id":329,"depth":34,"text":330},{"id":269,"depth":34,"text":336},{"identity":352,"slug":353,"image":354,"view":221,"tags":355,"excerpt":357},6,"matter-dotnet","feature-images\u002Fblogimage6.webp",[356],{"name":224,"color":225},{"type":8,"value":358},[359],[21,360,315],{},{"title":310,"description":315},"projects\u002F006-portfolio-matter-js","L_0HWYPibV730aP3gFnwBmtNDSA0QONdRjPcH55eEO8",{"id":365,"title":366,"body":367,"description":371,"extension":37,"meta":469,"navigation":40,"path":83,"seo":480,"stem":481,"__hash__":482},"content\u002Fprojects\u002F008-portfolio-KaiOS-Space-Scroller.md","Space Scroller On KaiOS",{"type":8,"value":368,"toc":458},[369,372,382,384,387,391,394,398,401,405,408,412,415,419,422,426,429,431,434],[21,370,371],{},"Learn about my personal project to port my Space Scroller game to KaiOS.",[21,373,374,375,378,379,31],{},"View this code on github ",[25,376],{"always-visible":27,"link-to":377,"seed":161,"text":162},"https:\u002F\u002Fgithub.com\u002Fcarterbrimeyer\u002Fspacescroller\u002Ftree\u002FkaiOS",". Or try out the web version ",[25,380],{"always-visible":27,"link-to":105,"seed":381,"text":162},"21415632",[11,383,247],{"id":246},[21,385,386],{},"A friend of mine had recently switched from a smartphone to a flip phone to cut back on screen time, which is how I first learned about KaiOS, the operating system that powers many modern flip phones. What caught my attention was that KaiOS apps are built with standard HTML and JavaScript, the same technologies my Space Scroller game was already written in, and I wanted to see if I could get it running on actual hardware with minimal effort.",[11,388,390],{"id":389},"getting-it-on-the-device","Getting It on the Device",[21,392,393],{},"The AT&T Cingular Flip IV runs KaiOS and is cheap and easy to source. To install apps outside of the official KaiOS Store I had to enable developer mode and root the device, then use Mozilla's WebIDE to sideload the app. The original game already used a bundled p5.js v1.4.0 minified file for its graphics, which worked without modification on the device's runtime. I also had to do some optimization to get the game running smoothly on the more limited hardware.",[11,395,397],{"id":396},"rotating-the-game-world","Rotating the Game World",[21,399,400],{},"The original game is a side-scrolling shooter designed for a landscape screen, but the flip phone's display is portrait. I rotated the entire game world 90 degrees so that enemies scroll downward from the top of the screen and the player's ship sits at the bottom. This took some effort to implement correctly, but it was worth it. The portrait orientation gives the player more distance between themselves and the oncoming obstacles, making the game noticeably more enjoyable on the smaller screen.",[11,402,404],{"id":403},"adapting-the-controls","Adapting the Controls",[21,406,407],{},"KaiOS devices don't have a mouse or touchscreen, so I had to remap all inputs to the D-pad, keypad buttons, and center D-pad button. One challenge was replicating the mouse-driven movement from the original game. I solved this by simulating a mouse point on the opposite side of the screen from the pressed direction. The longer a direction is held, the more the ship's speed accumulates and its rotation increases, closely matching how the original controls feel.",[11,409,411],{"id":410},"overheating","Overheating",[21,413,414],{},"To prevent players from simply holding down the fire button, I added an overheating mechanic. Firing continuously builds up heat, and once the weapon overheats it locks out until it cools down. This adds a layer of resource management to the combat and makes engagements more deliberate.",[11,416,418],{"id":417},"auto-pause-on-focus-loss","Auto-Pause on Focus Loss",[21,420,421],{},"The game automatically pauses whenever it loses focus. On a flip phone this is especially useful since closing the phone or switching away from the app suspends the game rather than leaving it running unattended. Resuming is as simple as returning to the app and pressing a button.",[11,423,425],{"id":424},"menu-screen","Menu Screen",[21,427,428],{},"I added a simple menu screen to give the game a proper entry point on the hardware. It displays the key bindings so players know how to control the ship, and prompts them to press a button to start. This was a small but important addition to make the experience feel complete.",[11,430,336],{"id":269},[21,432,433],{},"This project showed me that standard web technologies can reach platforms far beyond the browser. Even a relatively straightforward port introduced meaningful challenges: rotating a game world, adapting input from mouse to hardware buttons, adding new mechanics, and optimizing for more limited hardware, all of which expanded my understanding of cross-platform development.",[435,436,440,442,445,453],"div",{"className":437},[438,439],"hidden","md:block",[11,441,198],{"id":197},[21,443,444],{},"Since KaiOS apps are built in HTML and Javascript, I can easily implement it here so you can try it  out. Use the arrow keys to move the ship, 5 for shield, and space to fire:",[277,446],{"id":447,"src":448,"width":449,"height":450,"style":451,"scrolling":284,"title":452},"scroller-kaios-frame","\u002Fcontent\u002Fprojects\u002Fstatic\u002Fscroller-kaios\u002Fscroller-kaios.html",240,320,"border: 2px solid #ccc; border-radius: 8px; display: block; margin: 0 auto;","KaiOS Space Scroller",[21,454,455,456,31],{},"Compare it to the original game I started with ",[25,457],{"always-visible":27,"link-to":105,"seed":381,"text":162},{"title":33,"searchDepth":34,"depth":34,"links":459},[460,461,462,463,464,465,466,467,468],{"id":246,"depth":34,"text":247},{"id":389,"depth":34,"text":390},{"id":396,"depth":34,"text":397},{"id":403,"depth":34,"text":404},{"id":410,"depth":34,"text":411},{"id":417,"depth":34,"text":418},{"id":424,"depth":34,"text":425},{"id":269,"depth":34,"text":336},{"id":197,"depth":34,"text":198},{"identity":470,"slug":471,"image":472,"view":221,"tags":473,"excerpt":476},8,"kaios-spacescroller","feature-images\u002Fscrollergamekaios.webp",[474,475],{"name":224,"color":225},{"name":227,"color":228},{"type":8,"value":477},[478],[21,479,371],{},{"title":366,"description":371},"projects\u002F008-portfolio-KaiOS-Space-Scroller","S3js0N7IOZ3OZB6tXR0UVeL2WxL4LSqEhXjjVBdw1yE",1790721645468]