しがしぃ@MyPoZiの投稿 - Crieit

🎉Webアプリ完成しました🎉このアプリは本の学習ロードマップ共有サイトです📗- どのプログラミング書籍を選べば良いか分からない- 難しすぎる本を選んでしまったという問題を解決したいと思い作りました技術書を選ぶ時に、必ず参考にするようなサイトにしたいですhttps://t.co/5kIX4KFRBB
— しがしぃ@MyPoZi (@MyPoZi555) April 12, 2019

実質このプロジェクトは6ヶ月くらいと言えます。
なぜそんなにかかったのか。理由は、チーム開発で検証と実装を繰り返し、時には停滞していたからです。

10月 ~ 12月はアイデア出し

ある日、何作ろうかチームで考えていた所、ある先輩がやってきました。（私が尊敬している先輩の1人です）
話を聞くと、どうやらアイデア出しのフレームワークがあるらしく、司会進行をしてくださるみたいでした。
勿論チームの返事はOK。こんなありがたい話はありません。

そのアイデア出しのフレームワークとはGoogleなどで導入されているデザインスプリントでした
デザインスプリントを導入して分かった 3 つのメリットと注意点【前編】

簡単に言うと、

わずか 5 日間で、価値のあるプロダクトを開発するフレームワーク

です。
メリットは

失敗を素早く気づく
消費される人や予算と時間の節減
プロダクトのコンセプトに関するチーム内での意思統一
顧客の視点からアイデアを検証

などが挙げられます。
ほとんどの組織ではアイデア過多の状態。アイデアの検証や実行が伴わないことが問題であり、それを解決するのがデザインスプリントです。

デザインスプリントをやってみた

まず、身近に問題点や、解決したいことがないか話し合い、一番身近であるエンジニア関連についてアイデアを出すことになりました。
時間を測り、ポストイットにひたすら問題点を書いて貼っていきました。その後、1つ1つ書いたことについて意味をチーム内で共有し、話が広がった場合、違う色のポストイットにメモを書いていきました。そして、それぞれを分類分けし、分類ごとにタイトルを付けました。

分類された中からやりたいもの、解決できそうなもの、アイデアが思い浮かびそうなものなどの指標で3つ選びcrazy8を行ないました。
crazy8とは5分間で8個のアイデアを出す100m走より体力を使うアイデア出しの手法です。名前通り、狂ってますね。
以下は入門書が多すぎ問題を解決するための私が出したアイデア例です。

中級本を作るというアイデアね、、、
誰か中級本頼みました🙏

「5分で8個アイデア出すんでしょ？余裕でしょ！」
そう私は思いましたが、不可能でした、、、

アイデアは必ず8個じゃなくていいんです。大切なのは短い時間の中で一瞬のひらめきを出しまくることです。これ要らないでしょとかいう考えをする時間すらありません。

様々なアイデアが出ましたが、1人3票でアイデアに無言投票した結果、書籍を難易度で評価できるサービスに決定しました。
これだけで終わりません。さらに根本的な問題を突き詰めるために、少しアイデアを広く見て、技術書を買う時の不満という問題で再度1からやり直しました。

以上を繰り返し、

他の人の読書履歴と本と本の間の難易度が分かるサービス

を検証することとなりました。

この頃からプロダクトリーダーになったが、精神的に消耗した

まだプロダクトリーダーで消耗してるの？？
と言われそうなタイトルですね😅

実際、チーム開発するまで個人で
「プログラミング楽しい〜^q^」
だったのですが、チーム開発はプログラミングだけでなく

スケジュール管理
ファシリテーション
タスク管理
備品管理
メンバーとのコミュニケーション
他のチームでの運営、開発（合計3つくらい平行していました）

沢山やることがあり、毎日四六時中ずっとチーム開発のことを考えていました。
やったこともないし、何をしたらいいかすら分からなく、トラブルの耐性は一切ありませんでした。
精神衛生が非常に悪かったです。1ヶ月お風呂入ってないくらい。。。

