강의

멘토링

커뮤니티

Design

/

UI/UX

基礎から実戦まで!モバイルUX/UIデザイン完成

モバイルUX/UIデザイン、初めての方や基礎が不足している方向けの実践入門講座です。 基礎理論と様々な実習を通して、アプリ設計の実務感覚まで段階的に学びながら自信をつけてみましょう! 💪

  • hoodi
uxui
UI/UX
모바일디자인
피그마
모바일앱
Mobile App Design
Figma
ux
clone design
product design

学習した受講者のレビュー

受講後に得られること

  • モバイルデザインに必要な基礎理論および要素を習得できます。

  • フィグマ(figma)の各種テクニックと便利な機能をご紹介します。

  • ワイヤーフレームを見て、モバイル画面を制作できます。

  • 実際のアプリの例で学習内容を視覚的に学べます。

どの分野でも基礎が最も重要なものですよね!

UX/UIデザイン分野も同様です。モバイル画面をデザインする際は、サービスごとに構成要素や機能が様々にバリエーションされるため、結局自分が持っている基礎知識とそれを実務に応用できる画面設計力がとても重要です。基礎知識を積み重ね、画面をデザインしてみる実習で訓練して、デザインスキルを向上できるようサポートいたします!

🤔 "UX、UI...一体何から勉強すればいいのでしょうか?"

😭 「インターネットに情報はたくさんあるけど、何から見ればいいのかわからないです」

😵「アプリの画面をどのように構成すればいいのかわかりません。」

デザインコンサルティングとメンタリングを進める中で最もよく聞いた話です。ポートフォリオやFigma講座は本当に多いですよね。しかし、いざモバイルUX/UI講座を探してみると見つけるのが難しいです。そして、インターネットに散らばっている様々な情報を一度にまとめて整理するのも難しく、何が正しいのか、どれから学んでいけばいいのかが分からないのです。また、このように理論を学んだとしても、それを実際にどのように適用すべきかを知るのも困難ですよね!

モバイル環境の必須デザイン理論と、それを確実に適用できる実習を通じて
このような皆さんの悩みや心配を解消してみましょう!モバイルデザイン、Figma、ux、クローンデザイン、プロダクトデザイン

講義が終わっても、
教材と一緒にもう一度復習してみてください

*カリキュラム内の講義教材ダウンロードを参考にしてください!


この講義の特徴は?

배민、당근、토스などの有名アプリ画面例とともに

一般的によく知られている様々なアプリの画像例を通じて確実に学習してみましょう。学んだ内容が実際のアプリでどのように適用され使われているかを見ていると、はるかに理解しやすくなるでしょう!

理論を通じて学習し、実習で訓練する

モバイル環境に合わせた様々な理論と内容を学習し、これを複数の実習例題を通じて訓練することができます。また、途中途中で実務で習得できる꿀팁も確認してみてください!

Figma(フィグマ)でよく使うショートカット&機能

Figmaでよく使うショートカットキーを覚えておけば、他の人よりもずっと効率的で速くデザインができますよね!私がよく使う様々なショートカットキーと機能をまとめてお教えします!

段階的学習によるデザインの完成

基礎から応用、拡張される様々な概念まで、チャプター別に一緒に進めるように構成しました。しっかりついてきていただければ、いつの間にか一つの画面をデザインしている自分を発見することでしょう!

詳しい学習内容を見てみましょうか?


理論&ヒント

モバイル環境に特化したデザイン理論を学習し、Figmaの裏技も身につけましょう!

モバイルのカラー&フォント&余白

最も基本的な色、フォント、テキスト、余白などの要素をモバイルでどのように設定すべきかを学びます。

コンポーネントとUI

様々なUI要素の概念を学び、実習を通じてこれを適用してみながら、デザインをどのように設計すべきかを学びます。

モバイルサービスの共通的な画面特徴

リスト、GNB、フィルターなどのモバイル環境での共通的なパターンと要素について調べ、これを実際にデザインしてみます。

Figmaの様々な機能とコツ

最もよく使われるデザインツールであるFigmaでよく使う機能と実務でも役立つコツについて学習してみます。

Figmaを通じた実習例題

実習を通して学んだ内容を復習し、デザインの練習をしてみましょう!

事前相談申請ページに色を塗る

相談申し込みページにメインカラー&サブカラーの強弱と階層を調整して、ページにカラーを埋めてみます。

旅行レビューページのデザイン整理

会員登録画面を一緒に作りながら、UIで学んだ要素を適用してデザインしてみます。

会員登録画面のデザイン

