Figmaレスポンシブ教材

Figma初級者が、ウェブデザインを制作する時の実際的なケースとしてレスポンシブ・ウェブデザインを学べる教材を作成しました。

Figmaにはレスポンシブ・ウェブデザインのための直接的な機能がないため、Figmaにあるどの能力を組み合わせればそれが可能かを示しました。

また、Figmaの中にあるCSSフレックスボックスと同等の機能である「オートレイアウト」を活用し、デザイン後の工程であるコーディングにスムーズに「ハンドオフ」できるように考慮しています。

同様に典型的にコーディングの際に問題になるレスポンシブ・ウェブデザインのデザイン指示について、デザイナーがどこまで気を配るべきかというデザイナーの責務も明確にし、パーツ単位でのブレークポイントの設け方を記載しました。