Codewords

코드워드(Codewords): 웹상의 실시간 멀티플레이어 보드게임입니다.

저는 엄청난 보드게임 팬이자 수집가입니다. 또한 저는 UX 디자이너이자 게임 디자이너입니다. 나는 이러한 것들을 혼합하여 디지털 보드게임을 만들 수 있겠다는 생각을 한동안 생각해 왔습니다.

내 생각은 큰 화면(컴퓨터 모니터 또는 더 나은 경우 거실 TV)을 모든 플레이어가 공유하는 공통 보드로 작동하고 플레이어의 휴대폰을 게임의 도구이자 방법으로 사용할 수 있다는 것이었습니다. 상호 작용.

앞서 말했듯이 저는 보드게임을 좋아하고 보드게임이 허용하는 사회적 상호작용도 좋아합니다. 나는 또한 그들이 가지고 있는 물리적 구성 요소를 좋아합니다. 하지만 나는 그들이 어느 집에서나 큰 공간을 차지한다는 것을 이해합니다. 그리고 구하기도 힘들고, 장소로 옮기기도 귀찮은 경우가 많습니다.

그래서 이러한 디지털 보드게임은 누군가가 아직 구매할 수 없는 게임에 대한 재미있는 대안이 될 수도 있고, 인터넷이 연결된 곳이면 어디에서나 플레이할 수 있는 게임이 될 수도 있겠다는 생각이 들었습니다.

Ludoratory 만들기

제가 갖고 있는 또 다른 열정은 코딩입니다. 저는 아주 어렸을 때부터 BASIC을 가지고 장난을 쳤고, 지금은 디자이너로서 항상 웹 코딩에 대해 더 많이 이해하려고 노력하고 있습니다.

지난 몇 달 동안 저는 Vue 및 React와 같은 일부 자바스크립트 프레임워크를 연구해 왔으며 이러한 게임을 현실로 만들 수 있다고 결심했습니다.

이를 위해 저는 “Ludoratory” 브랜드로 일련의 게임을 시작하고 있습니다. 이 게임들은 웹 개발과 게임 디자인을 실험하게 될 것입니다. 모든 게임은 무료로 플레이할 수 있고, 광고나 추적이 없으며, 오픈 소스 코드를 사용합니다. 다른 사람들을 위해 재미있는 것을 만들면서 그들과 함께 배울 수 있기를 바랍니다.

코드워드

Vlaada Chvátil의 코드네임은 Ludoratory의 첫 번째 목표였습니다.

아직 플레이해 보지 않으셨다면, 가능한 한 빨리 복사본을 구해 보시기를 권합니다. 왜냐하면 이 게임은 놀라운 게임이기 때문입니다.

제가 생각하는 Codewords는 보드게임의 실시간 멀티플레이어 버전으로, 큰 화면에 모든 단어가 담겨 있고 휴대폰이 코드마스터의 지도로 사용됩니다. 원래 게임에서 약간의 변경 사항이 있으므로(저는 우리가 플레이하는 하우스 규칙을 사용하여 게임을 만들었습니다) 여기에 규칙을 설명하는 짧은 글을 썼습니다.

크레딧

저는 프레임워크, 라이브러리 및 리소스의 도움을 받아 게임의 디자인과 코딩을 만들었습니다.

• Vue-CLI를 사용하고 PWA를 지원하는 프런트 엔드용 Vue.js입니다.
• 실시간 업데이트를 관리하는 Firebase입니다.
• 각각의 새로운 게임에 대한 QRCode를 생성하기 위한 xkeshi의 Vue QRCode.
• Javisperez가 제작한 Vue Translate를 사용하면 게임을 영어와 포르투갈어로 모두 플레이할 수 있습니다.
• 배경 이미지로 Malik Earnest가 제작한 그림자가 잘 보이지 않는 남성 얼굴 사진입니다.
• Codrops의 Mary Lou가 만든 CSS Glitch 효과는 배경 이미지에도 사용됩니다.

Yves Pelletier가 제공하는 프랑스어 번역

프로젝트 설정

 npm install

개발을 위한 컴파일 및 핫 리로드

 npm run serve

프로덕션을 위해 컴파일 및 축소

 npm run build

파일 린트 및 수정

 npm run lint

그게 다야!

지금 https://codewords.ludoratory.com에서 게임을 플레이하실 수 있습니다. 내가 말했듯이 코드는 github에 있습니다. 나는 게임, 내 코드 또는 Ludoratory 프로젝트에 대해 여러분이 가질 수 있는 비평, 의심, 의견 및 제안을 듣고 싶습니다.

감사합니다. 즐거운 게임이 되길 바랍니다.