コンテンツへスキップ
ツール・サービス 公開・運用中 2026年7月

ブラウザゲーム4本 + オンラインスコアAPI(clvr.lol/play)

SNAKE・2048・タイピング・パスワード推理の4本を公開中。実績解除システムつき。ハイスコアはNode.js製の自作APIを自前VPSで運用して保存。

TypeScript Canvas API Node.js nginx
サイトを見る
https://clvr.lol/play/
ブラウザゲーム4本 + オンラインスコアAPI(clvr.lol/play)のスクリーンショット

運営中の技術ブログ clvr.lol に併設している、実際に遊べるブラウザゲームのコーナーです。
SNAKE・2048・タイピング・パスワード推理の4本と実績解除システムを公開しています。
フロントのゲーム実装だけでなく、ハイスコアを保存するAPIサーバーも自作し、自前のVPSで運用しています。

デザインのポイント

ゲーム一覧を「ターミナルの ls -la 出力」に見立て、ブログ本体のシンセウェイブ調と世界観を揃えました。

各ゲームはインストール不要・その場で起動。PCのキーボード操作とスマホのスワイプ操作の両方に対応しています。

工夫した点

01

ゲームロジックを自前実装

衝突判定・盤面合成・落下物のスポーン制御など、ライブラリに頼らずCanvas APIとTypeScriptで実装

02

オンラインスコアAPIも自作

Node.js製のAPIサーバーをPM2 + nginxで常時運用(cleverlab.lol/clvr-scores/)。フロントからバックエンド、サーバー運用まで一気通貫で自分で持っています

03

実績解除システム

プレイ状況に応じて実績がアンロックされる仕組みを実装し、再訪の動機を設計

04

操作の二重対応

矢印キー/WASDとタッチスワイプを同じロジックに集約し、デバイスを問わず遊べるようにしています

同じようなサイトを作りたい方へ

このページのURLを添えて送っていただければ、構成案と概算費用を返信します。相談は無料です。