#UIデザイン
【Figma講座】デザインスピードが上がるショートカット５選！
こんにちは！and factoryマンガアプリの担当デザイナーのリリです。
Figmaのデザイン作業を効率よくする為に欠かせないのが、ショートカットの活用。
今回は、Figmaのデザインスピードが上がるショートカットを５つ紹介します。
１.複数画像をまとめて差し替える【Command/Ctrl+Shift+K】複数の画像をシェイプ内に挿入する際、一枚ずつ追加していませんか？
Figmaでは複数画
エンジニア直伝！デザイン&実装の両観点で最適な「積むUIレイアウト」の制作方法
こんにちは、@ShikiCheriです。
現在フリーランスのUIUXデザイナーをやっており、単発案件ではなく長期的に組織や事業にコミットするような形で、サービス開発のデザインを中心に担当しています。
デザインシステム構築を担当したことでUIデザインの最適解について目から鱗が落ちた…！？クックパッドは25年のサービスの歴史があり、特にWeb版は今でも現役で活用されているサービスです。私はこの長寿サ
Figmaでパーセント指定で可変するComponentの作り方
初めまして、UXUIデザイナーのShanenです。Noteで初めての記事ですが、よろしくお願いします。
業務の中で、同じCompnentをいくつのデバイス画面に使うことが多いでしょう。特にデザインシステムの適用拡大によって、もっとフレキシブルなCompnentレスポンシブ対応が要求されている。なので、今回はfigmaで可変するComponentの作り方を紹介します。
みまさんご存知通り、fig
FigmaのVariablesを実際にプロジェクトに導入してみるなら、どこから使うか
Figmaの新機能のVariablesは、これまでの機能に比べるとできることが多く、今運用しているプロジェクトに何から導入していったらよいか模索している方が多いと思います。
Flappy Birdが作れたり、ポケモンを進化させることができたりと、Variablesの活用事例は多岐に渡りますが、実際のWeb・アプリのUIデザインにおいて、自分ならまずどこから導入してみるかをご紹介します。
一番手
XDユーザーのお困りごと6選 - Figmaを使えるようになろう！ vol.2
こんにちは。デザイン×エンジニアリング×ディレクションをベースに「新しい価値観」を創造するクリエイティブ集団、crage（くらげ）株式会社のデザインチーム、Figmaをバリバリ使ってきたガッキー🙋♀️と、XDからFigmaに乗り換えたナンシー🙋🏻♀️ です。
crageでは今までメインツールとしてXDを利用してきました。今は徐々にFigmaに移行中です。
そんなcrageでは、Fig
Figma Library外科手術
フリーランス&Goodpatch Anywhereで、グラフィックやUIデザインなど見た目周りを専門にデザインしているハマダナヲミと申します。文字とビールが好きです。(フェスではハイネケンに乾杯し、W杯では自宅からバドワイザーを応援し、ご飯を食べに行ったお店にモレッティがあれば迷わず注文します。)
みなさまFigma使ってますか！かつてPhotoshopと添い遂げるんやとばかり思っていたAdob
Reactが書けないデザイナーがAWS Amplify StudioとFigmaを使ってReactコンポーネントコード生成
HTMLとCSSは大方理解しているがJSはほんの少しだけ、Reactなんて書けませんみたいなレベルのデザイナーがAmplify Studioを使ってFigmaで作ったデザインをReactコード生成してみました。
こちらのチュートリアルが非常にわかりやすかったです。
※利用するにはFigmaアカウントとAWSのアカウント、Githubアカウントが必要
アプリケーションのデプロイやらロールの作成や
アップデート分も含めて、FigmaのAutoLayoutを完全に理解する
Figma config 2022でも発表、アップデートされた新機能をちゃんと理解するために使ってみて、個人の主観も入れつつ内容をまとめてみます。
adobeに買収後にFigmaとXDの関係がどうなるかは気になりますが、もし将来統合されたとしてもFigmaのAutoLayoutは残ってほしいし、XDのリピートグリッドも残ってほしい（line-heightまわりはXDさんはちょっかい出さないで）。
