1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[848],{4482:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/blog/wub",function(){return n(9676)}])},9676:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return h},frontmatter:function(){return o},tableOfContents:function(){return l}});var i=n(5893),s=n(9843),r=n(1582);let o={title:"Wub",short_title:"Wub",subhead:"Say nonsense words fast",date:"2023-08-11",filter_categories:["game","toy","speech"],assets_dir:"wub",description:"A game about saying nonsense words fast",rss_description:"I made a game called Wub - it gives you a series of increasingly difficult to say nonsense words and times how long it takes you to say them.",image:"gameplay-image.png"},l=[{level:2,text:"Basics",id:"toc:basics",href:"#toc:basics"}],a=function(e){let{children:t}=e;return(0,i.jsx)(r.Z,{post:o,tableOfContents:l,children:t})};function c(e){let t={a:"a",em:"em",h2:"h2",li:"li",p:"p",strong:"strong",ul:"ul",...(0,s.a)(),...e.components},{FT:n,FTD:r,SingleVideo:o}=t;return n||d("FT",!0),r||d("FTD",!0),o||d("SingleVideo",!0),(0,i.jsxs)(i.Fragment,{children:["\n",(0,i.jsx)(t.h2,{id:"toc:basics",children:"Basics"}),"\n",(0,i.jsxs)(t.ul,{children:["\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"Genre:"})," Competitive toungue twister"]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"Links:"})," ",(0,i.jsx)(t.a,{href:"/wub",children:"play it right here"})," or ",(0,i.jsx)(t.a,{href:"https://itseieio.itch.io/wub",children:"play it on itch"})]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"Engine:"})," A little hand-rolled javascript"]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"Time Spent:"})," ~4 hours one evening"]}),"\n",(0,i.jsxs)(t.li,{children:[(0,i.jsx)(t.strong,{children:"Other Stuff:"})," I built this game at ",(0,i.jsx)(t.a,{href:"https://www.recurse.com/",children:"Recurse Center"}),", a magical place that functions like a writers retreat for programmers. Consider applying!"]}),"\n"]}),"\n",(0,i.jsxs)(t.p,{children:["In Wub youâre prompted to say some silly phrases while a timer plays. When you finish saying the silly phrases the timer stops. The first phrase you say is âwub wub ",(0,i.jsx)(n,{i:1}),".â Thatâs why itâs called wub."]}),"\n",(0,i.jsx)(r,{i:1,children:(0,i.jsx)(t.p,{children:"Interestingly, the API does a better job of detecting the phrase âwub wubâ\nthan detecting a single wub!"})}),"\n",(0,i.jsx)(o,{src:"gameplay.mp4",description:"wub wub wub wub wub",alt:"A video of someone playing Wub",width:1280,height:720}),"\n","\n",(0,i.jsxs)(t.p,{children:["Thatâs it! There are like 15 phrases in the game. Try it out ",(0,i.jsx)(t.a,{href:"/wub",children:"here"}),"."]}),"\n",(0,i.jsxs)(t.p,{children:["Itâs built on top of the (experimental) ",(0,i.jsx)(t.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API",children:"web speech API"})," which made it really trivial to stand up a game like this, although I think it only works in Chrome right now."]}),"\n",(0,i.jsxs)(t.p,{children:["Originally I was hoping that the game could be built ",(0,i.jsx)(t.em,{children:"entirely"})," on nonsense words, including words that were very hard to pronounce. But the speech api tries very hard to fashion your speech into actual english words so I wasnât able to go quite as far in that direction as I wanted to. I guess Iâll have to train my own model :)"]})]})}function h(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return(0,i.jsx)(a,{...e,children:(0,i.jsx)(c,{...e})})}function d(e,t){throw Error("Expected "+(t?"component":"object")+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}},1582:function(e,t,n){"use strict";n.d(t,{Z:function(){return C}});var i=n(5893),s=n(7294),r=n(1754),o=n(1686),l=n(9711),a=n(2172);let c=o.ZP.a.withConfig({componentId:"sc-d1d98fc4-0"})(["font-family:var(--regular-font);color:var(--color-white-dim);text-decoration:none;line-height:1.2;margin:0;width:fit-content;&:visited{color:var(--color-white-dim);}@media (hover:hover){&:hover{color:var(--color-white);}}"]),h=(0,o.ZP)(c).withConfig({componentId:"sc-d1d98fc4-1"})(["font-size:var(--font-size-lsmall);&:not(:first-child){margin-top:0.375rem;}"]),d=(0,o.ZP)(c).withConfig({componentId:"sc-d1d98fc4-2"})(["font-size:var(--font-size-lsmall);margin-top:0.375rem;"]),u=(0,o.ZP)(c).withConfig({componentId:"sc-d1d98fc4-3"})(["font-size:var(--font-size-small);margin-left:0.25rem;margin-top:0.125rem;"]),f=(0,o.ZP)(c).withConfig({componentId:"sc-d1d98fc4-4"})(["font-size:var(--font-size-xsmall);margin-left:0.25rem;margin-top:0.125rem;"]),m=(0,o.ZP)(c).withConfig({componentId:"sc-d1d98fc4-5"})(["font-size:var(--font-size-xsmall);margin-left:0.25rem;margin-top:0.125rem;"]),p=o.ZP.nav.withConfig({componentId:"sc-d1d98fc4-6"})(["display:flex;flex-direction:column;padding-right:64px;"]),g="toc:title";var w=s.memo(function(e){let{items:t,title:n}=e;return n&&(t=[{level:1,text:n,id:g,href:"#".concat(g)},...t]),(0,i.jsx)(p,{children:t.map(e=>{let{id:t,href:n}=e,s=null;return 1===e.level?s=h:2===e.level?s=d:3===e.level?s=u:4===e.level?s=f:5===e.level&&(s=m),(0,i.jsx)(s,{href:n,children:e.text},t)})})}),x=n(3715),b=n(9332),j=n(1916),y=n(337),v=n(1413);let I=o.ZP.nav.withConfig({componentId:"sc-67c5266d-0"})(["display:none;@media ","{display:revert;position:sticky;top:2rem;}"],r.vb.TWO_COLUMN_LAYOUT),_=o.ZP.h4.withConfig({componentId:"sc-67c5266d-1"})(["margin-top:0;font-size:var(--font-size-large);"]);var C=function(e){let{children:t,post:n,tableOfContents:r,noFooter:o=!1}=e,c=s.useRef(null),h=null!=r&&r.length>0,d=(0,b.usePathname)(),u=h?(0,i.jsxs)(I,{children:[(0,i.jsx)(_,{children:"Table of Contents"}),(0,i.jsx)(w,{items:r,title:n.short_title})]}):null,f=(0,i.jsx)(l.Dr,{contentRef:c}),m=n.image?"https://eieio.games/images/".concat(n.assets_dir,"/").concat(n.image):null;return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(v.Z,{title:n.title,de
1scription:n.description,image:m,type:"article",date:n.date}),(0,i.jsx)(l.pD,{children:(0,i.jsx)(l.Od,{id:1,children:(0,i.jsx)(a.CL,{path:n.assets_dir,children:(0,i.jsx)(j.Z,{additionalLeftContent:u,additionalRightContent:f,noFooter:o,children:(0,i.jsxs)(y.Ls,{ref:c,children:[(0,i.jsx)(x.Z,{titleId:g,title:n.title,subhead:n.subhead,date:n.date,href:d}),t]})})})})})]})}}},function(e){e.O(0,[959,4952,3299,2888,9774,179],function(){return e(e.s=4482)}),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.