44
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【個人開発】iOSショートカットアプリのレシピ共有サービス『ShortcutPlus』を作りました

Posted at

はじめに

iPhoneにはショートカットという便利なアプリがあります。
レシピと呼ばれる操作手順書を登録しておけば、その機能を簡単に呼び出せるというもの。

忙しい日々をちょっとだけ効率化してくれるような、そんなレシピをもっと使いたいという思いからこのサービスを開発しました。

サービス概要

レシピを検索して探したり、自分が作ったおすすめレシピを投稿してシェアできるサービスです。

・アプリURL:https://www.shortcutplus.com/
・GitHubリポジトリ:https://github.com/TYIRI/shortcut_plus

作った背景

ショートカットを使っている中で下記の問題を感じており、これらを解決したいと考えました。

  • レシピがあちこちに散らばっており、ブログやYouTubeなどを一つずつ見ていく形で探しにくい。
  • 自作した凄いレシピを教えたいけど、気軽に言う場所がない。

使い方

1. レシピを探す

カテゴリ(未選択可)×キーワードで検索ができます。
また、カテゴリ・タグ・投稿ユーザーごとにもレシピを一覧表示できるので、趣向が似たものを探すことが可能です。

これといってキーワードは無いけど、どんなことができるか見たい人もいると思うので、アクセスの多い**「人気のレシピ」やランダムで抽出する「ピックアップ」**をトップページに表示しています。

これらの閲覧の際にユーザー登録は不要です。

スクリーンショット 2021-05-15 14.44.10.png

スクリーンショット 2021-05-15 14.43.46.png

スクリーンショット 2021-05-15 16.00.07.png

2. レシピを投稿する

ユーザー登録をしたら自分で作ったレシピが投稿できます。
本文の入力は、誰でも難しさを感じずに使えてかつ完成形が分かりやすいものにしたかったので、WYSIWYGエディタ(Action Text)にしました。

スクリーンショット 2021-05-15 15.38.53.png

ショートカットアプリでiCloudリンクを作成して共有するときに使える、ショートカットIDの入力スペースもあります。

使用技術

  • Ruby 2.7.2
  • Rails 6.1.3.1
  • Bootstrap
  • tag-it
  • jQuery-Validation-Engine
  • AWS

主要なGem

  • sorcery
  • aws-sdk-rails
  • aws-sdk-s3
  • impressionist
  • meta-tags
  • config
  • rspec-rails

ER図

スクリーンショット 2021-05-15 20.00.39.png

インフラ構成図

スクリーンショット 2021-05-16 13.29.12.png

開発期間

デプロイまで2ヶ月(300h〜)ほどかかりました。

苦労した点

Action Textの導入

比較的新しいこともあって調べても情報が少なかったことと、slimが未対応で正しく表示されないなど互換性の部分で考慮が必要だと学びました。これについては、Action Textを呼び出す部分をパーシャルにしてerbで作成することで、対処することができました。

本番デプロイ

AWSについては知識がほぼない状態だったので、ひたすらググりながら手探りでの作業でした。
特にログの見方が分かるまでは、エラーが発生しても問題の切り分けができずに何度かやり直ししています。
またこのタイミングで、Railsの依存していたmimemagic gemの0.3.5以下が削除されてbundle installできなくなっていることを知り、Railsが依存しないバージョンにアップデートする形で対応。更新内容を確認して実装箇所に影響がないことや、テストを実行して問題が発生しないかを改めてチェックしました。テストのありがたさをこのとき一番感じました...

工夫した点

通知機能

ユーザー登録をしていると、ヘッダーに通知が表示されます。
通知の内容は以下を設定しました。

  • マイレシピにいいね
  • コメントにいいね
  • マイレシピに新しいコメント
  • コメントしたレシピに新しいコメント

投稿する側は反応が返ってくる嬉しさを感じられ、閲覧する側は感想や意見を伝えやすく、コミュニケーションを取りやすいものにしたかったからです。
ちなみに、それぞれの通知項目についてON/OFFの切り替えができるので、欲しい情報だけを得ることができます。

レスポンシブデザイン

iPhoneやiPadでの利用が多いことを想定して、見やすいデザインにするのはもちろん、各端末の解像度を調べて一番使いやすい画面の表示を心掛けました。
iCloudリンクからはすぐにショートカットが入手できるため、レシピの作成が難しい人でも簡単に試せる形にしました。

望む未来

今でこそ当たり前にショートカットを使ってますが、最初はとっつきにくさを感じたり、難しいイメージがありました。
レシピがシェアされて広まっていくことで、ショートカットがもっと手軽なものになれば使う人も増えると思います。

忙しい日常のちょっとしたことがスムーズになり、ルーティンから解放されることで、みなさんが自分の好きなことに使える時間が増えればいいなと願っています。

おわりに

あったらいいなと思うものを1から形にでき、そしてそれを実際に使ってもらえて、サービス作りの楽しさを改めて感じました。
他にも作ってみたいなと思うアイデアがあるので、世の中に便利さや楽しさを与えられるようなサービスを開発していきたいです。

以上、ご覧いただきありがとうございました!

44
17
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
44
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?