会員登録画面のワイヤーフレームを見て、UIで学んだ要素を適用してデザインを完成させてみます。

中古マーケット画面デザイン

簡単な中古マーケット画面のワイヤーフレームを見て、学んだ内容を適用してデザインを完成させてみます。

講義を聞いた後は、こんなことができるようになります!💪

デザインの基礎力をしっかりと鍛えることができます

デザインで最も重要なのは基礎力です。実務で能力を伸ばしていけるよう、このような基礎力をしっかりと固めて、実力のあるデザイナーとして飛躍できるきっかけになるでしょう!

企画されたワイヤーフレームを見てデザインができます

実際の実務では、企画されたワイヤーフレーム(wireframe)を使ってデザインを行うことになります。準備した実習を通じて、ワイヤーフレームを使ったデザインを実際にやってみて、事前にスキルを向上させてみましょう!

このような方々に講義をおすすめします 👍

受講前の参考事項

前提知識および注意事項

  • 実習の場合Figmaを通じて進行するため、基礎的なFigmaツールを扱えることが良いです。図形を作成してテキストを適用し、オブジェクト同士を整列するなどのとても基本的な使用法だけ知っていれば大丈夫です!

  • 講義資料は商業的用途での使用はできません。すべての講義コンテンツと資料は著作権保護を受けます。ご参考ください!


実習環境

  • Figmaの実習は最新アップデートインターフェースが適用されたバージョンであるUI3で進行します。

  • 実習サンプルファイルはFigmaファイル(.fig)でお渡しするため、Figmaのデスクトップアプリをダウンロードして進めることをおすすめします!

学習資料

  • 授業ノートと動画を通して学習することができます。

講義Q&A

Q. デザイン非専攻者でも受講できる講義ですか?

モバイルデザインは日常でアプリを使ってみながら各機能について理解しているだけでも十分に学ぶことができます。そして色やテキストに関する簡単な概念について理解していれば無理なく受講できます。ただし、実習では専攻者、非専攻者を問わず簡単にFigmaの基本的な使い方を知っていればはるかにスムーズに例題を見ながらデザインできます!

Q. 基礎講義とはどの程度の難易度ですか?

主にモバイルUX/UIを今学び始めた方々が必要とする内容を含んでいるため、あまりにも複雑で難しい内容は最大限排除した入門〜基礎レベルの難易度とご覧いただけます。最大限基礎で扱える内容を持って講義を構成し、最初から講義で学ぶ内容だけをしっかり学習しながらついてくれば、その後の応用概念や実習は無理なく進められるよう制作しました!

Q. 必ず最初の部分から講義を受講しなければなりませんか?

基礎から徐々に内容を深めながら講義が行われ、それに合わせて実習も進行されるため、最初から順次授業を受講されることをお勧めします!

こんな方に
おすすめです

学習対象は
誰でしょう?

  • UX/UIデザインを学びたい方々

  • キャリアを始めたばかりの駆け出しデザイナー

  • UX/UIデザイナーを希望する就職準備生

  • UX/UIデザイナーへのキャリアチェンジを目指す方々

前提知識、
必要でしょうか?

  • 図形作成、カラー適用、テキスト整列などの簡単なFigmaツールの使い方を知っていると良いです!

こんにちは
です。

64

受講生

20

受講レビュー

2

回答

5.0

講座評価

1

講座

  • 현) 크몽 및 숨고 등 다양한 플랫폼에서 UX/UI 디자인 전문가로 활동

     

  • 현) 스타트업 위주의 대면 미팅을 통한 앱 설계 및 컨설팅 진행

  • 전) 삼성생명 TF팀 '워리스' 서비스 UX/UI 디자인 협업 및 제작

  • 전) 삼성전자 가전사업부 사내 UX 팀 과제 협업

     

     

안녕하세요 ! UX/UI 프로젝트 및 디자인 교육을 진행하는 후디입니다.

디자이너로 커리어를 쌓으며 배우고 습득한 여러 경험과 정보들로
디자이너를 꿈꾸는 많은 분들께 도움이 되는 각종 강의와 프로덕트를 만들어 나가고 있습니다 😎


쓰레드(threads) : https://www.threads.com/@hoodi_ux

カリキュラム

全体

