【第6回 2~3カラムの設定方法編】

※「カラム」について：2カラム=2列配置、3カラム=3列配置

あかちゃん：こんにちは、アプリデザインチームです！第6回目の今回は２カラム・３カラムの設定方法についてご紹介します！

ザッキー：おお！２カラム・３カラムの設定方法を覚えると画面にメリハリがついたり、より多くの情報を見せることができるので、これまでもたくさんのアプリで実装していますよね！

あかちゃん：そうですね！では早速フリーレイアウト機能で実装した時の見え方をご紹介しながら設定方法を学んでいきましょ〜！

ザッキー：画像をべたっと1枚貼るだけではなく、２カラム・３カラムにすると見た目がグッと賑やかになるし、情報がどのくらいあるのかパッと見たときにわかりやすいですね！

あかちゃん：では早速設定していきましょう！まずは、フリーレイアウト機能で設定したい画像の詳細設定を開いてください！

ザッキー：詳細設定で幅を選択するだけなので簡単ですね！

あかちゃん：そうです！このカラム幅の設定と、デザインチームメンバーもよくやるマージンの設定もできたらもっと綺麗に見えるのでそちらもご紹介します！

ザッキー：おお！確かにカラムの幅を設定しただけだと見た目が少し詰まった印象になってしまうのでありがたいです！

▲画像の内側にくるマージンを少ない数値に設定すると、余白が整って綺麗な見た目になります！

ザッキー：上下、画像の間のマージンを同じ間隔で設定してあげることでより見た目が綺麗になりましたね！

あかちゃん：画像だけではなく、ボタン風のデザインを配置するときも２カラム・３カラムで設定するとアプリっぽいデザインができます！

ボタン風に作成した画像を入稿して設定するのもいいですし、第5回でご紹介したボタンデザインの記事も参考に、フリーレイアウト内でボタンを作成して２カラム・３カラムの設定をするのもぜひ挑戦していただきたいですね！

第5回のヤプリ道場記事はこちら >

※ご不明点は担当のカスタマーサクセスにお問い合わせください。

では次回の更新をお楽しみに！