記事一覧
【ランチメニューの情報設計 vol.1】 根津のパスタ屋さん
私はデザイン会社でアプリやWEBサイトをつくっているのですが、会社の同僚とご飯に行くとよく始まる会話があります。
「この書き方だとAランチとBランチの違いがパッと入ってこないね。」
「ここの文書構造を整理しないと、日替わりランチの話がどこまで続いてるのか分かりにくいなぁ。」
黙ってさっさと選べよ!と自分でも思うのですが、ついつい「どうしたらもう少し情報が伝わりやすくなるか」を考え始めてし
【FigmaのAuto Layoutをマスターしよう vol.4】 カード型記事リスト
今回は記事一覧に使われることが多いカード型のリストを作りたいと思います。
第1回から今回まででAuto Latoutの基本的な設定をひと通りマスターできます!
並び位置の基準(Alignment)の設定値について今回作っていくのはこのようなリストです。
サムネイルと本文は幅いっぱい、日付は左揃え、ボタンは右揃えになっています。
Auto Layoutでは子要素に対して並び位置の基準(Align
【FigmaのAuto Layoutをマスターしよう vol.3】 固定幅のボタン
ここまで第1回ではテキスト量に合わせて伸び縮みするボタン、第2回では複数の要素をもつ伸び縮みするボタンをつくってきました。
今回はAuto Layoutを使って固定幅のボタンを作っていきたいと思います。
幅を固定するAuto Layoutでは並び方向が縦並び(Vertical)のときは幅を固定、横並び(Horizontal)のときは高さを固定することができます。
ということで以下のように設定
【FigmaのAuto Layoutをマスターしよう vol.2】 アイコン入りボタン
今回はAuto Layoutを使ってアイコンの入ったボタンを作っていきたいと思います。
「Auto Layoutってなに?」という方は前回の記事を読んでいただけたらと思います。
並ぶ方向(Direction)の設定
では最初に中身の要素が並ぶ方向の指定について見ていきましょう。
並ぶ方向には横方向(Horizontal)、縦方向(Vertical)の2つがあります。
Flexboxで言うところ
【FigmaのAuto Layoutをマスターしよう vol.1】 シンプルなボタン
みなさんFigmaのAuto Layout使ってますか?
私は普段アプリデザインの仕事をしていますが、Auto Layoutがリリースされてからプロトタイピングのスピードが2倍ぐらいになったのでは......?という感覚です。
というわけで、今回はシンプルなボタンを作りながらAuto Layoutの使い方を解説していきたいと思います!
Auto Layoutとは?
はじめに「Auto Layo