▲

웹에서 실행되는 게임 메이커 90s.dev 공개

 (90s.dev)
17P by GN⁺ 1일전 | ★ favorite | 댓글 2개
  • 90s.dev은 웹 기반에서 동작하는 새로운 게임 메이커 API로, 90년대 스타일의 GUI 앱 제작 경험을 제공함
  • 이 플랫폼은 직접적인 게임 엔진이나 게임 메이커가 아니라, 게임, 게임 엔진, 게임 제작 도구를 만들기 위한 API를 제공함
  • HTML Canvas 기반, 320x180 화면, WebGL2 지원, 웹 워커를 통한 보안과 성능 보장이 특징임
  • TypeScript-first SDK와 다양한 언어의 wasm 모듈 임포트 지원 등으로 빠르고 확장성 높은 프로토타이핑이 가능함
  • 사용자는 자신만의 앱을 만들어 GitHub 또는 NPM에서 공유하거나 로드할 수 있으며, 개발 커뮤니티와 협업 및 확장성 추구가 목적임

90s.dev 공개의 의의

  • 90s.dev은 웹에서 동작하는 새로운 형태의 게임 메이커 API 플랫폼임
  • 90년대 스타일의 GUI 앱 제작 환경을 제공하며, 게임, 게임 엔진, 그리고 게임 메이커 도구 생성을 위한 API를 특징으로 함
  • 목적은 누구나 HTML Canvas 상에서 픽셀 아트, 스프라이트, 맵 등 게임용 에셋과 툴을 쉽게 만들고 공유하는 생태계 형성임

주요 특징 및 비전

플랫폼 기본 소개

  • 90s.dev은 브라우저에서 실행, 320x180(16:9) 해상도로 웹 윈도우를 채우는 화면을 가짐
  • 모든 앱은 웹 워커 환경에서 실행되어 보다 뛰어난 보안과 성능 확보
  • WebGL2 오프스크린 캔버스 통해 최대 60fps 게임 동작 가능
  • GitHub와 NPM에 호스팅된 앱 모듈을 자유롭게 불러오고 배포할 수 있음
  • VSCode 친화적 TypeScript SDK로 빠른 프로토타이핑 지원
  • 웹어셈블리(wasm) 로 빌드된 다양한 언어 모듈 호환성 보유

기본 제공 앱

  • 기본적으로 픽셀 아트, 스프라이트 제작 툴, 맵 에디터 등 게임 에셋 제작용 기본 앱 제공
  • 음향 및 음악 편집 도구는 아직 미제공이지만, 누구나 직접 개발하여 공개/공유 가능
  • 작성된 앱과 도구는 iframe이나 링크로 모든 사용자에게 공유 가능

영감 및 차별점

참고한 게임 개발 툴

  • pico8: 미니멀리즘 지향, 단일 언어 지원
  • tic80: pico8의 여러 제한 해제
  • love2d: 외부 IDE 필요
  • picotron: 운영체제 아키텍처 도입
  • 90s.dev은 메타적 pico8이자, TypeScript가 도입된 love2d 또는 수직적 확장에 초점을 둔 tic80에 가까움

GUI 혁신과 기술적 세부사항

레이아웃 시스템

  • 수동 배치와 리사이징의 번거로움을 줄이기 위해 간단하면서도 강력한 자동 레이아웃 시스템 구현
  • 뷰(API)가 화면을 직접 그리고 자식 뷰 트리 구조 활용

Ref 시스템

  • 뷰의 속성(사이즈, 자식, 배경색 등)을 watchable pointer(ref)를 통해 관리
  • 모든 속성에 참조 객체(ref) 부여, 속성 변경사항을 자동 감지 및 반영
  • 기존의 React/Vue ref와 완전히 별개로 설계됨

Composites(복합 뷰 개념)

  • JSX에서 문자열 태그(소문자)와 값 태그(대문자)를 반전하여, 구현과 사용 분리를 강화
  • 추상 뷰를 글로벌 테이블에 등록하고, 시스템의 다른 부분에서 자유롭게 활용
  • 예시: colorpicker 뷰는 디폴트 구현을 제공하지만, 개발자가 원하는 스타일로 대체 가능
  • GUI 앱 개발에서 높은 유연성과 확장성 제공

앱 배포 및 커뮤니티 협업

앱 배포 방식 변화

  • 기존에는 자체 데이터베이스 기반 net/ 공유 드라이브 사용
  • 최근 NPM/GitHub에서 CDN을 통해 직접 모듈 호스팅 및 가져오기 지원
    • 예: /os/fs/ghb/someuser/project@1.0.0/some/file.js
  • 서비스 워커 활용으로 다양한 소스의 불러오기 매커니즘 완성

