top of page

​タグ一覧

配列処理(73)

階層化フォーム(33)

ファイル操作(28)

開発事例(25)

シート・セル操作(20)

図形操作(15)

設計思想(12)

講座実施報告(12)

ユーザーフォーム(10)

コード自動生成(10)

数学(8)

文字列操作(8)

開発効率化(6)

GAS(5)

アニメーション(5)

技術解説(4)

イミディエイトウィンドウ(4)

Googleスプレッドシート(4)

副業(4)

クリップボード(4)

条件付き書式(4)

その他(4)

Webアプリ(4)

OneDrive(3)

イベントプロシージャ(3)

ココナラ(3)

小説(3)

HTML(3)

JavaScript(3)

Enum(2)

PDF(2)

フリーランス(2)

リスキリング(2)

Outlook(2)

介護(2)

Discord(2)

シフト表(2)

LookerStudio(2)

日報(2)

カレンダー(2)

公開ツール(2)

罫線(2)

パズル(2)

小ネタ(2)

コード解説(2)

クラスモジュール(2)

Antigravity(2)

デスクトップアプリ(2)

ステータスバー(1)

コード解析(1)

バックアップ(1)

可変長引数配列(1)

ブック処理(1)

スクレイピング(1)

スプレッドシート(1)

coconala(1)

リボン登録マクロ(1)

QRコード(1)

実行予約(1)

給与計算(1)

VBA不使用(1)

リボン(1)

超勉強会(1)

スピログラフ(1)

図名描写(1)

連想配列(1)

溶接ロボット(1)

保育士(1)

楽天市場(1)

経理(1)

医療(1)

文書作成(1)

発注書(1)

ショートカット(1)

WebAPI(1)

色操作(1)

スーパー開発ショートカット(1)

ライブラリ処理(1)

放課後等デイサービス(1)

児童福祉支援(1)

学校(1)

UI(1)

CAD(1)

カーソル操作(1)

チェックボックス(1)

PowerShell(1)

python(1)

【Webアプリ】モルックのスコア管理と作戦提案をスマホで支援するWebアプリ「モルック大ちゃん」

 先日友達にスポーツの「モルック」に誘われたのをきっかけ(ネタ)にWebアプリを作ってみました。

 私自身はモルックは競技もやったことがない初心者だったので、Webアプリのコンセプトは次のような感じとしております。

  • モルックのルールの理解サポート

  • 競技中のスコア記録

  • 競技中の作戦検討サポート

 

 開発にはClaude Code (モデルは主に Opus 4.7)、本記事や説明図の作成にはGPT5.5を利用しています。


 ちなみに「大ちゃん」はその友達の名前です。

屋外の芝生で男性がモルックを投げる様子。観客が後方に立ち、スマホ画面にはスコア管理アプリ。タイトル「競技中の記録と作戦をスマホでサポート」。

モルックというスポーツをご存じでしょうか。

モルックは、フィンランド発祥のスポーツで、木製の棒を投げて、1〜12の番号が書かれたピンを倒し、ちょうど50点を目指す競技です。


一見するとシンプルな遊びに見えますが、実際にプレイしてみると、かなり頭を使います。

倒したピンが1本なら、そのピンの番号が得点。複数本倒した場合は、倒した本数が得点。50点を超えると25点に戻る。さらに、連続でミスすると失格になるルールもあります。

つまり、モルックは単にピンを倒すだけではなく、

「今、何点か」「あと何点で50点か」「どのピンを狙うべきか」「倒しやすいピンはどれか」「ミスが続いていないか」

といった判断を、試合中に考え続ける必要があります。


そこで今回、モルックの試合をスマートフォン上で支援するWebアプリとして、「モルック大ちゃん」 を作成しました。

アプリはこちらです。https://molkky-daichan.vercel.app/


モルック大ちゃんとは


モルック大ちゃんのWebアプリ紹介。スコア記録、ピン配置の見える化、作戦提案、ルール確認、設定機能をスマホで提供。緑の背景。

モルック大ちゃんは、モルックの試合中に使うことを想定した、スマートフォン向けのWebアプリです。

主な目的は、次の3つです。


1つ目は、スコア記録の自動化です。プレイヤーごとの得点、残り点数、ミス回数、50点超過時の25点戻りなどを、アプリ側で管理できるようにしています。


2つ目は、ピン配置の見える化です。モルックでは、倒れたピンをその場で立て直します。そのため、試合が進むにつれてピンの配置がどんどん散らばっていきます。

この配置をスマホ上で再現することで、現在どのピンがどこにあるのかを視覚的に把握できます。


3つ目は、作戦提案です。ピンの位置や得点状況をもとに、「次にどのピンを狙うとよさそうか」を候補として表示します。


単なるスコア記録アプリではなく、試合中の判断をサポートするアプリを目指しています。要件定義書上でも、本アプリの目的として、試合中のスコア記録、ピン配置の視覚管理、次に狙うべきピンのレコメンドを実現する方針で整理しています。


