Shopifyのお気に入り(Wishlist)アプリを、約4ヶ月かけて一人で開発してリリースしました。

外部記事Shopifyにお気に入り機能を追加|RYX Wishlistノーコードで導入。ゲストモード・分析・Flow連携対応のウィッシュリストアプリ。ryx.jpShopifyにお気に入り機能を追加|RYX Wishlist

パート1〜3に分けて、開発の裏側を書いていきたいと思います。

まずは「なぜ作ろうと思ったのか」という話から。

既存アプリへの不満

Shopify構築者として、今までいろんなストアにお気に入り機能を導入してきました。

何度も設定してきたので、管理画面が英語でも操作自体はできます。

英語のアプリの管理画面
英語のアプリの管理画面

ただ、フロントの初期表示が英語だったり、翻訳の設定に毎回時間がかかったりと、地味にストレスを感じる部分がありました。

僕自身は慣れているので「まあこんなものかな」と思っていたのですが、これってクライアントにとってはもっと大変なのでは? と思うようになりました。


クライアントが運用しきれていなかった

お気に入り機能って、そもそも何のためにあるかというと、最終的に購入してもらうためだと思っています。

導入するだけではなく、どの商品がお気に入りに入っているかを把握して、マーケティングに活かしていく。

そこまでできてはじめて価値があると思います。

ただ、実際にはクライアントの多くが分析画面をあまり活用できていませんでした。

理由はシンプルで、管理画面が英語だったからです。

Shopifyを初めて触る方にとって、管理画面自体がハードルになることも多いです。

そこにさらに英語のアプリが入ると、どうしても自分で運用するのが難しくなってしまいます。

「導入はできたけど、その先がうまく回っていない」

そういったケースを何度か見てきたのが、自分で作ろうと思ったきっかけのひとつです。


「自分で作ろう」と思った瞬間

アプリ開発に興味を持ったきっかけは、実はクライアントからの依頼でした。

Shopifyの通常のカスタマイズ——LiquidとJavaScriptだけでは対応しきれない依頼をいただいたことがありました。

バックエンドのAPI通信が必要な案件で、「Shopify上でReactが書ければ解決できるかもしれない」と思いました。

そこから調べていくうちに、Shopifyアプリ開発という選択肢があることを知りました。

外部記事BuildBuild your appshopify.devBuild

もともとJavaScriptには興味があって、Web制作をしていた頃から「面白いな」と思っていました。

Reactを学ぶためにいろいろ作ってみたり、Next.jsでサイトを作ったりもしていて、少しずつ技術的な土台はできてきていました。

そこに、クライアントの「今の技術では対応できない」というリアルなニーズが重なって、アプリ開発の技術を身につければ、もっといろんなクライアントの課題に対応できるようになるし、構築者としても成長できるなと感じました。

それが開発を始める決め手になりました。


じゃあ何を作るか

アプリ開発の学習を始めて、最初に考えたのは「何を作るか」でした。

答えはわりとすぐ出ました。お気に入りアプリです。

理由はここまで書いてきた通りで、

  • 構築案件でお気に入り機能を導入する機会が多かった
  • 既存アプリに感じていた不満があった
  • クライアントがうまく運用できていない現実があった

「自分が一番よく使う機能を、自分が使いやすい形で作ってみよう」

そう思ったのがRYX Wishlistの出発点です。

日本語のUIで、Shopifyの管理画面に馴染むデザインで、クライアントが自分で運用できるアプリ。

ShopifyのWeb Componentsを活用して、Shopifyに準拠した形で作りたいと考えました。

ここから約4ヶ月間の開発が始まるのですが、その話はパート2で書いていきたいと思います。


次回:パート2「開発のリアル」 試作2つを没にした話、一人開発中の収入の問題、想定外に広かった作業範囲について書きます。

外部記事Shopifyにお気に入り機能を追加|RYX Wishlistノーコードで導入。ゲストモード・分析・Flow連携対応のウィッシュリストアプリ。ryx.jpShopifyにお気に入り機能を追加|RYX Wishlist