「スクリプちん」のサイトデザインをリニューアル作業中です…^^;

AdobeXDの使い方を学ぶおすすめ動画・無料のワークショップKitも!

当ページのリンクには広告が含まれています。
Adobe XDを最短で学ぶ方法

Adobe XDは、WEBサイトやモバイルアプリなどのUI/UXをデザインできるツールです。

Adobe XDから書き出されたデータファイルは、まるで本物の仕上がりのように動作し、しかも共同作業を効率化する仕組みが、多く取り入れられています。

このAdobe XDを使うのは、それほど難しくはありません。

でも、これまでの常識的な制作工程に馴染みきった思考のままでは、Adobe XDを思うように活用することはできないでしょう。

Adobe XDには、これまでの経験からは発想できない機能がたくさんあります。そのため、このAdobe XDを十分に活用するためには、少しばかり時間が必要なように思います。

そこでここでは、Adobe XDを効率よく楽しく学ぶ方法を紹介します。
Adobe XDは、単なるワイヤーフレーム作成ソフトとして使うのではなく、WEBサイト開発までのパワフルツールとして活用できます。

今後のWEBサイト開発にも大きな影響を与えるであろうAdobe XDを、今のうちにマスターしておきましょう! もう、グズグズしてる時間はありません。

Adobe公式サイト Adobe XDとはどんなソフトで、どう使うのでしょうか?

目次

基礎:Adobe XDチュートリアル

もし、Adobe XDって何ができるのかもまだよく知らないというのなら、まずはAdobe公式のチュートリアル動画「XDことはじめ」を見るのがオススメです。

このチュートリアルはAdobe XDを持っていなくても見れるし、AdobeのIDがなくてもOKです。誰でもWEBサイト上で見ることができます。

このチュートリアルではXDの基本的な作業の流れを見ながら、基礎的なツールの使い方や、もっとも特徴的な機能の一つ「リピートグリッド」や、「画面遷移の作り方」などを見ることができます。

この「XDことはじめ」はStep1・2とありますが、どれも短い動画です。再生速度も最大で2倍速で聞けるので、あっという間に聞き終わります。

ほんの概要だけの紹介動画ですが、きっとこの動画を見終わった頃には、自分で実際にXDを触ってみたくてウズウズしてしまいますよ。

Adobe公式サイト XDことはじめStep1:まずはここから!

Adobe公式サイト Adobe XD

初中級:実践形式のXD講座

icon icon

次に、もっと実践的な内容を学びましょう。

私のオススメは、Udemy iconの「【2023年最新版】Adobe XD 手を動かして覚えるUI/UXプロトタイピング icon」です。

この講座では、スマホの画面サイズでワイヤーフレームを作り始めたあと、最終的にはiPad ProとWEBページへの展開、そして一番最後に、実際のサイト制作で役立つCSSコードの書き出しまで説明しています。

「実際の仕事の現場ではどんなふうに作業が進むのか」ということを講座背景においているので、単なる機能紹介動画ではありません。十分に実用に足る動画講座です。

この講座は、多くの大手企業の研修にも採用されている実績があるとのことで、几帳面で丁寧な口調で解説されています。
派手さはありませんが、講師自身が何かを売り込もうという宣伝めいたことが全くなく、しっかりと学べます。

講義の総時間数は11時間半あって少し長いので、ちょっと大変なように思うかもしれませんが、Adobe XDは難しいソフトではありませんから、このくらいのボリュームがないと、逆に物足りなく感じます。

私は実際にこの講座を受講しましたが、最初の基礎のあたりのセクションは2倍速再生で聴き、その後に自分で手を動かして実際にXDを使ってみる、というやり方で視聴しました。

少し複雑になってきたらスピードを緩めましたが、IllustratorPhotoshopなどのツールを使った経験がある人なら、サクサクと進められるはずです。

Udemy iconには、Adobe XD以外にもたくさんの講座があります。

それらの講座はほとんどが有料講座で、このXDの講座も有料ですが、Udemy iconでは頻繁にセールをやっているので是非チェックしてみてください。
セールでは95%引きなどで購入できるので、普段は数万円する講座も千円ちょっとまで安くなります。

おそらくもうすぐBlack Friday(ブラックフライデー)のセールも始まります。
それまでに、良さそうな講座を探しておくと良いと思います。

Udemy公式サイト 【2023年最新版】Adobe XD 手を動かして覚えるUI/UXプロトタイピング。UI/UXデザイナーを目指す完全ガイド icon

Udemy iconには、この他にもAdobe XDの講座がいくつかあります。日本語の講座は多くはありませんが…。

講師によって講座の雰囲気も違うし、講座のボリュームが小さいものもあるので、サンプル動画を比較して、自分に合いそうな講座を選んでみても良いかもしれません。

Udemy公式サイト Adobe XD 講座一覧 icon

詳細機能:Adobe XD Trail

もうひとつオススメなのが、Adobe XD公式の「Adobe XD Trail」という動画で学べる総合学習プログラムです。

このサイトでは、Adobe XDのたくさんの機能が動画で説明されています。めちゃくちゃたくさんあります。

「え!? じゃUdemyいらねぇじゃん」ってなりそうですが、このサイトは各機能を深掘りして説明しているサイトです。
ですから、基礎のチュートリアルの後で、すぐにこのサイトをみてもほとんどついていけません。

Adobe XD Trail」は機能紹介に特化しているサイトですから、まずは、前述の11時間半の【2023年最新版】Adobe XD 手を動かして覚えるUI/UXプロトタイピング iconで学んだあとで、この「Adobe XD Trail」で興味を持った動画を見てみると効率よく学べます。

公式サイト Adobe XD Trail

まとめ

私のオススメするAdobe XDを学ぶ方法は、この2つです。

Adobe XDの使い方は、YouTubeで無料動画を公開している人もいます。
もちろん、書籍もたくさん出ています。

でもやっぱり、無料動画では入門・基礎から抜け出すのは難しいように思います。

また、書籍を読みながらXDを使って覚えるのは、動画視聴に比べると効率が良くありません。
Udemy iconのセールなら1,200円程度まで値引きされるので、本を1冊買うよりも安いんです。

最初にも言いましたが、Adobe XDは今後のWEB制作においては大きな影響力を持つソフトです。
いまのウチに、XDを自由に使いこなせるだけのスキルを身につけておきましょう。

Adobe公式サイト Adobe XD

よかったらシェアしてね!
  • URLをコピーしました!
目次