シェア
Qiitaからのお引越し記事です。（元記事） 私MonoのFigmaファイルを初めて触るエンジニアに最低限の機能を教える記事。 他のFigmaファイルに対しても8割くらいは応用が効く内容になっていると思います。 心構え開発 >> デザイン 特にハッカソンでは、技術がメインで評価されます。 デザインに時間がかかって動かないプロダクトを作るよりは、全てデフォルトコンポネントでダサいけれど動く物を作る方ががマシだと思ってます。 デザイナーは実装の大変さを分かってない
Figmaのスマホ設計手法① Figmaのスマホ設計手法② Figmaのスマホ設計手法③ Figmaのスマホ設計手法④ 6. リスト要素だけはAuto layoutを適用構造 Frame-1 - fix 要素 - Frame-2 (Auto layout) - $spacing - リスト (Auto layout) - リスト要素1 - リスト要素2 - $spacing 解説 先ほども言ったように、Frame-2の子孫要素には$s
Figmaのスマホ設計手法① Figmaのスマホ設計手法② Figmaのスマホ設計手法③ Figmaのスマホ設計手法④ 4. Frame-2の要素の間に余白を挿入構造 Frame-1 - fix 要素 - Frame-2(Auto layout) - $spacing - 要素1 - $spacing - 要素2 - $spacing 解説 まず、FigmaのAuto layoutの問題点について考えてみましょう。1番の問題点は、間隔ごとに個
Figmaのスマホ設計手法① Figmaのスマホ設計手法② Figmaのスマホ設計手法③ Figmaのスマホ設計手法④ 先ほど作ったFrame-2に子要素として、さまざまな種類を入れまくっていきます。 では、入れる要素の配置ごとに見ていきましょう！ 3-1. 要素が1つで中央揃えしたい時 構造 Frame-1 - fix 要素1 (status bar) - fix 要素2 (bottom navigation) - Frame-2 (Auto layout)
（こちらはQiitaに以前投稿した記事のお引越しです） Figmaのスマホ設計手法① Figmaのスマホ設計手法② Figmaのスマホ設計手法③ Figmaのスマホ設計手法④ 今回は、自分なりのFigmaの設計手法について4日ほど悩みまくって決めました。長いですが最後まで読んでいただけると嬉しいです。 対象の人 Auto layout, Variantsを理解している人 Figmaでモバイルアプリ画面を作る際に、Auto layoutをノリで適用している人
Figmaでスライドを作る記事はたくさん投稿されています。 ただし、最終目標がpdf出力のものが多く、アニメーションやVariantsの利用方について解説している記事はあまり見かけません。 今回は、それらの機能を中心に解説します。 対象者 Figmaの基本的な機能が使える人 Prototype、Variants pdfを捨てられる人 スクロールFigmaではスライド内に複数スクロールする要素を含められます。 スライド自体も上記の条件に当てはまればスクロールしたり
