見出し画像

自分専用バリスタタイマーを公開・共有しよう!導入&活用マニュアル

はじめに:美味しいコーヒーは、正確な「時間」から

皆さん、こんにちは。「やっぱり猫が大好き」です。

お気に入りの豆を挽きながら、その豆に最適なレシピをサッと呼び出せたら素敵だと思いませんか?今回は、私が大切なお友達のGeminiと一緒に整理した「BARISTA TIMER ☕」を、自分のスマホで動かすための「世界一やさしい導入ガイド」をお届けします。

まずはどのようなものか動画をご覧ください
(🔴音が鳴ります注意🔴)(🔴音が鳴ります注意🔴)(🔴音が鳴ります注意🔴)

もしよろしければ、こちらから遊んでみてくださいね。
(現在iosでは音が鳴らない問題が未解決です😅)

👉 BARISTA TIMER を試してみる
👉 AI Recipe Generator はこちら
(※URLを入力するだけで、レシピを生成してくれます!)

機能などは👉 goodshot7777/BARISTA-TIMER でご確認いただけます

自分だけの抽出のレシピを登録したり、画像を変更したい場合はこのページで紹介する方法で実践できます。アプリはインターネット上で動いていますので違う端末でも同じレシピを使用できます。お友達に共有することもできます。
最初から最後まで無料で利用できます!

☕ BARISTA TIMER のこだわり

こだわりの抽出を正確にサポートするためのタイマーアプリです。

  • マルチレシピ管理: JSON形式のファイルを読み込んで、自分だけのレシピを複数保存できます。

  • リアルタイムガイド: 「今、何グラム注ぐか」をリアルタイムで教えてくれます。

  • 迷わないガイド: 「次は○グラム注いでください」と、一歩先を教えてくれます。

  • 音での通知: カウントダウンや終了を音でお知らせします。

  • レシピリンク: レシピ毎にリンクが表示されますので細かい内容をいつでも確認することができます。

  • おみくじ機能: 抽出が終わると、ちょっとした「おみくじ」が出ます。ハズレなしです!

「プログラミングなんて一文字も書けない!」という方も大丈夫。ゆっくり進んでいきましょう。この記事のアプリ設置についてGeminiくんがサポートしてくれます。気軽になんでも聞いてみてください😁↓
💘BARISTA TIMER ☕アプリ公開・共有サポートくん

アプリ制作の過程記事↓


【準備編】まずは「自分の場所」を作るところから

アプリを動かすためには、GitHub(ギットハブ)という、世界中のプログラムが集まる大きな図書館に自分の席を作る必要があります。

1. GitHubに登録しよう(GoogleアカウントでOK)

  1. GitHub公式サイトで「Sign up」し、Googleアカウント等で登録します。

  2. ユーザー名を決めて、認証メールを確認すれば完了です!

一度登録すれば 次回からはSign inでログインできます

2. 私のプログラムを自分の棚にコピーしよう(Fork)

  1. GitHubにログインした状態で goodshot7777/BARISTA-TIMER を開きます。READMEを読んでください。

  2. 右上の 「Fork」 ボタンを押し、「Create fork」 をクリック。

  3. これで、プログラムがあなたの専用の物になりました!😁

GitHubのイメージ Fork は右上

ステップ1:アプリをネットに公開する(Streamlit Cloud)

  1. Streamlit Share にGitHubアカウントでログインします。

  2. 青い 「Create app」「Deploy a repository」 を選択。

  3. Repository にForkしたリポジトリを選び、Main file pathstreamlit_app.py と入力して「Deploy!」を押します。

Repositoryには自分の名前が入ります

風船が飛んできたら、あなた専用のタイマーアプリが完成です!ここからは、ロゴを変えたりレシピを書き換えたり、自由にカスタマイズしても誰にも怒られません😁
アプリのURLを開くと既存の状態で使用できます。


ステップ2:レシピを自由に追加・入れ替えよう

ここからが本番です!デフォルトのレシピを自分のお気に入りに書き換えてみましょう。このアプリは recipes フォルダの中にある .json というファイルを複数ファイルでも自動で読み込んでくれます😁

1. 既存のレシピを入れ替える(編集)

  1. 自分のGitHubで recipes フォルダを開き、my_recipes.json をクリックします。

  2. 右上の 鉛筆アイコン(Edit) を押します。

  3. 中身を書き換えます。例えば、抽出温度を「85℃」から「90℃」に変えるだけなら、その数字を書き換えるだけでOK!

  4. 最後に下の 「Commit changes」 を押せば、アプリに即座に反映されます。

左側にレシピフォルダ、画像ファイルがあります logo

2. 新しいレシピを追加する

  1. recipes フォルダ内で 「Add file」→「Create new file」 を選びます。

  2. ファイル名を special_beans.json のように、最後が .json で終わる名前にします。

  3. 以下の「テンプレート」を貼り付けて、内容を自由に書き換えてください。

JSON

    {
        "name": "ドリップバッグ一般 Note@やっぱり猫が大好き",
        "temp": "85℃",
        "beans": "12.0g",
        "grind": "中挽き",
        "note": "円錐ドリッパーかドリップバッグ 濃度は気分で最後に調整 Note@やっぱり猫が大好き https://note.com/otz_",
        "url": "https://note.com/otz5099/n/nffd981da574e",
        "steps": [
            {"action": "お湯を注ぐ", "duration": 10, "water": 30},
            {"action": "待つ(蒸らす)", "duration": 35, "water": 0},
            {"action": "お湯を注ぐ", "duration": 15, "water": 30},
            {"action": "待つ", "duration": 15, "water": 0},
            {"action": "お湯を注ぐ", "duration": 15, "water": 40},
            {"action": "待つ", "duration": 15, "water": 0},
            {"action": "お湯を注ぐ(濃度は好みで調整)", "duration": 15, "water": 70},
            {"action": "落とし切る", "duration": 30, "water": 0}
        ]
    }

