# 概要 - スクリーン、データベース、レイアウト設定、ユースケース

サインアップとログインプロセスを持つ多くのアプリは、プロフィールを作成および更新するスムーズな方法を提供することで利益を得ることができます。設計がよく考えられたフローと美しいプロフィールページがあれば、ユーザーは自分の詳細を入力したり他のユーザーの情報を確認したりすることを楽しむでしょう。

## 画面概要

📚 **インストラクション画面**

クイックなヒント、ヘルプドキュメント、関連するテンプレートを使ってテンプレートの概要を素早く把握します。*この画面はいつでも削除できます。*

### ユーザー画面

1️⃣ **セットアップステップ1画面**

プロフィール作成の最初のステップでは、ユーザーが簡単なバイオを作成し、プロフィール写真を追加します。

2️⃣ **セットアップステップ2画面**

プロフィール作成の第2ステップでは、ユーザーがさまざまな興味を選択します。

3️⃣ **セットアップステップ3画面**

成功した状態の画面でプロフィールの詳細を最終確認します。

👤 **マイプロフィール画面**

個々のユーザーが閲覧するための関連するプロフィール情報を表示します。

🧾 **アカウント設定画面**

必要に応じてプロフィール情報を編集します。

❌ **アカウント削除確認画面**

ユーザーは進む前にアカウントを削除したいかどうかを確認する必要があります。

## データベース概要

ユーザープロフィール＆アカウント設定機能テンプレートには、サンプルデータが含まれたデータベースが付属しています。各Adaloデータベースにはコレクションが含まれ、各コレクションには関連するプロパティが付属しています。コレクション間の必要な関係も設定されています。

{% hint style="info" %}
**データベースに関する重要な注意:**

もし機能テンプレートからコレクションまたはプロパティを**削除**すると、アプリの機能に影響を及ぼす可能性があります。

機能テンプレートにコレクションまたはプロパティを**追加**すると、アプリの機能には影響しません。
{% endhint %}

以下は含まれるコレクションとそのプロパティの概要です。コレクション名は太字で表示され、説明が含まれます。プロパティには、名前、プロパティタイプ（角かっこ内）、説明が含まれます。

### 基本的なコレクションとプロパティ

#### 👥 **ユーザー**

**ユーザーコレクションは、すべてのAdaloアプリに自動的に付属しています。このコレクションには、アプリを使用するすべてのユーザーに関連する情報が格納されます。この情報は、ユーザーがアプリを使用するためにサインアップする際に最初に収集されます。**

* Email \[テキスト] — ユーザーのメールアドレス。
* Password \[暗号化] — アプリにログインするためのユーザーのパスワード。これは管理者を含め、誰にも表示されません。
* Username \[テキスト] — ユーザーのユーザー名。
* Full Name \[テキスト] — ユーザーの名前と姓。
* Profile Photo \[画像] — ユーザーのプロフィール写真。
* User Bio \[テキスト] — ユーザーが書いたバイオ。
* Rating \[数値] — ユーザーのスキルレベルの評価。
* Games Played \[数値] — ユーザーがプレイしたゲームの数。
* Interests \[多対多の関係] — この関連プロパティは、各ユーザーが多くの興味を持つことができ、各興味を選択する多くのユーザーがいることを示します。

#### 🤹🏾 興味

Interests Collection は、セットアップフロー中に表示される興味を保持しています。

* Name \[Text] — 興味の名前。
* Users \[Many-to-Many Relationship] — このリレーションフィールドは、どのユーザーがどの興味を選択したかを示します。各ユーザーは複数の興味を持つことができ、各興味は複数のユーザーに属することができます。

## レイアウト設定

ユーザープロファイル＆アカウント設定機能テンプレートの各画面は、レスポンシブデザインを使用して作成されています。画面はどんなデバイスやタブレットでも見栄えがします。

ほとんどの画面はカスタムレイアウトで設計されています。画面に新しいコンポーネントを追加すると、他の画面サイズに影響を与えることがあります。

### レイアウト概要

異なる画面サイズのレイアウトを表示または編集するには、画面タイトルをクリックしてドロップダウンを表示します。

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-0a98b0144050234aedd2b5e3fb1441156412f400%2FLayoutOverview1.png?alt=media" alt="" width="311"><figcaption></figcaption></figure>

このテンプレートのデフォルトビューはデスクトップです。ビルダーで1つの画面のサイズを変更しても、キャンバス上の他の画面のサイズは変更されません。

#### 非表示コンポーネント

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-0c0c6290c48169cd05f8be4e76ce60f303a0cad0%2FLayoutoverview2.png?alt=media" alt="" width="476"><figcaption></figcaption></figure>

各ビューには、デスクトップには表示されないがモバイルで表示されるコンポーネントがある場合があります。これらは左側パネルでグレーアウトされ、アイコンで示されます。

どのデバイスコンポーネントが表示されているかを確認する別の方法は、こちらのレイアウトタブです：

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-2bbea52ddce833a1d274220fbf1f4148195cd901%2FLayoutoverview3.png?alt=media" alt="" width="540"><figcaption></figcaption></figure>

#### カスタムレイアウト

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-5b867757643ee4aa22bb0c83ad9a711eabdb00f8%2FLayoutoverview4.png?alt=media" alt="" width="347"><figcaption></figcaption></figure>

一部のコンポーネントには、画面サイズに基づいたカスタムレイアウトが付属しています。これらの設定を表示するには、レイアウトタブを確認し、カスタムレイアウト設定までスクロールします。

## 使用例

* Pickleball クラブの一部として、ユーザーは自分のプロフィールを作成できます。
* 組織のメンバーのプロフィールを作成します。
* あなたのビジネスコミュニティ内で、フォーラムのためにユーザープロフィールを作成します。
* その他多くの用途！