作成した背景


試合中に困る点とアプリで解決できることを説明する図。左側には問題、右側には解決策がリスト表示。緑色が基調。

モルックは、ルール自体は比較的覚えやすい競技です。

しかし、実際の試合では、意外と管理する情報が多くなります。

たとえば、現在の点数が38点の場合、残りは12点です。この場面では、12番ピンを1本だけ倒せば勝ちです。


ただし、近くに他のピンがある場合、複数本倒してしまう可能性もあります。仮に2本倒してしまえば、得点は2点です。また、強く狙いすぎて1本も倒れなければミスになります。


このように、モルックでは、

「得点として欲しい数字」「実際に倒しやすいピン」「周囲のピンとの距離」「ミスのリスク」

を同時に考える必要があります。


さらに、50点を超えると25点に戻るため、むやみに高得点を取ればよいわけでもありません。

この判断を紙や頭の中だけで行うのは、試合中だと少し大変です。


そこで、スマートフォンでスコアとピン配置を確認しながら、次の一手を考えられるようにしたいと考えました。


試合画面:スコアとピン配置を一画面で確認



メインとなる試合画面では、上部にプレイヤーごとのスコアを表示しています。


現在の得点、50点までの残り点数、ミス回数を確認できます。また、どちらのプレイヤーの投擲中かも表示されるため、試合の進行状況が分かりやすくなっています。

中央には、ピン配置を表示するエリアがあります。


12本のピンをスマホ画面上に配置し、タップやドラッグで状態を調整できます。倒れたピンはタップで切り替えたり、配置が変わった場合はドラッグで移動したりできます。


モルックでは、倒れたピンをその場で立て直すため、ターンが進むほど配置が変化します。この変化を画面上で再現できるようにしている点が、このアプリの大きな特徴です。

また、各ピンには倒しやすさの目安となる数値も表示しています。


これは、投擲位置からの距離や周囲のピンとの間隔などをもとに、ヒューリスティックに評価したものです。厳密な物理シミュレーションではありませんが、次の一投を考える際の目安として使えるようにしています。


得点確定:ルール処理をアプリ側で自動化

得点確定の流れを説明する図。倒れたピンを確認し、得点決定、投擲確定、スコア更新の順に進む。緑の強調、葉の背景。

投擲後は、倒れたピンの状態を画面上で反映し、得点を確定します。


モルックの得点計算は、倒れた本数によって変わります。


1本だけ倒れた場合は、そのピンの番号が得点になります。たとえば、7番ピンだけを倒した場合は7点です。


一方で、複数本倒れた場合は、倒れた本数が得点になります。たとえば、3本倒れた場合は、ピン番号に関係なく3点です。


さらに、1本も倒れなかった場合はミスとして扱います。


このようなルールを、アプリ側で自動処理することで、試合中の点数計算の負担を減らします。


また、50点を超えた場合は25点に戻るルールにも対応しています。3連続ミスの扱いについても、設定画面から調整できるようにしています。


作戦提案:次に狙うピンの候補を表示

作戦提案を示すアプリ画面。スマホに倒しやすさや盤面確認、相性、ハイライト確認の6ステップが表示。背景は緑色の葉。

モルック大ちゃんでは、現在の得点状況とピン配置をもとに、次に狙うピンの候補を表示します。


たとえば、あと10点で50点になる場面では、10番ピンを1本だけ倒すことが理想です。


しかし、10番ピンの周囲に他のピンが密集している場合、狙いやすいとは限りません。反対に、少し点数効率は落ちても、孤立していて倒しやすいピンを狙った方が安全な場面もあります。


そこで、アプリでは単に「残り点数に合うピン」を表示するだけでなく、倒しやすさも含めて候補を提示します。


現時点では、ヒューリスティックに基づく作戦提案として、

  • 投擲位置からの距離

  • 周囲のピンとの間隔

  • 50点到達への寄与度

  • 単本狙い・複数本狙いの候補

などをもとに、おすすめの狙い方を表示する設計です。


これにより、試合中に「次はどこを狙うべきか」を考えるきっかけになります。


ルールタブ:初心者でもその場で確認できる


スマホ画面にモルックのルール説明、緑のアイコンで番号付き要点。目次に「モルックとは」「基本の流れ」「勝利条件」など。背景に葉のイラスト。

アプリ内には、モルックの基本ルールを確認できるルールタブも用意しています。

モルックを初めてプレイする人がいる場合でも、アプリを開けば基本的な流れを確認できます。


ルールタブでは、

  • モルックとは何か

  • 基本の流れ

  • 得点計算

  • 勝利条件

  • ペナルティ

  • ピン配置の特徴

などを整理しています。


試合中にルール確認が必要になった場合でも、別のサイトを検索する必要がありません。

特に、モルック初心者が混ざる場面では、アプリ内にルール説明があるだけでも使いやすさが大きく変わります。


