#目次
１．課題について
２．アプリの特徴について
３．ターゲット・ペルソナ
４．制作行程について
５．感想
#１．課題について
皆さんも洋服を通販で買う機会があると思います。
しかし、こんな経験をしたことはないですか？
「せっかく通販で良い洋服に出会えたと思ったのに、いざ届いて着てみたら…体型に合わない！」
「体型に合う洋服がほしいけれど、いちいちお店にまで行って試着するのはちょっと…」
なんてことはよくあると思います。
そんな問題を解決したいと思った私は、今回「体型に合った洋服を簡単に見つけたい人へ」というコンセプトをもとにこのアプリを作成しました。
#２．アプリの特徴について
・体型に合った洋服を見つけることができる。
・自分の体へのコンプレックスを軽減することができる。
・理想の体型へ近づくためのきっかけづくり。
・自分の体型を再現することができ、そのモデルに合わせて洋服を見つけることができる。
・お気に入りの洋服をまとめていつでも見ることができる。
・このアプリ内で買い物をすることができる。
#３．ターゲット・ペルソナ
忙しく時間の無い女性向けです。
自分の体型に自身が無い方、自分の体型に合った洋服が分からないという方はもちろんのこと、洋服は好きだが、いちいちお店へ出向いて試着するのも購入するのもめんどくさい！という方にもお勧めです。
自分で体型に合う洋服を探すことが苦手という人にも対応しています。
#４．制作行程について
私は授業の中で、「prott」というソフトを使用し、アプリを作成しました。
PC上ですべての工程を行うのではなく、紙に自分の思い描くアプリの画面を描き、それをprottに取り込み、実現していくというものです。
まずは使い方の大まかな説明をしていきます。
トップページを作成します。
この青い円で囲ったところを選択します。
そうすると、手書きで描いた写真を取り込むことができます。
取り込むとこのようなページに移動します。
この画面になると作成が可能です。
次に円で囲んだ部分を選択します。
画面が移り、選択したページの編集を開始することができます。
このページには外枠をつけたいと思ったため、四角形ツールを選択します。
多くの種類のツールがあるのでその要望に応じたツールを使用することができます。
このようにツールを選択した場所からドラッグし、配置したい場所に設置します。
私の場合は、二重枠にしたかったため二つの四角形を設置しました。
二重枠の設定が終わりました。
次に文字を追加します。
文字を追加するときには、テキストツールを使用します。（私はこのツールを一番乱用しました。）
先ほどと同じようにテキストをドラッグし、配置したい場所へ移動させます。
移動させた後は、位置なども細かく設定することができます。
テキストはサイズはもちろんのこと、フォントも自由に変更することが可能です。
あとは、右クリックをおしてアンロックを選択し、後ろの画像を取り除けばこのページは完成です。
大まかな操作方法はこれで以上になります。
ではこのアプリの目玉であるページをご紹介します。
このページです。
これは、自分の体型に合わせて変更した自分のためだけのマネキンです。
このページでは、マネキンに合わせて洋服を着せることができます。
つまり、自分の体型と同じマネキン…自分で着たも同然ということになります。
円で囲った「マネキン設定アイコン」を選択するとこのページに飛ぶことができます。
ここから自分がお気に入り（ハート型のアイコン）に登録した洋服をマネキンに着せることが可能です。
そしてここを選択するとこのような画面になります。
このように、自分がお気に入りに設定した洋服は自動で分類別になるというシステムになっています。
もちろん、お気に入りに登録していない洋服もこのアイコンを選択することで追加して着せることができます。
このような画面に飛び、自由に検索をして追加すること可能です。
そして再びマネキン設定アイコンを選択して元の画面に戻ります。
次に、このアイコンの説明です。
これはこのアプリ最大の特徴とも言える自分の体型に変更できるマネキンを作成するページです。
このようなページに移動します。
ここでは、縦幅（身長）と横幅を変更することができます。
さらに細かく設定をしたい場合は「もっと細かく」を選択します。
するとこのようなページに移動します。
体のさまざまな部分の変更を可能にしました。
そのため、その人のコンプレックスにあった自由度の高い設定を行うことができます。
また、いつでも変更することができるためちょっとの体型の変化などにも対応可です。
制作工程は以上です。
|グループ|テーマ|他の作成者|
|---|---|---|---|
|３|Body Searcher|ぽぷこ
このアプリを実際に動かすにはこちら[クリック][link-6]
[link-6]:https://prottapp.com/p/de3631
その他の制作物はこちら[クリック][link-5]
[link-5]:https://qiita.com/shigeru-suzuki/items/409137c96ee739509487
#５．感 想
授業でアプリを制作すると聞いたときはとても不安でした。プログラミングのような専門知識のない私にできるだろうかと。その半面で、ものづくりが好きな私にとっては楽しみでもありました。
いざはじめてみると作業に戸惑ったりもしましたが、「prott」はシンプルな操作が多いため作成は比較的スムーズに行うことができたと思います。しかし、私の場合は作成したページ数が多かったため時間はその分かかってしまいましたが、仕上がりには満足しています。
普段、私は携帯電話でアプリを使用していますがこんなアプリがあったらいいと思う機会があります。その中のひとつとして今回私が作成したアプリのようなものがあったため、実現することができてうれしいです。
このように専門知識の無い私でも簡単に作成することができたため、prottがもっと高校や大学で活用されたら良いのではないかと思います。
時間も掛かり大変でしたが作成してみて良い体験になりました。
静岡県立島田商業高校 こちら[クリック][link-1]
[link-1]:http://www.edu.pref.shizuoka.jp/shimada-ch/home.nsf/IndexFormView?OpenView
prottサイト こちら[クリック][link-2]
[link-2]:https://prottapp.com/ja/
画像を提供してくださったa o * iさん こちら[クリック][link-4]
[link-4]:https://www.instagram.com/_a03man_/