# ECサイトの開発案件

## 概要

- 顧客：株式会社プラムブック
- VR技術・ホログラム技術の展開。
- レオタードの素材を海外から取り寄せて独自のECサイトで販売したい。
- 参考サイト(このようなサイトを作りたい)
- https://leotard.tokyo/
- 要望
- 特にツールなどの要望はなし。
- 決済システムの支払い方法にコンビニ決済やPAYPAYなどを含ませたい
- 使用する管理者アカウントの種類によって権限を設けたい。（発注数の確認だけ ※売上に関しては非公開など）
- デザイン シュミレーター機能を付けたい（別途API連携が必要かも）
- 課題
- ASPで上記要望の実現が可能なのか
- ASPで実現不可の場合はオープンソースでの開発が必要か
- 提案
- ASPで実現可能な場合は概算費用とどこまで実現できるかを提示する。
- ASPで実現不可の場合は予算の見積もりと工数確認
- ＜参考サイト＞
- 〇ASP比較サイト
- https://web-kanji.com/posts/ec-site-compare
- 〇ECサイト構築おすすめツール比較
- https://notepm.jp/blog/4247
- 〇CMSでの作成
- （おすすめ比較サイト＝`https://blog.hubspot.jp/cms-ec`）
- EC CUBE（https://www.ec-cube.net/）
- 〇デザインシュミレーター機能
- https://one-d.io/
- https://www.mogadigi.jp/web-ds/

---

# yutaメモ

## 顧客の必須要望

1. アカウント権限の階層設定
1. 決済システムの支払い方法にコンビニ決済やPAYPAY
1. デザインシュミレーター機能

## ASPでの機能確認

- 前提として上記3つの機能があるASPがあるかの調査
- BASE
- Shopify
- `STORE.jp`
- MakeShop
- カラーミーショップ

＜ASP比較＞
| --- | BASE | Shopify | STORES | MakeShop | カラーミーショップ
| -------- | -------- | -------- | -------- | -------- | -------- |
| **アカウント権限階層設定** | 不可能| 可能 | 1組織に1アカウントのみ（権限機能無） | 1組織 5アカウントで権限設定が可能| 可能
| **決済システム** | 決済方法は以下　https://baseu.jp/3965#:~:text=%E3%80%8CBASE%E3%80%8D%E3%81%A7%E3%81%AF%E3%80%81%E3%80%8C%E3%82%AF%E3%83%AC%E3%82%B8%E3%83%83%E3%83%88,%E3%81%A7%E5%AF%BE%E5%BF%9C%E3%81%97%E3%81%A6%E3%81%84%E3%81%BE%E3%81%99%E3%80%82 | [可能](https://www.shopify.jp/blog/sbps-paypay-and-more) | PAYPAYは無。https://stores.jp/ec/functions/payment | 顧客要望の決済方法あり。https://www.makeshop.jp/main/function/multi_payment.html | PAYPAY有。https://shop-pro.jp/func/
| **シュミレーター機能** | 無（モガデジを使用はできる） | アプリで実現可能 | 無（外部とのAPI連携も不可） | デフォルトでは無（API連携は可能） |デフォルトでは無（API連携は可能）
| **料金** | 確認中 |　月額29-79 USD＋決済手数料　| 確認中 | 確認中 | 年額35万～40万（月額50万の売上見込みとして）

＜シュミレーター機能のベンダー比較＞
| --- | モガデジ | プリントデザイナー | `one-d.io` |
| -------- | -------- | -------- | -------- | -------- | -------- |
| **仕様** | https://www.mogadigi.jp/web-customize/customize_ecsite.html| 別管理画面でデザイン発行し、キーが発行 | https://one-d.io/ec%e3%82%ab%e3%83%bc%e3%83%88%e3%83%bbasp%e9%80%a3%e6%90%ba%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/|
| **ASP連携** | 一部可能（上記仕様欄に記載） | URLの挿入のみ（API連携は不要） | 一部可能（上記仕様欄に記載） |
| **費用** | https://www.mogadigi.jp/web-customize/customize_plan.html | https://design.s-graphi.co.jp/plan.php | https://one-d.io/price/ |

※*デザインシュミレーター機能について*※
https://leotard.tokyo/　のデザイン機能は↓で実装されているっぽい。
・DBで生地（服地）情報、生地（服地）画像を管理
・frameworkはfuelPHP。動作はjQuery。
・html5mのcanvas機能を駆使して着せ替えを再現。
（以下記事に記載）
http://blog.livedoor.jp/lonpa-mac/archives/32018008.html

- Custom Product Builder (シュミレーター機能のApp)
https://apps.shopify.com/customization-tool?locale=ja
※費用：$35/月。 30日間の無料体験。
サンプル動画（エンドユーザの実操作）：https://www.youtube.com/watch?v=gbj4cDPHi3A

