Kso App Advent Calendar 2019 7일째 보도다.

개시하다

나는 가위바위보가 약하다.1대 1의 신경전은 더욱 그렇다.
하지만 슬프게도 세상에는 가위바위보가 결정하는 일이 많다.
텔레비전 채널권, 급식 남은 디저트, 욕실 청소
인생에서 결정하는 일은 항상 가위바위보를 해서 진다.
이대로 가면 인생은 계속 실패할 거야.
다음에 하고 싶으면 지는 거야.
자동 가위바위보 로봇 팔이 있었으면 좋겠다.
그래서 나는 자동으로 손을 뻗는 프로그램을 만들기로 결정했다.
※ AI, 기계학습에서 승리하는 것과 같은 기술 수준이 높은 일은 하지 않습니다.사전에 양해해 주십시오.

만든 물건

가위바위보!
https://okmr-d.github.io/shake-janken/
모바일 스마트폰과 태블릿PC를 통해 랜덤으로 가위바위보를 할 수 있는 웹 애플리케이션이다.
그렇다면 다음 단계에 어떤 조치를 취해야 할지 망설일 필요가 없다.
태블릿PC를 손에 쥐는 것은 마치 자신의 손과 같다.상대에게 위화감을 주지 않고 열심히 경기할 수 있다.
가위바위보 할 친구가 없어도 괜찮아요.스마트폰을 한 손에 들고 혼자서도 가위바위보를 할 수 있다.이것은 시간을 보내는 좋은 방법이다.
단말기의 가속도 센서를 사용하기 위해서는 해당 스마트폰이나 태블릿PC에서 찾아보세요.홈 화면에 추가하여 모든 화면에서 놀 수 있습니다.
【주의사항】
・터미널을 흔들 때 떨어뜨리거나 손상되지 않도록 주의하세요.망가져도 책임 못 져.
・정말 중요한 장소에서 이 앱을 사용하는 것을 추천하지 않습니다.써도 져도 무책임하다.

공을 들이다

투명 배경

이 그림을 배경으로 사용하면 사람에 따라 터미널도 통과할 수 있다.

휘두르는 것이 쉬워졌다

스윙을 할 때 한 손이 연속으로 뻗은 경우 화면에 변화가 없으면 흔들리기 어려워 스윙 타이밍이 한순간에 배경색을 바꾼다.

기술 해설

검측 설비가 차였다

웹 브라우저에서 모양 제스처를 감지하려면 DeviceMotionEvent를 사용하여 장치의 가속도 정보를 얻어 계산하고 판정합니다.
모양 결정 예

const threshold = 5 // 判定のしきい値
const last = { x: null, y: null, z: null } // 前の時点のデータ

const deviceMotionHandler = (event) => {
  // X、Y、Z 上のデバイスの加速度を重力度込みで与えるオブジェクト(m/s2)
  const current = event.accelerationIncludingGravity

  // 初回だけ
  if (last.x === null && last.y === null && last.z === null) {
    last.x = current.x
    last.y = current.y
    last.z = current.z
    return
  }

  // 現時点の座標と前の時点の座標の差分
  const deltaX = Math.abs(last.x - current.x)
  const deltaY = Math.abs(last.y - current.y)
  const deltaZ = Math.abs(last.z - current.z)

  // シェイク判定（差分がしきい値を超えた）
  if (deltaX > threshold || deltaY > threshold || deltaZ > threshold) {
    // シェイクされた！！！
  }

  // 現時点の座標を更新する
  last.x = current.x
  last.y = current.y
  last.z = current.z
}

window.addEventListener('devicemotion', deviceMotionHandler, false)

iOS 12라면 사용자의 설정을 변경하거나 iOS 13에서 해석을 받아야 하기 때문에 부기에 요약한다.
→ iOS 13+ Safari에서 devicemotion 및 deviceorientation 이벤트에 대한 라이센스를 획득하는 방법

소스 코드

끝말

사회에 도움이 되지 않는 쓰레기 애플리케이션을 만들어야 하는데 가위바위보 약자를 돕는 애플리케이션이 생겼다.
Kso App Advent Calendar가 올해도 인기가 많네요.내일을 기대하다.
가능하면 작년 작품을 보세요.
→ '알림이 멈췄다'는 체험을 할 수 있는 앱을 만들었어요.