사이먼 게임(기억력 게임) with PWA

Let's Play Simon!

https://mooky1007.github.io/simon_game/

Simon Game

 

PWA를 적용해 보았다.

 

[38JS] #17 사이먼 게임 만들기에서 만들었던

 

 

요런 디자인을 좀 더 개선하고, 주변인의 피드백을 받아서

UI를 좀더 개선하고 이런저런 기능을 조금 더 추가해봤다.

 

타이틀도 넣고.. UI도 바꾸고 진동도 넣었다.

아 이슈가 하나 있었는데 클릭시에 진동을 넣고 싶어서 navigation 객체의 viverator? 를 사용했었는데

이게 아이폰계열에서 지원이 안되서 따로 예외 처리를 해줘야 하는듯..

 

이건 또 처음알았네..

 

그리고 사파리쪽에선 button::active css가 적용이 안되서 이래저래 바꿨는데

문제 출제중에도 계속 오류가 있었어가지구 button에 이벤트리스너로 터치 스타트 터치 엔드로 색넣는것도 넣었다가..

뭔가 실제로 버튼이 동작을 안했어도 색이 들어와서 게임성이 조금 떨어지는것 같아서 그냥 클릭 이벤트로 통일했다.

 

음.. 그리고 언제 문제가 끝난질 모르겠다고 하는 피드백이 많아서,

문제가 끝나면 게임스크린 중앙에 Go! 라는 텍스트를 넣어주었는데,

이것도 뭔가 Go!가 사라져야 시작을 해야될거같다는 이야기가 있어서

최초 터치 이후에 숨기는걸 생각해보는데.. 게임쪽 UX는 너무 어려운것 같다.

 

베스트 스코어를 로컬스토리지를 이용해서 저장하게끔 설정했다.

 

하는김에 최근에 관심있게 보고있던 PWA를 적용해보았다.

주소창이 없는거 말고는 글쎄..

 

그리고 플레이콘솔 계정 있는김에 등록도 해보았다ㅋㅋㅋ

뭐 하루짜리였지만 이래저래 재밌었던 작업이였다.

 

아 이게 토이프로젝트지~ ㅎㅎ

 

물론 나는 레벨 8이상은 죽어도 못깰꺼같다.. 기억력 개똥..

아참 그리고 티스토리에서 알게된 텐핑 광고도 넣어봤다.

 

그럼 끝!