ミキ｜デザイナー

デザインファームで働くデザイナーです。 Service Design/ UX Desi…

ミキ｜デザイナー

デザインファームで働くデザイナーです。 Service Design/ UX Design/ UI Design

  • FigmaのAuto Layoutをマスターしよう

    Figma大好きデザイナーがAuto Layoutを使ってさくさくプロトタイピングする方法を書いていきます。

  • ランチメニューの情報設計

    街で見かけたランチメニューの再構築を題材に情報設計について書いています。

  • 固定された記事

【ランチメニューの情報設計 vol.1】 根津のパスタ屋さん

私はデザイン会社でアプリやWEBサイトをつくっているのですが、会社の同僚とご飯に行くとよく始まる会話があります。 ｢この書き方だとAランチとBランチの違いがパッと入ってこないね。｣ ｢ここの文書構造を整理しないと、日替わりランチの話がどこまで続いてるのか分かりにくいなぁ。｣ 黙ってさっさと選べよ！と自分でも思うのですが、ついつい「どうしたらもう少し情報が伝わりやすくなるか」を考え始めてしまいます。 小さい飲食店だとメニューはお店の方がを手作りされてることが多いです

ミキ｜デザイナー

    • 【FigmaのAuto Layoutをマスターしよう vol.4】 カード型記事リスト

      今回は記事一覧に使われることが多いカード型のリストを作りたいと思います。 第１回から今回まででAuto Latoutの基本的な設定をひと通りマスターできます！ 並び位置の基準（Alignment）の設定値について今回作っていくのはこのようなリストです。 サムネイルと本文は幅いっぱい、日付は左揃え、ボタンは右揃えになっています。 Auto Layoutでは子要素に対して並び位置の基準（Alignment）を指定することができます。 並び方向が縦並び（Vertical）のと

      ミキ｜デザイナー

      • 【FigmaのAuto Layoutをマスターしよう vol.3】 固定幅のボタン

        ここまで第１回ではテキスト量に合わせて伸び縮みするボタン、第２回では複数の要素をもつ伸び縮みするボタンをつくってきました。 今回はAuto Layoutを使って固定幅のボタンを作っていきたいと思います。 幅を固定するAuto Layoutでは並び方向が縦並び（Vertical）のときは幅を固定、横並び（Horizontal）のときは高さを固定することができます。 ということで以下のように設定してみましょう。 1. 要素が並ぶ方向を「Vertical」にする。 2. 幅

        ミキ｜デザイナー

        • 【FigmaのAuto Layoutをマスターしよう vol.2】 アイコン入りボタン

          今回はAuto Layoutを使ってアイコンの入ったボタンを作っていきたいと思います。 「Auto Layoutってなに？」という方は前回の記事を読んでいただけたらと思います。 並ぶ方向（Direction）の設定 では最初に中身の要素が並ぶ方向の指定について見ていきましょう。 並ぶ方向には横方向（Horizontal）、縦方向（Vertical）の２つがあります。 Flexboxで言うところのflex-directionを表し、Horizontalはflex-direc

          ミキ｜デザイナー
        • 固定された記事

        【ランチメニューの情報設計 vol.1】 根津のパスタ屋さん

        ミキ｜デザイナー

        マガジン

        • FigmaのAuto Layoutをマスターしよう
          4本
        • ランチメニューの情報設計
          1本

        記事

          【FigmaのAuto Layoutをマスターしよう vol.1】 シンプルなボタン

          みなさんFigmaのAuto Layout使ってますか？ 私は普段アプリデザインの仕事をしていますが、Auto Layoutがリリースされてからプロトタイピングのスピードが２倍ぐらいになったのでは......？という感覚です。 というわけで、今回はシンプルなボタンを作りながらAuto Layoutの使い方を解説していきたいと思います！ Auto Layoutとは？ はじめに「Auto Layoutとはどんな機能なのか」という話ですが、簡単に言うと CSS でいう div

          ミキ｜デザイナー

          【FigmaのAuto Layoutをマスターしよう vol.1】 シンプルなボタン

          ミキ｜デザイナー