ポートフォリオの作成準備をしていく



web系エンジニアになる事を決心すると同時に、プログラミングを勉強しはじめてから約6週間となります。（その辺りの詳細も改めて記事作成したいと考えています。）

progateでの各種言語を広く浅く勉強(約3週間)
→オンラインスクールでのphp/laravelの勉強(約3週間)
→そしてこれから早速ポートフォリオの作成を行おうという所です。

そこで今回はポートフォリオ作成にあたり、プロダクトの企画フローをざっくりと紹介していこうと思います。
自分のメモ代わりみたいな所もあるので参考程度にm(_ _)m。。。



#プロダクト企画フロー　7つのフェーズ
７つのフェーズに分けて順を追ってプロダクトを企画していきます。


1.アイディア出し
2.ペルソナの作成
3.リーンキャンバスの作成
4.エレベーターピッチの作成
5.ユーザーストーリーマッピング
6.MVP(Minimum Viable Product)選定
7.ワイヤーフレームの作成


#1.アイディア出し
これは単純にどんなものを作りたいか、またどんなものがあったら便利か等をバンバン出していくフェーズです。
あまり深くは考えず、数を出していきます。
この段階では作れる作れないはとりあえず考えないようにしました。


↓↓ちなみに私がいくつか考えたもの↓↓

>- Qiitaのようなサービスを他ジャンルで！(スポーツ、勉強、旅行、趣味、キャリア関連等...)
>- 自分の没頭する趣味、培ったスキル、経歴で何か副業に成り得るものは無いかを発見するサービス
>- 自己分析＋他己分析で自分を理解、一目瞭然の自分ポートフォリオが作れるサービス
>- タイムマネジメントをして利用者の目標達成を手助けするサービス
>- 勉強の進捗をグラフで確認できるサービス
>- 色んなジャンルの同期と繋がれるサービス(社会人○年目、○○の趣味○年目、子育て○年目...)

もう既にありそうな気もしますが今回は自分でサービスを作成してみるというのが目的なので、そこは目を瞑りました。
今回は上記アイデア内の”**自己分析＋他己分析で自分を理解、一目瞭然の自分ポートフォリオが作れるサービス**”を作成していくイメージで進めていきたいと思います。


#2.ペルソナ作成

ペルソナとは簡単に言えば架空の顧客像のことです。
ここでは上記で出したアイディアを誰が使うのか、その人がどんな人なのかを具体的にイメージして、ターゲットユーザーを明確化していきます。
メインとサブに分けて2つのペルソナを作っていきます。

↓↓作成してみたペルソナ↓↓

###A.メインターゲットのペルソナ

|項目       　　　　|内容          |
|:-----------------|:------------------------------------|
| *名前*              | 若井未来         |
| *年齢*           　 | ２１歳           |
| *性別*              | 女性         |
| *住所*             | 大阪           |
| *趣味*             | 海外旅行、カフェ巡り    |
| *習慣*             | 毎日１枚インスタ映えの写真を投稿、毎日３０分の英語勉強      |
| *経歴*             | 高校時代はテニス部で大学に入ってからはバイト漬け、留学経験もあり|
| *将来の目標*        | 自分でもしくは夫婦でカフェ経営をしてみたい|
| *最近はまっている事* 　| 英語を使う機会が作りたくて"meetup"というアプリを利用している|
| *最近悩んでいる事*   | もうすぐ就活だけど自分のアピールポイントはなんだろう、将来の夢は一旦保留かなあ..  |
| *最近興味がありやってみたい事*　| インターンシップ               |


###B.サブターゲットのペルソナ


|項目       　　　　|内容          |
|:-----------------|:------------------------------------|
| *名前*              | 東京太郎               |
| *年齢*           　 | ２８歳                 |
| *性別*              | 男性              |
| *住所*             | 東京               |
| *趣味*             | 野球、映画鑑賞                   |
| *習慣*             | 仕事終わりは同僚と飲みに行く事が多く、週末は趣味の草野球 |
| *経歴*             | 大学卒業後、一般企業でサラリーマン           |
| *将来の目標*        | 今の彼女と結婚して子供も作って幸せな生活を送る |
| *最近はまっている事* 　| 携帯でオンラインゲーム                |
| *最近悩んでいる事*   | 私生活も仕事も特に不満はないけど、毎週同じ事の繰り返しなんだよなあ |
| *最近興味がありやってみたい事*　| ジムに通いたい               |


