iOS Haptics-tester

Hva er haptisk tilbakemelding?

Haptisk tilbakemelding er en taktil respons — en liten vibrasjon eller trykk — som en enhet produserer for å bekrefte en handling eller få oppmerksomhet. På smarttelefoner genereres det av en liten motor (på iPhones, Apples "Taptic Engine") som skaper korte, presist tidsbestemte pulser. I motsetning til en lang summende vibrasjon, er moderne haptics knapphet og subtil, designet til å føles som et fysisk klikk i stedet for en alarm.

I native iOS-apper bruker utviklere UIFeedbackGenerator API for å spille av ulike haptiske mønstre som et lett trykk, en "suksess" dobbelt-trykk, eller en "feil" trippel-trykk. I lang tid hadde webplattformen på iOS Safari ingen ekvivalent — navigator.vibrate() ble ganske enkelt ignorert på iPhones. ios-haptics-biblioteket utnytter en bieffekt av <input type="checkbox" switch>-elementet (introdusert i Safari 17.4): å veksle den bryteren utløser systemets haptiske motor, som tillater websider å spille av korte haptiske mønstre fra JavaScript.

Verktøybeskrivelse

iOS Haptics Tester lar deg utløse haptiske tilbakemeldingsmønstre direkte fra nettleseren din for å verifisere om enheten og OS-versjonen din støtter dem. Det eksponerer de tre mønstre som leveres av ios-haptics-biblioteket — et enkelt trykk, en "bekreftelse" (to raske trykk), og en "feil" (tre raske trykk) — og inkluderer også en knapp som kaller standard navigator.vibrate() API som fallback for Android og andre enheter.

Eksempler

Funksjoner

• Enkel-trykk-knapper for enkelt, bekreftelse og feil haptiske mønstre
• Automatisk deteksjon av haptisk støtte på gjeldende enhet
• Innebygd fallback-test for standard navigator.vibrate() Web API
• Live hendelseslogg med tidsstempler for hvert utløst mønster
• Klare statusbannere som forklarer iOS-versjonkompatibilitet

Brukstilfeller

• Webutviklere som verifiserer at haptisk tilbakemelding fungerer på en ekte iPhone før de integrerer ios-haptics i sitt eget nettsted eller PWA
• QA-ingeniører som sjekker hvordan de samme mønstre føles på ulike enheter, OS-versjoner og nettlesere
• Nysgjerrige brukere som ønsker å oppleve forskjellen mellom iOS-stil "Taptic"-tilbakemelding og den lengre Android navigator.vibrate()-pulsen

Hvordan det fungerer

På iOS Safari oppretter verktøyet dynamisk en skjult <input type="checkbox" switch>, veksler den, og fjerner den deretter fra DOM. Det å veksle den native bryteren er det som utløser Taptic Engine — det finnes ingen offentlig Web API som gjør dette direkte. "Bekreftelse"- og "feil"-mønstre gjentar ganske enkelt vekslingen to eller tre ganger i rask rekkefølge.

På enheter som ikke støtter iOS-switch-trikset, faller biblioteket tilbake til navigator.vibrate(), som er mye støttet på Android-nettlesere. "Test navigator.vibrate()"-knappen i dette verktøyet kaller den API-en direkte slik at du kan sammenligne de to mekanismene.

Alternativer forklart

• Enkelt haptisk trykk — Spiller av ett kort trykk. Best brukt til å bekrefte en liten interaksjon som en veksler eller et vellykket skjemafelt.
• Bekreftelse (to raske trykk) — Spiller av to raske trykk. Ideelt for "lagret", "sendt", eller andre positive bekreftelser.
• Feil (tre raske trykk) — Spiller av tre raske trykk. Bruk for å signalisere valideringsfeil eller destruktive feil.
• Test navigator.vibrate() — Kaller Web Vibration API med en 200 ms varighet. Nyttig for å bekrefte ikke-iOS-enhetsstøtte og for å sammenligne følelsen mot iOS-mønstre.
• Tøm logg — Fjerner alle oppføringer fra hendelsesloggen.

Begrensninger

• Programmatisk iOS haptics fungerer bare på iOS 17.4 gjennom 26.4. Apple patched den underliggende oppførselen i iOS 26.5, så å kalle disse mønstre fra JavaScript utløser ikke lenger Taptic Engine på de nyeste iOS-versjonene. Direkte brukerinteraksjon med en ekte <input type="checkbox" switch> fungerer fortsatt.
• iOS Safari ignorerer navigator.vibrate() på praktisk talt alle versjoner, så fallback-knappen vil virke stille på iPhones.
• Desktop-nettlesere kan ikke produsere haptisk tilbakemelding; knappene vil kjøre, men du vil ikke føle noe.
• Noen Android-nettlesere krever at siden er i forgrunnen og en brukergest før navigator.vibrate() vil utløses.
• Haptisk tilbakemelding kan også være deaktivert i enhetens systeminnstillinger (f.eks. Innstillinger → Lyder og haptics → Systemhaptics på iOS).

Tips

• Test på en ekte enhet, ikke en simulator eller emulator — virtuelle enheter har ikke en Taptic Engine.
• Hvis ingenting skjer på iPhone, sjekk at Systemhaptics er aktivert i Innstillinger og at Stille modus ikke undertrykker dem på eldre iOS-versjoner.
• Bruk Bekreftelse-mønsteret sparsomt; overbruk av raske haptics blir raskt irriterende.
• Kombiner haptics med visuell tilbakemelding — en haptic alene er sjelden nok til å kommunisere tilstand til brukeren.

Vanlige spørsmål

Hvorfor føler jeg ingenting på iPhone-en min? Du er sannsynligvis på iOS 26.5 eller nyere, hvor Apple patched teknikken som brukes av dette biblioteket. Prøv en enhet som kjører iOS 17.4–26.4, eller sjekk at Systemhaptics er aktivert i Innstillinger.

Hvorfor fungerer ikke navigator.vibrate() på iPhone? Apple har aldri implementert Web Vibration API i iOS Safari. Det finnes for øyeblikket ingen standardbasert måte å utløse vibrasjon på iOS fra en webside.

Er det trygt å bruke i produksjon? Biblioteket er lite og bieffektfritt, men fordi det er avhengig av en særegenhet ved ett spesifikt HTML-element, kan det brytes i enhver fremtidig iOS-oppdatering — som det allerede gjorde i iOS 26.5. Behandl alltid haptisk tilbakemelding som en progressiv forbedring, aldri et krav.

Fungerer det inne i en PWA eller "Legg til startskjerm"-app? Ja, på støttede iOS-versjoner fungerer den samme teknikken i installerte webapper akkurat som den gjør i Safari.