「チーム開発、辞めようかな。」
と悩んで、デザインスプリント案を持ってきてくださった先輩に相談した結果、自分の中での優先順位やチーム開発というのも段々分かり、心も軽くなり、まだ頑張れました。
普通にメンバーに仕事を振ったら良いと思いますが、振ってみても結局全て自分でやってしまいます。私がメンバーを信用出来ていないと考えます。
そこで、しっかりメンバーに仕事を振り、メンバーが裁量を得れば、もっと上手く行ったと後から反省しています。

その後、

リーンキャンバス（事業プランを整理するフレームワーク）
ペルソナ（サービスを利用する顧客の中で最も重要な人物モデル）
市場規模
競合相手（9サービスくらい規模や強みなどを分析）
テスト項目、仮説

などを決め、様々な人に記事を書いてもらい、プロトタイプを制作しました。
そして、プロトタイプを使ってもらってインタビューをしました。

協力してくれた方たちには感謝です。一度きりの人生のうちの大切な時間を人のために使えるという心優しい方達ばかりでした。
その気持ちから私は自分1人で生きていないということを学ばさせていただきました。

12月から設計・開発をスタート

「やっと開発ができる..!!」

とワクワクしましたね〜。
しかし、私がするべき一番の仕事はメンバーが不自由なく動けるようにタスクを振ることでした。
個人で開発する時は、仕様書をしっかり書くということはしませんが、人に伝えるために全てを言語化しなければいけない辛さを味わいました。
先輩からチーム開発の手順、書き方などを教えてもらい、
私は
- ユーザーストーリー
- API設計
- 技術選定
- シーケンス図

など、ドキュメントを書きまくりました。

こんなシーケンス図を分からないなりに書いてみましたが、正直メンバーは殆ど見なかったと思います。

仕様書やユーザーストーリーはGithubのissueに書きました。
バッジだらけで見辛い。。。絵文字なんか使えばもう少し見やすかったのかな。他のチーム開発も見てみたいな...!!

タスク管理はGithubのProjectsを使いました。

ER図などデータベースに関しては、チームメンバーにデータベーススペシャリスト持ちの人がいたので、任せて勉強させてもらいました🙏

ブランチの切り方はGithub Flowで、プルリクエスト出したりレビューしたりなどしましたが、正解が分からないのでとりあえずやってみよう精神でした😂

2月から私は海外へ、しかし我慢できずサービス開発を

はい、ニュージーランドに1ヶ月間短期留学に行きました。
折角お金掛けて海外に行くので、海外でしか体験できないことをやりたかったので開発はお休みすることにしました。
その間、マネジメントは先輩に取ってもらいました🙏

しかし、結局我慢できなくて、海外生活後半は開発していました😇（結果出来たのが、単行本のコメントメーカーです）
私は本当に開発が好きなんだな〜と実感しました。

3月後半に帰国、１人でサービス開発

日本に帰国して、チーム開発しよう！と思い、slackで尋ねても誰からも返事がありません。

「あ〜、ダメだ。でも開発したい。」
「仕方ない、１人で開発するか。」
「もう自分だけで作るし、自分の好きな技術で作ればええんちゃう？？」

元のアイデアとは少し違う感じに改変してですが、結果１人で作りました。。。
この結果が良いか悪いか分かりません。チーム開発にこだわっていたら、完成すらしなかったかもしれません。
もしくは、チームという力で大成功していたかもしれません。

ただ、私は皆で楽しく開発したかったです。

いくらでも今回のチーム開発に関して反省しました。

ミチアカリを公開した日、カレー屋で１人で泣きました😂
色んな思いが込み上げてきて、抑えようとしましたが、止まりませんでした😂
今思い返すと笑えますよほんと😂

今回の体験は私にとって非常に良いものでした。普通に生活していたら100%味わえない体験だったんじゃないかなと。
反省あり、学びあり、感謝あり、
以前の私より圧倒的成長をすることが出来ました。
今後必ず活かします。

