ๆญฃๅœจๅŠ ่ฝฝ่ง†้ข‘...

่ง†้ข‘ๅŠ ่ฝฝๅคฑ่ดฅ

It's time to bring Haptics to the web ๐Ÿซจ Create custom tactile patterns with strengths + durations for your web interactions. Make your app feel as good as it looks โœจ โ†’

2,149,159 ๆฌก่ง‚็œ‹ โ€ข 7 ไธชๆœˆๅ‰ โ€ขvia X (Twitter)

43 ๆก่ฏ„่ฎบ

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

๐š—๐š™๐š– ๐š’ ๐š ๐šŽ๐š‹-๐š‘๐šŠ๐š™๐š๐š’๐šŒ๐šœ works both on iOS and Android ๐Ÿ“ณ huge thanks to @alexvanderzon for jamming on this with me! ๐Ÿค

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

now available as a skill

jhey ส•โ€ขแดฅโ€ขส” ็š„ๅคดๅƒ
jhey ส•โ€ขแดฅโ€ขส”7 ไธชๆœˆๅ‰

ha, nice โ€“ never considered building an abstraction for this one as it always felt like apple could pull the hack at any moment ๐Ÿ˜… made some demos around this for confs in the past where i'd leverage gsap.ticker for the .click() to get different "intensity rates"

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

essentially what this does. has the fallback for navigator.vibrate() so if the workaround ever gets pulled there's still a chance it'll still be functional down the line

jhey ส•โ€ขแดฅโ€ขส” ็š„ๅคดๅƒ
jhey ส•โ€ขแดฅโ€ขส”7 ไธชๆœˆๅ‰

in an ideal world we would just have cross-browser navigator.vibrate() ๐Ÿ™‡โ€โ™‚๏ธ for now, timeline those label clicks ๐Ÿ˜… p.s i like the qr code touch, that's nice ux

Parth Patel ็š„ๅคดๅƒ
Parth Patel7 ไธชๆœˆๅ‰

neat - similar to tactus?

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

other packages don't support intensity + duration. i've aimed to get web-haptics as close to iOS native vibes as possible.

Parth Patel ็š„ๅคดๅƒ
Parth Patel7 ไธชๆœˆๅ‰

cant wait to try

SIP ็š„ๅคดๅƒ
SIP7 ไธชๆœˆๅ‰

u will never tempt me to post a web app

Alex Greenland ็š„ๅคดๅƒ
Alex Greenland7 ไธชๆœˆๅ‰

@AnaArsonist how much haptic did you use? yes.

pugson ็š„ๅคดๅƒ
pugson7 ไธชๆœˆๅ‰

can u make a bridge between desktop editor + mobile website to preview the pattern on your phone instantly

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

good idea. the editor should be mobile friendly but iโ€™ll look into this ๐Ÿค

pugson ็š„ๅคดๅƒ
pugson7 ไธชๆœˆๅ‰

websockets

Andrew Ambrosino ็š„ๅคดๅƒ
Andrew Ambrosino7 ไธชๆœˆๅ‰

@raunofreiberg any chance of making this work with the Mac trackpad like snapping does in

Benji Taylor ็š„ๅคดๅƒ
Benji Taylor7 ไธชๆœˆๅ‰

goated

Raffi ็š„ๅคดๅƒ
Raffi7 ไธชๆœˆๅ‰

Real ones will remember the 48 hours that SIP had this exclusive alpha

Jake Dow-Smith ็š„ๅคดๅƒ
Jake Dow-Smith7 ไธชๆœˆๅ‰

priorities

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

๐Ÿคฏ

Nayli Naza ็š„ๅคดๅƒ
Nayli Naza7 ไธชๆœˆๅ‰

itโ€™s so good @lochieaxon !! tried it for !!!

Aiden Bai ็š„ๅคดๅƒ
Aiden Bai7 ไธชๆœˆๅ‰

banger

Joe Bell ็š„ๅคดๅƒ
Joe Bell7 ไธชๆœˆๅ‰

Canโ€™t believe this is free Truly top notch stuff ๐Ÿ”ฅ

Andreas Storm ็š„ๅคดๅƒ
Andreas Storm7 ไธชๆœˆๅ‰

๐Ÿ”ฅ

James Clements ็š„ๅคดๅƒ
James Clements7 ไธชๆœˆๅ‰

the generational run continues

Gabriel Foulon ็š„ๅคดๅƒ
Gabriel Foulon7 ไธชๆœˆๅ‰

I vibe coded pretty much the exact same thing a few months ago, but Iโ€™m really happy to see a much cleaner version haha Web mobile deserves a better experience!

Stani ็š„ๅคดๅƒ
Stani7 ไธชๆœˆๅ‰

Huge

Miguel Piedrafita โœจ ็š„ๅคดๅƒ
Miguel Piedrafita โœจ7 ไธชๆœˆๅ‰

@pacocoursey no wayyyyy lfg

Ryan McLeod ็š„ๅคดๅƒ
Ryan McLeod7 ไธชๆœˆๅ‰

This is a lovely editor

60fps ็š„ๅคดๅƒ
60fps7 ไธชๆœˆๅ‰

โ™ฅ๏ธ

pugson ็š„ๅคดๅƒ
pugson7 ไธชๆœˆๅ‰

hell yeah

Austin Valleskey ็š„ๅคดๅƒ
Austin Valleskey7 ไธชๆœˆๅ‰

Such a fun website, love this ๐Ÿซถ

Sadi Moodi ็š„ๅคดๅƒ
Sadi Moodi7 ไธชๆœˆๅ‰

Web haptics is such an underrated UX layer. Your approach with intensity + duration is key - most libraries skip this. Quick tip: map iOS HapticFeedbackStyle to WebHapticsPattern for native-feeling feedback. Would love to see this in a React component library!

rauno ็š„ๅคดๅƒ
rauno7 ไธชๆœˆๅ‰

yesssss

Pran ็š„ๅคดๅƒ
Pran7 ไธชๆœˆๅ‰

๐Ÿ”ฅ

ana howard ็š„ๅคดๅƒ
ana howard7 ไธชๆœˆๅ‰

holy shit

Ben South ็š„ๅคดๅƒ
Ben South7 ไธชๆœˆๅ‰

LFG

joshpuckett ็š„ๅคดๅƒ
joshpuckett7 ไธชๆœˆๅ‰

feels so good!

Damian ็š„ๅคดๅƒ
Damian7 ไธชๆœˆๅ‰

Does not seem to work on android though ?

Julian ็š„ๅคดๅƒ
Julian7 ไธชๆœˆๅ‰

What API does it use? I only know of the checkbox hack for mobile safari...

ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie ็š„ๅคดๅƒ
ุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœุœlochie7 ไธชๆœˆๅ‰

it's using that workaround + navigator.vibrate() where possible. I spent the time replicating the same feeling as native haptics and this package offers an API abstraction similar to native handling of haptics.

Sam Saccone ็š„ๅคดๅƒ
Sam Saccone7 ไธชๆœˆๅ‰

joyful. well done

Souvik Biswas ็š„ๅคดๅƒ
Souvik Biswas7 ไธชๆœˆๅ‰

It supposed to work on Android Chrome? Doesn't seem to get it work on Android but works like a charm on iOS. So cool!

matt ็š„ๅคดๅƒ
matt7 ไธชๆœˆๅ‰

@_joerl dude

Quentin Merabet ็š„ๅคดๅƒ
Quentin Merabet7 ไธชๆœˆๅ‰

Wait last time I checked it wasnโ€™t supported by Apple โ€“ even in PWA. Is this new?

็›ธๅ…ณ่ง†้ข‘