Hi Creators!
We’re excited to give you new haptics capabilities via a Studio beta! Haptic effects refer to tactile feedback – such as a buzz or a rumble – used to enhance immersion in a game. During the Studio beta, you can opt into usage of the API via the Beta features tab. We are hoping to use this beta to gather developer feedback – please let us know if you have any thoughts below!
We’re delivering:
- Predefined enum-based haptic effects: We are introducing five out-of-the-box haptic effects for developers to add to their experiences. They will work across all haptic-supported input devices. The five effects we’ll introduce are: Explosion, Collision, UIClick, UIHover, and UINotification.
- Customizable waveform effects: We are giving developers the ability to customize their own waveform haptic effects. This API abstracts away hardware details, so custom waveforms will work across haptic-supported input devices, given hardware limitations.
-
Integrated Gui haptics: A no-code method of integrating haptics into your game UI, via properties
HoverHaptic
andClickHaptic
onImageButtons
andTextButtons
.
Haptic effects currently run locally in Studio (edit, play, and test on a local server). They can’t be used in production experiences during the Studio Beta. We plan to have a client beta soon to allow you to publish experiences. Once we release haptics to client, they will be available on haptic-enabled input devices across mobile phones, Gamepads, and VR controllers.*
*Note: The following combinations of client platforms + input devices do not yet support haptics. We are working to fix these piecewise.
- Android11 and below
- MacOS 15+ with controllers
- Mobile devices with controllers
- PC-VR
Keep reading for details!
How to Enable this Beta
To enable this beta in Roblox Studio, follow these simple steps:
- Open Roblox Studio and navigate to the “File” menu.
- Click on “Beta Features”.
- Enable the “Haptic Effects” option by checking the corresponding checkbox (see screenshot below) and press Save.
- Restart Roblox Studio when prompted.
How to Use the HapticEffect API
We’ll walk you through the basics of how to use the HapticEffect
API in this post. You can find detailed API documentation here.
Get Started with Our Predefined Effects
To cover some common use cases of haptics, we’re providing five predefined effects:
-
UIHover
: Useful for when a player browses over an object (often a UI object) without triggering its action. -
UIClick
: Useful for when a player has selected an object (often a UI object) with the intention of triggering its action. -
UINotification
: Useful for when there is an inbound message that should draw the player’s attention away from their current gameplay. -
GameplayExplosion
: Useful to signify a large-scale physics event that triggers impact across a large portion of a given scene. -
GameplayCollision
: Useful to signify a clear and purposeful impact between objects.
These can be accessed by setting Enum.HapticEffectType
to their corresponding number. Here’s an example:
Click here to view the Code Block
-- create a predefined effect --
local effectPredefined = Instance.new("HapticEffect")
effectPredefined.Parent = workspace
effectPredefined.Type = Enum.HapticEffectType.GameplayExplosion
effectPredefined:Play()
If you want to try out these effects, check out our sample placefile, HapticWorld!
HapticWorld.rbxl (187.2 KB)
Make Your Own Custom Waveforms
It’s easy to create your own custom haptic effects as well! Here’s an example where we create a custom effect that gradually intensifies.
Click here to view the Code Block
-- First, define the custom curve we want to use.
local rampUpWaveform = {
FloatCurveKey.new(0, 0.3),
FloatCurveKey.new(100, 0.4),
FloatCurveKey.new(300, 0.8),
FloatCurveKey.new(400, 1.0)
}
local effectCustom = Instance.new("HapticEffect")
-- Next, set the effect type to Custom so we can define our own waveform.
effectCustom.Type = Enum.HapticEffectType.Custom
-- Then, set the keys of the waveform. This errors if Type ~= "Custom".
effectCustom:SetWaveformKeys(rampUpWaveform)
-- Optionally, we can set the position of impact and radius. Here, we have the impact hitting the right side of the input device (X=1).
effectCustom.Position = Vector3.new(1, 0, 0)
effectCustom.Radius = .8
effectCustom.Parent = workspace
effectCustom:Play()
Example
Our sample placefile HapticWorld uses multiple haptic effects. The goal of this game is to dodge exploding balls that will fall from the sky. Check out our placefile if you want to take a look under the hood!
HapticWorld.rbxl (187.2 KB)
If you’re looking for a visual way to design custom waveforms, you can leverage the existing Number Sequence Editor to draw line segments! This makes it easy to create and fine-tune custom haptic effects. To set this up in Studio, follow these steps:
- Create a
HapticEffect
Instance and name it “CustomHapticEffectInstance”. - Change the “CustomHapticEffectInstance” type to Custom.
- Create a NumberSequence attribute on the “CustomHapticEffectInstance” instance and name it “WaveformCurve”.
- Create a Number attribute on the “CustomHapticEffectInstance” instance and name it “WaveformLengthMS”.
- Use NumberSequence editor to generate a waveform curve.
- Use “WaveformLengthMS” to specify the duration (in milliseconds) of the haptic effect.
- Create a script under the “CustomHapticEffectInstance” instance and insert the following code:
Click here to view the Code Block
-- Converts a NumberSequence attribute to a FloatCurve suitable for custom waveforms in HapticEffect.
local hapticInstance = script.Parent
local waveformCurve = hapticInstance:GetAttribute("WaveformCurve") -- a NumberSequence attribute to represent waveform
local waveformCurveLengthMS = hapticInstance:GetAttribute("WaveformLengthMS") -- a number attribute to represent total length of the waveform in ms
if waveformCurve and waveformCurveLengthMS then
local floatCurve = {}
for i, keypoint in waveformCurve.Keypoints do
table.insert(floatCurve, FloatCurveKey.new(keypoint.Time * waveformCurveLengthMS, keypoint.Value))
end
hapticInstance.Type = Enum.HapticEffectType.Custom
hapticInstance:SetWaveformKeys(floatCurve)
end
Integrate Haptics in Your UI with No Code
For your UI-based haptic use cases, you can opt for a no-code solution by using new properties HoverHaptic and ClickHaptic, available on ImageButtons and TextButtons. See documentation here.
To get started, you first need to create HapticEffect instances in your Workspace.
- Create a HapticEffect instance, name it as “ClickHapticEffectInstance”
- Go to the properties panel, change the Type to UIClick
- Create another HapticEffect instance, name it as “HoverHapticEffectInstance”
- Go to the properties panel, change the Type to UIHover
Once those are instantiated, you can apply HapticEffects to your Gui!
- Create a TextButton or ImageButton
- Go to the properties panel, navigate to the Haptic category
- Click the 2nd column of ClickHapticEffect properties
- Select the “ClickHapticEffectInstance” instance
- Click the 2nd column of HoverHapticEffect properties
- Select the “HoverHapticEffectInstance” instance
Now, at run-time, if you hover over or click the button, the designated HapticEffect will play accordingly!
FAQ
Click here to view the FAQ!
I currently use HapticService. Will my experience be affected when Haptic Effects launches in client?
TL;DR: your experience will not be affected.
We strongly recommend all Creators who are using HapticService today to try out our new HapticEffect API, since it addresses many of the bugs / inconsistencies reported about HapticService. However, we will continue to maintain HapticService for Creators who have implemented this within their experiences; we will not update HapticService and instead address inbound reports through HapticEffect.
How many haptic effects should I have within my experience?
We recommend having less than 100 simultaneous haptic effects to maintain performance quality.
Made with love
Our new and improved haptics were made possible thanks to @RickleSandwich, @LittleEel0621, @cyrian_sun, and @MetaVars.
We can’t wait to hear your thoughts on our new haptics and see all the amazing things you create! Let us know about your experience and if you encounter any issues!