CSS Niteのオンラインセミナーで『Figmaの基本と「ペアデザイン」の実践』についてお話しました！

アシスタントデザイナーの中川です。
2021年2月19日、CSS Niteのオンラインセミナーにneccoが登壇。『Figmaの基本と「ペアデザイン」の実践』という内容で、necco代表の阿部さんとデザイナーの今さんと一緒にお話しました。

CSS Niteとは？

CSS Niteとは、2005年から開催されているウェブ制作に関わる方のためのセミナーイベントのことで、ウェブデザインやウェブマーケティングに関するテーマを総合的に扱っています。
次回は、半田 惇志さんによる『CSS設計完全ガイド』の著者による「CSS設計のキホンと王道パターン」が4月14日（水）に開催されるそうです！
(*こちらのイベントは終了しました。)

前半は「Figmaの基本」について、実際に動かしながら紹介

セミナー前半では「Figmaの基本」についてお話しました。

neccoでは、普段業務でFigmaというデザインツールを活用しています。ウェブ制作や
「Figmaって具体的に何ができるの？」というところから「仕事でどこまで活用しているのか」などについてお話ししました。
今回はFigmaの操作感をより直感的に感じてもらうために、登壇資料のスライドもすべてFigmaで作成してみました！
Figmaの強みである同時編集機能を活かして、今回作成した資料のデータを3人でリアルタイムでFigma上で動かしながら進めていきました。

neccoがよく使用するプラグインの紹介も実演を織り交ぜながら紹介しました。以下が紹介させていただいたプラグインです。

・Unsplash（高品質のフリー写真素材）
・Japanese Dummy Text（日本語のダミーテキスト作成）
・Better Font Picker（フォントの字形を確かめられる）
・Nisa Text Splitter（テキスト分割）
・Map Maker（地図作成）
・Blobs（ランダムで丸オブジェクト作成）
・HTML <-> Figma（サイトをFigma上に起こしてくれる）

便利なプラグインは作業を効率化してくれる強い味方ですね。
他にも、間取り図や図解作成など業務以外でのFigmaの活用方法や、Figmaファイルの管理の仕方、グリッドの作成方法など盛りだくさんな内容でお届けしました。

後半は「ペアデザインの実践」について、実例を交えて紹介

後半では、neccoが普段から実践している「ペアデザイン」についてお話しました。

ペアデザインをするメリット・デメリットや、効率の良いメンバーの組み合わせ方など、neccoでの実例を交えて紹介しました。

また、今回作成したセミナー用のバナーのコンセプト決め〜完成するまでのペアデザインの様子を、擬似的に再現してみました！どんなフィードバックを受けてどういった変遷でデザインをブラッシュアップしているのか、neccoの普段のペアデザインの様子が伝わったらなによりです。

2時間という短い時間でしたが、Figmaやペアデザインの魅力をお届けできていたら幸いです！

本編終了後のアフタートーク

セミナー終了後のアフタートークには、Adobe XDユーザーグループ大阪を主宰している松下 絵梨さん( @matsu_eri )や、セミナー参加者でもあり日々TwitterなどでFigmaの情報発信や共有を行っている株式会社キテレツ代表のKiteさん( @ixkaito )、株式会社エイチーム・Increments株式会社所属の綿貫さん( @xrxoxcxox )にもご参加いただき、他のツールとの違いや、Figmaの便利機能についてさらに掘り下げることができました。

最後に

今回ご参加いただいたみなさま、出演してくださった皆様、本当にありがとうございました！👏👏
SlidoやZoomやTwitterでもたくさんコメントくださり嬉しかったです！neccoみんなで喜んでいまいした。
Figmaの魅力を普段業務で使用している自分たちの目線で少しでもお伝えできれば…と思いながらお話させていただきましたが、私たちも今回のセミナーを通してたくさんの発見を得ることができました。
みなさんが楽しくFigmaを活用できるきっかけになっていましたらnecco一同とても嬉しいです！

---

📮 お仕事のご依頼やご相談、お待ちしております。

お仕事のご依頼やご相談は、お問い合わせ からお願いいたします。

🤝 一緒に働きませんか？

下記の職種を募集中です。より良いデザイン、言葉、エンジニアリングをチームで追求していける方をお待ちしております。詳細は 採用情報 をご覧ください。

• デザイナー
• アシスタントデザイナー
• フロントエンドエンジニア
• アシスタントフロントエンドエンジニア
• エディター・ライター

🗒 会社案内資料もご活用ください。

弊社のサービスや制作・活動実績、会社概要、ご契約など各種情報をまとめた資料をご用意しています。会社案内資料 からダウンロード可能ですので、ぜひご活用ください。

（2024年5月時点）