ブックマーク / note.com/shingo2000 (2)

  • FigmaのVariablesを使用してダミーコンテンツを管理する|鈴木慎吾 / TSUMIKI INC.

    公式のPlaygroundを見ると、ダークモードとライトモードなど、複数のモードを持つデザイントークンを管理するような使い方が想定されているようですが、これをデザイン内で使用するダミーコンテンツの管理に使用してみたいと思います。 FigmaのVariablesにダミー情報を登録しておき、一覧や詳細表示のインスタンスに反映するアイディア。 要素の有無や文字量が多い場合など、複数パターンを用意しておくと表示の検証が手軽にできるし、スクショに使うダミー情報もすぐに反映できる。良い気がするぞ。 #config2023 pic.twitter.com/Q4OgyFzJ5z — 鈴木慎吾 / TSUMIKI INC. (@shingo2000) June 23, 2023 ダミーコンテンツとは?ダミーコンテンツとは実際には存在しない物らしいテキストや画像のことを指し、UIデザインの際に頻繁に使用しま

    FigmaのVariablesを使用してダミーコンテンツを管理する|鈴木慎吾 / TSUMIKI INC.
    kojika17
    kojika17 2023/06/26
  • UIモーション01: UIになぜ動きが必要か?|鈴木慎吾 / TSUMIKI INC.

    スマホアプリやWebサービスなど、スクリーン上のUIには様々な形でモーション(動き)が使われています。
こうしたUIモーションは利用者として毎日何気なく目にしているものですが、そこには作り手がいて目的があるはずです。この記事ではUIモーションの目的と効果的な使用方法について考察します。 UIモーションとUIアニメーション「モーション」と「アニメーション」はどちらも動きを表す言葉として、同じ意味で使われることもありますが、元々の言葉の意味を踏まえると以下のような違いがあると言えます。 UIモーション:UI要素に動きを与えたもの。ユーザーの操作や時間経過に応じてUI要素が移動・拡大・縮小・変形などの変化が生じること。(例:モーダルウィンドウの表示・非表示など) UIアニメーション:時間とともに変化するグラフィックをUIに取り入れること。(例:Twitterのいいねボタンを実行した際の演出) 厳

    UIモーション01: UIになぜ動きが必要か?|鈴木慎吾 / TSUMIKI INC.
    kojika17
    kojika17 2023/03/06
  • 1