公開後の反応は良かった

公開後、皆さんが拡散していただいたおかげで、沢山の人に触っていただけました。（本当にありがとうございます🙇‍♂️）

「良さそう！」
「助かる！」
「すごい！」
「面白い！」

などの声もいただけました。皆様の反応は全て保存してあります😊

皆さんが作ってくださったコンテンツ（記事）は非常に良いもの何だな〜と分かりましたが、作ってくれる人が中々いません。
本をある程度読んで尚且書いてくれる人ですから、そりゃ少数派になるかなと。
この辺のアイデアはまだ詰める必要がありそうです。ユーザーはメリットを感じなければ使いませんよね。

少しずつ機能を付けていったり試行錯誤しています！

ミチアカリ(https://t.co/5kIX4KFRBB)にリクエスト機能追加しました。- 特定の学習ロードマップが知りたいけど、記事がない- ここまで本読んだけど、次何の本がオススメなんだろうそういうものが知りたい時に、リクエストとして出せる機能です。また、リクエスト記事にコメントを付けられます✌️ pic.twitter.com/cnbm5r0j2D
— しがしぃ@MyPoZi (@MyPoZi555) April 20, 2019

思い入れのあるサービスなので、これからグロースというものをやっていきます💪

まとめ

人生色々ある。失敗はない。省みれば全て学び。

チーム開発は思い通りに行かないことも多々あったが、非常に良い学びとなりました。
またチーム開発に挑戦したいです💪

良ければこちらも見ていって下さい〜！
デザインスプリントの本もあります。
ミチアカリのアイデア出しのために読んだ本

私は私が予想していた以上に皆様にお世話になっています。必ず忘れません。
この気持ちを大切に、私自身も他の人に優しく接することができるようになります。

今回は以上です！
また、Crieitで記事書くので次回もよろしくです👍

よければTwitterも😊

単行本についているアレのWebアプリを作った話

2019-03-30T11:22:33+09:00

初めまして！しがしぃと申します。
WWWサーバのWebチャンネルで主に開発、狩り、貿易をしております。
他の人工知能チャンネルやゲーム開発チャンネルも盛んらしいですね。

・・・茶番は置いておいて、
今回は、単行本についているアレを作成することが出来るWebアプリを作りました。

こんなやつです。

このアプリのリンクは ↓ です
単行本のコメントメーカー

制作過程の考えなどをまとめました。技術要素はなるべき少なくしました。

なぜこのサービスを作ろうと考えたのか

とある日、Twitterで時間を湯水のように使っていました。そこで、ある画像を見つけました。

単行本のアレ風ツイート pic.twitter.com/XFN5SOQNzP
— わけぎラテ (@wakegi9315) May 30, 2018

ワイ「うわぁ、懐かしい。こんなのあったな〜」
ワイ「なんか、作るWebアプリでもあるんか？」
ワイ「探した感じないやん」
ワイ「あ、ワイが作ればええやん！」

〜おわり〜

以上です。

このマーケットのパイはどれくらい大きさなのか
このサービスを使うことによるユーザーのメリット
どんなペルソナ
気になるあの子は今何しているんだろう

などなど、一切考えてないです！
（だから、色々ガタガタなんでしょうけどそれはまた置いておいて）

アイデアを深める

今まで、様々なアプリを作ろうと思って作っていても、途中で投げ出したことが何回もあります。
「この機能いる？」「これ作って誰が使うねん」
これを作っているときに思います。経験ある方もいらっしゃるかと・・・。

今回こそはMVP(実用最小限の製品)を作るぞ！と意気込んでアイデアを深めていきました。
そのMVPを考えたて実行した結果がこれです。

とりあえず画像を生成できるところまで
—————————はじめに考えていた公開時期 —————————

初期値ににななしさん、画像は人のマーク、コメントはコメントが入りますという初期値を

画像をデータベースに保存

TwitterOGPを対応

一覧で新規順で見れるように
—————————実際の公開した時期 —————————

Twitterログイン云々

「え？は？？MVPはバカンスにでも？？」

とでも言いたくなるような結果ですね。

作っていると、物足りなくなって、次々作ろうと・・・。
で、でも、MVP設定しなかったら完成すらしなかったはず！（言い訳）

完成はしましたが、後で振り返ると、MVPで止めておけば良かったなと思いました。理由は後に書いてあります。

作る時のメモ

メモはEvernoteに書いています。
読めたもんじゃないですが、自分しか読まないので、これくらい適当です；；

凝った所

つくるボタンを押さないと、画像を保存できない所

実はつくるボタンを押さなくても、単行本のコメント画像を作ることが技術的に可能です。しかし、このWebアプリの構成上、他の方が作ったものを見ることが半分の目的になってしまっており、コンテンツが少なくなってしまいます。この辺はアイデアを考えるときに、しっかり深めれば分かったことなんですが、何も考えずに実装した結果ですね。
反省です。修行します。

動的なTwitterCard

一応、動的なTwitterCardです😇https://t.co/cgGpGiOMVS
— しがしぃ@MyPoZi (@MyPoZi555) March 28, 2019

こんな感じでやつです。作品によって、TwitterCardが自動的に切り替わるやつです。
SPAなので色々と訳が違い、最終的にクローラーの場合のみ引っかかるような仕様にしました。
女の子もこんな感じで引っかかれば良いんですけどね！

vue.js laravel5.7 動的 og タグ

VueとLaravelのSPAにした

これは凝ったというか、単なる新しいことへの挑戦です。
新しい方が楽しいし、SPAの方がユーザーにとってより良いかなと思いました！

ナビゲーションメニューをタブバーにした所

いつも通り、画面遷移ボタンはハンバーガーメニューにするか〜と考えていた所、1つの記事を見つけました。
君たちはそんなにハンバーガーメニューが好きなのかね？
いつもハンバーガーさんに頼ってるし、たまにはタブバー使ってみるかぁ!
と思い新しく使ってみました。

モバイルからのアクセスが多く、親指から近いところにボタンがあるのでまぁいい感じでした。
これから作るWebアプリでもこれにしても良いかなと思いました。

この辺の凝ったところは、ユーザーからしたら違和感なく便利に使ってもらえることが目的なので

「ここ便利！すごい！」

というような効果はあまり見えませんが、、、

公開したあとの反省

ここで、MVPで止めなかった反省が来ます。

作ったものが全て公開されることにより、ユーザーが作ることを躊躇してしまう可能性がある。
当初考えていたものより規模の大きくなってしまった。

このWebアプリは、とりあえず単行本についているアレを作ることが出来れば良いと思うんです。
公開する必要はありません。身内だけで使用人もいるかと思います。（いるんか？）
このアプリ、作ったものが全て公開されるのですが、それが原因で、ユーザーが作ることを躊躇してしまう可能性があります。
全て公開するメリットももちろんありますが・・・。
とりあえず、MVPで止めて、皆さんの反応を見るor相談するべきでした。

おわりに

アイデアはいくらでも転がっている。
何も考えずに作るのは早いけど、後々しんどい面もある。
MVPは大事。どれくらい大事かというと、この記事を読み込んでいる皆さんのデバイスくらい大事。
とりあえずリリースしようぜ！成功するかなんて分かんない！しかし、必ず反省・ふりかえりは必要！
個人開発はめちゃくちゃ楽しい。周りにいる人達はシャレにならんくらい優しい。

特に成功した訳ではないけど、書いてみました。自己満足かも知れませんが、それでも形にすることは大切だと思います。（思います）

このWebアプリ、まだまだなんで、皆に使ってもらえるようになるには、磨き続ける必要がありそうですね。

今回省いた技術要素につきましては、後ほどQiitaに上げます。

新しい分野の技術は本当にワクワクして楽しいですね！

それでは、また！
Sea yuu agein!