▲

URL 주소창에서 스네이크 게임 플레이하기

 (demian.ferrei.ro)
5P by GN⁺ 3일전 | ★ favorite | 댓글 1개
  • 사용자는 URL 주소창에서 snake 게임을 즐길 수 있음
  • 키보드의 방향키 또는 WASD로 스네이크를 제어하는 방식임
  • 웹페이지에서 URL이 제대로 보이지 않거나 "안개" 효과로 인해 주소가 흐릿하게 보일 수 있음
  • URL을 직접 조작하며 게임을 플레이하는 독특한 인터페이스 제공임
  • 일반적인 게임 방식과 달리 주소창 활용으로 색다른 체험 제공임

URL 주소창에서 이루어지는 색다른 게임 방식

  • 사용자는 방향키 또는 WASD 키를 사용하여 스네이크를 조작함
  • 게임 화면 대신 브라우저 URL 주소창에서 실제로 게임이 이루어짐
  • 웹페이지의 특성상, 일부 사용자에게는 URL이 제대로 표시되지 않거나 흐릿하게 등장하는 문제가 발생할 수 있음
  • 만약 URL이 정상적으로 보이지 않거나 혼란스럽게 보인다면, 페이지의 URL 주소표시를 확인하거나 새로고침 등의 방법을 시도해야 함
  • 기존의 HTML5 게임과 다르게, 사용자가 URL 영역에서 즉각적인 피드백과 함께 인터랙티브한 게임 경험을 할 수 있음
▲
GN⁺ 3일전  [-]
Hacker News 의견
  • 예전에 비슷한 걸 만든 적이 있음, favicon을 활용했음
    https://franciscouzo.github.io/favisnake/
    • 예전에 favicon으로 2048 게임도 만들었었음
      https://aquova.net/games/2048/
    • 정말 신기하다고 느낌, 레티나 디스플레이일수록 플레이하기 더 어려워짐
  • 정말 멋지다고 생각함, 다만 공백을 표현하는 문자가 내 브라우저에선 좀 이상하게 보임, 마치 폭이 제각각인 사각형들처럼 보임
    유니코드에는 모든 4x2 브라유 점자 패턴(256종류)이 있으니, ⣿ 를 배경으로 쓰고 그 위에 스네이크나 먹이를 음영으로 깎아내는 방법도 고려할 만함
    예시: ⣿⣿⣛⣛⣛⣛⣛⣩⣽⣿⣯⣿⣿⣿
    이렇게 하면 글자 간격이 일정해서 읽기 쉬울 것 같다는 생각이 듦
    • 나도 그걸 고민했었음, 초반에는 확실히 도움이 되겠지만 후반엔 오히려 상황을 더 나쁘게 만들 수도 있을 것 같음
      스네이크가 커질수록 그리드에 더 많이 퍼지고, 결국 더 많은 공백 대체 문자가 눈에 띌 수밖에 없음
      게임이 진행될수록 더 빨라지기 때문에 집중해야 하는 구간에 화면이 더 복잡해지는 건 바람직하지 않다고 생각함
      이 이상한 공백 문제를 제대로 해결할 방법이 있으면 정말 알고 싶음, 다만 페이지 <title> 같은 텍스트 출력에 의존하려고 하진 않음
      참고로 Reddit에 최근 올라온 비슷한 스네이크 게임도 제목에 그리더라
      https://old.reddit.com/r/webdev/…
      당장 고득점을 노린다면 "?"를 클릭해서 URL을 페이지에 표시하는 방식이 제일 나아 보임
  • 반응성이 매우 뛰어나서 놀라웠고, 다시 돌아오자마자 HN으로 깔끔하게 복귀해서 정말 기뻤음
    히스토리도 엉키지 않음, 진짜 기발하다고 느낌
    • history.pushState랑 history.replaceState를 잘 활용한 것 같음
    • 소스코드 보니 URL 업데이트를 제한하는 몇몇 브라우저에서는 백버튼 기능도 차단하는 다른 방법을 써야 하는 것 같음
  • 정말 기발한 아이디어라서 감탄했음
    브라유 점자 패턴을 이용해서 점 정보를 URL로 바꿔서 사용하는 점이 인상적임
    https://github.com/epidemian/snake/blob/master/snake.js
  • 이런 게 있어서 hackernews에 오는 이유가 생김, 하루가 즐거워짐
  • 정말 독특하고 창의적인 아이디어라고 생각함
  • 처음에 어떻게 동작하는지 잘 몰랐던 분들을 위해, 좌측 상단에 작은 시안색 물음표가 있음
    여기에는 설명이 되어 있음

    방향키나 WASD로 URL에서 스네이크를 조작할 수 있음. URL이 잘 안 보이거나 이상하게 보이면 클릭
    추가적으로, 주소창이 충분히 길어야 화면을 볼 수 있으니 창을 넓게 해서 플레이해야 함
    참신한 컨셉이고 잘 동작함

  • 생각보다 난이도가 높음, 스네이크 주변의 빈 점들이 꽤 산만하게 느껴짐
    빈 점들이 없는 방식으로 페이지에 표시하면 어떻게 보일지 궁금함
  • 정말 영리하고 플레이 자체도 충분히 재미있는 게임임
답변달기