# 概要
ECサイト構築ツールBASEの新規テーマ開発
# 担当
3人チームでフロントエンドエンジニア担当
フロントエンドエンジニア : 1
デザイナー : 1
レビュワー : 1
# 使用技術
HTML/css/jQuery/JavaScript/API/Ajax/BASE独自タグ/Figma
# 課題
新規テーマを開発しても、BASEプラットフォーム内で売れなければ意味がないので、売れるテーマを開発すること。
# 取り組み
会社の業務として、ノーコードツールBASE用の新規テーマ開発を行いました。これまでに2つのテーマを開発し、全体のデザイン構成、コーディング、テストを一貫して担当しました。
デザイン構成は、Shopifyの売れているテーマを参考にして考案しました。例えば、トップ画面の次のセクションにコンセプトエリアを配置したり、各セクションの見出しにパララックス効果を用いるなど、サイトに特徴を出す工夫をしました。デザインが固まった後、HTMLとCSSでサイト全体の構成と装飾を行い、jQueryでトップ画像のスライダーやヘッダーの開閉機能を実装しました。また、JavaScriptを用いて、スクロールに応じて背景画像を切り替えるなどの動的な効果を追加しました。
テスト工程では、BASEの基準に基づいて細かく確認し、動作に不具合がないか、サイト全体のトーンやマナーが統一されているかをチェックしました。Figmaでは、バナーのデザイン、サイトのレイアウト構成、画像のサイズ変更、アイコン作成などを行いました。
# 工夫した点
売れるテーマを開発するために、Figmaを用いて実際に売れているテーマを分析しました。具体的には、Shopifyで人気のあるデザインテンプレートを収集し、それぞれのセクションごとに画像を切り取り、組み合わせて最適なレイアウトを検討しました。
# 実績
結果的に、シンプルでインパクトの強いテンプレートを考案することができ、売上にも結びつきました。2022年7月の販売額は496,000円、2022年8月は8月18日時点で352,000円を達成しました。
ほとんど私1人で開発したため、会社に貢献できた実感があり、自信がつきました。
# 開発成果物
https://devmove.thebase.in/
https://devforum.base.shop/