Product Personalizer
Customify ‑ Product Customizer

【Shopifyについて】
-- 世界中の決済に対応
-- 配送対応が強い
-- アプリ充実
-- 料金について：
ベーシックプラン　※スタッフアカウント数2つ
　＞月額$29 決済手数料3.40%　※14日間無料
プラグインApp （Custom Product Builder）
　＞月額$35
＝**最低固定費 月額 $64 + 決済手数料3.40%**

### 結論
~~〇シュミレーター機能に関してはベンダー提供のものではなく、fuelPHPのフレームワークで実装した方が、良さそう。ベンダー提供のものだと、仕様制限や料金も高額になるため、こちらで実装できる範囲だと思われる。~~

〇ShopifyをベースにECサイトの構築して、
シュミレーター機能はプラグインの「Custom Product Builder」を使用。
構築費用は30万？　＋　要件定義費用5万？　構築後の保守費用 5万？
~~納品期間3週間？　できれば14日間以内に実装したいところ（Shopifyの無料期間だから）~~

〇Shopify制作期間について
https://artpeace.jp/blog/2020/07/27/shopify%E3%81%A7%E3%81%AE%E3%82%B9%E3%83%88%E3%82%A2%E5%88%B6%E4%BD%9C%E3%81%AE%E3%82%B9%E3%82%B1%E3%82%B8%E3%83%A5%E3%83%BC%E3%83%AB%E3%81%AF%E3%81%A9%E3%82%8C%E3%81%8F%E3%82%89%E3%81%84%EF%BC%9F/

アピールポイント：
構築保証としてサイトの打ち合わせ段階の構築条件が達成するまで着手し、
初期委託費用以外はいただかない。

### Shopify構築相場


（参考記事）
https://shopify.huckleberry-inc.com/basic/build-cost/#:~:text=Shopify%E6%A7%8B%E7%AF%89%E4%BA%88%E7%AE%97%EF%BC%9A30%E4%B8%87,%E3%81%A6%E3%81%84%E3%82%8B%E5%A0%B4%E5%90%88%E3%81%8C%E3%81%82%E3%82%8A%E3%81%BE%E3%81%99%E3%80%82

---

# yukiメモ