設定タブ:ローカルルールに合わせて調整


設定画面のスマホイメージ。プレイヤー名、ルール確認、ミス回数設定などが緑色のアイコンと共に説明されている。背景は白。

設定タブでは、プレイヤー名の変更やゲームルールの確認、現在のゲームのリセットなどを行えます。


モルックには公式ルールがありますが、実際にはローカルルールで遊ぶこともあります。


たとえば、連続ミス時の扱いは、遊ぶメンバーや場面によって変えたい場合があります。そのため、設定画面から連続ミス失格回数を変更できるようにしています。


また、試合状態はブラウザのローカルストレージに保存されます。


そのため、ページを閉じても、同じ端末で再度開けば状態を保持できます。ログインやアカウント登録は不要です。


屋外で気軽に使うアプリとして、できるだけシンプルに利用できる構成にしています。


スマホで使いやすいWebアプリとして設計


スマホ表示のWebアプリデザイン紹介画像。片手操作、PWA、オフライン利用などの特徴説明。手にスマホ、UIや機能説明のテキストあり。

モルック大ちゃんは、スマートフォンで使うことを前提に作成しています。


モルックは屋外でプレイすることが多いため、パソコンではなくスマホで操作できることが重要です。


また、試合中に細かい入力を何度も行うため、複雑なフォーム入力よりも、タップやドラッグで直感的に使えるUIを重視しています。


技術的には、React + TypeScript をベースにし、ピン配置の操作にはCanvas系の描画を利用する構成です。


また、PWA対応も想定しており、ホーム画面に追加すれば、アプリのように起動できます。

データはクラウドではなく、ブラウザのローカルストレージに保存します。


この構成により、ログイン不要で、URLを共有するだけですぐに使える形にしています。


開発面で意識したこと


開発面で意識したことを示す図。UI、State、Domain、Persistenceの各レイヤーでの機能と採用技術が緑色で詳述。葉のイラストも。

今回のアプリでは、単に画面を作るだけではなく、ゲームロジックをできるだけ分離することを意識しています。


スコア計算、50点到達判定、25点戻り、ミスカウント、作戦提案などは、画面表示とは切り離して考える必要があります。


そのため、内部的には、

  • UIを表示する部分

  • 試合状態を管理する部分

  • 得点計算や作戦提案を行うロジック部分

  • ローカル保存する部分

を分けて設計しています。


このようにしておくことで、今後機能を追加する場合にも拡張しやすくなります。


たとえば、将来的にAI推奨モードを追加する場合でも、現在の状態をもとに「次に取るべき行動」を返す仕組みとして組み込むことができます。


今後の発展:AIによる作戦提案へ


今後の発展ロードマップ。3段階フェーズとAI推奨モードを示す。様々な要素のテキスト付き枠が緑色で配置され、進化を説明。

現時点では、ヒューリスティックに基づく作戦提案を中心にしています。


ヒューリスティックとは、厳密な最適解ではないものの、経験的・実用的な判断基準をもとに評価する方法です。

たとえば、

  • 近いピンほど倒しやすい

  • 周囲にピンが少ないほど単本狙いしやすい

  • 残り点数に近いピンほど価値が高い

といった考え方です。


今後の発展としては、強化学習や価値反復によって、より高度な作戦提案を行うことも考えています。


モルックは、単純な得点ゲームに見えて、実際には状態と行動の組み合わせが多い競技です。


現在の点数、相手の点数、残りピン、配置パターン、ミス回数などを考慮すると、「どの一手が有利か」を計算機で分析する余地があります。


今後は、こうした情報をもとに、より戦略的なAI推奨モードへ発展させることも目指しています。


まとめ

モルック大ちゃんは、モルックの試合をスマートフォンで支援するWebアプリです。


主な特徴は、次の通りです。

  • スコアを簡単に記録できる

  • 50点ルールや25点戻りを自動で管理できる

  • ピン配置を画面上で見える化できる

  • 次に狙うピンの候補を確認できる

  • ルールをアプリ内で確認できる

  • 設定やリセットもその場で行える

  • ログイン不要でスマホから使える

モルックは、シンプルで楽しいスポーツでありながら、実は戦略性の高い競技です。


だからこそ、スコア管理や作戦判断をアプリで支援することで、より試合に集中しやすくなります。


今後も、実際に使いながら改善を重ね、より使いやすいモルック支援アプリにしていきたいと考えています。


アプリはこちらから利用できます。https://molkky-daichan.vercel.app/

Excel VBAによる業務自動化・ツール開発をご検討の方へ

​"脱Excel"の前に、現状のExcelの潜在能力を120%発揮してみませんか?

softex-celwareロゴ 透過 横長.png

​インボイス登録番号:T5810983887134

  • Facebook
  • Twitter
  • YouTube

©2023 softex-celware。Wix.com で作成されました。

bottom of page