tag:crieit.net,2005:https://crieit.net/tags/TODO%E3%83%AA%E3%82%B9%E3%83%88/feed 「TODOリスト」の記事 - Crieit Crieitでタグ「TODOリスト」に投稿された最近の記事 2023-07-29T05:35:55+09:00 https://crieit.net/tags/TODO%E3%83%AA%E3%82%B9%E3%83%88/feed tag:crieit.net,2005:PublicArticle/18544 2023-07-29T05:35:55+09:00 2023-07-29T05:35:55+09:00 https://crieit.net/posts/Nuxt3-Cloudflare-GooglePlay-64c426ab215c8 【個人開発】アイデア出しから公開・プロモーションまでまとめ(Nuxt3、Cloudflare、GooglePlay) <h1 id="1. はじめに"><a href="#1.+%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB">1. はじめに</a></h1> <p>個人開発の大体の流れがつかめるように、アイデア出しから公開・プロモーションまでをまとめました。</p> <h2 id="1-1. 作ったアプリ"><a href="#1-1.+%E4%BD%9C%E3%81%A3%E3%81%9F%E3%82%A2%E3%83%97%E3%83%AA">1-1. 作ったアプリ</a></h2> <p><a target="_blank" rel="nofollow noopener" href="https://lisble.net/about/"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/2eb38bfc-0efc-d719-9baa-d0967308e507.png" alt="シンプルな買い物リスト-lisble リスブル" width="350"></a></p> <div class="table-responsive"><table> <thead> <tr> <th>About</th> <th>List</th> <th>History</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/01ff7a29-9672-8717-161b-807bfd85f014.png" alt="Aboutページのスクリーンショット.png" width="120" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/1e53b87e-f6d3-8ef8-8646-f66b8c02dbb2.png" alt="リストページのスクリーンショット" width="120" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/64e97b97-f950-2f48-e346-63a506643401.png" alt="履歴ページのスクリーンショット" width="120" height=""></td> </tr> </tbody> </table></div> <div class="table-responsive"><table> <thead> <tr> <th></th> <th>基本操作</th> </tr> </thead> <tbody> <tr> <td>① <strong>リスト作成</strong> ② <strong>買い物完了でチェック</strong> ③ <strong>チェック済みを削除</strong> ※これらの手順だけで簡単操作</td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/33bc7e8d-e258-bdbd-85e4-affb6c585cd9.gif" alt="買い物リスト-lisble リスブルの基本操作" width="160" ></td> </tr> </tbody> </table></div> <p><strong>『<a target="_blank" rel="nofollow noopener" href="https://lisble.net/about/">買い物リスト・メモ - Lisble リスブル</a>』</strong><br /> <div class="table-responsive"><table> <thead> <tr> <th>iOS,PC</th> <th>Android</th> </tr> </thead> <tbody> <tr> <td><a src="https://lisble.net/about/" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/992c120a-33bd-48d1-93cd-d97fde42d22c.png" alt="シンプルな買い物リスト-lisble リスブル" width="250"></a></td> <td><a src="https://play.google.com/store/apps/details?id=net.lisble.twa" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/f92cdde6-21d1-2d3f-b8bf-9fb72a74abde.png" width=230 alt="googlePlayバッジ" ></a></td> </tr> <tr> <td>iOS,PCの方は、PWAの為、メニューから <strong>「ホーム画面に追加」</strong> をお願いします。</td> <td>このアプリは Google Play で入手できます。</td> </tr> </tbody> </table></div></p> <h1 id="2. 0から公開までの流れ"><a href="#2.+0%E3%81%8B%E3%82%89%E5%85%AC%E9%96%8B%E3%81%BE%E3%81%A7%E3%81%AE%E6%B5%81%E3%82%8C">2. 0から公開までの流れ</a></h1> <h2 id="2-1. アイデア"><a href="#2-1.+%E3%82%A2%E3%82%A4%E3%83%87%E3%82%A2">2-1. アイデア</a></h2> <p>1番大事だけど一番頭を悩ませました。<br /> 新しいものか、既存のサービスでの差別化の二択で、はじめてということで後者にしてしまいました。<br /> これからもアンテナをはって次につなげたいです。</p> <p><strong>アイデアの出し方</strong><br /> * とにかく紙に書く<br /> * 不満・面倒・悩み・困っていること<br /> * 人間観察(周りの人)・他業種の業務課題<br /> * 真似 → シンプル化・別分野へ応用・既存のサービスの不満解消<br /> * 海外のサービス調査<br /> * ニッチ・マニアック(自分の強み・趣味)<br /> * 合体・逆</p> <p>既存のサービスの発展系か、何かの組み合わせか<br /> 思いついたらメモ 📝</p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://shuheblog.com/programing-app-idea-creative">アプリ開発でアイデアが浮かばないあなたへ。独創的なアイデアの出し方</a><br /> <a target="_blank" rel="nofollow noopener" href="https://qiita.com/MasatoraAtarashi/items/eec4642fe1e6ce79304d">ポートフォリオや個人開発で使えそうなアイデア</a></p> <h2 id="2-2. 要件定義"><a href="#2-2.+%E8%A6%81%E4%BB%B6%E5%AE%9A%E7%BE%A9">2-2. 要件定義</a></h2> <p><strong>①要件(こうだったらいいな)</strong><br /> * 出来る、出来ないを考えずあげていく</p> <p><strong>②要件の為の機能</strong><br /> * ここで出来る、出来ないを考える<br /> * 最低限必要な機能を絞る<br /> * 実装方法が思いつかない機能は省略</p> <hr /> <ul> <li>出先で「あれあったかな❓」を解決したい → 買い物履歴を残して最近買ったものをわかるようにする機能</li> <li>在庫の把握・重複購入を減らしたい → 買い物履歴から同じ単語入力時に色の変化で知らせる → 入力中に知らせることにより在庫を思い出すきっかけにもなる<br /> etc...</li> </ul> <p><strong>③出来ればマネタイズも考える</strong><br /> 1. <strong><em>広告</em></strong>:アフィリエイト、AdSense(web)、AdMob(アプリ)<br /> 2. <strong><em>課金</em></strong>:広告削除、追加コンテンツ、アイテム<br /> 3. <strong><em>寄付</em></strong><br /> 4. <strong><em>有料</em></strong>:買い切り<br /> 5. <strong><em>サブスク</em></strong>:月額制</p> <p>とにかく一連の流れを経験したく、マネタイズまでの道のりが見えたのが本アプリ案で、結果Amazonアソシエイト、AdSenseになりました。<br /> AdSenseは受かりませんでした。継続して挑戦します。</p> <p><strong>④利用技術</strong><br /> 🔑 <strong><em>ログイン・ユーザー登録無し</em></strong>、、広告も可でとにかく<strong><em>お金をかけずに</em></strong>を優先して、SPAで制作することにしました。<br /> - GooglePlay Developer 申請・登録25ドル(当時3,352円)<br /> - 独自ドメイン Xserverドメイン 初年度のみ1円<br /> - 更新、移管はCloudflare予定</p> <p><strong><em>アイデア・デザイン</em></strong><br /> Xmind(マインドマッピング)<br /> Figma<br /> <strong><em>コード</em></strong><br /> Nuxt3(Composition API)・TypeScript・Tailwind CSS<br /> <strong><em>インフラ</em></strong><br /> Cloudflare<br /> <strong><em>開発環境</em></strong><br /> VSCode・Git、GitHub</p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://tenshoku-miti.com/takahiro/create-original-application/">【5ステップ】初めてのオリジナルアプリの作り方!アイデアの出し方も公開</a></p> <h2 id="2-3. 設計"><a href="#2-3.+%E8%A8%AD%E8%A8%88">2-3. 設計</a></h2> <p><strong>①画面設計</strong><br /> 1. 必要なページ列挙 ➡ 階層・整理<br /> 2. ワイヤーフレーム(紙手書き)下書き<br /> 3. ワイヤーフレーム(figma)清書</p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://b-risk.jp/blog/2019/10/wireframe/">ワイヤーフレーム(画面設計)の作り方</a><br /> <a target="_blank" rel="nofollow noopener" href="https://aqcg.jp/web_point/">Web画面設計の手順と重要なポイント</a></p> <p><strong>デザインの4原則</strong><br /> 1. 「<strong><em>近接</em></strong>」:関連する要素を<strong><em>グループ化</em></strong><br /> 2. 「<strong><em>整列</em></strong>」:関連する要素を<strong><em>見えない線</em></strong>で整列<br /> 3. 「<strong><em>反復</em></strong>」:要素の<strong><em>一貫性</em></strong>、デザインの<strong><em>統一</em></strong><br /> 4. 「<strong><em>対比</em></strong>」:要素の優先度を<strong><em>強弱</em></strong>で示す</p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://designpartner.jp/principle/#:~:text=%E3%80%8C%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%AE4%E5%8E%9F%E5%89%87%E3%80%8D%E3%81%AF,%E3%82%B7%E3%83%BC%E3%83%B3%E3%81%A7%E3%82%82%E5%BD%B9%E7%AB%8B%E3%81%A4%E3%81%A7%E3%81%97%E3%82%87%E3%81%86%E3%80%82">お役立ち知識:デザインの4原則 - デザインパートナー</a></p> <p><strong>②データ設計(構造)</strong><br /> * データの設計図</p> <h2 id="2-4. 開発"><a href="#2-4.+%E9%96%8B%E7%99%BA">2-4. 開発</a></h2> <ul> <li>設計通りに作る</li> <li>最低限の機能</li> <li>制作途中で機能の追加案を我慢して、とにかく完成させることに集中する(追加の機能を制作してしまいました。なのでここに残しておきます。)</li> </ul> <p><strong>①工夫した機能</strong><br /> - <strong>並べ替え(D&D)・スワイプ機能</strong>をライブラリ(Vue.Draggableは、思うような機能にならなかった)を使用せずに作成<br /> - ↳シンプル化のため、<strong>同じ発火点</strong>で、<strong>参考サイト様</strong>(<a target="_blank" rel="nofollow noopener" href="https://reffect.co.jp/vue/trello-drag-drop-clone/">Trello風タスク並び替えドラッグ&ドロップクローン(Vue.js利用)</a>)を参考に、【<strong>マウス、タッチ、処理回数削減、d&dとswipeの融合、グループ間並べ替え、d&d中の上下の画面端scroll</strong>】ロジックを考え自作しました。</p> <div class="table-responsive"><table> <thead> <tr> <th>並び替え機能</th> <th>スワイプ</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/30495dd3-fec4-c791-cb39-a1c09f78003d.gif" alt="買い物リスト-lisble リスブルの並べ替え動作" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/cb611a1f-9124-472b-1a26-b7c4f53f8ecc.gif" alt="買い物リスト-lisble リスブルのスワイプ動作" width="150" height=""></td> </tr> <tr> <td></td> <td>←<strong>色</strong>  →<strong>削除</strong>※タッチデバイスのみ</td> </tr> </tbody> </table></div> <ul> <li>スマホとPCの<strong>挙動の違い</strong>など(ENTER、終了時の処理...)</li> <li>日本、世界の<strong>日時の表示形式</strong>(履歴)</li> <li>Amazonアソシエイトの各国の設定(<strong><em>OneLink</em></strong>)</li> <li>アニメーション(数字のドラムロール、追加削除時...)etc...</li> </ul> <p><strong>②多言語化(i18n)</strong><br /> <strong>@intlify/nuxt3</strong>使用<br /> 日/英で単語の長さの違いによる表示崩れに注意</p> <hr /> <p><strong><em>未解決問題</em></strong><br /> 日本語で検索時、検索結果が英語サイトのtitleとdescriptionになってしまう問題(同じURLで 日/英 にしたい)</p> <p><strong><em>確認</em></strong><br /> meta tagの設定(title、description等)日/英 切替時にきちんと切り替わっている。</p> <p><strong><em>↓ためしたこと↓</em></strong><br /> - <a target="_blank" rel="nofollow noopener" href="https://zenn.dev/koushikagawa/articles/32ef098e0698c7">Nuxt.jsのi18n多言語対応したら、日本語で検索した時の検索結果が英語になってしまった。解決できたので対応方法を記載します。</a><br /> - <strong>@intlify/nuxt3</strong> で <code>detectBrowserLanguage: false,</code>にあたる設定がない??<br /> - sitemapの設定 (hreflang属性)<br /> - Google Search Consoleに日/英を認識させる方法??...<br /> - (2023年7月) Nuxt3での多言語化はまだ開発中らしいので情報待ち🍥 → <a target="_blank" rel="nofollow noopener" href="https://github.com/intlify/nuxt3">intlify/nuxt3: Nuxt 3 Module for vue-i18n-next</a></p> <hr /> <p><strong>③プライバシーポリシー</strong><br /> <strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://biz.moneyforward.com/contract/basic/1237/">プライバシーポリシーとは何か?必要性、記載事項をわかりやすく解説</a></p> <p><strong>④テスト</strong><br /> - 個人情報を扱っているなら、徹底的に安全確認<br /> - 例外処理</p> <h2 id="2-5. 公開"><a href="#2-5.+%E5%85%AC%E9%96%8B">2-5. 公開</a></h2> <p><strong>①(SPA SSG) 静的ファイルホスティングサービス【無料】</strong><br /> 1. GitHub Pages<br /> 2. Firebase Hosting<br /> 3. Netlify<br /> 4. Vercel<br /> 5. <strong><em>Cloudflare Pages</em></strong></p> <p>無料プランの枠・サイトのパフォーマンス・商用利用可で<strong><em>Cloudflare Pages</em></strong></p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://zenn.dev/catnose99/scraps/6780379210136f">Cloudflare Pages・Vercel ・Netlify の違いや使い分けをまとめる</a><br /> <a target="_blank" rel="nofollow noopener" href="https://jpsern.com/netlify-to-cloudflare-pages/">NetlifyからCloudflare Pagesに引っ越しました</a></p> <p><strong>②Google Play Store 配信方法</strong><br /> <strong><em>PWA → TWA</em></strong><br /> * TWA変換ツール「<strong><em>Bubblewrap CLI</em></strong>」使用<br /> * Lighthouse で <strong><em>80</em></strong> 以上のパフォーマンス スコアが必要(↓に記述)</p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://flaming.codes/ja/posts/trusted-web-activity-create-pwa-android-app">信頼できるWebアクティビティ</a><br /> <a target="_blank" rel="nofollow noopener" href="https://0115765.com/archives/7932#outline__2_2">【TWA】完全開発ガイド=超簡単にPWAをPlay Storeで配信しよう</a><br /> <a target="_blank" rel="nofollow noopener" href="https://sqripts.com/2022/12/14/22480/">PWA対応サイトをAndroid APK(AAB)に変換する</a></p> <p><strong>③Lighthouse のパフォーマンス改善(リファクタリング)</strong><br /> - <strong><em>cssの最適化</em></strong> → 読み込み順、削除、animation(<code>transform</code>,<code>opacity</code>...)etc...<br /> - <strong><em>googleFonts, Analytics</em></strong> → GTM使用、読み込むタイミング、読み込み方、文字の限定etc...<br /> - <a target="_blank" rel="nofollow noopener" href="https://deep-space.blue/web/2090">【2022年3月】Google Fontsのパフォーマンス比較&ハリー・ロバーツ方式の勝手に改良版</a><br /> - <a target="_blank" rel="nofollow noopener" href="https://nullnull.dev/blog/google-fonts-subset/#%F0%9F%8F%A9______________________%F0%9F%91%A8%F0%9F%91%A9">Google Fontsを簡単にサブセット化する方法</a><br /> - <strong><em>Web Worker</em></strong> → 並列処理 <a target="_blank" rel="nofollow noopener" href="https://note.com/npaka/n/nc930b61840ac">Web Workerの使い方</a><br /> - <code>requestAnimationFrame()</code> → 「60fps」 <a target="_blank" rel="nofollow noopener" href="https://www.webdesignleaves.com/pr/jquery/requestAnimationFrame.html">requestAnimationFrame の使い方</a><br /> etc...</p> <p>Mobile :arrow_down:<br /> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/ea2d91d0-76be-ff81-0c8f-ee55669bf1e6.png" alt="Lighthouseモバイルのスコア" width="500" height=""><br /> Desktop :arrow_down:<br /> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/23080b76-e970-9ecb-b92d-3f873b2878e7.png" alt="Lighthouseデスクトップのスコア" width="500" height=""></p> <h2 id="2-6. リリース後"><a href="#2-6.+%E3%83%AA%E3%83%AA%E3%83%BC%E3%82%B9%E5%BE%8C">2-6. リリース後</a></h2> <p><strong>①掲載用スクリーンショット、画像作成</strong><br /> * figma制作<br /> * サイトにより、サイズ、比率、枚数、が異なる</p> <p><strong>②登録サイトに投稿/掲載依頼</strong><br /> 当たって砕けろ、チャレンジ精神で色々掲載依頼を出してみた結果です。<br /> <a target="_blank" rel="nofollow noopener" href="https://zenn.dev/yamatake/articles/b93d87ed134f31">個人開発者に告ぐ!「告知=恥ずかしい」を脱却しよう~実例データから重要性を解説</a></p> <p><strong><em>登録or掲載</em></strong> → 🎉<br /> メール・問い合わせ反応待ち → 📧<br /> 更新が止まっているサイトが多い</p> <p><strong>日本</strong><br /> - <a target="_blank" rel="nofollow noopener" href="https://app-liv.jp/5347459/"><strong><em>Appliv</em></strong></a> → 🎉 <strong><em>レビュー</em></strong>、とても丁寧な対応 :thumbsup:<br /> - <a target="_blank" rel="nofollow noopener" href="https://applion.jp/android/app/net.lisble.twa/"><strong><em>APPLION</em></strong></a> → 🎉 ランキング<br /> - <a target="_blank" rel="nofollow noopener" href="http://houkago-no.appspot.com/app_detail/6278466848686080"><strong><em>放課後アプリ部</em></strong></a> →🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://applishow.com/detail/DsL3Q4b5hxxm/"><strong><em>Applishow</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://www.approom.me/app/01H2J1N7SXF5JSH8ZMMDMGBF2V?platform_id=2"><strong><em>AppRoom</em></strong></a> → 🎉 登録 <a target="_blank" rel="nofollow noopener" href="https://www.approom.me/articles/01H2JGWJ3K3J72WVN7EJT5CKYD"><strong><em>アプリ記事掲載</em></strong></a><br /> - <a target="_blank" rel="nofollow noopener" href="https://seekups.seekgeeks.net/views/detail.html?id=712"><strong><em>SeekUps</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://rrws.info/archives/3197"><strong><em>ロケットリリース</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://appstimes.jp/posts/2991"><strong><em>Appstimes</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://anymake.app/products/kAjQm0f6tswHGaKTd0G5"><strong><em>AnyMake</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://www.makepost.net/projects/386"><strong><em>makepost</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://www.mitsukarusite.jp/2023/06/550/"><strong><em>MITSUKARU!</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://devhaunt.com/product/111"><strong><em>DevHaunt!</em></strong></a> →🎉 登録、とても丁寧な対応 👍<br /> - <a target="_blank" rel="nofollow noopener" href="https://kojin.dev/application/41"><strong><em>個人dev</em></strong></a> → 🎉 登録<br /> - <a target="_blank" rel="nofollow noopener" href="https://appget.com/c/developerpage/createdevpost/"><strong><em>アプリゲット</em></strong></a> → ゲームのみ<br /> - <a target="_blank" rel="nofollow noopener" href="https://www.appbank.net/"><strong><em>AppBank</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://applision.com/review/"><strong><em>Applision</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://tsukulog.work/"><strong><em>ツクログ</em></strong></a> → 📧 クリエイター登録済み、まだ作品は掲載されない(2度投稿)<br /> - <a target="_blank" rel="nofollow noopener" href="https://octoba.net/"><strong><em>octoba</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://newlaun-ch.com/"><strong><em>NewLaun-ch</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://appllio.com/"><strong><em>appllio</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://appnavi.info/"><strong><em>appnavi</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://androlion.org/"><strong><em>Androライオン</em></strong></a> → 📧条件:レビュー<br /> - <a target="_blank" rel="nofollow noopener" href="https://androrank.com/?m=send"><strong><em>AndroRank</em></strong></a> → 📧条件:レビュー<br /> - <a target="_blank" rel="nofollow noopener" href="https://android-apps.org/"><strong><em>Androidアップス</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://softcollection.org/android/"><strong><em>Androidコレクション</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://news.mynavi.jp/top/notice/press/"><strong><em>マイナビニュース</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://corp.itmedia.co.jp/pr/"><strong><em>ITmedia</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://corp.itmedia.co.jp/media/pr/"><strong><em>ITmedia ねとらぼ</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://androck.jp/contact/"><strong><em>AndRock</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="http://app-vip.jp/posts/add"><strong><em>AppVIP</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://applink.jp/request"><strong><em>AppLink</em></strong></a> → 📧<br /> - <a target="_blank" rel="nofollow noopener" href="https://www.gapsis.jp/"><strong><em>GAPSIS</em></strong></a> → 📧</p> <hr /> <p><strong>海外</strong></p> <ul> <li><a target="_blank" rel="nofollow noopener" href="https://www.producthunt.com/my/products"><strong><em>Product Hunt</em></strong></a> → 🎉 登録から1週間待つ必要がある</li> <li><a target="_blank" rel="nofollow noopener" href="https://alternativeto.net/software/shopping-list--lisble/about/"><strong><em>AlternativeTo</em></strong></a> → 🎉 登録</li> <li><a target="_blank" rel="nofollow noopener" href="https://appstoreapps.com/submit-your-app/"><strong><em>app store apps</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.appcraver.com/contact-us/"><strong><em>AppCraver</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://arstechnica.com/contact-us/"><strong><em>arttechnica</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.androidappsreview.com/submit-your-android-app/"><strong><em>Apps Review</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://androidcommunity.com/send-tips/"><strong><em>community</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="http://www.androidapplog.com/suggest-app/"><strong><em>App Log</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://getandroidstuff.com/submit-app/"><strong><em>Get Android Stuff</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.androidguys.com/request-app-review/"><strong><em>Android Guys</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.androlib.com/"><strong><em>androlib</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.apkmirror.com/"><strong><em>APKMirror</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="http://appscout.pcmag.com/"><strong><em>PCMag</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.newsreports.com/contact/"><strong><em>NEWSREPORTS</em></strong></a> → 📧</li> <li><a target="_blank" rel="nofollow noopener" href="https://www.ifanzine.com/contact/"><strong><em>iFanzine</em></strong></a> → 📧</li> </ul> <hr /> <p>※上記以外で無料で宣伝できるサイト、方法があれば教えていただけると嬉しいです。</p> <p><strong>③記事を書く</strong><br /> - Qiita<br /> - <a target="_blank" rel="nofollow noopener" href="https://qiita.com/arieight/items/7935afdaf78d31f8b444">【Nuxt3】はじめての個人開発「買い物リストアプリ」開発記録</a><br /> - Zenn<br /> - <a target="_blank" rel="nofollow noopener" href="https://zenn.dev/arieight/articles/55ec7a38edb940">Nuxt3で初めての個人開発記録【買い物リストアプリ】</a><br /> - Crieit<br /> - <a href="https://crieit.net/posts/Lisble-64bfaf0e5e2b7">シンプルな買い物リストアプリ「lisble リスブル 」の紹介</a><br /> - 【個人開発】アイデア出しから公開・プロモーションまでまとめ(Nuxt3、Cloudflare、GooglePlay)<br /> - note<br /> - <a target="_blank" rel="nofollow noopener" href="https://note.com/arieight/n/nc8cace276feb">値上げ対策! 買い物リスト作成で節約</a><br /> - <a target="_blank" rel="nofollow noopener" href="https://note.com/arieight/n/ne70e5e3865f3">シンプルな買い物リストアプリ「Lisble リスブル 」のご紹介</a><br /> - Medium(英語記事)<br /> - <a target="_blank" rel="nofollow noopener" href="https://medium.com/@arieight_8/price-increase-measures-save-money-by-making-a-shopping-list-120cec400b15">Price increase measures! Save money by making a shopping list</a></p> <p><strong>④Twitter(日本語/英語)</strong><br /> - Twitter日本語ver.:<a target="_blank" rel="nofollow noopener" href="https://twitter.com/arieight_8">@arieight_8</a><br /> - Twitter英語ver.:<a target="_blank" rel="nofollow noopener" href="https://twitter.com/Lisble_en">@Lisble_en</a><br /> - 登録or掲載 → つぶやく<br /> - 機能一覧、設定一覧、動画(gif)でツイート<br /> - 開発中からつぶやいた方が良い</p> <p><strong><em>参考サイト</em></strong><br /> <a target="_blank" rel="nofollow noopener" href="https://www.producthunt.com/posts/shopping-list-lisble">個人開発したWebサービスをリリースした後にやったこと / やり続けていること</a></p> <h1 id="3. 気付き・反省点・まとめ"><a href="#3.+%E6%B0%97%E4%BB%98%E3%81%8D%E3%83%BB%E5%8F%8D%E7%9C%81%E7%82%B9%E3%83%BB%E3%81%BE%E3%81%A8%E3%82%81">3. 気付き・反省点・まとめ</a></h1> <ul> <li>開発を0からして、初めてコードをさわって新しい概念にふれた時くらい勉強になり、とても知見が広がり良かったです。</li> <li>プログラミング以外の作業が初だったので「プログラミング:他 = 3:7」くらいの感覚でした。様々なデザインが予想より大変でした。</li> <li>一番面白いと感じた作業は、ロジックを考えて形になった時でした。<br />  </li> <li><strong>アイデア</strong> → 紙やXMindに思いつく限りまとめたのですが、総合的な判断で結局既存のサービスに追加機能の方向になってしまいました。マネタイズまで含めたアイデアが難しいです。どうせやるなら一通りやってみたかったので次回以降にしました。常にアンテナをはって知見を広げていいこうと思いました。</li> <li><strong>要件定義</strong> → 運用費がかからない、個人情報は扱わない、AdSense以外のマネタイズまで考える、などを考慮してアイデアを絞り、考え、すでにあるサービスと見比べ、アイデアと要件定義をぐるぐるしていました。</li> <li>AdSenseは、コンテンツ不足でwebアプリは受かりづらいらしいです。</li> <li><strong>利用技術</strong> → 平凡なアイデアだったので初めて挑戦する技術(Nuxt3、TypeScript、etc...)を使用してしまいました。</li> <li>デプロイ先など、お金をかけずに運用していくための他の効率の良い方法やサービスを引き続き調査していきます。(Firebaseをデータベース等)</li> <li><strong>設計</strong> → 画面デザインは、UI足したら引き算・データ設計は構造整理</li> <li><strong>開発</strong> → 追加の機能を制作してしまいました。最低限の機能でまず完成を目指すべき</li> <li><strong>工夫した機能</strong> → ToDoの変化型アプリで平凡なアプリで非常に多く数があるため、機能にこだわりました。</li> <li>多言語化して作業が増えた。[Amazon設定、時間形式、表示崩れ、metaタグ、etc...]</li> <li><strong>テスト</strong> → 多視点が重要</li> <li><strong>公開</strong> → 運用費をかけないにこだわる</li> <li><strong>パフォーマンス改善</strong> → 良い学習</li> <li><strong>マネタイズ</strong> → Amazonまでの導線が弱い 要検討</li> <li>著作権・プライバシーポリシー・DDoS対策etc...</li> <li><strong>プロモーション</strong> → Twitterは開発中から・アイデア段階でSNSを考慮したサービス・地道にor金をかけるか・個人の場合限られるので勉強段階からブログや記事など書いておけばまた違ったかも</li> <li>「告知=恥ずかしい」があったので、経験せずにはわからないからできることは全部しようと思いました。</li> </ul> <p>作る前に想像していたよりコード以外の作業が多いとうことに改めて気付かされました。<br /> 制作中、何度も宇宙兄弟のセリフが脳内再生してました。ありがとうございました。</p> <hr /> <blockquote> <p>「また積めばいいよ」<br /> 「次はもっと上手く積めるようになってるよ」<br /> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/54752648-2273-f10c-d125-ea6abc68e562.jpeg" alt="『宇宙兄弟』17巻 小山 宙哉「また積めばいいよ」" width="300"><br /> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/9d577b8b-90ef-2e69-8d2b-2e67ebfb9794.jpeg" alt="『宇宙兄弟』17巻 小山 宙哉「次はもっと上手く積めるようになってるよ」" width="300"><br /> 出典: 『宇宙兄弟』17巻 小山 宙哉(講談社、2012年3月23日第1発行)</p> </blockquote> <hr /> <p>購入履歴が残せるシンプルな買い物リストアプリ <strong><em>『買い物リスト - Lisble リスブル』</em></strong> です。メモ、ToDoアプリとしても機能します。<br /> 購入履歴の保存機能により、無駄な重複購入を防ぎ、在庫の備忘録にもなります。<br /> ログイン・ユーザー登録不要、無料ですぐにご利用いただけます。<br /> もしよかったら、触ってみてください。</p> <p><strong>『<a target="_blank" rel="nofollow noopener" href="https://lisble.net/about/">買い物リスト・メモ - Lisble リスブル</a>』</strong><br /> <div class="table-responsive"><table> <thead> <tr> <th>iOS,PC</th> <th>Android</th> </tr> </thead> <tbody> <tr> <td><a src="https://lisble.net/about/" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/992c120a-33bd-48d1-93cd-d97fde42d22c.png" alt="シンプルな買い物リスト-lisble リスブル" width="250"></a></td> <td><a src="https://play.google.com/store/apps/details?id=net.lisble.twa" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/f92cdde6-21d1-2d3f-b8bf-9fb72a74abde.png" width=230 alt="googlePlayバッジ" ></a></td> </tr> <tr> <td>iOS,PCの方は、PWAの為、メニューから <strong>「ホーム画面に追加」</strong> をお願いします。</td> <td>このアプリは Google Play で入手できます。</td> </tr> </tbody> </table></div></p> <p>Twitter:<a target="_blank" rel="nofollow noopener" href="https://twitter.com/arieight_8">@arieight_8</a></p> <hr /> <p>Google Play および Google Play ロゴは、Google LLC の商標です。</p> Arieight tag:crieit.net,2005:PublicArticle/18538 2023-07-25T20:16:30+09:00 2023-07-25T20:16:30+09:00 https://crieit.net/posts/Lisble-64bfaf0e5e2b7 シンプルな買い物リストアプリ「Lisble リスブル 」について <h1 id="1. はじめに"><a href="#1.+%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB">1. はじめに</a></h1> <p><strong>シンプルな買い物リスト・メモ - Lisble リスブル</strong><br /> アプリの解説・紹介をするために記事を書きました。</p> <p><strong>シンプルな買い物リスト</strong>のアプリです。メモ、ToDoアプリとしても機能します。<strong>ログイン・ユーザー登録不要、無料</strong>ですぐにご利用いただけます。</p> <p>「<strong>買い忘れ、衝動買い、同じものを買ってしまう、出先での在庫確認、ネットショップとの比較など</strong>」考える事が多く、余計な負担だったので、リストをつけることにより改善したいと思いました。<br /> <strong>購入履歴の保存機能</strong>は、<strong>在庫の備忘録</strong>にもなります。また買い物中の操作性を重視し、レイアウトの<strong>左/右切り替え</strong>が可能です。<br /> 事前に買うべきものをメモしておくことで、より計画的に買い物をして、結果的に節約につながります。</p> <h1 id="2. 買い物リストアプリ「Lisble リスブル 」について"><a href="#2.+%E8%B2%B7%E3%81%84%E7%89%A9%E3%83%AA%E3%82%B9%E3%83%88%E3%82%A2%E3%83%97%E3%83%AA%E3%80%8CLisble+%E3%83%AA%E3%82%B9%E3%83%96%E3%83%AB+%E3%80%8D%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6">2. 買い物リストアプリ「Lisble リスブル 」について</a></h1> <p><a target="_blank" rel="nofollow noopener" href="https://lisble.net/about/"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/2eb38bfc-0efc-d719-9baa-d0967308e507.png" alt="シンプルな買い物リスト-Lisble リスブル" width="350"></a></p> <p><strong>『<a target="_blank" rel="nofollow noopener" href="https://lisble.net/about/">買い物リスト・メモ - Lisble リスブル</a>』</strong><br /> <div class="table-responsive"><table> <thead> <tr> <th>iOS,PC</th> <th>Android</th> </tr> </thead> <tbody> <tr> <td><a src="https://lisble.net/about/" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/992c120a-33bd-48d1-93cd-d97fde42d22c.png" alt="シンプルな買い物リスト-Lisble リスブル" width="250"></a></td> <td><a src="https://play.google.com/store/apps/details?id=net.lisble.twa" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/f92cdde6-21d1-2d3f-b8bf-9fb72a74abde.png" width=230 alt="googlePlayバッジ" ></a></td> </tr> <tr> <td>iOS,PCの方は、PWAの為、メニューから <strong>「ホーム画面に追加」</strong> をお願いします。</td> <td>このアプリは Google Play で入手できます。</td> </tr> </tbody> </table></div></p> <h2 id="2-1. アプリの概要"><a href="#2-1.+%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E6%A6%82%E8%A6%81">2-1. アプリの概要</a></h2> <p>購入履歴が残せるシンプルな買い物リストのアプリです。メモ、ToDoアプリとしても機能します。<strong>ログイン・ユーザー登録不要、無料</strong>ですぐにご利用できます。</p> <div class="table-responsive"><table> <thead> <tr> <th>About</th> <th>List</th> <th>History</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/01ff7a29-9672-8717-161b-807bfd85f014.png" alt="Aboutページのスクリーンショット.png" width="120" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/1e53b87e-f6d3-8ef8-8646-f66b8c02dbb2.png" alt="リストページのスクリーンショット" width="120" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/64e97b97-f950-2f48-e346-63a506643401.png" alt="履歴ページのスクリーンショット" width="120" height=""></td> </tr> </tbody> </table></div> <h2 id="2-2. アプリの3つの特徴"><a href="#2-2.+%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE3%E3%81%A4%E3%81%AE%E7%89%B9%E5%BE%B4">2-2. アプリの3つの特徴</a></h2> <p><strong>① 買い物中の操作性(UI,UX)</strong><br /> 片手操作での誤操作防止のため編集機能を片側に寄せ、かつ <strong>左/右 表示切替可能</strong>。<br /> チェックしたメモ、まだしていないメモを切り替え、すぐに確認できるようにしました。</p> <p><strong>② 購入履歴の保存</strong><br /> <strong>日付時間と共に保存</strong>をして、入力時に同一品目を色の変化でお知らせをします。<br /> 購入履歴を残すことにより、直近で購入したものがわかり、無駄な重複買いと共に在庫を思い出すきっかけにもなると思いました。</p> <p><strong>③ Amazon検索</strong><br /> 入力したメモをそのまま<strong>Amazon検索</strong>できます。買い物中の値段の比較や、欲しいものリストとしてご活用してもらえればと思いました。</p> <h2 id="2-3. アプリの画面案内"><a href="#2-3.+%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E7%94%BB%E9%9D%A2%E6%A1%88%E5%86%85">2-3. アプリの画面案内</a></h2> <div class="table-responsive"><table> <thead> <tr> <th></th> <th>スマホ</th> </tr> </thead> <tbody> <tr> <td>① <strong>購入履歴へ</strong> ② <strong>メニュー</strong>(移動・設定) ③ <strong>タブ切り替え</strong> ④ <strong>↑↓並べ替え</strong> ④ <strong>←色、→削除</strong> ⑤ <strong>編集</strong> ⑥ <strong>チェック</strong> ⑦ <strong>リスト追加</strong> ⑧ <strong>「チェックあり」のみ削除</strong> ⑨ <strong>すべて削除</strong></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/bb63d0a7-c937-4b2b-e913-8230c118d9fb.png" alt="スクリーンショット" width="350" height=""></td> </tr> </tbody> </table></div> <div class="table-responsive"><table> <thead> <tr> <th></th> <th>タブレット・PC</th> </tr> </thead> <tbody> <tr> <td>① <strong>編集</strong> ② <strong>色</strong> ③ <strong>削除</strong> ④ ↑↓ <strong>並べ替えのみ</strong></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/a75aec69-901c-d87e-0411-b5c40e23b409.png" alt="スクリーンショット" width="405" height=""></td> </tr> </tbody> </table></div> <h2 id="2-4. アプリの基本操作"><a href="#2-4.+%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E5%9F%BA%E6%9C%AC%E6%93%8D%E4%BD%9C">2-4. アプリの基本操作</a></h2> <p>①②③これらの手順だけで簡単操作<br /> <div class="table-responsive"><table> <thead> <tr> <th></th> <th>基本操作</th> </tr> </thead> <tbody> <tr> <td>① <strong>リスト作成</strong> ② <strong>買い物完了でチェック</strong> ③ <strong>チェック済みを削除</strong> ※これらの手順だけで簡単操作</td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/33bc7e8d-e258-bdbd-85e4-affb6c585cd9.gif" alt="買い物リスト-lisble リスブルの基本操作" width="160" ></td> </tr> </tbody> </table></div></p> <h2 id="2-5. アプリの機能一覧"><a href="#2-5.+%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E6%A9%9F%E8%83%BD%E4%B8%80%E8%A6%A7">2-5. アプリの機能一覧</a></h2> <div class="table-responsive"><table> <thead> <tr> <th>並び替え機能</th> <th>スワイプ</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/30495dd3-fec4-c791-cb39-a1c09f78003d.gif" alt="買い物リスト-lisble リスブルの並べ替え動作" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/cb611a1f-9124-472b-1a26-b7c4f53f8ecc.gif" alt="買い物リスト-lisble リスブルのスワイプ動作" width="150" height=""></td> </tr> <tr> <td></td> <td>←<strong>色</strong>  →<strong>削除</strong>※タッチデバイスのみ</td> </tr> </tbody> </table></div> <div class="table-responsive"><table> <thead> <tr> <th>タブ切り替え</th> <th>Amazon検索</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/db8c743b-1789-98a7-0c26-82adbef8733e.gif" alt="買い物リスト-lisble リスブルのタブ動作" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/e0d457fa-a1c3-3b28-b90e-fe67f86ffba6.png" alt="買い物リスト-lisble Amazon検索のイメージ" width="170" height=""></td> </tr> <tr> <td><strong>すべて、チェックあり、なし</strong></td> <td>そのまま<strong>Amazon検索</strong></td> </tr> </tbody> </table></div> <div class="table-responsive"><table> <thead> <tr> <th>購入履歴の保存</th> <th>重複買い防止</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/4c03d104-0d05-234f-f56b-ff150451077a.gif" alt="買い物リスト-lisble リスブルの買い物履歴・削除動作" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/72a81f65-8c27-f1cb-84c5-74fbf3d8680b.gif" alt="買い物リスト-lisble リスブルの重複購入防止動作" width="150" height=""></td> </tr> <tr> <td><strong>1. チェックあり削除</strong> <strong>2. 購入履歴の保存</strong></td> <td>履歴と同じ品目を入力時に<strong>色の変化</strong>でお知らせ</td> </tr> </tbody> </table></div> <div class="table-responsive"><table> <thead> <tr> <th>続けて追加</th> <th>全削除</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/93b63cdc-c10b-5f6c-c8c6-18bdfe229f2c.png" alt="追加ボタン" width="50" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/9e640615-6745-b110-9de7-37df2827ba6f.png" alt="全削除ボタン" width="100" height=""></td> </tr> <tr> <td><strong>+ボタン、ENTERキー</strong></td> <td>チェック済みは<strong>購入履歴に保存</strong></td> </tr> </tbody> </table></div> <h2 id="2-6. アプリの設定"><a href="#2-6.+%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E8%A8%AD%E5%AE%9A">2-6. アプリの設定</a></h2> <div class="table-responsive"><table> <thead> <tr> <th>テーマカラー</th> <th>レイアウト</th> <th>多言語</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/e1de9ced-0089-d47b-9108-45c7354bf927.png" alt="買い物リスト-lisble リスブルのテーマカラー5種" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/31cc5133-da53-b9e0-6419-6fbc7fe6fda6.png" alt="買い物リスト-lisble リスブルのレイアウトの左/右切り替え" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/f318e886-f667-3430-e50b-0a36c2eccb27.png" alt="買い物リスト-lisble リスブルの英語表示" width="129" height=""></td> </tr> <tr> <td>5種</td> <td>片手操作での誤操作防止(<strong>左利き</strong>)</td> <td><strong>日本語</strong> / <strong>英語</strong></td> </tr> </tbody> </table></div> <div class="table-responsive"><table> <thead> <tr> <th>自動削除</th> <th>入力中のEnterキー操作</th> </tr> </thead> <tbody> <tr> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/cca8e553-c7bf-fd06-99b6-c5fee6f0fa1b.png" alt="買い物リスト-lisble リスブルの自動削除機能" width="150" height=""></td> <td><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/63a179fc-2df2-5456-8ae4-d2565ed27ad9.png" alt="買い物リスト-lisble リスブルの入力中のEnterKeyの挙動" width="150" height=""></td> </tr> <tr> <td>終了時に「<strong>チェックあり</strong>」を<strong>自動削除(保存)機能</strong></td> <td><strong>追加</strong> / <strong>改行</strong> 切り替え</td> </tr> </tbody> </table></div> <hr /> <h1 id="3. 最後に"><a href="#3.+%E6%9C%80%E5%BE%8C%E3%81%AB">3. 最後に</a></h1> <p><strong>購入履歴</strong>が残せるシンプルな買い物リストアプリ 『<strong>買い物リスト - Lisble リスブル</strong>』 です。メモ、ToDoアプリとしても機能します。<br /> <strong>購入履歴の保存機能</strong>により、無駄な重複購入を防ぎ、在庫の備忘録にもなります。<br /> <strong>ログイン・ユーザー登録不要、無料</strong>ですぐにご利用いただけます。<br /> もしよかったら、触ってみてください。</p> <p><strong>『<a target="_blank" rel="nofollow noopener" href="https://lisble.net/about/">買い物リスト・メモ - Lisble リスブル</a>』</strong><br /> <div class="table-responsive"><table> <thead> <tr> <th>iOS,PC</th> <th>Android</th> </tr> </thead> <tbody> <tr> <td><a src="https://lisble.net/about/" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/992c120a-33bd-48d1-93cd-d97fde42d22c.png" alt="シンプルな買い物リスト-lisble リスブル" width="250"></a></td> <td><a src="https://play.google.com/store/apps/details?id=net.lisble.twa" target="_blank" rel="noopener noreferrer" ><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906025/f92cdde6-21d1-2d3f-b8bf-9fb72a74abde.png" width=230 alt="googlePlayバッジ" ></a></td> </tr> <tr> <td>iOS,PCの方は、PWAの為、メニューから <strong>「ホーム画面に追加」</strong> をお願いします。</td> <td>このアプリは Google Play で入手できます。</td> </tr> </tbody> </table></div></p> <hr /> <p>Google Play および Google Play ロゴは、Google LLC の商標です。</p> Arieight tag:crieit.net,2005:PublicArticle/16423 2020-12-25T07:00:11+09:00 2020-12-25T07:00:11+09:00 https://crieit.net/posts/GTD-Todoist 噂のGTDをTodoistで始めるための手順 <p>本記事は、<a href="https://crieit.net/advent-calendars/2020/crieit">Crieit なんでも Advent Calendar 2020</a>の最終日 (12/25) の記事です。</p> <h1 id="TL; DR"><a href="#TL%3B+DR">TL; DR</a></h1> <p>TodoistでのGTDは、悪くはありませんが最適でもありません。<br /> もしGTDに特化したツールがあれば、そちらを使う方がよいことは間違いないでしょう。<br /> 僕はTodoistを使います(意固地)。</p> <p>本記事はTodoistに特化していますが、それ以外のTODOリストのツールでも使える方法があると思います。</p> <h1 id="はじめに"><a href="#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB">はじめに</a></h1> <p>「タスク管理にTODOリストを使おう」と思い立っては三日坊主で辞めてしまう、という経験を何度もしており、4年前からアカウントを持っているTodoistを持て余していました。</p> <p><a target="_blank" rel="nofollow noopener" href="https://todoist.com/ja">Todoist: ToDoリストで仕事と生活を管理</a></p> <p>そんな時、GTDというタスク管理方法があると、噂で耳にしました。<br /> せっかくTodoistアカウントがあるから、これで挑戦してみようと考えました。</p> <p>その結果、なんと2週間も(僕にとっては1週間以上も続いたことが奇跡)もTodoistを使い続けることに成功しました。<br /> この手法は意外と僕に適しているのかもしれません。</p> <p><a target="_blank" rel="nofollow noopener" href="https://postd.cc/gtd-in-15-minutes/">15分で分かるGTD – 仕事を成し遂げる技術の実用的ガイド | POSTD</a></p> <p>GTDは方法論であり、特別なツールが用意されているわけではありません。<br /> また、僕はTodoistユーザーですが、TodoistにGTDの設定があるわけでもありません。</p> <p>そこで本記事では、TodoistでGTDを実施するために、僕の使いやすかった方法を紹介します。<br /> いくつか試行錯誤もあったため、それも交えて説明しようと思います。</p> <p>なお、僕のGTDに対する理解は、上記リンク先ページの知識しか無いため、理解が間違っている可能性もあります。<br /> ご注意ください。</p> <hr /> <p>ちなみに、この記事を書くために調べたら、ほとんど同じタイトルの記事を見つけてしまいました。<br /> 本記事での設定方法は下記と異なるため、本記事を読む際は、あくまで僕の使いやすかった例であると頭の片隅に置きながら読んでください。</p> <p><a target="_blank" rel="nofollow noopener" href="https://kiomiru.co.jp/blog/work/todoist-taskmanagement/">Todoistを用いたGTD式タスク管理術 | キオミルブログ</a></p> <h1 id="Let's Start GTD by Todoist"><a href="#Let%27s+Start+GTD+by+Todoist">Let's Start GTD by Todoist</a></h1> <p>本記事では、次の項目について記載しています。</p> <ul> <li>GTDとは?</li> <li>Todoistの整備</li> <li>TodoistでGTDを実施する手順</li> </ul> <h2 id="GTDとは?"><a href="#GTD%E3%81%A8%E3%81%AF%EF%BC%9F">GTDとは?</a></h2> <p><del>Great To Do</del> "Getting Things Done" と呼ばれる、物事をよりよく完遂するための手法(いわゆるタスク管理方法)の1つです。<br /> 何かしたいなーという記憶を、全てTODOリストに書出すことで、脳のメモリリソースを開放し、もっと生産的なことに時間を使おう!というものです。</p> <p>特徴として、下記が挙げられます。</p> <ul> <li>まずタスクをメモ書き(記録)する <ul> <li>そのためには、どんな時でも記録できるものを常に手元に用意する</li> <li>TODOリストに入れるのは、そのあとでも良い</li> </ul></li> <li>タスクを5種類に分ける <ul> <li>インボックス</li> <li>次にとるべき行動</li> <li>連絡待ち</li> <li>プロジェクト</li> <li>いつかやる/多分やる</li> </ul></li> <li>週次レビューで進捗を確認する <ul> <li>1週間に1回、タスクの進捗を確認する</li> </ul></li> </ul> <p>まとめると、以下のような思想です。</p> <ul> <li>したいと思ったことを、まず書出す</li> <li>タスク化の敷居を下げる</li> <li>タスクの優先順序を決める</li> <li>常に管理できるTODOリストを目指す</li> </ul> <h2 id="Todoistの整備"><a href="#Todoist%E3%81%AE%E6%95%B4%E5%82%99">Todoistの整備</a></h2> <p>TodoistでGTDを実施するために、僕が必要だなと思った設定などを、説明します。</p> <h3 id="プロジェクトを追加する"><a href="#%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%82%92%E8%BF%BD%E5%8A%A0%E3%81%99%E3%82%8B">プロジェクトを追加する</a></h3> <p>Todoistの「プロジェクト」機能に、GTDのプロジェクトを追加します。</p> <p>僕は、GTDにおけるプロジェクトというものを、タスクの分類分けとして利用しています。<br /> 例えば、「仕事」「プロジェクトA」「学習」「私事」などです。</p> <h3 id="各プロジェクトにボードを追加する"><a href="#%E5%90%84%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%81%AB%E3%83%9C%E3%83%BC%E3%83%89%E3%82%92%E8%BF%BD%E5%8A%A0%E3%81%99%E3%82%8B">各プロジェクトにボードを追加する</a></h3> <p>各プロジェクトをボード表示にして、以下のボードを、以下の順番でそれぞれのプロジェクトに追加します。</p> <ul> <li>実施予定/実施中/完了</li> <li>連絡待ち</li> <li>いつかしたい</li> </ul> <p>これらは、それぞれGTDの下記に対応します。</p> <ul> <li>次にとるべき行動</li> <li>連絡待ち</li> <li>いつかやる/多分やる</li> </ul> <p>「次にとるべき行動」に「実施予定」を含めているのは、実施予定から実施中に移動するということが、個人的に手間と感じているためです。<br /> 僕は、基本的に各プロジェクトのページを見ることはあまりありません。<br /> そのため、タスクを実施する前に<strong>プロジェクトページの展開</strong>と<strong>タスクのボード間移動</strong>をするのは、正直手間でしかありませんでした。<br /> カンバンなど、チームで複数人でタスクを管理している場合は、誰が今何をしているかを可視化するために、実施予定と実施中を分けることには意味があると思いますが、個人であれば必要ないと思います。</p> <p>また、「次にとるべき行動」に「完了」を含めているのは、チェックを付けると同じボード内の履歴に移動するためです。<br /> ZenHubなどのカンバンツールと異なり、完了したタスクが自動的に完了ボードに移動する、という動作を実装しているTODOリストは多くありません(そもそもボードという概念が多くのTODOリストには無いですね)。<br /> Todoistもご多分に漏れず未実装であるため、完了を実施中と同じボードに配置しています。</p> <p>「いつかやる/多分やる」を「いつかしたい」と言い換えているのは、断定形ではなく希望形にすることで、よりタスク化の敷居を下げることが目的です。<br /> 気分の問題でもあるので、ここはご自由に決めて構いません。<br /> 慣れている人はIceboxと書いてもいいですね。</p> <p>プロジェクトと分けているのは、軸が違うと思ったからです。<br /> 「プロジェクト」はタスク分類であるのに対し、「実施予定/実施中/完了」「連絡待ち」「いつかしたい」はタスクの状態だと思ったため、プロジェクトと各状態を、それぞれ別軸で管理しようと考えました。</p> <h3 id="「タスク確認(土曜日は週次レビュー)」タスクを毎朝の繰返しタスクとして追加する"><a href="#%E3%80%8C%E3%82%BF%E3%82%B9%E3%82%AF%E7%A2%BA%E8%AA%8D%EF%BC%88%E5%9C%9F%E6%9B%9C%E6%97%A5%E3%81%AF%E9%80%B1%E6%AC%A1%E3%83%AC%E3%83%93%E3%83%A5%E3%83%BC%EF%BC%89%E3%80%8D%E3%82%BF%E3%82%B9%E3%82%AF%E3%82%92%E6%AF%8E%E6%9C%9D%E3%81%AE%E7%B9%B0%E8%BF%94%E3%81%97%E3%82%BF%E3%82%B9%E3%82%AF%E3%81%A8%E3%81%97%E3%81%A6%E8%BF%BD%E5%8A%A0%E3%81%99%E3%82%8B">「タスク確認(土曜日は週次レビュー)」タスクを毎朝の繰返しタスクとして追加する</a></h3> <p>「タスク確認(土曜日は週次レビュー)」というタスクを、毎朝の繰返しタスクとして追加します。<br /> このタスクは、その名の通り、その日のタスクを確認する、というタスクです。<br /> このタスクのプロジェクトの分類については、特に決まりは無いと思います。<br /> 僕は「私事」の「実施予定/実施中/完了」に分けていますが、インボックスでも良いかもしれません。</p> <p>朝の時間は、出社予定前など、1日の始まりの時間として設定するといいと思います。<br /> 僕の場合は、基本テレワークであるため、毎朝8:30に設定しています。</p> <p>休日?気にする必要はありません。<br /> その日までに実施すればよいので、時間設定は実はあまり重要ではありません。</p> <h3 id="完了したいタスク数を1に設定する"><a href="#%E5%AE%8C%E4%BA%86%E3%81%97%E3%81%9F%E3%81%84%E3%82%BF%E3%82%B9%E3%82%AF%E6%95%B0%E3%82%921%E3%81%AB%E8%A8%AD%E5%AE%9A%E3%81%99%E3%82%8B">完了したいタスク数を1に設定する</a></h3> <p>Todoistは、1日どれだけタスクを実施できたらゴールか、という指標として「完了したいタスク数」を設定できます。<br /> これを、1に設定します。</p> <p>これは、タスク数で一喜一憂したくなかったことが目的です。<br /> デフォルト値は5なのですが、4つや3つしかタスクをしていない日があったら、まるでその1日が未達成な日であったかのように思ってしまい、地味に傷ついてしまいました。<br /> これを1にすることで、「タスク確認(土曜日は週次レビュー)」タスクさえすれば、必ずゴールできるという素敵仕様になっています。</p> <p>個人的には、GTDを継続する秘訣にもなっているので、騙されたと思ってやってみてください。<br /> 朝一番に「1日のゴールです」と言われるのは、なかなか心に優しいですよ。</p> <h3 id="(有料版の場合)タグを準備する"><a href="#%EF%BC%88%E6%9C%89%E6%96%99%E7%89%88%E3%81%AE%E5%A0%B4%E5%90%88%EF%BC%89%E3%82%BF%E3%82%B0%E3%82%92%E6%BA%96%E5%82%99%E3%81%99%E3%82%8B">(有料版の場合)タグを準備する</a></h3> <p>僕は無料版のため使えませんが、タグを使うと便利だろうなーと思うことはあります。</p> <p>例えば、大枠としてプロジェクトを利用し、副枠としてタグを使うといった、プロジェクトとタグを親子関係で利用すると便利そうです。<br /> 「仕事」プロジェクトの中でタスクを作って、その中で「プロジェクトA」タグと「プロジェクトB」タグを使い分ければ、タスクの見通しが良くなりそうです(今は全部ごっちゃにしています)。</p> <p>有料版は、他にも様々な機能があるため、GTDをもっと続けられたら有料版にしてみようかなと思ってます。</p> <h2 id="TodoistでGTDを実施する手順"><a href="#Todoist%E3%81%A7GTD%E3%82%92%E5%AE%9F%E6%96%BD%E3%81%99%E3%82%8B%E6%89%8B%E9%A0%86">TodoistでGTDを実施する手順</a></h2> <p>では、TodoistでGTDを実施するための手順、および、設定方法などを、以下に記します。</p> <h3 id="タスクリストを充実させる"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E3%83%AA%E3%82%B9%E3%83%88%E3%82%92%E5%85%85%E5%AE%9F%E3%81%95%E3%81%9B%E3%82%8B">タスクリストを充実させる</a></h3> <p>最初にGTDをやってみようと思ったら、まずは1時間かけてしたいことを書出すそうです。<br /> 僕は、1時間で思い出せるとは思わなかったので、1週間かけて、やってみたいことを書出しました。<br /> これは、向き不向きがあるので、個人で方法を決めてください。</p> <p>ちなみに、この時点でTodoistを使う必要はありません。<br /> 書出したタスクは、紙やメモアプリなどに記録すれば十分です。</p> <p>説明のため、僕が書出した結果の抜粋を、以下に記します。<br /> もちろん、GTDの実施というタスクも、同じタスクだろうと思って書出しました。</p> <ul> <li>タスク確認(土曜日は週次レビュー)</li> <li>GTDの実施</li> <li>サンスクリットの勉強</li> <li>月1プロジェクト</li> </ul> <p>1週間経つと、タスクもそれなりの量に増えてくるので、タスクリストが充実したら次に進みます。</p> <h3 id="タスクをプロジェクトに分類する"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E3%82%92%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%81%AB%E5%88%86%E9%A1%9E%E3%81%99%E3%82%8B">タスクをプロジェクトに分類する</a></h3> <p>書出したタスクリストが、それぞれどのプロジェクトに該当するかなと想像し、各プロジェクトに移動します。<br /> 最初は未設定のボードに移動するとよいです(後でボード移動する際にわかりやすいため)。</p> <p>僕は、以下のように移動しました。</p> <ul> <li>タスク確認(土曜日は週次レビュー)</li> <li>GTDの実施: 私事</li> <li>サンスクリットの勉強: 学習</li> <li>月1プロジェクト: 仕事</li> </ul> <p>最初は多いため、じっくりプロジェクトを分類しましょう。<br /> この時、新しいプロジェクト分類が見つかったら、新規作成したほうが手っ取り早いです。</p> <h3 id="各プロジェクトのボードに分類する"><a href="#%E5%90%84%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%81%AE%E3%83%9C%E3%83%BC%E3%83%89%E3%81%AB%E5%88%86%E9%A1%9E%E3%81%99%E3%82%8B">各プロジェクトのボードに分類する</a></h3> <p>タスクリストをプロジェクトに分類し終わったら、各タスクの状態を決めましょう。<br /> 先に書いた通り、タスクの状態は、以下の3つです。</p> <ul> <li>実施予定/実施中/完了</li> <li>連絡待ち</li> <li>いつかしたい</li> </ul> <p>「実施予定/実施中/完了」のタスクは、必ず日時を指定しましょう。<br /> そうしないと、予定にならず「いつかしたい」タスクとの差別化ができません。</p> <p>繰返し実施するタスクは、繰返しタスクとして設定しましょう。<br /> 僕は、毎日より間隔の空く繰返しタスク(隔週、月1などのタスク)については、「連絡待ち」に配置しています。<br /> これは、毎日のタスク確認を少しでも楽にするためです(後述)。</p> <p>なお、ボードに追加する際には、サブタスクである程度のタスク分割をしておくと良いです。<br /> 特に、「実施予定/実施中/完了」に配置したタスクについては、タスク分割をしておくことをオススメします。</p> <p>僕の場合は、以下の通りです。<br /> 可読性向上のため、「実施予定/実施中/完了」は「実施予定」に変えています。</p> <ul> <li>タスク確認(土曜日は週次レビュー): 私事 > 実施予定(繰返し、日時指定済み)</li> <li>GTDの実施: 私事 > 実施予定(日時指定済み) <ul> <li>GTDについて調べる: 私事 > 実施予定(日時指定済み)</li> <li>タスクを書出す: 私事 > 実施予定(日時指定済み)</li> <li>タスクを分類する: 私事 > 実施予定(日時指定済み)</li> <li>1週間続ける: 私事 > 実施予定(日時指定済み)</li> <li>まとめをブログに書く(本記事!): 私事 > 実施予定(日時指定済み)</li> </ul></li> <li>サンスクリットの勉強: 学習 > いつかしたい</li> <li>月1プロジェクト: 仕事 > 連絡待ち(繰返し、日時指定済み)</li> </ul> <p>ちなみに、本節完了時点で、「GTDの実施」タスクのサブタスク上位3つは終わっていることになります。</p> <h3 id="タスク確認タスクを完了する"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E7%A2%BA%E8%AA%8D%E3%82%BF%E3%82%B9%E3%82%AF%E3%82%92%E5%AE%8C%E4%BA%86%E3%81%99%E3%82%8B">タスク確認タスクを完了する</a></h3> <p>以上で、TodoistでのGTD実施準備は完了です。<br /> タスクを確認したので、「タスク確認(土曜日は週次レビュー)」をチェックしましょう。</p> <p>はい、今日はゴールできました!<br /> 後は、したいと思っているタスクを順次こなしていけばよいでしょう。</p> <h2 id="GTDを実施するにあたってのTips"><a href="#GTD%E3%82%92%E5%AE%9F%E6%96%BD%E3%81%99%E3%82%8B%E3%81%AB%E3%81%82%E3%81%9F%E3%81%A3%E3%81%A6%E3%81%AETips">GTDを実施するにあたってのTips</a></h2> <p>Todoistで(あるいはそれに限らず)GTDを実践する際に、僕が心がけているTipsを記します。</p> <h3 id="タスクの記録について"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E3%81%AE%E8%A8%98%E9%8C%B2%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6">タスクの記録について</a></h3> <p>「タスクの記録」とは、脳で考えていること(記憶)を文字に起こすこと(記録)です。<br /> 記憶は瞬時に消えやすく、思い出すために体力を使うものであるため、できるだけスグに記録することが大切です。<br /> そのため、できるだけ手間のかからない、簡単に記録できることが望ましいです。</p> <p>簡単な方法として、記録方法とタスク管理ツールを別にする、という方法があります。</p> <p>タスク管理ツールは管理するものであるため、なるべく自動で管理しやすいツール(使いこなせるのであれば多機能でも良い)が望ましいです。<br /> 僕は、これをTodoistと捉えました。</p> <p>一方の記録方法ですが、とにかく瞬時に記録できることが望ましいため、人によってはアナログなノートなどもありだと思います。<br /> お風呂場など、今までは記録が難しい場所でも、文明の利器を使うことで、AlexaやGoogleアシスタントなどに記録できます、素晴らしいですね。<br /> 僕は現在、お風呂場については一旦無視しています(本当はもったいない)が、それ以外ではiOSアプリのDraftPadというアプリで記録しています。<br /> とにかく起動が早いため、思ったことを瞬時に記録できます、オススメですよ。</p> <p><a target="_blank" rel="nofollow noopener" href="https://apps.apple.com/jp/app/draftpad/id358067114">‎「DraftPad」をApp Storeで</a></p> <h3 id="タスクの追加方法"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E3%81%AE%E8%BF%BD%E5%8A%A0%E6%96%B9%E6%B3%95">タスクの追加方法</a></h3> <p>前述したとおり、タスクを追加する際には、以下のことを実施します。</p> <ul> <li>タスクの記録</li> <li>タスクのプロジェクト分類</li> <li>タスクの状態分類</li> <li>サブタスクでのタスク分割</li> </ul> <p>特に、「実施予定/実施中/完了」に分類するタスクについては、サブタスクでのタスク分割を推奨します。<br /> タスク分割しておくことで、ある程度の見積りが取れますし、それによっていつ実施すべきかも決まりやすいからです。</p> <p>また、Todoistでは、サブタスクにも日時指定ができます。<br /> タスク自体が数日かかる場合などに便利ですので、ぜひ使ってみてください。</p> <h3 id="タスク確認タスクとは?"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E7%A2%BA%E8%AA%8D%E3%82%BF%E3%82%B9%E3%82%AF%E3%81%A8%E3%81%AF%EF%BC%9F">タスク確認タスクとは?</a></h3> <p>タスク確認は、毎朝実施すると良いです。</p> <p>「タスク確認(土曜日は週次レビュー)」タスクとは、毎日、もしくは、週1で実施する、TODOリストの見直しタスクです。<br /> 毎日のタスク確認と、週次レビューでは、見る範囲が異なります。</p> <h4 id="タスク確認で見る範囲"><a href="#%E3%82%BF%E3%82%B9%E3%82%AF%E7%A2%BA%E8%AA%8D%E3%81%A7%E8%A6%8B%E3%82%8B%E7%AF%84%E5%9B%B2">タスク確認で見る範囲</a></h4> <p>基本的に、今日のタスクと、各プロジェクトの「実施予定/実施中/完了」ボードのタスクを眺めればよいです。<br /> 眺めてみて、1日に余力がありそうだと思ったら、今日のタスクに「いつかしたい」タスクを入れるのもよいでしょう。</p> <h4 id="週次レビューで見る範囲"><a href="#%E9%80%B1%E6%AC%A1%E3%83%AC%E3%83%93%E3%83%A5%E3%83%BC%E3%81%A7%E8%A6%8B%E3%82%8B%E7%AF%84%E5%9B%B2">週次レビューで見る範囲</a></h4> <p>基本的には、全てのタスクを見直します。<br /> 特に、「いつかしたい」タスクはちゃんと見直しましょう。</p> <p>「いつかしたい」タスクを眺めて、したい欲が高まってきたら、日付を指定して、「実施予定/実施中/完了」に入れると良いです。<br /> 逆に、絶対しないという意思が固まったら、削除するか、「アーカイブ」プロジェクトを用意してそこに入れちゃいましょう。</p> <h1 id="おわりに"><a href="#%E3%81%8A%E3%82%8F%E3%82%8A%E3%81%AB">おわりに</a></h1> <p>この記事が公開されたことで、僕の「GTDの実施」タスクは完了です。</p> <p>GTD、思ったより良い感じです。<br /> このまま続けてみるので、皆さんも挑戦してみてはいかがでしょうか?</p> <p>それでは、よいお年を。</p> Morichan