タグ

figmaとtipsに関するsigのブックマーク (7)

  • Figmaでちょっとしたデザインをつくるときに使っているプラグイン8選 - ICS MEDIA

    アイコンやスライド作成など、デザイナーに限らずちょっとしたデザインをつくる機会はありませんか? そんなとき、Figmaのプラグインを使うと、いつもより少し凝ったデザインを手軽につくることができます。 今回は、画像加工やあしらいをつくるときに便利なプラグインを8個紹介します。2024年6月時点で、すべて無料で使用できるので気軽に試してみてください。 Figmaのプラグインを使ったことがないという方は、以下の記事で使い方を紹介していますので参考ください。 『Figmaを使いこなせ! デザイナー必須のおすすめプラグイン15選』 1. Noise & Texture Noise & Texture | Figma 「Noise & Texture」は、ノイズやさまざまなテクスチャーを画像として作成できるプラグインです。 プラグイン実行後、設定パネル内の[Add to Canvas]をクリックすると

    Figmaでちょっとしたデザインをつくるときに使っているプラグイン8選 - ICS MEDIA
  • FigmaのPaddingやカーソル移動のデフォルト値を設定する方法 | wentz-design.com

    今回はFigmaでオブジェクトをカーソル移動するときや、Auto layout使用時にPaddingに設定される値(10px)などの初期値を変更する方法を紹介します。デザインシステムなどを利用していて4や8の倍数を基準にしたい場合などにおすすめです。 この記事のターゲットFigmaのカーソル移動の初期値を変えたい方 Auto layoutのPaddingの初期値を変えたい方 「Nudge amount」のデフォルト値を変更するカーソル移動やAuto layoutのPaddingに適用される初期値は「Nudge amount」で設定された値が参照されます。設定の変更方法は以下の通りです。 ツールバーの一番左のFigmaアイコンをクリック メニューの「Preference」から「Nudge amount...」を選択する Nudge amountのダイアログで値を設定する Small nudg

    FigmaのPaddingやカーソル移動のデフォルト値を設定する方法 | wentz-design.com
    sig
    sig 2023/09/25
  • FigmaでInstance内の画像を入れ替える。

    UI(ユーザーインターフェース)デザインツールというと、SketchやAdobe XDの他に、Figmaというツールもよく名前が上がります。 改めて、UIデザインツールのシェアについて調査中!ご協力お願いします!(その他が多ければ集計し直します) 【あなたはどのUIデザインツールを使っていますか?】 — Web Design Trends (@TrendWebDesign) 2018年7月12日 トライデントコンピュータ専門学校Webデザイン学校では、「Webデザイン」の授業で利用するパソコンのOSがまだWindows7だったりします。 Photoshop, Illustratorを使用するには問題ないのですが、UIデザインツールといえば上位に上がるSketchもAdobe XDも利用できません。 そこで、2018年度はこのFigmaUIデザイン&プロトタイピングを学習しました。 導入当

    FigmaでInstance内の画像を入れ替える。
  • Figmaの色がブラウザの表示と違う…となったときに見直す設定

    Figmaアプリとブラウザで色が異なる表示になってしまうことがあります。 実際にWebで実装する際に表示されるのはブラウザで表示したときの色味になるので、Figmaアプリでデザインしてから実装されたものを見ると「あれ?」となったりします。 この記事ではFigmaアプリとブラウザでの色を統一する方法、なぜそれが起きるのか、Figmaアプリの設定の選びどころについて紹介します。 目次起きることFigmaアプリとブラウザでの色を統一する方法なぜFigmaアプリとブラウザの色に差が生まれるのかFigmaアプリの設定の選びどころ起きること 左がFigmaアプリ、右が同Figmaをブラウザで表示した画面です。 スクリーンショットでもわかるくらい差が出ます。Figmaアプリとブラウザでの色を統一する方法最初にとりあえず統一する方法だけ紹介します。 メニューバーのColor Spaceの設定をsRGBに変

    Figmaの色がブラウザの表示と違う…となったときに見直す設定
    sig
    sig 2022/05/17
  • Figmaの権限と課金の仕組みで注意することおよび対策|enpipi_work

    Figmaはオンラインで共同編集ができるデザインツールです。無料から気軽に利用することができ、Web上で利用できるため便利な一方で課金や権限の仕組みを正しく理解しないと意図しない過払いやインシデントが発生してしまいます。 この記事では課金と権限の仕様について述べ、気をつけるべきポイントについて記します。 前程 Professional Planでの調査結果です。 Organization Planでは仕様が異なるところがあるかもしれません。 もし誤りがあった場合は、フィードバックいたただければと思いますmm 権限の全体像Figmaの構成はFile, FileをまとめるProject(フォルダのようなもの), ProjectをまとめるTeamで成り立っています。 Team, Project, Fileにはそれぞれ下記のような権限があります。 Figmaの公式ヘルプページより抜粋 ユーザーはT

    Figmaの権限と課金の仕組みで注意することおよび対策|enpipi_work
  • 10 Figma Best Practices to 10X Your Workflow

    If we have a large set of variants for buttons, input fields, and so on, it will cost us tons of precious time if we decide down the line that 8px radius looks better than 12px or if we need to make any other adjustments. By using base components for our variant sets we can make one adjustment to our base and it will push the changes to all of our variant instances. To do this, create a base compo

    10 Figma Best Practices to 10X Your Workflow
    sig
    sig 2021/07/07
  • Figmaの生産性を高めるTips50選|三上蒼太 / Sota Mikami

    このような記事を参考にすることで設定可能です。 僕は ⌘ + Shift + M で設定しています。 3: Figma Walkerはショートカット設定しよう一押しPluginの一つ、Figma Walker。 日人のエンジニアさんが開発されました。 SkecthでいうRunnnerのようなPluginです。 特に、特定のFrameやMainComponentがある位置にすぐさま移動するのに便利です。 プロジェクトが進みファイルが大きくなってきた際にとっても便利です。 これもどんどん使う機会が多くなってくるため、Macにて独自のショートカットとしておくと便利です。 僕は ⌘ + Shift + F としています。 4: ショートカットのチートシートの存在 ショートカットに苦手意識がある方は、ぜひ「ショートカットのチートシートがある」ということをだけでも覚えておいてください。 全てではない

    Figmaの生産性を高めるTips50選|三上蒼太 / Sota Mikami
    sig
    sig 2021/06/08
  • 1