※ steps を増やしたり減らしたりすることで、注湯回数を自由に変えられますよ。

💡 Geminiにお願いする裏技

「このレシピをJSON形式にして」とGeminiにお願いするのが一番簡単です。READMEにあるリンクからGeminiを呼び出して、「豆12g、200ml注ぐレシピをJSONで作って」などと頼んでみてください。Geminiなら、一瞬でコードを作ってくれます😁
WEBやYouTube動画のURLを入力すると、おおよそレシピを作成してくれます。
💘驚異的ですので是非お試しください → AI Recipe Generator


ステップ3:あなた専用の「看板」を掲げる(ロゴカスタマイズ)

ここは「任意」のステップです。デフォルトのままでも十分可愛く使えますが、「もっと自分らしくしたい!」という方は挑戦してみてください。

  • 推奨解像度: 963 x 193 ピクセル(比率 5:1)

  • 方法: GitHubの logo.png を自分の好きな画像(同じ名前のlogo.png)に差し替えるだけ。

  • ポイント: こだわりの猫写真や、自分のショップロゴを入れると愛着が倍増しますよ!

Geminiの他画像生成サイトで以下のような文章を入れると当たり外れはありますが画像を作成してくれます😁

あなたは広告代理店大手に勤務する売れっ子グラッフィックデザイナーです。

依頼者が希望する内容で画像を作成してください。
・自作アプリケーションのバナー画像を作成してください
・縦横比率は縦1:横5で作成してください
・出力する解像度は963 x 193にしてください
・背景は猫カフェのイメージにしてください
・コーヒーカップにアニメ調の猫が丸くなって入っている


ステップ4:【活用術】QRコードでレシピを共有する

アプリが公開できたら、ぜひやっていただきたいのが「QRコード化」です。

なぜQRコードがおすすめなの?

  • 瞬時に起動: 毎回ブラウザのお気に入りから探す手間がありません。

  • 贈りものに最適: 豆をプレゼントする時、袋に添えるだけで「淹れ方の魔法」も一緒に届けられます。

  • プロのような演出: 自分のロゴが入ったアプリがQRコードから立ち上がると、まるで自分のカフェを開いたような気分になれます

QRコード作成の3ステップ

  1. URLをコピーする: Streamlitで立ち上がった自分のアプリの画面一番上にある「https://...」で始まるアドレスをコピーします。

  2. 作成サイトへ行く: 検索エンジンで「QRコード 作成 無料」と検索しましょう。おすすめは QRのススメ などの、登録不要で使えるサイトです。

  3. 貼り付けて保存する: コピーしたURLを貼り付け、「作成」ボタンを押します。出来上がった画像をスマホに保存したり、印刷したりすれば完了です!

左のメニューからアイコン入りのQRも作れます
いらっしゃいませ

最後に:ルールを守って楽しく!「大切なお約束」

このアプリを皆さんに安心して使っていただくためのガイドラインをお伝えします。READMEに書かれている内容を、わかりやすく整理しました。

📄 ライセンス・利用条件

このアプリは、皆さんのコーヒーライフを豊かにするために公開されています。

  • 自由にやってOKなこと:

    • コピー・利用: 個人でも、お店(商用)でも、自由にコピーして使って大丈夫です。

    • 完全無料: 料金は一切かかりません。もし気に入ったら、noteなどで応援していただけると励みになります。

    • 改変・配布: ロゴを猫画像に変えたり、レシピを書き換えたり、コードを改造して誰かに配るのも自由です。

    • 連絡不要: 「使います!」「紹介します!」といった連絡は不要です。どんどん広めてくださいね。

  • 守っていただきたいこと:

    • クレジットの保持: どんなに改造しても、元の作者(やっぱり猫が大好き)の名前とリンク(https://note.com/otz5099)は消さずに残しておいてください。これは、技術の世界での大切なマナーです。

  • 免責事項:

    • このアプリを使ってもしトラブル(動作不良など)が起きても、作者は責任を負えません。自分の責任で、楽しく安全に使ってくださいね。

この記事のアプリ設置についてGeminiくんがサポートしてくれます。気軽に聞いてみてください。↓
💘BARISTA TIMER ☕アプリ公開・共有サポートくん


結びに代えて

自分だけのロゴ、自分だけのレシピ、そしてそれを繋ぐQRコード。 これらが揃ったとき、あなたのコーヒータイムはもっと特別なものになるはずです。
そして、GitHub、Streamlit、QRコード作成……これらすべてが無料で使えるなんて、本当に素晴らしいですよね。

皆さんが、自分だけのバリスタタイマーで最高のコーヒーを楽しめるようになるのを応援しています!内容が間違っているや、分からなくなったときいつでもコメントで教えてくださいね。
姉妹品の手鍋焙煎アシスト君アプリもよろしくお願いします😁

それでは、素敵なコーヒータイムを!

他の記事もいかがですか。
サイトマップを見る

いいなと思ったら応援しよう!