Figmaの使い方：初心者向けWebデザイン【2022年最新版】
29.3 هزار بار بازدید -
2 سال پیش
-
時間と場所にとらわれない「クリエイティブで自分らしい働き方」を手に入れませんか？クオリティの高いWebデザインスキルを軸に、フリーランスとして安定的に稼ぐためのスキルを学ぶ、６ヶ月間のオールインワンプログラムはこちらから。プロのデザイナーから直接フィードバックやを受けたりコーチングを受けながら、最短で実力派フリーランスWebデザイナーになることを目指します。⬇️ Web Design Bootcampへはこちらからエントリー
時間と場所にとらわれない「クリエイティブで自分らしい働き方」を手に入れませんか？
クオリティの高いWebデザインスキルを軸に、フリーランスとして安定的に稼ぐためのスキルを学ぶ、６ヶ月間のオールインワンプログラムはこちらから。プロのデザイナーから直接フィードバックやを受けたりコーチングを受けながら、最短で実力派フリーランスWebデザイナーになることを目指します。
⬇️ Web Design Bootcampへはこちらからエントリー
https://designup-academy.com/wdb-apply/
◽️◽️◽️◽️◽️◽️
Figma初心者の方へ。Figmaの使い方をWebデザインをしながら学びましょう！無料で使える範囲を日本語で説明しています。
Figmaの使い方：初心者向けWebデザイン【2022年最新版】
00:00 - イントロダクション
00:36 - Figmaのダウンロード
01:04 - Figmaのインターフェイスの説明
01:21 - Figmaのコミュニティ
02:27 - Figmaのファイル構造、ネーミング
03:11 - Figmaの無料版の範囲
04:16 - デザインファイルのインターフェイスの説明
07:29 - Webデザインをやってみよう
07:50 - デスクトップの設定
08:34 - レイアウトグリッドの設定
10:43 - ヘッダー、ヒーローセクション
15:06 - オートレイアウト
18:16 - コンセプトのセクション、オブジェクトの結合
19:16 - オブジェクトと画像のマスク
20:20 - ボタンの作り方 従来の作り方 vs オートレイアウト
22:34 - コンポーネント
24:25 - プロダクト/トライアル/フッターのセクション
33:08 - モバイルの設定/レイアウトグリッド
34:42 - Figmaのアプリで実際の大きさを確認しよう
41:09 - モバイルのメニュー
44:16 - 最後にレイヤーを整理しよう
45:27 - コメント機能、チャット機能、URLのシェア
46:39 - 画像の書き出し、エクスポート
◽️◽️◽️◽️◽️◽️
リンク
練習用Figmaファイル：Japanese Cosmetics Web Design
https://www.figma.com/community/file/...
Figmaのショートカット表を限定公開中。今すぐ無料ダウンロード↓
https://designup-academy.com/figma-sh...
Figmaのダウンロード（デスクトップ）
https://www.figma.com/downloads/
Figmaのスマホアプリ（Figma and FigJam)
https://apps.apple.com/jp/app/figma-a...
◽️◽️◽️◽️◽️◽️
💻 フリーランスWebデザイナーになるためのロードマップを無料ダウンロード。
https://designup-academy.com/roadmap/
💻 Figmaのショートカット表を限定公開中。今すぐ無料ダウンロード↓
https://designup-academy.com/figma-sh...
◽️◽️◽️◽️◽️◽️
使用ツール一覧：
https://designup-academy.com/tools/
ニュースレター登録：
https://designup-academy.com/newsletter/
Instagram：
Instagram: mayuko_design
👉 About Mayuko | フリーランスデザイナー（Branding/Web/UI/UX）
時間と場所にとらわれない「クリエイティブで自分らしい働き方」を手に入れたい人たちをサポートしています✨
🇺🇸 NYで7年+のデザイナー歴
🌎 世界中のクライアントとフルリモートでお仕事中
🎓 Udemy受講生330名+
*いくつかのURLにはアフィリエイトリンクが入っています。有益な無料コンテンツを作成し続けるためにサポートをよろしくお願いします。
#Figma
#Figmaとは
#Figma日本語
クオリティの高いWebデザインスキルを軸に、フリーランスとして安定的に稼ぐためのスキルを学ぶ、６ヶ月間のオールインワンプログラムはこちらから。プロのデザイナーから直接フィードバックやを受けたりコーチングを受けながら、最短で実力派フリーランスWebデザイナーになることを目指します。
⬇️ Web Design Bootcampへはこちらからエントリー
https://designup-academy.com/wdb-apply/
◽️◽️◽️◽️◽️◽️
Figma初心者の方へ。Figmaの使い方をWebデザインをしながら学びましょう！無料で使える範囲を日本語で説明しています。
Figmaの使い方：初心者向けWebデザイン【2022年最新版】
00:00 - イントロダクション
00:36 - Figmaのダウンロード
01:04 - Figmaのインターフェイスの説明
01:21 - Figmaのコミュニティ
02:27 - Figmaのファイル構造、ネーミング
03:11 - Figmaの無料版の範囲
04:16 - デザインファイルのインターフェイスの説明
07:29 - Webデザインをやってみよう
07:50 - デスクトップの設定
08:34 - レイアウトグリッドの設定
10:43 - ヘッダー、ヒーローセクション
15:06 - オートレイアウト
18:16 - コンセプトのセクション、オブジェクトの結合
19:16 - オブジェクトと画像のマスク
20:20 - ボタンの作り方 従来の作り方 vs オートレイアウト
22:34 - コンポーネント
24:25 - プロダクト/トライアル/フッターのセクション
33:08 - モバイルの設定/レイアウトグリッド
34:42 - Figmaのアプリで実際の大きさを確認しよう
41:09 - モバイルのメニュー
44:16 - 最後にレイヤーを整理しよう
45:27 - コメント機能、チャット機能、URLのシェア
46:39 - 画像の書き出し、エクスポート
◽️◽️◽️◽️◽️◽️
リンク
練習用Figmaファイル：Japanese Cosmetics Web Design
https://www.figma.com/community/file/...
Figmaのショートカット表を限定公開中。今すぐ無料ダウンロード↓
https://designup-academy.com/figma-sh...
Figmaのダウンロード（デスクトップ）
https://www.figma.com/downloads/
Figmaのスマホアプリ（Figma and FigJam)
https://apps.apple.com/jp/app/figma-a...
◽️◽️◽️◽️◽️◽️
💻 フリーランスWebデザイナーになるためのロードマップを無料ダウンロード。
https://designup-academy.com/roadmap/
💻 Figmaのショートカット表を限定公開中。今すぐ無料ダウンロード↓
https://designup-academy.com/figma-sh...
◽️◽️◽️◽️◽️◽️
使用ツール一覧：
https://designup-academy.com/tools/
ニュースレター登録：
https://designup-academy.com/newsletter/
Instagram：
Instagram: mayuko_design
👉 About Mayuko | フリーランスデザイナー（Branding/Web/UI/UX）
時間と場所にとらわれない「クリエイティブで自分らしい働き方」を手に入れたい人たちをサポートしています✨
🇺🇸 NYで7年+のデザイナー歴
🌎 世界中のクライアントとフルリモートでお仕事中
🎓 Udemy受講生330名+
*いくつかのURLにはアフィリエイトリンクが入っています。有益な無料コンテンツを作成し続けるためにサポートをよろしくお願いします。
#Figma
#Figmaとは
#Figma日本語
2 سال پیش
در تاریخ 1401/04/09 منتشر شده
است.
29,317
بـار بازدید شده