Webデザイナー必見!デザインの最新トレンド収集やスキルアップに活用できるスライド21選
Webデザイン業界は、トレンドの移り変わりが非常に早いのが特徴です。テクノロジーの発展やスマートフォンの普及も影響し、グラフィックからUI/UX、モバイル向けデザインなど様々なトレンドが誕生しました。
Webデザイナーであれば常日頃から情報収集を欠かさないという方もいるのではないでしょうか。
そのような時は、*セミナーや勉強会で利用されたスライドを閲覧できる「Slideshare」から情報を得ることをオススメします。*基本的なノウハウから、トレンドを取り入れた新しい手法など様々なスライドが共有されているため、書籍ではまかないきれない情報を得ることができるでしょう。
今回は、スキルアップを目指す若手Webデザイナー向けのスライドを21種類まとめました。ぜひ、Webデザインのスキルアップに活用してみてください。
Webデザイナー向けトレンドやスキルが学べるスライド21選
1.ウェブデザインに応用する4つの基本原則
「近接」「整列」「コントラスト」「反復」というデザインに関する基本原則をWebデザインに応用する手法が学べるスライドです。ページのレイアウトを上記の原則に適用させることで、視覚的にどのように変化するのかがわかりやすくまとめられています。
2.色彩センスのいらない配色講座
「配色」に関する基礎知識が学べるスライドです。色相や三原色、明度など基本的な色の構造について解説されている他、具体的な配色のノウハウを学ぶことができます。
配色はデザインの基本ですが、改めて色見本から配色の方法を確認する意味でもぜひチェックしてみましょう。
3.Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
人によって異なる「デザイン」の良し悪しについて言及したスライドです。目立つデザインか、わかりやすいデザインかなど、人によって好むデザインは分かれます。そのデザインは「何を目的に作られたものか」という視点で考えることで最適なデザインを選べるということが事例を元に解説されています。
4.いまさら訊けないWebフォント入門
CSSのfont-familyで利用できるWebフォントの基本について学べるスライドです。Webフォントを導入する際の構造やルール、利用するメリットについてシンプルに解説されています。
5.デザイナーこそ覚えておきたいCSS最新事情! あなたの知らないfont-familyのイマ
Webフォントの種類や具体的なフォント事例について学べるスライドです。代表的なフォントを例に、フォントデザインの特徴を解説し、フォントが与える印象について言及しています。
6.ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
非デザイナー向けに作られた、「デザイン」の判断の方法について学べるスライドです。「デザイン」は見た目の良さで良し悪しを判断しがちですが、「伝えたい目的を達成できているか」という視点を持つことで、デザインの判断ができると解説しています。非デザイナー向けとはいえ、他部署とのやり取りを行うデザイナーであれば知っておきたい知識でしょう。
7.コーディングを考慮したWebデザインガイドライン
ホームページ制作などコーディングを考慮したWebデザイン設計の基本が学べるスライドです。カラーモードや、寸法の単位、テキストサイズなどコーディング担当者に配慮した設定やレイアウトを知ることができます。
8.【デザイン・ノイズ論】~ Webデザインにおけるノイズ的手法を考える ~
“雑音”や“不要な要素”を意味する「ノイズ」をデザインに活用する方法を解説したスライドです。ノイズは「分からないけど面白いもの」と定義しており、AI時代に備えてノイズ的な発想をデザインに応用することの重要さを学べます。
9.コンバージョン心理学によるウェブ・デザイン
心理学の視点からコンバージョン改善するための方法をデザインという軸で学べるスライドです。ユーザーがコンバージョンしやすいUI設計とはなにか、コンバージョンするときの心理状況とはなにかについて図でわかりやすく解説されています。
10.【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】
企業ロゴの作り方について、コンセプトから作成する手順をまとめたスライドです。どんな会社なのか、何を提供しているのか、企業の第一印象はなにかのように「企業らしさ」を洗い出しデザインする方法を学ぶことができます。
11.アクセシビリティとこれからのWebデザイン
全ての人が「利用しやすい」設計を指す「アクセシビリティ」という視点からWebデザインを考察したスライドです。アクセシビリティを考慮したデザイン設計を行うことで、ユーザーの快適性を高めるだけでなくマーケティングという点においてもメリットが得られると解説されています。
12.UXの考え方とアプローチ
UXの基本的な考え方が学べるスライドです。様々なデバイスが登場したことでUXという概念が重視されるようになりました。ユーザーの心理構造をもとにどのようにプロダクトやサービスをデザインすれば良いUXなのか、実務において役立てられるでしょう。
13.グッドパッチのデザインカルチャーの作り方
アプリのUIデザインを行う株式会社グッドパッチのデザインカルチャーを知ることができるスライドです。デザイナーはどういう視点を持って仕事をすべきか、チームワークやプロジェクト進行の事例など、自社でデザインチームの構築をする際の参考にできるでしょう。
14.CAMPFIRE DESIGN #1 「デザインの力」でビジネスにコミットする
Yahoo JAPANが開催するデザインの勉強会イベント「Design #1」で利用されたデザインとビジネスの関わりについてのスライドです。ビジネスの手段としての「デザイン」をYahoo!の事例をもとに学ぶことができます。
15.快適にWebデザインするためのフリーランスの仕事の流れ【プロジェクトマネジメント編】夏本 健司
フリーランスのデザイナー向けの業務についてまとめられたスライドです。クライアントとのデザイン案のやり取りや、納期の取り方など業務のフロー別にわかりやすく解説されています。
16.SketchがAndroidのUIデザインに向いているワケ
Mac用デザインツール「Sketch」がAndroidアプリのUI設計に利用するメリットを解説したスライドです。Sketchができる業務の幅広さ、連携できるサービスの豊富さなどを知ることができるでしょう。
17.Photoshopをもっと効率化しよう ショートカットのその先へ 第76回「WEB TOUCH MEETING」
Photoshopを用いた業務効率化についてまとめられたスライドです。一般的にショートカットやツールの把握によってPhotoshopの作業効率を上げることができますが、さらに効率化する方法として、アクション設定について細かく解説されています。具体的な設定方法も学べるのですぐに応用できるでしょう。
18.デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
Webデザイナー向けに「Adobe Creative Cloud」の活用方法を解説したスライドです。アイデア案出しではAdobe Stockを活用し、モック制作にはAdobe Experience Designを利用するというように業務フローごとにどのソフトが活用できるのかがまとめられています。
19.WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
Photoshopの基本操作を軸にした作業効率化方法を学べるスライドです。選択範囲ツールを定規的に利用するなど応用技を学ぶことができます。他にもツール別に効率化する手段が解説されているため、既にPhotoshopに使い慣れたユーザーでも新しい発見があるかもしれません。
20.イラスト制作のためのIllustrator〜ベクターでもっと自由に描いてみよう〜
非デザイナー向けにIllustratorを使った、イラスト制作を簡単に行う方法がまとめられたスライドです。イラストをいきなり書き始めるのではなく、パーツに分解してイラストとして構成していくという手順がわかりやすく解説されています。
21.Adobe MAX Japan 2016「ベテランほど知らずに損してるIllustratorの新常識 あ、それ、今のIllustratorならこうします!」鷹野 雅弘(スイッチ)
プロのデザイナー向けにIllustratorの応用方法を解説したスライドです。Illustratorのアップデートに伴い強化されたツールなど、「慣れている人ほど見落としがち」な機能にフォーカスしているため、業務になれたデザイナーこそチェックすべき内容がまとめられています。
まとめ
スライドシェアは、書籍やWebメディアよりも直感的に情報を得られるため、短時間で効率的に情報収集できるのがメリットです。
また、デザインの基本的なスキルから最新のトレンドまで、第一線で活躍するデザイナーが制作したスライドも多く、「知っているようで知らなかったノウハウ」に出会えることがあります。またデザインの実務は一通りこなせるデザイナーでも、上記のスライドから学べることもあるでしょう。
Webデザインのスキルアップや情報収集のために、ぜひ今回ご紹介したスライドを参考にしてみてはいかがでしょうか。
- UI
- UIとは、ユーザーインターフェイス(User Interface)の略で、ユーザー(使い手)とデバイスとのインターフェイス(接点)のことを意味します。
- UX
- UXとは、ユーザーエクスペリエンス(User Experience)の略で、ユーザーが製品・サービスを通じて得られる体験を意味します。似たような言葉に、UI(ユーザーインターフェイス、User Interface)がありますが、こちらはユーザーと製品・サービスの接触面を指した言葉です。
- セミナー
- セミナーとは、少人数を対象とする講習会のことです。講師からの一方的な説明だけで終わるのではなく、質疑応答が行われるなど講師と受講者のやり取りがある場合が多いようです。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- レイアウト
- レイアウトとは、もともと「配置」や「配列」を指す語です。ここでは、「ホームページレイアウト(ウェブレイアウト)」と呼ばれる、ホームページにおけるレイアウトについて説明します。
- CS
- CSとはCustomer Satisfactionの略称で「顧客満足度」を意味します。顧客との関係維持、サービスの発展に関するマーケティング戦略に関わる用語です。
- フォント
- フォントとは、同一の特徴を持った文字の形状を一揃いでデザインしたものです。
- フォント
- フォントとは、同一の特徴を持った文字の形状を一揃いでデザインしたものです。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- テキスト
- テキストとは、純粋に文字のみで構成されるデータのことをいいます。 太字や斜線などの修飾情報や、埋め込まれた画像などの文字以外のデータが表現することはできませんが、テキストのみで構成されたテキストファイルであれば、どのような機種のコンピューターでも共通して利用することができます。
- レイアウト
- レイアウトとは、もともと「配置」や「配列」を指す語です。ここでは、「ホームページレイアウト(ウェブレイアウト)」と呼ばれる、ホームページにおけるレイアウトについて説明します。
- UI
- UIとは、ユーザーインターフェイス(User Interface)の略で、ユーザー(使い手)とデバイスとのインターフェイス(接点)のことを意味します。
- コンセプト
- コンセプトとは、作品やサービスなどに一貫して貫かれている考え方をいいます。デザインと機能がバラバラだったり、使い勝手がちぐはぐだったりすると「コンセプトが一貫してないね」などと酷評されてしまいます。
- マーケティング
- マーケティングとは、ビジネスの仕組みや手法を駆使し商品展開や販売戦略などを展開することによって、売上が成立する市場を作ることです。駆使する媒体や技術、仕組みや規則性などと組み合わせて「XXマーケティング」などと使います。たとえば、電話を使った「テレマーケティング」やインターネットを使った「ネットマーケティング」などがあります。また、専門的でマニアックな市場でビジネス展開をしていくことを「ニッチマーケティング」と呼びます。
- UX
- UXとは、ユーザーエクスペリエンス(User Experience)の略で、ユーザーが製品・サービスを通じて得られる体験を意味します。似たような言葉に、UI(ユーザーインターフェイス、User Interface)がありますが、こちらはユーザーと製品・サービスの接触面を指した言葉です。
- デバイス
- デバイスとは「特定の機能を持つ道具」を表す語で、転じてパソコンを構成するさまざまな機器や装置、パーツを指すようになりました。基本的に、コンピューターの内部装置や周辺機器などは、すべて「デバイス」と呼ばれます。
- アプリ
- アプリとは、アプリケーション・ソフトの略で、もとはパソコンの(エクセル・ワード等)作業に必要なソフトウェア全般を指す言葉でした。 スマートフォンの普及により、スマートフォン上に表示されているアイコン(メール・ゲーム・カレンダー等)のことをアプリと呼ぶことが主流になりました。
- UI
- UIとは、ユーザーインターフェイス(User Interface)の略で、ユーザー(使い手)とデバイスとのインターフェイス(接点)のことを意味します。
- Android
- Android OSとはスマートフォン用に開発された基本ソフト(OS)の一種です。米国Google社が中心となり開発されました。
- アプリ
- アプリとは、アプリケーション・ソフトの略で、もとはパソコンの(エクセル・ワード等)作業に必要なソフトウェア全般を指す言葉でした。 スマートフォンの普及により、スマートフォン上に表示されているアイコン(メール・ゲーム・カレンダー等)のことをアプリと呼ぶことが主流になりました。
- UI
- UIとは、ユーザーインターフェイス(User Interface)の略で、ユーザー(使い手)とデバイスとのインターフェイス(接点)のことを意味します。
- シェア
- シェアとは、インターネット上で自分が見つけて気に入ったホームページやブログ、あるいは、Facebookなど自分自身が会員登録しているSNSで自分以外の友達が投稿した写真、動画、リンクなどのコンテンツを自分の友達にも共有して広めたいという目的をもって、SNSで自分自身の投稿としてコンテンツを引用し、拡散していくことをいいます。
おすすめ記事
おすすめエントリー
同じカテゴリから記事を探す
カテゴリから記事をさがす
●Webマーケティング手法
- SEO(検索エンジン最適化)
- Web広告・広告効果測定
- SNSマーケティング
- 動画マーケティング
- メールマーケティング
- コンテンツマーケティング
- BtoBマーケティング
- リサーチ・市場調査
- 広報・PR
- アフィリエイト広告・ASP
●ステップ
●ツール・素材
- CMS・サイト制作
- フォーム作成
- LP制作・LPO
- ABテスト・EFO・CRO
- Web接客・チャットボット
- 動画・映像制作
- アクセス解析
- マーケティングオートメーション(MA)
- メールマーケティング
- データ分析・BI
- CRM(顧客管理)
- SFA(商談管理)
- Web会議
- 営業支援
- EC・通販・ネットショップ
- 口コミ分析・ソーシャルリスニング
- フォント
- 素材サイト
●目的・施策
- Google広告
- Facebook広告
- Twitter広告
- Instagram広告
- LINE運用
- LINE広告
- YouTube運用
- YouTube広告
- TikTok広告
- テレビCM
- サイト制作・サイトリニューアル
- LP制作・LPO
- UI
- UX
- オウンドメディア運営
- 記事制作・ライティング
- コピーライティング
- ホワイトペーパー制作
- デザイン
- セミナー・展示会
- 動画・映像制作
- データ分析・BI
- EC・通販・ネットショップ
- 口コミ分析・ソーシャルリスニング