ポートフォリオ

Arrangy:アレンジ飯レシピ共有サービス:ポートフォリオ紹介

「Arrangy」はRUNTEQ(ランテック)修了生の三又さんが制作した「コンビニ食・外食店の料理に一手間加えることで別のおいしさを楽しめるサービス」です。ユニークなアイデアである傍ら、技術面でVue.jsへの挑戦やユーザーにとって分かりやすいUIデザインの工夫をこらし、コンテストで最優秀賞に輝きました。就活でも活きる確かな実力と個性豊かなアイデアを両立させたポートフォリオのヒントが詰まった内容です。【修了生ポートフォリオ紹介vol.16】

コンビニ・外食飯をアレンジ!レシピ共有サービス

三又さん、「Arrangy」はどのようなサービスなのでしょうか?

三又さん
三又さん
Arrangy」は、コンビニ食・外食店の料理に一手間加えることで別のおいしさを楽しめるサービスです。

サービスへ)

食事へ時間をかけられないみなさん。毎日いつも同じメニューばかり食べていてマンネリになっていませんか?

だからといって、食事の用意に時間を割けるほど余裕がない!という方にぴったりなのがこの「Arrangy」です。

「Arrangy」は、コンビニ食・外食店の料理に一手間くわえて美味しくできるレシピの閲覧と投稿ができるんです!

まず、レシピの閲覧では会員登録をしなくても、みんなの投稿したレシピを自由にみることができます。

市販の蒸しパンに牛乳をかけて冷蔵庫で冷やすだけ!という簡単なレシピや、

がっつりとアレンジを加えるレシピまでさまざまな種類があります。

そして、投稿機能では自分がおすすめしたいレシピを投稿することができます。
アレンジ前とアレンジ後の写真を投稿することで、どの商品がどのように変わったのか見ただけですぐにわかるようになっています!

手軽さが特徴のコンビニ食にあえて一手間加える発想は、なかなか斬新だと感じました。

食事のマンネリを防ぐために考案

なぜ一手間加えて別のおいしさを楽しめるようにしようと考えたのでしょうか?

三又さん
三又さん
僕自身、料理を作る手間暇を考えると結局コンビニで済ませる事が多かったんです。

そういった食生活を続けていると次第に同じものを食べることになり飽きてしまうので、この原体験を解決するために一手間加えたレシピを共有できるサービスを作ろうと思いつきました。

らんてくん
らんてくん
自分自身の困りごとを解決したいという思いからサービスを作ることは、よいことだぞ!

「Arrangy」にはすでにたくさんのレシピが登録されていますよね。
レシピはリリースに合わせてどのくらい登録していたのでしょうか?

三又さん
三又さん
本リリースするタイミングでSeedファイルに入れていたレシピは24, 5件ほどです。

もともとアイデアのレビュー段階でRUNTEQ講師の方から「コンテンツの数が大事だ」と言われていたので数は大事にしてました。

目標のレシピ登録数を達成するために、システムの開発だけでなくレシピの開発も頑張ったのだそうです。

苦労を重ねて生み出したレシピの中で、三又さんが一番おすすめしたいレシピを教えてください!

三又さん
三又さん
評判が良かったのは、蒸しパンを冷やして食べるレシピです。
母や他の受講生たちも試してくださって、「一番おいしかったし簡単だった」と言ってくれました。

インターネットで検索してみると各会社の公式ページでアレンジレシピが紹介されているそうで、そのアレンジレシピを参考にしながら考案することが多かったとお話してくださいました。

こだわりはVue.jsに挑戦した画像の投稿機能

企画段階ではレシピにこだわった「Arrangy」ですが、他にもこだわった部分はありますか?

三又さん
三又さん
サイトのUIやデザインは、自分なりにうまくまとまるよう意識しました。

いろいろな方に見てもらえるポートフォリオにするためには、UIやデザインがきちんと整っていないと見ていただけないと聞いていたので、とてもこだわりました。

らんてくん
らんてくん
バックエンド側の技術だけでなく、見てもらうことまで意識していて素晴らしいぞ!

では、実装で大変だったことが2つあったとお聞きしましたが、それぞれ詳しく教えていただけますか?

三又さん
三又さん
一つ目は画像の投稿機能です。この機能はこだわりましたし、一番大変でしたね。

RUNTEQカリキュラム基礎編にも画像投稿機能を実装する課題があり、そのときはRailsの機能を使用すれば簡単に実装ができました。