##3.リーンキャンバスの作成
リーンキャンバスとは考えたアイデアが具体的にどういう構造になっているのかを明確化する為に作るものです。
数字の順番に項目を埋めていき、矛盾があったり埋められない項目があれば、アイデア出しを改めて行っていく必要性があります。
初めてのポートフォリオ作成という意味ではビジネス性はそこまで深く意識しなくても良いかと考えました。
自分の為に正直な自己分析を行って欲しいのですが、やっぱり少しでも自分をよく見せようとしてしまう人が目に浮かんでしまって...何か良いアイデアないですかね...

↓↓”セルマネ”というサービス名でリーンキャンバスを作成してみた↓↓

![スクリーンショット 2019-03-11 0.49.47.png](https://qiita-image-store.s3.amazonaws.com/0/367959/c5750cd0-d52e-7293-0389-eb1944e52ca8.png)
>githubにてリーンキャンバスのPDFが無料公開されていました。
>こちらから→[demi168さん](demi168/Lean-Canvas-prototype-PDF)


##4.エレベーターピッチの作成

エレベーターピッチとはそもそもなんぞやという所から。
名前の通りです。エレベーターに乗っている間の短い時間という意味から、つまり15~30秒
くらいで誰にでも分かるように説明出来るテンプレートを持っておきましょうという事みたいです。
エレベーターピッチっていう言葉自体遊び心のある表現でおもしろいなあと思って調べてみると、アメリカのシリコンバレーから生まれた言葉みたいです。発想がユニークで好き。~~いつか自分もシリコンバレーの時代の最先端を走るIT企業でバリバリ・・・~~
ビジネスシーンで使われる言葉のようですが、プライベートの面でも十分使えそうなスキルだと感じました。

↓↓エレベーターピッチも作成してみた↓↓

>*"セルマネ"というプロダクトは、*
>*目標へコミットしたいと本気で考えている*
>*もしくは頭のどこかでは考えている、*
>*大小様々な目標を持つ全ての人向けの、*
>*自分を見える化する自己管理サービスです。*
>
>*自己分析・他己分析、さらに自分ポートフォリオを作成する事で、*
>*大小様々な目標に対しての現在地を確認でき、*
>*MIIDAS等、他の自己分析サービスとは違い、*
>*利用者を限定せず全ての人が生活の一部として利用できます。*


##5.ユーザーストーリーマッピング

ユーザーストーリーマッピングとは、考えているサービスで出来ることを、ユーザー目線から書き出したものです。まずは大枠で出来ることを羅列していき、その後派生させて詳細を書き出していくという作業を行います。
現段階で考えている最終的にここまで作り込みたいというような内容ですので、一旦は最低限の機能が実装できた所で作成完了という形にすると思います。

↓↓セルマネのユーザーストーリーマッピング↓↓

>- ユーザーはアカウントを作成する事ができる
>  - ユーザーはアカウントを編集する事ができる
>  - ユーザーはアカウントを削除する事ができる
>  - ユーザーはアカウントの公開範囲を設定できる
>- ユーザーは自己分析を自問自答形式で行う事ができる
>  - ユーザーは自分に対する質問を作成できる
>  - ユーザーは自分に対する質問を編集する事ができる
>  - ユーザーは自分に対する質問を削除する事ができる
>  - ユーザーは自分に対する質問へ回答する事ができる
>  - ユーザーは自分に対する質問への回答を編集する事ができる
>  - ユーザーは自分に対する質問への回答を削除する事ができる
>  - ユーザーは自分に対する質問及び回答の公開範囲を１つずつ設定できる
>- ユーザーは他己分析用の質問を作成する事ができる
>  - ユーザーは他己分析用の質問を編集する事ができる
>  - ユーザーは他己分析用の質問を削除する事ができる
>  - ユーザーは他己分析用の質問及び頂いた回答の公開範囲を１つずつ設定できる
>- ユーザーは自分のポートフォリオを作成する事ができる（現在分及び目標分）
>  - ユーザーは自分のポートフォリオを編集する事ができる
>  - ユーザーは自分のポートフォリオを削除する事ができる
>  - ユーザーは自分のポートフォリオの各項目を作成する事ができる
>  - ユーザーは自分のポートフォリオの各項目を編集する事ができる
>  - ユーザーは自分のポートフォリオの各項目を削除する事ができる
>  - ユーザーは自分のポートフォリオの各項目の数値を入力する事ができる
>  - ユーザーは自分のポートフォリオの各項目の数値を編集する事ができる
>- ユーザーは日記を作成する事ができる
>  - ユーザーは日記を編集する事ができる
>  - ユーザーは日記を削除する事ができる
>  - ユーザーは日記に対するコメントへ返信ができる
>  - ユーザーは日記に対するコメントへの返信を編集する事ができる
>  - ユーザーは日記に対するコメントへの返信を削除する事ができる
>  - ユーザーは日記の公開範囲を１つずつ設定できる
>
>※レスポンス側は省略します。（他己分析用質問への回答、日記へのコメント関連等）



##6.MVP(Minimum Viable Product)選定

MVPとはプロダクトが成り立つ為に最低限必要な機能の事です。
プログラミングの勉強を始めるまで知らなかったのですが、アプリやサービスは初めから完璧な状態でリリースするということはほどんどなく、実際はこのMVPをとりあえず開発して、その後継ぎ足ししていくというような形なんですね。
確かに言われてみれば、Facebookとかでもいつの間にか自己紹介に動画を載せられるようになっていたり、男女交際有無の欄が出来ていたりしていましたね。

↓↓ざっくりとMVP選定してみた↓↓

>- アカウント関係の機能は全て実装
>- 自己分析関係の機能はレスポンス対応以外実装
>- 他己分析関係の機能はレスポンス対応以外実装
>- （ポートフォリオ関係は進捗次第で再度検討）
>- 日記関係の機能はレスポンス対応以外実装
>
>※勝手なイメージですが一ヶ月程度で作成してそこから本格的に就活をしたいと考えているので進捗次第では、機能を継ぎ足していこうと思っています。

##7.ワイヤーフレームの作成

MVP選定を行ったら本格的な開発の前にワイヤーフレームの作成を行います。
ワイヤーフレームとは、ページのデザインをする前の設計図の事です。
どこに何を配置して、それがどのような機能を持つのかを描いていきます。
この段階ではビジュアルやカラーリングにはそこまでこだわらず、ユーザー目線での使いやすさを意識していくようにします。
ワイヤーフレーム作成用のアプリケーションもあるみたいですが、個人の簡単な開発であれば初めは紙に手書きでもOKみたいです。開発規模が大きくなり、シェアする必要が出てくれば恐らく必須ですね。

↓↓ワイヤーフレームも作成しました（3/11更新、ページ数が多いので一例のみです）↓↓

![スクリーンショット 2019-03-11 21.25.05.png](https://qiita-image-store.s3.amazonaws.com/0/367959/fc385abb-41b6-3df3-c86a-6f20766ed397.png)
![スクリーンショット 2019-03-11 21.25.41.png](https://qiita-image-store.s3.amazonaws.com/0/367959/57b8e2d2-5266-2cfa-5ff6-c0be49bf9034.png)

>有名で使いやすいものでは[Cacoo](https://cacoo.com/ja/)とかがあるみたいです。


##最後に...
最後にというほどでもありませんが...作成頑張ります！
きっと大変なんだろうと容易に想像がつきますが、それ以上にワクワクしています:grin::v:

それでは。進捗報告もまた投稿していければと思います。

以上、Qiita初投稿でした。