there you go
hello and welcome i'm machine dana and today we're going to learn how to do
spin wheels with streamlabs online more specifically we're going to be
adding it to streamlabs obs but you can add this to obs studios xsplit obs live
all the softwares okay you can add this to all the softwares and all this is is a spin spin
wheel a little bit like family fortunes family fortunes was it family fortunes the one where
they spin the wheel and they win prizes united onto your stream pick a button spins the wheel
and you win stuff or if you're really clever you lose stuff because people love it when you're in
pain it's like a sadistic thing with twitch and youtube gaming viewers seem to really love it when
the broadcaster is in some sort of like pain or dismay but anyway you can use the wheel to
give yourself stupid things to do or experience i've done this quite a few times but i've used
a third-party wheel i've never actually added the wheel component as a browser source onto my stream
using streamlabs obs in this video i'm going to show you how to do that these things are highly
customizable you can add the categories you can add as many or as few options as you want on the
wheel you change the colors the size like the thinness of the lines that go around the wheel
if you find this useful please give it a thumbs up i'd love it if you do that also if you want
to subscribe by all means do so got any questions at all check me out at twitch.tv or slash machine
dana or even just join the discord in the description let's go okay so first thing you're
going to need to do here visit streamlabs.com this is regardless of whether or not you're adding this
streamlabs obs or obs studio or expert or whatever you do need to visit this is to configure the
wheel itself i'm gonna click on widgets if you can't find it just do a search for widgets because
sometimes they mess around with the layouts click on spin wheel and here it is kind of the
stuff to configure it we'll go into all these details and make a really fun wheel now just
as a way of example but the standard one looks a little bit like like that it's a bit boring to be
honest there's a there's a button just here you can't really see it because the camera just to
the right here but you literally click this wheel and it will spin the wheel and then there's like
a message that appears okay that's it that's the wheel congratulations you've won a water bottle
so today we're gonna be basically customizing this going through all the different options here so
you can add this as a browser source using the copy widget url here you're able to paste this
into any other software but within streamlabs obs this is kind of built in as a widget integrated
with it and i'll show both methods within this video first of all i'm not liking the options
here so i'm just going to literally kill all these options these are the options that go on the wheel
themselves so let's start by adding like a like a dildo people might want to win a dildo we'll
add um a hammer some bath water you can't add categories using the add category button oh donut
yeah we'll leave donut on there leftover picking nuggets he doesn't like chicken nuggets so we can
color all of these options we want the dildo to be like pink obviously a hammer we want it to be like
like a brown color maybe yep wonderful the bath water is gonna be i mean skeggy like
urine colored the donut is is is red and and the leftover chicken nuggets are also like
kind of beige like that color we've got a lot of beige in there i'm going to change the hammer
color to to like like i don't know purple there you go we've got a purple hammer and all we need
to do is add the sections here and you can add like like two two of them will literally be a 50
50 split so this splits the full wheel into how many sections you've added the sections are just
basically the categories but you can add multiples of them so if you wanted two hammers but only one
dildo would make it happen hoping that out of context would be quite funny so we're gonna add
section add section add section just keep adding the dildos we've got like a decent amount here but
instead of that many dildos i'm gonna add some bath water i'm gonna add some leftover chicken
nuggets another um donut basically it's just we're in dildo heaven here i'm not sure what the
sliders actually are this could be the quantity of something that you win or it might actually be
the waiting in other words you don't necessarily need to add this many sections for instance if i
wanted one two three four five six six dildos i could just add one section with a with a six
well as i've already added the sections i'm just gonna leave it like that i'm just gonna
jumble up the order a little bit there we go so they're nicely spread out now this is a result
template you can customize this text the result is just the variable parameter and then you've
got the static text so you won it's fine it's a little bit boring though but maybe i'll add
congrats um the font you could choose a font for this orbitron a little bit more interesting
and then the font size there's no previewer here normally you get like a previewer but you can
always change the settings at a later stage so don't worry too much about that the font
way is the thickness of the font the label text height and the label text width this just defines
what the text actually looks like on the wheel like how tracked the text is the result color
and the border color so the text colour here is the colour of the actual text on the wheel and
then the result colour and the border colour of the result these are the text when you when the
pop-up appears to say what you've won this is what the text looks like i'm going to with pink and
black for the results but i'm going to go white for the inner text because white feels like it
contrasts pretty well with most of those maybe not the yellow but we'll see you can then choose
the speed of the wheel i'm just gonna speed it up a little bit and then the slow down rate so
that's the rate at which it slows down towards the end we'll just make it a little bit more prolonged
this time out it's pretty straightforward if you set it to zero the wheel will be shown
at all times you're having to control whether or not it's visible with the browser source
by clicking the eyeball on streamlabs obs or obs studio or whatever to actually show or not
whereas this here is like a kind of a soft way of showing it whereby for instance after i don't know
seven seconds the wheel will disappear i'm just gonna leave it to zero for now because then i
can manually turn on the wheel using the source perhaps with a stream deck or something like that
we've then got the option to make a ticker i think that's pretty boring this is just the image that
shows like where they've won like it's the pointer okay this is the pointer i'm gonna change media
i've carefully curated a pointer that is suitable for this particular wheel that's the
one that we're going to use select eggplant this ticker size just defines how big you want the um
picker to be i think in my case we're probably down here somewhere ticker tone i just want to
talk about this this is actually the sound effect that plays this is an ogg file but it can play
like mp3 files and this is a url so cdn stands for content delivery network cdns are basically
just servers uh for instance amazon web server google servers and so on they are content delivery
networks so you'll see cdn wherever you see high volumes of assets that are delivered to the web
so there's obviously a streamlabs cdm service i don't know what they're using for their cdm
you can upload i think a ticker tone onto streamlabs servers but here to be honest there's
loads of other ways you can do this okay so now we need to locate a sound file a hosted sound
file now if you've got a way of hosting mp3 sound files i'm linking directly to the dot mp3 and you
can do that or the dot ogg but there are loads of sources already out there i use myinstance.com and
this has got loads of sound bites for instance like my all-time favorite sound bite which is
just beautiful i can now click on this if i want i can download the mp3 if i want to host it add it
to like favorites and all that kind of stuff now we've got the option here to copy the url for it
but this is an iframe which contains a url if we just get rid of the iframe information and
copy to the embed information we see that there's an embedded information here but this still isn't
good enough really to paste in here because it's still copying essentially like a widget we don't
want a widget copy here we just want the mp3 hosted file what i'm going to do is go back to
the main page for this i'm going to right click and go into page source page sure shows me all
the code information including any assets on the web page cutting sounds that have been used and
wherever they are hosted i can now do control f on the keyboard and do a search for mp3 and
i can see here that there is the mp3 posted link so this is my instance dot com forward slash media
sounds forward slash and then the sheep scream dot mp3 that to me looks more like a direct link to a
file we'll just copy that url and paste it in a browser and there it is none of the mess none of
the website this is purely just the sound effect i think that will work but i'm going to just
paste that in here as well now the thing to bear in mind with this ticker ideally it wants to be
a really short noise because it loops itself when it spins the wheel like a click click click click
click and then as it slows down it'll go click click click click click so i'm not sure what this
is gonna sound like it might sound pretty funny we'll see you can enable or disable center image
in here it's just defaulted to my twitch logo and you can adjust the center image size i should make
that just a touch bigger can add a border to the center image and then make that chord as well i'll
leave it white and then obviously the width of the border at this point you can enable or disable
a custom css javascript and html if you've got a particular theme that you're using that you want
to apply a theme to you can do it here i'm not going to do that because i'm not a css nerd i'm
going to save those settings there and the default wheel is now changed so the default wheel will
apply all those settings now what i'm just going to do i'll show how to add it to streamlabs obs
in a second but for now let's just check the look and feel of the wheel right so we've got lots of
dildos on there we've got some bath water some donuts leftover chicken nuggets the words are
a little bit long but i'm just going to leave it because i can't be bothered but you might
want to try shortening it to chicken nuggets but i'm relatively happy with how that looks
it's a little bit more on brand it's not as boring we can see as well we've got the uh
the peen actually let's make that bigger i'm just going to adjust the size of this
be more realistic save settings refresh the browser source much better
so now all we have to do is go to the top if we're streaming right now
and quick spin the wheel which is located just here
there you go oh i won a dildo
well that works perfectly now i'm actually just going to show how you add that to streamlabs obs
or as a browser source first of all within streamlabs online just copy the url then
go into streamlabs obs or whatever software it is that you're using you can click add here and if it
streamlabs obs you're using you can simply select the spin wheel add the source build all wheel and
here we can actually tweak some of the settings if you're in streamlabs obs because this is like a
fully integrated service you can make any changes to it if you want such as the categories sections
things like that just click done on that and we can resize it and if we want we can stick it below
me so that will now work but to activate that we still need to make it viewable and then we also
still need to go into here and click on the spin wheel as well i'll just delete that if you want
to add this as a browser source you simply click the plus icon and select browser source instead
we want to add a new browser source we're going to call it picking wheel this time add source
now here we simply want to in the url paste the widget url that we've copied to clipboard you can
adjust width and height and css and all that kind of stuff now you would go through the same process
if you were using xsplit or if you were using like obs studio or whatever click done on that
and we've got the exact same thing
to make the micro adjustments to that and then all you have to do is like create good content
chicken wings there you go how you can add a customized wheel spin wheel family fortunes dildo
chicken nuggets wheel to your stream i'm really keen to see how you guys use this i just want
one last thing okay my wife bought me this for christmas which is there's an actual wheel in
there in this thing and this was the inspiration for the video and they don't look like much but
honestly the carolina reaper one the one on yelp in yellow just here is really really hot like she
made me eat these on stream i've made a digital version of this over to you guys let me know how
you use this don't forget to like subscribe and i will see you on the next vid take care