참여 및 협업

  • 운영체제적 디자인으로 필수 앱(기본 앱) 외 커뮤니티 앱 개발 장려
  • 이슈 트래커, 포럼, 위키(모두 GitHub repo) 통해 소통 및 협업 지원
    • 이슈: 기능 요청 및 버그 신고
    • 포럼: 프로젝트 발표 및 논의
    • 위키: 프로젝트 모음 및 큐레이션

앱 공유

  • 앱 공유는 /os/#app형식의 링크로 가능
  • 커뮤니티 중심으로 앱, 라이브러리, 에셋의 자유로운 제작 및 확산 추구

결론 및 방향성

  • 90s.dev은 게임 메이커 생태계 자체를 설계하고 정의하는 API 플랫폼임
  • 누구나 쉽게 직접 앱을 제작, 배포, 활용할 수 있는 확장형 웹 게임 제작 환경 추구
  • 커뮤니티 협력과 오픈 플랫폼 철학에 기반한 미래지향적 게임 개발 툴임
▲
lazyhack 8시간전  [-]

게임엔진 자체는 어떨지 궁금해지는군요

답변달기
▲
GN⁺ 1일전  [-]
Hacker News 의견

  • 어느 날 2월에 새벽 2시에 일어나 그냥 코딩을 시작한 경험 공유, 더 이상 기다리는 것이 지겨웠던 상황, 계속해서 코드를 작성하며 API 기반 게임 메이커 툴, 게임 엔진, 게임을 만들어낸 과정, 본인의 진짜 열정이 API 설계에 있음을 깨달음, 그런 식으로 열정을 찾고 전념하는 사람들이 너무 멋지게 느껴지는 감정 공유

  • 칭찬 고마움 표현, 프로젝트의 본질이 잘 설명되지 않았던 아쉬움 토로, 실제로는 API가 가장 흥미로운 부분인데 겉으로 드러나지 않아 답답함, API의 혁신적인 사용성을 보여주는 예제가 더 많아질 때까지 기다렸어야 했다는 생각, 출시를 너무 성급하게 했다는 후회

  • 내가 이번 프로젝트 저자라고 밝히며, 피드백에 감사함을 표함, 이른 출시였다는 사실을 분명히 느낌, 여러 지적 사항들 개선 작업을 하고 몇 달 내로 다시 돌아오겠다는 의지 표명

  • 전혀 이르지 않은 출시라고 생각, 굉장히 멋지고 극도로 과도하게 설계된 프로젝트임을 칭찬, 유명한 bike shed 비유로 최고라고 평가, 독자적인 반응형 시스템까지 구현한 점에 엄청난 감탄

  • Show HN에는 딱인 타이밍이라고 판단, Hello World 투어를 찾아보며 어떤 프로젝트인지 직관적으로 이해 가능했음, 기존 PICO-8과 React 경험이 있다면 더욱 재미있게 다가옴, 16:9 비율 선택도 현명하다고 봄, PICO-8의 정사각형 비율은 어색하다는 의견

  • 일찍 출시해준 점에 감사함, 자주 출시하는 전략 강력 추천, 10,000번의 반복이 성공에 이르는 길임을 언급하며 한 번의 도전은 시작일 뿐임을 강조

  • 너무 이르게 출시한 것 아니라는 격려 메시지, 저자가 굉장히 잘하고 있다는 응원 전달

  • 깊이 있게 다루진 않았지만, 이 레트로한 감성에 몰래 더 끌리고 있다는 고백, 아마도 옛날의 단순하고 편안했던 시절로부터 느껴지는 위안이 지금 이런 프로젝트를 보면 살아난다는 감상

  • paint 앱 동작 여부 질문, Firefox와 Chrome에서 시도해봤지만 색상 선택 후 클릭해도 아무것도 그려지지 않음, 콘솔에도 아무 오류가 없음, 별개의 주제로 90년대 감성을 성공적으로 재현한 점에 감탄, 처음에는 70~80년대 터미널 느낌으로 봤지만, 자세히 보니 정말 90년대가 정확히 이런 모습이었다는 깨달음, 앞으로의 발전에 기대감을 표현

  • 혼란을 일으켜 미안하다고 언급, 색상 선택기까지만 개발했으며 그 이상은 아직 미구현 상태, 조만간 한 시간 안에 완성할 수 있을 것 같음, 동시에 개발 의도 자체가 GUI 앱 개발의 즐거움과 파워를 90년대 감성으로 재현하는 것이었음을 밝힘, 불편함은 빼고 놀라움만 담으려 했고 그래서 90s.dev라는 이름을 정했다는 설명

  • 아직 구현되지 않았을 가능성 언급, 창 좌측 상단 “hash” 버튼 클릭 후 “View Source” 선택하면 UI만 모킹된 상태, 스크롤 영역에는 단순 무늬만 그려진 코드만 확인 가능

  • 자신에게도 동작하지 않음

  • 프로젝트 자체는 충분히 이해하진 못하지만 감성에 크게 반함, 어떤 감성적 분위기와 시각적 요소만으로도 사람의 감정에 큰 영향을 주고 더 많은 관심을 유발하게 됨이 신기하다고 느낌

  • 개인적으로 설명 방식을 고민해봄, 더 쓰기 편리한 pico8을 만들고 싶었기에 320x180 디자인과 프로토타입을 만들었음, 동시에 VS Code의 모든 편의 기능과 TypeScript 지원까지 얻고 싶었기에, 최종적으로는 pico8의 탭에 포함된 것들을 제작하고 배포 가능한 플랫폼으로 기획함, 그리고 지금 생각해보면 이 역시 너무 일찍 출시했다고 느낌

  • 감성 자체는 마음에 들지만 16:9 비율과 90년대 PC 조합은 어울리지 않는다는 의견, 정사각형에 가까웠던 CRT 모니터의 독특한 감성을 더 좋아함

  • 감사 인사, 설명이라는 작업이 너무 어렵다는 토로, 이번 글도 결국 본인이 무엇을 만들었는지 가능한 짧게 설명해보려 한 시도임을 고백, 버전이 짧아도 여전히 내용이 모호할 수밖에 없어 포기하겠다는 솔직한 심정

  • 프로젝트가 매우 멋지다고 생각하지만 시작이 조금 어렵게 느껴짐, 미니 게임 만드는 방법에 대한 간단한 워크스루가 있으면 좋겠다는 제안

  • 감사 인사 전하며, 현재 게임 빌드 방식은 앱 빌드 튜토리얼과 동일하지만 커스텀 뷰를 만들고 draw 메서드를 덮어써서 만들 수 있다고 설명, 성능을 위해서는 OffscreenCanvas를 생성해서 활용하면 더욱 좋으며, 아직 WebGL2를 더 편하게 감싸주는 API는 제공하지 않고 있음, 향후 초보자도 게임 전체를 직접 만드는 튜토리얼을 꼭 만들 예정임을 약속, 현재는 앱 위주라 먼저 게임 메이커 툴(스프라이트, 맵 등) 개발부터 중점적으로 다룬다고 설명, Hello World 튜토리얼 링크 공유

  • 프로젝트를 엄청나게 흥미롭게 여김, 어린 시절로 즉시 돌아간 기분, pico8도 좋아하지만 본인은 좀 더 데스크톱과 GUI로 자란 세대라 pico8은 한 세대 정도 너무 이른 느낌, 이 프로젝트는 마치 CD를 다시 사는 듯한 향수 자극

  • Pico8 개발자가 만든 Picotron도 소개, Pico8과 비슷하지만 약간 제약이 덜한 데스크톱 OS라 설명, 본인은 사용 경험은 없고 GIF만 본 적 있지만 프로젝트 패러다임이 유사함, pico8을 안에 만들 수 있는 “플랫폼” 지향이라는 점에서 본인 프로젝트와 닮았다고 느낌, 서로 다른 방식으로 같은 이상을 추구한다고 생각

  • Getting Started 가이드 첫 단계에서 막힘, helloworld.zip을 로컬로 다운로드 후 filer.app.js를 웹에서 열고, mount 버튼을 눌러 drive name으로 helloworld/app 입력했으나 아무런 반응 없음, zip 파일을 90s.dev 인스턴스에 업로드하는 방식이 헷갈림

  • 피드백에 감사 인사, 아마 Firefox를 사용 중일 확률이 높음, 해당 기능은 showDirectoryPicker에 의존하는데 Firefox는 지원하지 않아 Chrome 사용 권장, 또한 drive name에는 경로 없이 이름만 입력해야 하며(e.g. “foo”) 가이드를 곧 수정하겠다고 다짐, 이후 foo/helloworld.app.js가 실제 로컬 경로에 연결됨을 설명

  • 90년대 감성이 정말 마음에 든다고 표현, 특히 폰트가 인상 깊음, 80년대 스타일의 픽셀 아트보다 90년대 디자인에 훨씬 더 끌리는 취향 자각

  • 랜딩 페이지에 대한 비판 제기, 프로젝트를 ‘game maker’라 부르면서 동시에 ‘game maker가 아님’이라는 모순된 설명이 혼란을 준다고 느낌, 용어 정리가 일관되지 않다는 지적

  • 네이밍이 원체 어려운 문제임을 상기, 컴퓨터 과학에서 가장 어려운 과제 중 하나라고 봄, 캐시 무효화와 함께 언급

답변달기