트위터 타임 라인에서 움직이는 브라우저 게임을 JS에서 만들었습니다.
TL; DR
『Alien Abduction』
여기에서 재생할 수 있습니다.
htps : // 아엔.ぁ 이네 s. 코m/
화면을 탭하면 미니 게임 녀석입니다.
트윗에 포함
무려 트윗에 묻을 수 있었습니다!
UFO를 조작하여 동물을 납치하는 게임을 만들었습니다! PC라면 타임라인에서 직접 플레이할 수 있습니다. ↓ Alien Abduction htps // t. 코 / 7 쿠 tPXT · Gj #phina_js
무려 트윗에 묻을 수 있었습니다!
UFO를 조작하여 동물을 납치하는 게임을 만들었습니다! PC라면 타임라인에서 직접 플레이할 수 있습니다. ↓ Alien Abduction htps // t. 코 / 7 쿠 tPXT · Gj #phina_js
(↑꼭 리트윗해주세요!)
Twitter의 OGP의 카드 타입에, player라고 하는 것이 있어, 오리지날의 음성·동영상 플레이어를 임베드할 수 있습니다.
이것을 사용하여 트윗하면 트윗에 iframe으로 마운트되기 때문에 캔버스의 콘텐츠도 그대로 움직이는 것 같습니다.
플레이어 카드는 다른 카드 유형과 약간 다른 절차를 갖습니다.
- OGP 설정
- HTTPS 대응
- 트위터에 심사를 내고 승인을 받는다
신청이나 표시 확인은 2018년 4월 25일 으로부터 실시합니다.
심사는 도메인별로 이루어졌으며, 자신의 경우 3일 만에 승인되었습니다.
<meta name="twitter:card" content="player">
<meta name="twitter:player" content="https://alien.laineus.com/fullscreen/">
〜略〜
공유 원본 페이지는 무엇이든 될 수 있으며 twitter:player
에 지정된 페이지는 트윗에 포함됩니다.
심사 대상의 도메인도 twitter:player
로 지정하는 편입니다.
콘텐츠 자체에 대해서도 크기가 창에 맞아야 하는 등 몇 가지 규칙이 있는 것 같습니다.
자세한 것은 아래의 기사를 참고로.
Twitter가 말한다! ? 플레이어 카드를 만드는 방법 - Voicy Tech Blog
CardValidator
심사 자체는 감각적으로 상당히 느슨하게 느껴졌다.
그러나 트위터 카드의 정책적으로 괜찮은지 의심스럽기 때문에 삭제될 수도 있습니다.
시도 할 때는 자기 책임으로 부탁드립니다.
2020/07/10 덧붙여: 아마 현재는 심사가 필요하지 않은 것 같습니다. → 『ㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜ 하테나 bぉg. 코m/엔트리/2017/05/14/133539』
게임 개발용 JS 라이브러리 「Phina.js」
게임 개발에 사용한 라이브러리를 소개합니다.
공식 사이트
비밀로 유지하고 싶었지만 사실 Twitter에 웹 페이지를 삽입 할 수 있습니다.
JavaScript로 Canvas 게임을 만들기 위한 일본 라이브러리입니다.
게임 진행이나 묘화 주위의 관리와 같은 기반이 되는 부분이나, 당 판정 등 다양한 게임에 범용적으로 사용할 수 있는 기능 등이 제공됩니다.
소스 코드
GitHub
ht tp // p 병아리 js. 코m/
BGM
BGM은, 이쪽의 브라우저로 동작하는 작곡 소프트로 빨리 만들었습니다.
정말은 Cubase라고 하는 Windows용의 제대로 된 작곡 소프트를 가지고 있습니다만, 최근 리눅스 이외의 OS를 사용하고 싶지 않아서 ↑를 사용했습니다.
Reference
이 문제에 관하여(트위터 타임 라인에서 움직이는 브라우저 게임을 JS에서 만들었습니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/laineus/items/a71d8fa4efae39119ef1텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)