Figmaでフレームを活用する方法

Figmaのフレームとは何ですか？

Figmaでのフレームは、デザイン作業の基本的な枠組みを提供します。フレームを使用して、さまざまなデザイン要素を整列させたり、画面サイズに合わせて調整することができます。

 

フレームの種類と実装順序

フレームは、さまざまなデバイスと画面サイズに合わせて提供されます。一般的に使用されるフレームタイプには、Phone、Tablet、Desktop、Presentation、Watchなどがあります。プロジェクトの必要に応じて、Desktop、Phone、Tabletの順に実装することが一般的です。これは、画面サイズの違いが大きい場合にデザイン要素の変更が必要になるためです。

 

 

1. フレームの作成は、各カテゴリー、つまり旅行の基本知識、グルメ、交通として作成するのが良いですが、有料のため、一つのページで全て進行することにします。実際のデザイン作業には問題ありません。

フレーム作成ガイド

1. 左上にある # アイコンをクリックします。

2. 右側でPhone、Desktopなどのサイズを選択します。

3. 現在、私たちはPresentation 1980 * 1080で進行しています。ウェブデザインの場合、Presentation 1980 * 1080で進行することが多いです。その理由は、最も多くのユーザーが1980 * 1080を使用しているからです。

4. 右側でサイズを選択するとフレームが作成されます。

5. 直接作成する方法も存在します。

6. タイトル設定はフレーム上に別途記入するのではなく、フレーム名を記入する場所があります。

   1. 例えば、「①韓国旅行前に知っておくべきこと」と書くのではなく、'Slide 16:9 -10'と書かれた場所をダブルクリックすると、タイトル設定が可能です。

7. フレームはコピーが可能です。Altボタンを押しながらドラッグすると、同じサイズで同じ高さのボックスを複製することができます。間隔の調整も可能です。