「Arrangy」はRUNTEQ（ランテック）卒業生の三又さんが制作した「コンビニ食・外食店の料理に一手間加えることで別のおいしさを楽しめるサービス」です。ユニークなアイデアである傍ら、技術面でVue.jsへの挑戦やユーザーにとって分かりやすいUIデザインの工夫をこらし、コンテストで最優秀賞に輝きました。就活でも活きる確かな実力と個性豊かなアイデアを両立させたポートフォリオのヒントが詰まった内容です。【卒業生ポートフォリオ紹介vol.16】
コンビニ・外食飯をアレンジ！レシピ共有サービス
三又さん、「Arrangy」はどのようなサービスなのでしょうか？
（サービスへ）
食事へ時間をかけられないみなさん。毎日いつも同じメニューばかり食べていてマンネリになっていませんか？
だからといって、食事の用意に時間を割けるほど余裕がない！という方にぴったりなのがこの「Arrangy」です。
「Arrangy」は、コンビニ食・外食店の料理に一手間くわえて美味しくできるレシピの閲覧と投稿ができるんです！
まず、レシピの閲覧では会員登録をしなくても、みんなの投稿したレシピを自由にみることができます。
市販の蒸しパンに牛乳をかけて冷蔵庫で冷やすだけ！という簡単なレシピや、
がっつりとアレンジを加えるレシピまでさまざまな種類があります。
そして、投稿機能では自分がおすすめしたいレシピを投稿することができます。
アレンジ前とアレンジ後の写真を投稿することで、どの商品がどのように変わったのか見ただけですぐにわかるようになっています！
手軽さが特徴のコンビニ食にあえて一手間加える発想は、なかなか斬新だと感じました。
食事のマンネリを防ぐために考案
なぜ一手間加えて別のおいしさを楽しめるようにしようと考えたのでしょうか？
そういった食生活を続けていると次第に同じものを食べることになり飽きてしまうので、この原体験を解決するために一手間加えたレシピを共有できるサービスを作ろうと思いつきました。
「Arrangy」にはすでにたくさんのレシピが登録されていますよね。
レシピはリリースに合わせてどのくらい登録していたのでしょうか？
もともとアイデアのレビュー段階でRUNTEQ講師の方から「コンテンツの数が大事だ」と言われていたので数は大事にしてました。
目標のレシピ登録数を達成するために、システムの開発だけでなくレシピの開発も頑張ったのだそうです。
苦労を重ねて生み出したレシピの中で、三又さんが一番おすすめしたいレシピを教えてください！
母や他の受講生たちも試してくださって、「一番おいしかったし簡単だった」と言ってくれました。
インターネットで検索してみると各会社の公式ページでアレンジレシピが紹介されているそうで、そのアレンジレシピを参考にしながら考案することが多かったとお話してくださいました。
こだわりはVue.jsに挑戦した画像の投稿機能
企画段階ではレシピにこだわった「Arrangy」ですが、他にもこだわった部分はありますか？
いろいろな方に見てもらえるポートフォリオにするためには、UIやデザインがきちんと整っていないと見ていただけないと聞いていたので、とてもこだわりました。
では、実装で大変だったことが2つあったとお聞きしましたが、それぞれ詳しく教えていただけますか？
RUNTEQカリキュラム基礎編にも画像投稿機能を実装する課題があり、そのときはRailsの機能を使用すれば簡単に実装ができました。
しかし、今回はVue.jsを使って実装していたので知識を応用できずにかなり苦労しました。
今まで使ったことのない技術でも、手を動かしながら調べてわからないことを潰していけるのはまさに自走力が伴っているからですね！
インターネットでUIに関して調べたところ、人間は物をみるときに左上からどんどん情報を読んでいくことを知りました。
そのため、画面の左側に重要な情報を置き、サイドバーは右側に配置しました。
当初はあまり登録者数が振るわなかったそうですが……
正直なところ、自分だけでレシピを増やすことがきついと感じためSNSのようにユーザーも投稿できるようにしたのですが、ちょっと失敗だったかもしれないと思いました。
ユーザー目線で開発する大切さを学ぶ
苦労した甲斐もあり「Arrangy」はリリース後に、ユーザー数450人、PV数6500を記録しました。
本当にたくさんの方に見ていただけましたね！
さまざまな反響があったかと思いますが、その中でも嬉しかった声はありますか？
ちなみに、改善の提案などはいただいたのでしょうか？
本リリースまでにフィードバックを反映した結果、「要らないのでは？」と提案していただいた機能の削除を行いました。
声を受けてしっかりと改善した経験は、きっと実務でも活きてくるはずです！
UIにこだわり、フロント側にはじめてVueを採用した「Arrangy」ですが、就職活動で面接官の方にお見せしたときにどのような反応をいただきましたか？
それから、コードの中身を見てくださる方も多く、技術力について「しっかりしていて綺麗なコードを書いているね」と評価していただけました！
これは、RUNTEQさんのおかげです（笑）
選考へ進んだすべての企業から、コンセプトと技術力を評価していただいたそうです。
RUNTEQではポートフォリオのサポートに力を入れているので、とても嬉しい話をお伺いできました！
さいごに、全体を通して学びを得られたと感じることを教えていただけますか？
RUNTEQに入るまでは、ポートフォリオは就活のために作るというイメージでした。
しかし、今回のポートフォリオ制作ではユーザーに「Arrangy」を使っていただくためにはどうしたらよいのかという視点で開発することができたため、大きな学びとなりました。
三又さんは実務に入った現在もユーザー視点を大切にしており、ユーザーに寄り添った提案ができているそうです。
RUNTEQでは、入学オリエンテーションからすでにユーザー目線を持つようお伝えしているので、ポートフォリオ制作時に大切にしていただけてとても嬉しく感じます。
三又さん、今回はインタビューに答えてくださりありがとうございました！
今後のご活躍も応援しております。
編集後記
いかがでしたでしょうか？
三又さんの制作した「Arrangy」は、身近な食問題からはじまり個性豊かなポートフォリオへと仕上がりました。
ユニークな作品でありながら、Vue.jsに挑戦したり、ユーザーの目線を意識したりすることで、コンテスト審査員も驚く高いクオリティの作品となりました。
RUNTEQで、個性豊かなあなただけのポートフォリオを制作しませんか？
もちろん初めての方でも、アイデア企画段階から開発段階までサポートいたします！
RUNTEQに少しでもご興味のある方、未経験からWebエンジニアを目指そうとお考えの方は、まずは一度無料キャリア相談会へお越しください！ https://runteq.jp/
「Arrangy」を読んだあなたにおすすめ！食べ物関連のポートフォリオ例
