Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
今風のイケてるWEBデザインを作る手順 Figma × Photoshop
Highest Rated
Rating: 4.7 out of 5(491 ratings)
4,510 students

今風のイケてるWEBデザインを作る手順 Figma × Photoshop

【保存版】今風の洗練されたオシャレで美しいWEBデザインを作る極意を、プロの一線で20年以上デザインし続けてきた経験を元に、言語化して分かりやすくまとめました。その理論と手法を使って実際にデザインしながらその作り方を実感できる講座です。
Created bySTAND 4U
Last updated 5/2026
Japanese

What you'll learn

  • WEBデザインを作る手順
  • 美しいデザインを作るための基本知識
  • 美しいテキストのレイアウト設定
  • フォントの選定について
  • 美しい余白の取り方
  • WEBデザインにおけるレイアウトのコツ
  • 写真の選定・加工
  • FigmaとPhotoshopの連携
  • 色・配色の基本知識
  • 今風のイケてる美しいWEBデザインの作るテクニック
  • 今風のイケてる美しいWEBデザインを作る練習

Course content

6 sections58 lectures4h 43m total length
  • 当講座はどういう講座?0:49
  • 講座を受講する前に5:18
  • Udemyの便利な機能と使い方(スキップ可)4:36
  • リソース:学習用素材ダウンロードデータ1:43
  • 新しいUIについて0:43
  • 当講座に関わる「Figma・Photoshopのアップデート情報」1:19

Requirements

  • Figmaの基本操作
  • Photoshopの基本操作

Description

どうすれば今風のイケてるオシャレWEBデザインが作れるのか分からない…自分のデザインが何故かアカ抜けない」という悩みを持つWEBデザイン初級・中級の方に向けて、プロのWEBデザイナーとして20年以上デザインし続けてきた経験を元に、「今風のイケてるWEBデザインを作る手順」を分かりやすく具体的な手法を、丁寧に言語化して図解付きでまとめました。

デザインの手順・デザインの基本から始まり、タイポグラフィーやレイアウトの考え方や、余白の取り方、色彩・配色の基本や、写真の選定・加工方法に加え、今風の魅力的なデザインを作るポイント等をまとめて、実際にゼロからデザインする流れを見ながら、一緒にイケてるオシャレでカッコいいWEBデザインを作っていく講座です。

今回の講座は「FigmaとPhotoshopを連携して」作っていく講座ですが、ツールの使い方の部分以外は、イラストレーターやXDなど他のツールで作っておられる方にも十分参考にしていただける内容となっています。

Who this course is for:

  • WEBデザインの初級者で、美しいデザインを作りたいと思っている人
  • WEBデザインの中級者で、美しいデザインの作り方がわからない人