- パッケージとASPの違い（メリデメとか）
- [ECシステムの構築は「パッケージ」と「ASP」どっちが良いの？ \| ecbeing](https://www.ecbeing.net/contents/detail/10)

## ECサイトのビジネスモデル

- BtoC
- 企業と顧客の取引
- BtoB
- 企業間の取引
- CtoC
- 顧客間の取引

## ECサイト構築方法の種類

### 1. フルスクラッチ

- 自分でプログラムを組んで構築する
- 独自のカスタマイズを行いたい場合に採用

#### メリット

- 独自性が高いカスタマイズが可能
- なんでもできる

#### デメリット

- コストが高い
- 実装工数がかかる
- インフラ・セキュリティの管理をしっかりと行う必要がある

### 2. ASP

- ECサイトに必要な機能が揃っているプラットフォームを提供している

#### メリット

- コストが安い
- 自動アップデートがある

#### デメリット

- 独自性のあるカスタマイズができない
- ECサイトの成長に合わせた拡張が難しい

### 3. ECパッケージ

- ECサイトを構築するにあたって必要な機能を提供しているサービス
- ショッピングカード・注文管理・商品管理・在庫管理・顧客管理 等々
- サーバーを用意し、パッケージをインストールして使用する

#### メリット

- ECサイトに必要な機能が揃っている
- 必要な機能を追加でカスタマイズできる
- セキュリティが強い
- 外部サービスとの連携が可能

#### デメリット

- 初期費用が高い
- ライセンス料金
- カスタマイズ料金
- インフラ・サーバーなどの環境費用
- システムが古くなれば技術的なメンテナンスを行う必要がある
- 保守が必要なので、長期的なランニングコストがかかる
- メンテナンスやシステムアップデートなど
- 追加機能に費用が発生する

### 4. クラウドECパッケージ

- ECパッケージと同じく必要な機能を提供している

#### メリット

- ECパッケージと違いクラウド環境で構築が可能なので、クラウド運用を気にする必要がない
- 常に最新のシステムにアップデートされる
- カスタマイズ性がそれなりに高い
- 外部サービスとの連携が可能

#### デメリット

- コストはASPに比べかかる
- ソースコードの開示をしていないため、EC事業者が自社で保守管理できない

### 5. オープンソース

- 企業や個人が開発し、一般公開しているもの
- フルスクラッチを他社がやって、使うようなもの

#### メリット

- カスタマイズが用意
- ライセンス費用が不要

#### デメリット

- 実装コストが高い
- セキュリティなどが不安

### 比較

| --- | フルスクラッチ | ASP | ECパッケージ | クラウドECパッケージ | オープンソース |
| -------- | -------- | -------- | -------- | -------- | -------- |
| **初期費用** | 1000万〜数億円| 10〜30万円 | 600万円〜 | 500万円〜 | 0 |
| **ランニングコスト** | 高い | 安い | ASPよりは高い | ASPよりは高い | 保守 |
| **実装工数** | かなり高い | 低い | 中（4ヶ月〜ぐらい？） | 中（3ヶ月ぐらい？） | 高い |
| **カスタマイズ性** | ◎ | △ | ○ | ○ | ○ |
| **セキュリティ** | △ | ○ | △ | ○ | × |
| **自動アップデート** | × | ○ | × | ○ | × |

### 結論

- 長期的に考えるとコストはそれなりにかかるが、クラウドECパッケージを使用するのが良さそう。
- 中期的に考えると、費用を抑えたASPが良さそう。
- **今回の案件規模的に中期的・コスト及び実装コストを抑えたASPが良さそう。**
- **ASPの中でもShopifyがいい**
- 最近Shopifyの人気は高く、数多くのECサイトに使用されている
- インフラ面はShopifyにお任せできるし、ランニングコストもそれほど高くない
- WordPressみたいにカスタマイズできるツールやアプリが可能
- 独自言語（Liquid）で構築されているが、フロントのカスタマイズが可能
- Shopifyの案件が多く今後の実装に役立つ（Wordpress案件みたいに）
- paypay支払いにも対応している
- ただ、Shopifyでできること以外はできない

### 未確認事項

- BaseやEC-CUBEからshopifyに乗り換えることが多いようだが、どこが優れているのか・どんな機能が豊富なのかを具体的にあまり分かってない
- ここは藤沼にある程度任せよう

## 必要機能

### 商品関連

- 商品管理
- 商品の登録・編集など
- 在庫管理
- 出品できる在庫の数量などの状況を管理する

### 会員機能

- 顧客管理
- サイト登録ユーザーや商品購入ユーザーなどの情報を管理する
- 問い合わせ
- お問い合わせフォームの内容を管理
- メール配信
- 注文・受注・発送などのメール機能
- メールマガジンもあれば

### 注文カート機能

- 注文商品の管理
- 注文された商品の数量や金額などを管理
- 決済の管理
- 顧客の決済方法の情報を管理・連携
- 出荷管理機能
- 発送に必要な配送先情報などを管理

### マーケティング

- キャンペーン実施
- クーポン発行
- レコメンド機能

### アナリティクス

- 商品の売れ筋
- ユーザーの動向

### デザイン

- 必要なページ

## Shopify参考記事

- [Shopify 開発に役立つ情報源をご紹介 \- Qiita](https://qiita.com/t-kurasawa/items/3e90c31fe0d16ff9095d)
- [Shopify導入時に確認！決めなければいけないことリスト｜your shopify team｜non\-standard world株式会社](https://www.non-standardworld.co.jp/23547/)
- [Shopifyテーマ開発の先祖返りを防ぐテクニック。複数環境間のバージョン管理｜your shopify team｜non\-standard world株式会社](https://www.non-standardworld.co.jp/23445/)
- [ローカルでShopifyテーマの開発環境をセットアップする3ステップ — Shopify開発者【2021年版】](https://www.shopify.jp/blog/partner-local-shopify-theme-setup-three-steps)
- [Shopify でテーマとアプリを開発する – ThemeKit / Shopify App CLI – \| TECH \| NRI digital](https://www.nri-digital.jp/tech/20200525-2042/)
- shopifyアプリ作ればデザインシュミレータ使えそうだな。むしろもうあるかも

## Leotard.Tokyoの技術調査

- EC-CUBEのオープンソースをカスタマイズしている
- 画像をhoverすると動くやつ
- YTPlayerというjQueryライブラリを使用している
- 動画を流すやつ
- シュミレーターはcreatejsというライブラリを使用している
- ファイルにデータを持たせて、フロントで実装をしている

### 実装について

- EC-CUBEのオープンソースを使用しつつ、独自で実装しているので、同じように作りたいとなるとコストは結構かかる

---

# 次のアクション

- [x] 職務経歴書の提出
- [x] 次のMTGの調整
- 藤沼がやってる。日曜の何時からかは相手から返答あったらわかる
- [x] 概算見積もりの提出
- [概算見積もり](https://docs.google.com/spreadsheets/d/1MlWiJ5CSbNGp9fRJW7hMB3EtZlEQkAuR74gTcC_1yZA/edit?usp=sharing)

# 2021/05/22（日）の打ち合わせ

https://hackmd.io/Qs1lKf0yStqod66pRU58fg