Doodling Journey

キャンバス

マウスを動かすだけで描画 · Spaceで一時停止

ここから描けます

マウスを動かすだけで描画 · Spaceで一時停止
今回の線 （推定）0.0cm
保存すると進む距離0.0m
描画設定
今日描いた距離
0.0cm
推定実寸保存済み 0.0 cm
今日の旅の進捗
0.0m
保存済み描いた線から換算
目的地まで
0.0km
京都
このアプリについて・改善の記録

このアプリについて

学習中に描いた線の量を距離として見えるようにし、目的地に近づく様子を楽しめるアプリを作っています。公開後の意見をもとに、使い方や画面を改善していく個人開発です。

改善の記録
  • 配色調整案：背景・キャンバス・入力欄に薄い紙色を加え、操作色の青は維持。
  • 全画面で記録した後、通常表示に戻る処理を修正。
  • タッチパッド用の描画設定と手ぶれ補正を追加。

旅の設定

経由地 （任意・最大5地点）
一覧にない地点を追加する

名前と緯度・経度で、好きな場所を設定できます。

選択したルートの大圏距離0.0km
旅の目標距離

旅を設定し直しても、学習記録と到達履歴は残ります。現在の旅の進捗は新しい旅には加算されません。

京都に到着！

次の旅に使える余剰距離0.0km

どちらを選んでも、今回の学習記録は残ります。

使い方

  1. 旅を設定する

    出発地・経由地・目的地を選択。任意の地点や目標距離も設定できます。

  2. 学習しながら描く

    複数の線を合算。取り消し・全消去で描き直せます。

  3. 記録して、進む

    描いた長さ（cm）÷ 10 × 設定したm（1〜100m）。保存時の倍率で距離が確定します。

  4. 到達したら、次の旅へ

    次の目的地・距離を選び、余剰距離を繰り越すか決められます。

タッチパッドで描きやすくするには

「タッチパッドで描く」で、全画面・クリックなし・標準の補正をまとめて設定できます。小さく細かく描くより、大きな円や往復する線をゆっくり描いてみましょう。指を置き直すときはSpaceで一時停止し、位置を変えてもう一度Spaceで再開します。

動きが速すぎる場合は、PCの設定でカーソル速度を少し下げてみてください。手ぶれ補正を強くすると細かな動きもなめらかになるので、必要に応じて「弱め」「なし」に調整できます。

定規で校正すると、実際の長さに合わせられます。

「実寸を合わせる」で基準線を定規で測り、その長さを入力してください。未校正の場合は端末情報から推定します。画面・モニター・ズームを変えたら再校正してください。PCはクリックなしの描画が標準です。チェックを外せば押しながら描けます。「全画面」で広く描けて、Spaceキーで一時停止・再開できます。距離は補正後に表示した線で計算します。

本プロトタイプでは、このブラウザに記録を保存します。別の端末との同期・アカウント登録は今後の実装対象です。海岸線・国境はNatural Earthの地理データを使用しています。＋で現在地を拡大し、−で縮小できます。ルートは大圏距離で、道路や鉄道の経路とは異なります。

今回の線を消去しますか？

キャンバス内の未保存の線をすべて消去します。

実寸の校正

画面に定規を当て、下の基準線の両端の目盛りの間を測ってください。

この両端の間を、定規で測ります。

測った長さの精度に合わせて計算します。未保存の線にも反映し、保存済みの記録は変更しません。別の画面や表示倍率に変えたら、もう一度合わせてください。