STUDIO レスポンシブ設定(さまざまなデバイスに合わせてデザインを整える)

デザインエディター画面で、レスポンシブ設定ができます。

エディター上部、スタイルバーの「レスポンシブ」タブから「基準」「タブレット」「モバイル」でデザインの調整をします。

 

PCサイズ「基準」を中心に「タブレット」と「モバイル」のデザインの見え方を設定します。
「基準」で作成したデザイン → 「タブレット」、「モバイル」反映
「タブレット」で変更したデザイン→「モバイル」反映
という様に大きいサイズから小さいサイズにデザインが反映されます。

例)
【テキストサイズ】
基準・タブレット・モバイル:288

基準を設定すると、タブレットとモバイルも同じサイズで反映されるので、デバイスサイズに合っていない見た目になります。

そこでレスポンシブ設定
↓  ↓  ↓

【テキストサイズ】
基準:288
タブレット:200
モバイル:150

デバイスごとにテキストサイズを設定すると、見た目が整って読みやすくなります。