.png?w=420)
最近注目されているプロダクトデザイナーの実務ガイド
boldydesign
￥16,303
入門 / Figma, ProtoPie, Design System
5.0
(5)
100+
製品デザイナーの実務プロセスを一つずつ順を追って説明します。 基本的なデザイン関連用語からペルソナ、QA、デザインシステムなど、全体的なデザイン実務を完全に理解できるようになります!
入門
Figma, ProtoPie, Design System
ProtoPie Master Courses (プロトファイマスタークラス)
プロトタイピングの最強者ProtoPieツールを最初から実務スキルまでワークショップ方式で進めます。
ProtoPie
ProtoPie
講座 を紹介して、成長と収益を得ましょう！
マーケティングパートナーズ
講座 を紹介して、成長と収益を得ましょう！
学習した受講者のレビュー
学習した受講者のレビュー
4.9
5.0
overbold
100% 受講後に作成
ツールの使い方について、細かい部分まで丁寧に説明してくださるので、とても理解しやすかったです。2025年3月現在、ProtoPieのUIが講義バージョンと細かく異なる部分もありますが、受講する上では全く問題ないので、もし受講を悩んでいる方は参考にしてみてください！
5.0
지수
31% 受講後に作成
とても詳しい説明ありがとうございます。大変助かります。
5.0
wjddmsdk777
31% 受講後に作成
直接作りながら講義を進めるので理解がよくできます！
受講後に得られること
ProtoPieの基本的な使い方
Figmaと連携した効率的なプロトタイピング作業
モバイルデバイスのセンサーを使用したプロトタイピング
プロトタイピングの最強者ProtoPie
基礎から実務スキルまで！ 🌠
複雑なコーディングなし
プロトタイピングが可能なProtoPie🪄
ProtoPieはデザイナーが開発者の助けを借りずに
お客様のご意見を開発前にあらかじめ適用してみることができますよ！
開発者とのシームレスなコミュニケーションツールを提供しています。
最近の非対面UI開発トレンドにもぴったりのツールです。
この講義だけの特長
📝
練習方法
🧑💻
実務中心の例
🍯
様々なチップ伝授
こんな方におすすめですよ🙋♀️
初めてプロトファイ
接する方
デザインワークを効果的に
プレゼンテーションしたい方
インタラクティブなプロトタイプ
印象的なプレゼンテーション
したい方
UIの実用性を検証するため
詳細なプロトタイピング
必要な方
🎓受講生の悩み
「最初にやってみるのはうまくできますか？」
👨🏫 受講生の悩み解決方法
入門から高級実務まで簡単に一つずつ追いながら学べます。
これを学びます📚
1. ProtoPieの紹介とページローリングUIの作成
- ProtoPieの紹介と特徴、活用範囲、画面構造、System Status Bar、プレビュー画面の紹介
- FigmaデザインをProtoPieに読み込む
- ページローリングUIの作成：チュートリアル画面の作成
2. ボタンと画面切り替えとカードローリングUIの作成
- Tabトリガーによる画面切り替え/インタラクションの追加
- 自然な動きのためのEasing値の調整
- 透明オブジェクトの活用
- カードローリングUI/垂直スクロールの作成
3. Tab ナビゲーションの作成
- スクロールとページングコンテナの重複使用
- ChainとPage Scrollコンテナを使用したTabナビゲーションの作成
4. プロトタイプ共有、ProtoPie Player Appの使い方
- Cloud 共有と Interaction Record
- ProtoPie Playerモバイルアプリの紹介と使い方
5. ヘッダーインタラクションとプルトリガー
- Chain/Dragを使用したヘッダーインタラクション
- TouchVelocityを使用したヘッダーインタラクション
- リストを押すと表示されるContextメニューを作成する
6. インタラクティブコンポーネントとの通信
- アクション領域のグループ化
- Condition を使用したチェックボックスコンポーネントの作成
- Send/Receive Triggerによる制御と通信
7. Variable 使用したインタラクション (1)
- リバースページスクロールインタラクション
- iOS Background Blur エフェクトを使う
- 変数を使用したログイン画面のパスワード入力表現
- 変化する変数値を画面に表示する
8. Variable 使用したインタラクション (2)
- スライダによって値が変化するインタラクション
- ボトムメニューマイクロインタラクション
- 3D Rotateカードインタラクション
9. Variable 使用したインタラクション (3)
- 円グラフインタラクションの作成
- 画面のスクロール値を変数に入れて表示
- Rangeを使用したインタラクション
10. Input/Return トリガーの使用と繰り返しアニメーション
- 入力ウィンドウとデバイスキーパッドの使用
- パスワード入力画面実習
- タイムラインアニメーション：繰り返し効果など
11. ビデオコントロールとベクターアニメーションの活用
- ビデオファイルコントロール
- LottiesFilesアニメーションの活用：jsonファイル
- Figmaで作成した画面切り替えのインポート：Smart Transition
12. デバイスセンサーの活用とマウス効果の使用
- マップUI
- マウスオーバー/アウト効果、マウスポインタデザイン
- 音楽検索プロトタイプ、騒音測定プロトタイプ、音声認識プロトタイプ
予想される質問 Q&A 💬
Q.この講義だけを聞くとProtoPieをマスターできますか？
この講義をすべて聞いたら、実務にすぐに使えるレベルになります。
Q.このレッスンにはProtoPieのすべての機能が含まれていますか？
この講義の実務中心のワークショップ方式で進められ、ProtoPieのすべての機能は含まれていませんが、主に使用するほとんどの機能の取り扱いがあります。
Q. ProtoPieはWindowsでも使用できますか？
ProtoPieはOSを選ばず、Mac、Windowsの両方で利用可能です。
✅受講前に確認してください
プロトファイフリープランポリシーの変更により、1つのファイルで使用できるシーンの数が2つに制限されました。下記の授業は、無料プランでは受講に制約がある可能性があることをお知らせします。
セクション2 - ProtoPieの使い方
- 2～4鋼の例ではシーンを最大4つまで使用するため、円滑な川の進行には有料プランが必要です。
- レッスン2でチュートリアル画面を一度に3つ読み込んだ部分は、無料プランでは一度に1画面ずつインポートする方法で進行する必要があります。
- 無料プランで許可されている2つのScenes（例、チュートリアル、メイン）以外の残りの部分に沿って試すには、最初に作業したScene（例、チュートリアル、フルメニュー）をクリアして進めることができます。
セクション3 - ProtoPieに慣れる
- 6章の例では、さまざまな方法でヘッダーインタラクションを実装するために3つのシーンを使用しています。
- ただし、Scene間につながるインタラクションがあるわけではなく、進行していた一つのSceneで続けていきながら授業を進めることはできます。
こんな方に
おすすめです
学習対象は
誰でしょう？
インタラクティブなプロトタイプで印象的なプレゼンテーションをしたい人
UIの実使用性を検証するためにディテールなプロトタイプが必要な方
前提知識、
必要でしょうか？
1講座でFigmaツールとの連携が行われてFigmaツールを使うと分かるともっと楽になります。
こんにちは
mcです。
169
受講生
14
受講レビュー
23
回答
4.9
講座評価
1
講座
こんにちは。
デジタルエージェンシーINPIXクリエイティブデザイングループ・グループ長の安明哲（アン・ミョンチョル）です。
社内スタッフの教育を行っているうちに、このようにオンライン講座も公開することになりました。
私のツール講義を通じて、UI/UXデザインに携わる方々のお役に立てれば幸いです。
カリキュラム
全体
13件 ∙ (7時間 54分)
講座資料（こうぎしりょう）:
授業資料
講座掲載日:
最終更新日:
受講レビュー
全体
14件
4.9
14件の受講レビュー
13595454060受講レビュー 1
∙
平均評価 5.0
- cory93259765
受講レビュー 2
∙
平均評価 5.0
- hanbyeoldesign0151
受講レビュー 1
∙
平均評価 5.0
- overbold9326
受講レビュー 2
∙
平均評価 5.0
5
100% 受講後に作成ツールの使い方について、細かい部分まで丁寧に説明してくださるので、とても理解しやすかったです。2025年3月現在、ProtoPieのUIが講義バージョンと細かく異なる部分もありますが、受講する上では全く問題ないので、もし受講を悩んでいる方は参考にしてみてください！
- mcfid知識共有者
ProtoPieのアップデートで無料プランのポリシーとUIが少し変更になったので心配していましたが、ちゃんと受講されたとのこと、安心しましたし、感謝いたします。業務にお役に立てれば幸いです。
- wjddmsdk7772478
受講レビュー 1
∙
平均評価 5.0
似ている講座
同じ分野の他の講座を見てみましょう！