しかし、今回はVue.jsを使って実装していたので知識を応用できずにかなり苦労しました。

今まで使ったことのない技術でも、手を動かしながら調べてわからないことを潰していけるのはまさに自走力が伴っているからですね!

三又さん
三又さん
二つ目は、先ほどこだわった部分でも挙げたUIについてです。

インターネットでUIに関して調べたところ、人間は物をみるときに左上からどんどん情報を読んでいくことを知りました。

そのため、画面の左側に重要な情報を置き、サイドバーは右側に配置しました。

当初はあまり登録者数が振るわなかったそうですが……

三又さん
三又さん
身近な方々の反応をみると自分で投稿するよりも投稿されているレシピを見て楽しむ方が多かったので、登録者数があまり増えなかったのだと考えています。

正直なところ、自分だけでレシピを増やすことがきついと感じためSNSのようにユーザーも投稿できるようにしたのですが、ちょっと失敗だったかもしれないと思いました。

らんてくん
らんてくん
ユーザーが見るだけでも楽しめるコンテンツを作ったことには、おおいに自信をもってくれよな!

ユーザー目線で開発する大切さを学ぶ

苦労した甲斐もあり「Arrangy」はリリース後に、ユーザー数450人PV数6500を記録しました。

本当にたくさんの方に見ていただけましたね!

さまざまな反響があったかと思いますが、その中でも嬉しかった声はありますか?

三又さん
三又さん
やはり自分の投稿したものをSNSにシェアしてくださったり、実際に料理を作ってみて「おいしかったよー」と言っていただけたりしたことがとても嬉しかったですね。

ちなみに、改善の提案などはいただいたのでしょうか?

三又さん
三又さん
ポートフォリオコンテスト「editch」へ出場したのですが、イベントの2日前に他のRUNTEQ受講生の方々からフィードバックをいただきました。

本リリースまでにフィードバックを反映した結果、「要らないのでは?」と提案していただいた機能の削除を行いました。

声を受けてしっかりと改善した経験は、きっと実務でも活きてくるはずです!

UIにこだわり、フロント側にはじめてVueを採用した「Arrangy」ですが、就職活動で面接官の方にお見せしたときにどのような反応をいただきましたか?

三又さん
三又さん
コンセプトがおもしろいとおっしゃっていただきました。

それから、コードの中身を見てくださる方も多く、技術力について「しっかりしていて綺麗なコードを書いているね」と評価していただけました!

これは、RUNTEQさんのおかげです(笑)

選考へ進んだすべての企業から、コンセプトと技術力を評価していただいたそうです。

RUNTEQではポートフォリオのサポートに力を入れているので、とても嬉しい話をお伺いできました!

さいごに、全体を通して学びを得られたと感じることを教えていただけますか?

三又さん
三又さん
一番の学びは、ユーザー目線でサービスを考えることの大切さを知れたことです。

RUNTEQに入るまでは、ポートフォリオは就活のために作るというイメージでした。

しかし、今回のポートフォリオ制作ではユーザーに「Arrangy」を使っていただくためにはどうしたらよいのかという視点で開発することができたため、大きな学びとなりました。

三又さんは実務に入った現在もユーザー視点を大切にしており、ユーザーに寄り添った提案ができているそうです。

RUNTEQでは、入学オリエンテーションからすでにユーザー目線を持つようお伝えしているので、ポートフォリオ制作時に大切にしていただけてとても嬉しく感じます。

三又さん、今回はインタビューに答えてくださりありがとうございました!

今後のご活躍も応援しております。

編集後記

いかがでしたでしょうか?

三又さんの制作した「Arrangy」は、身近な食問題からはじまり個性豊かなポートフォリオへと仕上がりました。

ユニークな作品でありながら、Vue.jsに挑戦したり、ユーザーの目線を意識したりすることで、コンテスト審査員も驚く高いクオリティの作品となりました。

RUNTEQで、個性豊かなあなただけのポートフォリオを制作しませんか?
もちろん初めての方でも、アイデア企画段階から開発段階までサポートいたします!

RUNTEQに少しでもご興味のある方、未経験からWebエンジニアを目指そうとお考えの方は、まずは一度無料キャリア相談会へお越しください! https://runteq.jp/

「Arrangy」を読んだあなたにおすすめ!食べ物関連のポートフォリオ例

ジロリアス:二郎系ラーメン検索サービス

さけぐらむ:性格診断×日本酒おすすめサービス