Webデザイナー Webディレクターが覚えておきたい Adobe XDによるワイヤーフレームの作り方 ワイヤーフレーム速習講座
デザインテンプレートダウンロード特典付き！
実用的なワイヤフレームの作り方を学べるオンライン講義XDワイヤーフレーム作成講座のお申込み
Adobe XD ワイヤーフレーム講座
ワイヤーフレームテンプレート特典付き
5,500円（税込）
- 受講形式
- eラーニング（いつでも学習できるオンライン講義）
- 視聴期限
- 受講開始から1年間
こんな方におすすめですXDワイヤーフレーム作成講座で学べること
-
Webデザイナー、Webディレクター、フロントエンドエンジニア
ホームページの企画・ウェブデザインの提案や打ち合わせに必要なワイヤーフレームの作り方を学ぶことができます。XD初心者でも受講可能です。
-
仕事や実務で使えるワイヤーフレームを作りたい方
Adobe XDでLPランディングページのワイヤーフレームをデザイン、制作できるようになります。
-
スキルアップを考えている方、副業やフリーランスで仕事をしたい方
Webデザイン、ホームページ制作の業務案件受注を前提に実務レベルの技術を学ぶことができます。
XDワイヤーフレーム作成講座の特徴
- プロの制作手順をマスターできる！
- 実務で使えるデザインスキルを習得！
- Adobe XDで実践学習！
実践形式のカリキュラムXDワイヤーフレーム作成講座の学習内容
需要あるランディングページを作例に
優れたWebデザインを提案できるようになります。
概要・ワイヤーフレームの目的
- ワイヤーフレームの活用メリット
- 実践作例の説明（化粧品ブランドのサンプルLP）
初期準備・メインビジュアル
- アートボード作成、ガイドラインの設定
- 長方形ツール、テキストツール、リピートグリッド、整列の使い方
- メインビジュアルのコンテンツ作成とレイアウトデザイン方法
商品紹介
- 購入を促すキャンペーン商品の見せ方
- コンポーネント、長方形ツール（角丸変形）、テキストツールの使い方
- コンポーネントの活用方法、ボタン作成
ユーザーの悩み・問題
- レイアウト作成のためのガイドライン
- チェックボックスの作り方
- リピートグリッドの活用方法
Call to Action
- ランディングページの重要ポイントCTA
- クリックしやすいボタン周辺デザイン
商品の特徴
- 等間隔の横並びデザイン
- コンポーネント、長方形ツール、リピートグリッドの使い方
お客様の声
- 購入を後押しするユーザーレビューの作成
- 画像・シェイプマスクを活用したデザイン
- スタック機能を使ったレイアウト
よくある質問
- FAQセクションの作成
- ガイドラインを活用したレイアウト
- 線ツール（点線）、リピートグリッドの使い方
フッターエリア
- フッターの作成
- アートボードの保存
目標は、クオリティの高いワイヤーフレームを短時間で作れるようになること。
ウェブサイト作成やホームページ制作の現場では、WebディレクターやWebデザイナーがワイヤーフレームを使って、最初の提案や打ち合わせを行う場面が多くあります。そのワイヤーフレームをもとに、ザインカンプを作成したり、コーディング（実装）を行う流れが一般的です。ワイヤーフレームは、Webサイトの設計図でもあり、お客様やチームと共有する重要なコミュニケーションツールにもなり、完成品にも大きな影響を与えます。ワイヤーフレームのクオリティが仕事の受注や結果を左右するといっても過言ではありません。また、アドビ関連のソフトウェアを利用するWebデザイナーやWeb開発者は多いため、Adobe XDの扱いにも慣れておくことで、さまざまな案件に対応でき、プロジェクトを円滑に進めることができます。
この講座では、需要あるランディングページを課題に、実用的なワイヤーフレームの作り方、デザイン手法を学ぶことができます。特にお客様と接点のあるWebディレクター、Webデザイナー、打合せから制作までを行うフリーランスの方におすすめです。
ワイヤーフレームテンプレート特典付き！
受講特典として、講座で作成する「ランディングページPC版」に加え、「ランディングページスマートフォン版」「コーポレートサイト」のワイヤーフレームのデザインテンプレート3点を無料でダウンロードすることができます。オリジナル作成のベースとして実務や仕事でご利用いただけます。
この講座で身につくスキル
プロのウェブデザイナーが現場で必要な
基礎基本を盛り込んで監修しています。
-
ワイヤーフレーム
Webサイトのイメージが伝わるワイヤーフレーム、ランディングページのレイアウトテクニックを習得できます。
-
Adobe XD
Adobe XDの実用的な使い方、Adobe XDを使ったWebデザイン方法がわかります。
-
UI/UXデザイン
商品購入までの導線、ユーザー目線を意識した見せ方などWeb設計の基本が身につきます。
ガイダンス
| 講座名 | Adobe XD ワイヤーフレーム講座 |
|---|---|
| 特典内容 | xd形式ワイヤーフレームのサンプルテンプレート3点 ランディングページ（PC版）／ランディングページ（スマホ版）／コーポレートサイト |
| 受講料金 | 5,500円（税込） |
| 講義形式 | eラーニング（オンラインでいつでも受講可能） |
| 所要時間 | 実演講義 約38分 |
| 視聴期限 | 視聴開始日から1年間 （期間内は何度でもご覧いただけます） |
| 使用ツール | Adobe XD※ご利用のパソコンに事前にご準備ください。※Adobe XDは、2023年2月よりAdobe Creative Cloud(Adobe CC)プランに含まれます。詳しくはAdobe公式サイトにてご確認ください。 |
| ご用意いただくもの | インターネット環境／パソコン（MacまたはWindows）／上記使用ツール※実装学習はパソコンを推奨いたします。視聴はタブレットやスマートフォンでも可。 |
| キャンセルポリシー | 視聴開始前（購入日から1ヶ月以内）：なし 視聴開始前（購入日から1ヶ月後以降）：料金の100% 視聴開始後：料金の100%※ご返金の際は受講料金から振込手数料を差し引いた金額をご返金いたします。 |
受講の流れ
-
1. 講座のお申し込み・購入手続き
こちらよりご購入手続きをお願いいたします。お手続き完了後、受講に関する案内メールをお送りいたします。
-
2. アカウント発行
ご入金の確認が出来次第、アカウントを発行いたします。
-
3. 講座の視聴・学習開始
マイページにログインして視聴・学習を開始することができます。
講師・監修
伊東 知美
Design24℃ 代表
制作プロダクションにてDTPデザイナーとして勤務。新聞、パンフレットなど紙媒体の広告デザインやロゴデザインなどの制作実績を経て、WEBデザインにキャリアチェンジ。2005年独立。結婚式場のサイトや化粧品LPなど女性向けのデザインから、きっちりとしたコーポレートサイトやポップなサービスサイトまで多くの業種のサイトデザインを手掛ける。
誰でもWEBデザイナーになれる時代だからこそ、ディレクションスキルやユーザビリティを考慮したデザイン、ロジカルな思考などのちょっとしたスキルで他のデザイナーさんと差がつくはずです。現場で使える実践的な講座を提供いたします。
最速でワイヤーフレームの作り方を習得！
受講したお客様の声
-
自信をもって打ち合わせができるようになりました
東京都 Y.K 様 / Webデザイナー
何となく作っていたワイヤーフレームに物足りなさを感じていたので受講しました。実際に思い描いたホームページの本格的なワイヤーフレームを作れるようになりました。ランディングページのテンプレートが大変参考になりました。
-
社内で明確な構成を伝えることができるようになりました
埼玉県 T.H 様 / Webディレクター
アドビXDでつくるワイヤーフレームの流れを見てプロの仕事を体感できました。おかげさまで、社内でデザイナーやエンジニアに明確な構成を伝えることができるようになりました。
-
完成度の高いワイヤーフレームの作り方がわかった
千葉県 C.S 様 / Webエンジニア
提案からひとりでこなすフリーランスとしては、完成度の高いワイヤーフレームの作り方がわかって本当に良かったです。XDなのでデザインカンプまで一気に作れそうな内容でした。ありがとうございました。
- 福岡県 M.Y 様 / Webディレクター 特典のテンプレートはとてもお得でした。早速、仕事で活用させていただきました。ありがとうございました。
- 京都府 Y.T 様 / Webデザイナー 教材が化粧品のランディングページで良かったです。ワイヤーフレームの作り方や完成までの流れがとても参考になります。
- 東京都 K.S 様 / Webデザイナー 取引先の企業から本格的なワイヤーフレームだとほめられました。
- 神奈川県 H.K 様 / Webエンジニア ワイヤー制作時のXDの操作とデザインの手順をしっかり学習できました。機会があったらWebデザインを依頼したいです。
- 北海道 R.N 様 / Webデザイナー 流れるような作業が、さすがプロです。同じくらいのスピードで作れるよう練習したいと思います。
よくある質問
- XD、ウェブデザインの初心者・未経験者でも受講できますか？
- Adobe XD、Webデザイン初級レベルの方でも受講いただける内容となっております。事前にAdobe XDに少し触れておくと、よりスムーズに学習いただけます。
- 事前に準備するものはありますか？
- 講座で使用するツールをご用意ください。詳しくはガイダンスの使用ツールをご覧ください。
- 受講料の支払い方法は？
- クレジットカード払い、銀行振込よりお選びいただけます。
- 銀行振込の場合の振込期限は？
- お申込みいただいた日から3営業日以内となります。ご入金が確認できなかった場合はキャンセルとさせていただきます。
- グループでの申し込みはできますか？
- 可能です。ただし、おひとり様つき1つのアカウントの登録・発行が必要となります。お申し込みの際に、受講者全員の「お名前」「メールアドレス」をお知らせいただきます。
- 申し込み後のキャンセル料はかかりますか？
- 講義形式がeラーニングの講座は、受講開始までキャンセル料はかかりません。
ただし、ご購入日から1ヶ月以降よりキャンセル料の対象となりますのでお早めにご連絡ください。 - 法人での申し込みは可能でしょうか？
- 可能です。社内研修や社員育成プログラムなどでもご活用いただいております。
仕事で使えるワイヤーフレームをマスターできるXDワイヤーフレーム作成講座のお申込み
Adobe XD ワイヤーフレーム講座
ワイヤーフレームテンプレート特典付き
5,500円（税込）
- 受講形式
- eラーニング（いつでも学習できるオンライン講義）
- 視聴期限
- 受講開始から1年間