Adobe XD学習、レスポンシブデザインについて学習します。
第5回は レスポンシブデザイン作成の基礎について学びます。
下記ブログにアクセスし、掲載しているYouTube動画をご覧ください。
レスポンシブデザインは、PCやスマホなどのデバイスのウィンドウ幅に合わせて、
見やすい表示に自動で切り替える仕組みを持つデザインになります。
動画を見終わりましたら、感想や不明点、質問などコメントをご記入ください。
記載いただいた不明点や質問については後日まとめて案内します。
【Adobe XD】第5回 レスポンシブデザインを作る 1/4（#1 基礎を理解する）
XD学習
コメント一覧
基礎の紹介ということですが、今回は前回まで4回の復習の場面も多く、より本格的になってきたように思いました。レスポンシブの具体的な作業は次回からのようなので楽しみです。
レスポンシブデザインの構築は複雑で難解というイメージでした。材料が揃っているという条件付きですがxdでは簡単に作成できることに驚きました。以前はレスポンシブの仕組みもしっかり理解しないまま更新作業をやっていました。作成段階から構造や仕組みを理解していければと思います。
レスポンシブデザインの概念や、説明の仕方の参考にもなりました。
また制作を依頼する側の視点だと、レスポンシブデザインのレイアウトが変化するブレイクポイントを定義し、指示するのにとても有効な機能だと思いました。
第一回からなぞらえてやってみて、まったく追いついていないですが、何回も見直しながらやっていきます。
web初心者（それ以前ですが）でもわかりやすく難しい設定もしなくてすむのがとても使いやすです。
実際にそのとうり作業してみようとすると理解できていないところもありますが、レスポンシブデザインが何かということがわかりやすかったです。
動画確認しました。今では当たり前になっているレスポンシブデザインですが、実際作業するとなるとある程度の知識や技術が必要となります。レスポンシブデザインをXdで作成した場合、どの程度の知識が必要なのか、また作業効率的にどうなのかこれからの内容が楽しみです。
普段レスポンシブデザインに触れていますが多くが実際にコーディングを行ってからコードに沿ってレスポンシブ化する流れになっています。
デザイン時点である程度レスポンシブの動きが見えることでより具体的なイメージの共有が可能になるのでコーディング時のズレが少なくできると感じました。
レスポンシブへの対応となるとXd上の排出されるCSSがどの程度実践的に流用できるのかが気になります。