Step2：デザインの設定

概要

Appifyをご利用いただくにあたり、アプリ公開までの手順をStep1〜Step3のガイドに分けてご案内しています。

本ガイドでは「Step2：デザインの設定」についてご説明します。まだ初期設定が完了していない方は、まずは「Step1：初期設定」からご確認ください。

初期設定が完了したら、次にモバイルアプリのデザインを設定していきます。まずは、アプリ全体の構成を検討しましょう。

具体的には、アプリトップ、ヘッダータブ、フッタータブ、検索、マイページの構成を考えていきます。構成を考える際は、他社の事例を参考にしてみてください。

構成が固まったら、アプリを構成する各ページを実際に作成していきましょう。

アプリのトップ画像などに使用されるのが「デザインページ」です。設定方法については、以下のガイドをご確認ください。

「リソースページ」は、店舗一覧や商品選択などのメニュー用途で使われることが多いページです。縦にバナーを並べたレイアウトで、以下の遷移先を設定できます。

「コレクションページ」は商品を表示するためのページです。こちらはAppify上での個別設定は不要で、Shopifyで作成したコレクションを指定することで表示されます。

おすすめの設定順序

Appify管理画面の「テーマ」内にて、デザインページ＞リソースページ＞コレクションページの順で設定するのがスムーズです。

ページ作成後は、顧客が自身の会員情報やポイント情報を確認できる「マイページ」を作成します。マイページはアプリの利便性を高める重要なページのひとつです。

次に、ヘッタータブ・フッタータブを作成しましょう。

画面上部に表示されるのが「ヘッダー」です。テンプレートの利用や、任意の画像アップロードが可能です。

画面下部に表示されるのが「フッター」です。アプリを開いたときに常に表示されるため、ブランドに合った項目を設定しましょう。

最後に、アプリ内検索機能の設定を行います。

アプリ上に検索バーを表示し、商品情報などで絞り込みできるようにするには、「Search & Discovery」アプリを用いて検索条件を設定する必要があります。

お疲れさまでした！👏

以上でアプリのデザイン設定は完了です。次は、アプリの配信方法についてご案内いたします。

こちらは公開前の必須ステップではありませんが、今後の運用において欠かせない機能ですので、続けてご確認ください。