未ログイン状態で閲覧中
  • 投稿日:2026/04/05
ClaudeCoworkでアプリを作ろう! 「朝の支度をスムーズに」Codeでも作ってみました!

ClaudeCoworkでアプリを作ろう! 「朝の支度をスムーズに」Codeでも作ってみました!

たむ@note☆楽天ROOM☆AI

たむ@note☆楽天ROOM☆AI

この記事は約4分で読めます
要約
Claudeの導入をオフ会で一緒にやってもらいました。今まで気になっていたアプリ作りにチャレンジ。「自閉症スペクトラムの子どもの朝の支度をスムーズに」を目指すアプリです。どのお子さんも使えると思います。カスタマイズもできます。コードでも同じ指示で作って比較してみました。

Claudeをオフ会で導入

先日、オフ会でClaudeの導入の仕方を教えてもらいました。

丁寧に教えていただき、無事終了。

「スイカゲームを作ってください」という指示だけで10分ぐらいで完成。

「すごい時代がきたな。」

すごいのはわかったけどどう使おう💦

・アイデアを見てみる

すごいのはわかったけど何に使おう・・・。

一人で考えていても何も思いつきません。

Coworkの「アイデア」を押してみると・・・

2026-04-05 8.49の画像.pngいろいろな活用方法が出てきました。

・Claudeで何ができるかな?オフ会に参加

導入した次の日に「Claudeで何ができるかな?」という雑談しようオフ会があったので参加しました。

みなさん、「すごいのはわかったけどどう使おう・・・」という同じ悩みを持った方が多かったです。

いろいろ雑談をする中で、ずっと作ってみたかった「自閉症の子供の朝の支度をスムーズにするアプリ」が作れるといいなと呟いていると、その場で聞きながら作ってみてくださった方がいて、「こんなのがあっという間に作れたよ!」と、できたものを見せてくれました。自分がイメージした通りのアプリがあっという間に完成していました。どんな指示をしたかも教えていただき、自分でもやってみよう!と思えました。大感謝です!!!

自分でウェブアプリ作りにチャレンジ!

家に帰って、早速アプリ作りをしてみました。

まずは、Coworkで作ってみました。

「自閉症の子供が朝の支度をするときに使うアプリ。終わったものを自分でチェックできるようにしたい。全部チェックし終わると、子供の大好きな絵が完成して、「頑張ったね」と声で褒めてほしい。朝の支度は後からでもお母さんが追加変更できるようにしたい。ご褒美の絵もお母さんが探してきたものを使えるようにしたい。出来上がったアプリをnoteで紹介したいので、コピーして、誰でも見られる形式にしてほしい。」

とお願いしてみました。最初にできたのが

stupendous-cactus-97a216.netlify.app

⚙️を押すと自由にカスタマイズできます。

さらに5日間続けたら、さらに嬉しいサプライズが起きるようにしたいなと思い、

「タッチで操作できるようにしたい。全部クリアが5日間続くと、さらに嬉しいサプライズが起こるようにしたい。」

とお願いしてみると、

dapper-bublanina-6b1816.netlify.app

改良したものを作ってくれました。


できあがったアプリの機能まとめ:

🧒 子ども画面

顔を洗う・歯を磨く・着替えるなど5つのタスクがデフォルトで入っていますタップするとチェックが入り、パズルのピースが少しずつ外れて絵が現れます全部終わると🎉紙吹雪+「よく がんばったね!」と声で褒めます「もう一度はじめる」ボタンで翌朝リセットできます

👩 お母さん設定(⚙️ボタン → PINコード入力)

初期PINは 0000(あとから変更できます)タスクの追加・変更・削除ができますご褒美の絵を写真フォルダから選んでアップロードできますほめことばを好きな文章に変えられます

⭐ 5日連続達成サプライズ

画面上部に星が5つ並んだ「れんぞくバー」が表示されます。できた日だけ星が輝きます5日連続(または10日・15日…5の倍数の日)に達成すると、虹色に光る画面+トロフィー🏆が飛び出し、大量の紙吹雪が降り注ぎます設定画面から「5日達成のメッセージ」も自由に変えられます

・最初の画面

IMG_0012.jpeg・設定(⚙️を押す。あいことばの初期設定は0000)

IMG_0013.jpegIMG_0016.jpegIMG_0017.jpeg・設定後のアプリ画面

IMG_0018.jpegIMG_0019.jpegCodeでも同じ指示で作ってみました。

Codeでも同じ指示で作ってみました。

できたのがこちらです。

admirable-moonbeam-8b03a9.netlify.app

使い方はほぼ同じです。

自分が気づいたCoworkとCodeの違いは、

作ったものの保存の仕方?が違うだけでした💦

本当はいろいろ違うんだと思うのですが、これから勉強していきます。

Claudeを使ってみた感想

作ってみたかったウェブアプリが作れてびっくりです。

指示をよく考えてからお願いすれば、そんなにトークンを消費し過ぎる印象はなかったです。

これから、noteの記事づくりの補助ができるものや、楽天ROOMの商品探しの補助などができるものを作ってみたいなと思っています。

オフ会がたくさん開かれているので、いろいろ参加しながらいっぱいチャレンジしていきたいと思います。

2026-04-05 9.29の画像.png

ブックマークに追加した記事は、ブックマーク一覧ページで確認することができます。
あとから読み返したい時に便利です。

たむ@note☆楽天ROOM☆AI

投稿者情報

たむ@note☆楽天ROOM☆AI

ペンギン会員

この記事に、いいねを送ろう! 参考になった記事に、
気軽にいいねを送れるようになりました!
この記事のレビュー(2
  • 会員ID:xV6xAKBJ
    会員ID:xV6xAKBJ
    2026/04/16

    大変参考になりました!こんなに楽しいアプリが作れるのですね?早速試してみたいと思います!ありがとうございます!

    たむ@note☆楽天ROOM☆AI

    投稿者

    2026/04/16

    読んでいただいてありがとうございます😊 アプリはいろいろなものが作れますよ。 いろいろアレンジができるので、自分好みのアプリが作れるのが楽しいです♪

    たむ@note☆楽天ROOM☆AI

    投稿者

  • 会員ID:NDTpt9B3
    会員ID:NDTpt9B3
    2026/04/05

    完成したアプリとその過程のアプリががリンクで実際に拝見できて分かりやすかったです😊ありがとうございます🙇‍♂️

    たむ@note☆楽天ROOM☆AI

    投稿者

    2026/04/05

    読んでいただいてありがとうございました^_^ まだ勉強を始めたばかりなので、いろいろなことにチャレンジしていきたいと思います♪

    たむ@note☆楽天ROOM☆AI

    投稿者