現場で学ぶ！デザインデータからのライブコーディング実践会

🧑‍💼 想定対象者

• Web制作を学び始めた初学者
• 実務経験を持ち、制作フローを深く理解したい中堅制作者
• デザインからコーディングへの変換を体系的に学びたい方
• ベテランの方も、新たな気づきや参考を得られる内容

🟡 セミナー概要
Web制作の現場では、デザインデータをどう読み解き、どうコードに落とし込むかが品質やスピードを大きく左右します。
本イベントでは、Webデザイナー／エンジニア、そして弊社コミュニティのギルドメンバーでもある庄司 美雪さんが登壇し、冒頭で「設計の考え方」「コーディング方針」を解説。その後、実際のデザインデータをもとに、どこに注目しながら実装を進めていくのかをライブで公開します。
さらに今回は、庄司さんが普段使用している Cursorエディタを用いたライブコーディングに加え、実務の中で AIコーディングをどう活用しているかについても触れる予定です。
AIの使い方は人によってさまざまですが、庄司さんならではの活用方法でリアルな視点が聞けるのも本イベントの見どころです。
リアルタイムで進む作業を目の前で体感することで、手順や判断の背景が学べるのはもちろん、実務に直結する具体的なポイントを持ち帰ることができます。
初学者から中堅層まで、そしてベテランの方にとっても新たな気づきや参考になる濃密な90分です。
※
デザインデータはFigmaを使います。
 

👨‍🏫 講師プロフィール
Webデザイナー兼エンジニア：庄司 美雪
合同会社いろは 代表 ／ 一般社団法人ディレクションサポート協会CTO ／ 株式会社ShareDan WEBクリエイターズギルド：コーダー、メンター
文系大学卒業後、インフラエンジニアとしてIT業界に入り、その後Web制作や広告運用など幅広い業務を経験。現場で培った経験を活かし、効率的で品質の高いコーディング手法をわかりやすく解説して下さいます。

 
🎁 参加頂いた方が得られること

• 現場で使える設計思考：無駄のない効率的なコーディング手順と判断基準
• デザインデータの読み解き方：意図を掴み、再現性の要点を定義してブレなくコード化する
• 納品形式の理解：次の担当者がスムーズに作業できる状態での納品方法
• AIコーディングの実践的な視点：「私はこう使う」というリアルなAI活用例
• 実践の空気感：リアルタイム作業の進め方や注意ポイントを体感できる

📅 当日のスケジュール予定【10/24(金)：19:00〜20:30】
ー オープニング

• 冒頭講義
• ライブコーディング
• ブラウザチェック＆納品の講義

ー Q&A
ー クロージング

＊20:30の講義後、オフライン会場では弊社ShareDanオフィスで軽食を伴う懇親会を行う予定（参加自由＆途中退出可）

※講義内容は変更を伴うことがあります
 

📚️参加費
オンライン＆会場とも**【3,000円】**
＊講義終了後のアンケートに回答頂いた方にはアーカイブデータを共有いたします

 
🏢会場（オンラインのご参加も可能です）
弊社「株式会社ShareDan」オフィス（浅草橋駅から徒歩５分）

Address：東京都台東区浅草橋五丁目1番38号 アイビー浅草橋3階
＊会場の参加人数は【定員10名】とさせて頂いております。
 
🎁特典
弊社ウェブクリエイターズ集団ギルドメンバーは、参加費【無料】
＊
「ウェブクリエイターズ集団ギルドメンバー」とは？
 
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
🌸 デザインを正しく理解し、効率的にコードへ落とし込む力は、Web制作において大きな武器になります。
本イベントでは、そのプロセスを実際のデータを使ったライブコーディング形式で学べます。
リアルな講義を通じて、すぐに実務に活かせる知識と感覚をぜひ持ち帰ってください。
新しい発見とワクワクをぜひ一緒に体感しましょう♫