55件 ∙ (5時間 33分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

20件

5.0

20件の受講レビュー

  • hopesdreamsforest님의 프로필 이미지
    hopesdreamsforest

    受講レビュー 23

    平均評価 5.0

    修正済み

    5

    73% 受講後に作成

    最近UX/UIを学ぶ必要があると思い、どの講義を受けようか悩んでいましたが、フーディーさんの講義、本当に素晴らしいです。 基礎知識もないのですが、開発する上でデザイン的な部分を補いたくて、受講し始めました。色の概念から始まり、フォントやテキストをどのように使うべきか、その方法を詳しく教えてくれるので、理解しやすかったです。Figmaを扱うのが苦手なのですが、見ながら真似してみると、ずっと簡単にできるので良かったです。 最近モバイルアプリの開発を始めたのですが、デザイン的な部分をどのように構成するか、詳細に作れるようになりました。

    • hoodi
      知識共有者

      こんにちは。知識共有者フーディです。 真心のこもった受講レビュー、本当にありがとうございます! 開発者の方がデザイン的な部分を共に悩んで受講してくださった点が、特に印象深く感じます! デザインは単にきれいな画面を作るだけでなく、ユーザーとより良くコミュニケーションを取り、機能を効果的に伝える方法でもあるからです😊😊 基礎から追ってきやすいように、最大限構成しようとした講座ですが、チャルランさんがこのように助けになったと伺い、本当にやりがいを感じますね! 今後も実務でデザインの悩みが生じた際には、講座内容を再度ご参考にされながら活用してみてください。 いつでもまたお越しいただけるよう、無制限受講で構成しております :) 今後される開発とデザイン作業にも、素晴らしい結果があることを心より応援いたします!

  • gmls님의 프로필 이미지
    gmls

    受講レビュー 2

    平均評価 5.0

    5

    96% 受講後に作成

    アプリケーション画面構成とユーザー観点から企画するための基礎を身につけることができました。 ありがとうございます。

    • hoodi
      知識共有者

      こんにちは、知識共有者のフーディです。 企画に必要な基礎を学んでいただけたとのこと、とても嬉しいです..!😊😊 様々なプラットフォームやドメインを扱っていくうちに、どのような視点で設計すべきかコツが掴めるようになりますよ..!貴重なレビューと評価をありがとうございます☺️ 完走まであと少しですね..!ファイティング!

  • mong6님의 프로필 이미지
    mong6

    受講レビュー 1

    平均評価 5.0

    5

    31% 受講後に作成

    • hoodi
      知識共有者

      こんにちは、知識共有者のフーディです。 貴重な評価を残してくださりありがとうございます! 私のデザイン講座がお役に立てていれば幸いです!😊 完講まで頑張ってください!💪

  • cg5xyfnn9m8289님의 프로필 이미지
    cg5xyfnn9m8289

    受講レビュー 1

    平均評価 5.0

    5

    100% 受講後に作成

    • hoodi
      知識共有者

      こんにちは、知識共有者のフーディです。 100%完講後、貴重な評価をお寄せいただきありがとうございます..! 私のデザイン講義がお役に立てれば嬉しいです! 😊

  • squarecracker님의 프로필 이미지
    squarecracker

    受講レビュー 1

    平均評価 5.0

    5

    67% 受講後に作成

    UX/UIが何なのかよく分からず途方に暮れていましたが、この講義を聞いて一つずつ理解できるようになりました。途中にクイズもあり、自分が正しく理解しているか確認できます。 一番良かったのは、なぜこのようにすべきなのかを本当に分かりやすく説明してくださることです。ただ暗記しろというのではなく理由を教えてくださるので、すっと頭に入ってきます。 配達の民族、ダングンマーケットのようなアプリを例に挙げて説明してくださるので、「あ、これか!」とすぐに理解できました。Figmaで直接作ってみるのも楽しく、まだ全て受講していませんが、もう簡単な画面は作れるようになりました。 UX/UIが難しくて悩んでいる方々に本当におすすめします。私も完全な初心者でしたが、理解できましたからね。

    • hoodi
      知識共有者

      こんにちは、知識共有者のフーディーです。 クラッカーさんの貴重なレビュー、本当にありがとうございます!👍 UX/UIは最初は難しくて途方に暮れるかもしれませんが、このように一つずつ理解し始めたというお言葉に本当に嬉しく思います。 特に「なぜこのようにすべきなのか」に焦点を当てて説明した部分をよく理解してくださって、とても嬉しいです。 ペミン、ダングンマーケットのように実際のアプリを例に挙げて説明したのも、デザインは「イメージ」が重要なので、より視覚的に、そして実際のアプリを見ながら確実に理解していただけるように意図したのですが、認めてくださって感謝いたします :) 今後も講義の最後までしっかりとついてきていただければ、はるかに確かな実力が身につくでしょう。 改めて貴重なレビューありがとうございます!

期間限定セール

¥92,400

30%

¥16,390

似ている講座

同じ分野の他の講座を見てみましょう!