最大「5」つまで保存できるよ。動画をまずは消化するのだっ!
閉じる

UI初心者向けに「ゼロからはじめる、UIの見た目のつくり方」を更新中です

4.18.2023

こんにちは!今回は、現在BONOで更新中の「ゼロからはじめる、UIの見た目のつくり方」シリーズについてお話ししたいと思います。

このシリーズはUIデザインの勉強をはじめて、”Figmaの使い方はちょっとわかった!”人向けに作成しています。UIをゼロから作るのはまだ大変ですが、プロと一緒に作る順番、サイズの決め方、考え方を進めていくチュートリアルです。**車の教習でいう”隣にわかっている人がいる状態で基礎を実践する”**ようなレベルをイメージしています。

以下の項目でこのシリーズをご紹介します。

  1. “隣にわかっている人がいる状態でUIを作る”シリーズ
  2. サービスの全体像をデザインして、ゴールイメージを早めに知る
  3. 途中まで無料!!でデザインを進められます
  4. 補足-Figmaの操作は必須

1. “隣にわかっている人がいる状態でUIを作る”シリーズ

今回のシリーズでは、ToDoサービスを題材に、ブラウザのUIデザインを一緒に作成していきます。

ToDoサービスを選んだ理由は、ソフトウェアの基本動作である「作成/削除/編集」、UI基本構造である「コンテンツ/ナビゲーション/アクション」をシンプルに考えられるからです。

このシリーズでは、見た目だけでなく、UIの基本的なユーザビリティを担保する方法も一緒に学んでいきます。これにより、学習者はUIの見た目を作成するだけでなく、基本的な使いやすさも意識できるようになるでしょう。

2. サービスの全体像をデザインして、ゴールイメージを早めに知る

ソフトウェアデザインの世界では、見た目だけ良くしてもダメで、操作性も同じように担保しながらUIの見た目を決めていかなければなりません。以下の項目を実際のUIに近いものを作りながら、一通りまずは通ることができます。

1度通ることで個別に学ぶ時の理解度が上がることを狙っています。

▼ こういう要素をまずは一通り体験

  • UIデザインの基本原則
  • 色彩やフォントの選び方
  • レイアウトやグリッドシステムの活用方法
  • ユーザビリティを考慮したデザインのポイント
  • プロトタイプ制作やデザインツールの使い方
  • 参考デザインの使い方
  • 自己フィードバックをもとにしたデザイン改善方法

いきなり個別の話について知っても「いつどうやって使うの?」となると思うので、まずは1回デザインしてみる。を大事にしているシリーズです。

3. 途中まで無料!!でデザインを進められます

このシリーズは基本的にBONOのメンバー向けに作っています!が、UIデザインを始める、理解するきっかけになると思って作っているので、”最初のホーム画面を作成→ブラッシュアップ”するところまで誰でもBONOにアクセスすれば閲覧、トライできるようにしています。

それ以降学びたくなったらBONOでは「ロードマップ」をもとに、未経験からでもUIデザインのスキルがしっかり身に付く実践型コンテンツを用意しています。まずははじめてみる人が増えると嬉しいです。以下のリンクから動画を閲覧できるのでぜひ覗いてみてください!



「ゼロからはじめる、UIの見た目のつくり方」

これらのコンテンツを通じて、デザイン初学者がUIデザインの基本を習得し、見た目と操作性を兼ね備えたデザインが作れるようになることを目指しています。今後も様々なコンテンツを追加していく予定ですので、ぜひお楽しみに!

それでは、皆さんがUIデザインの世界にどんどん挑戦して、1人でも多くの人が”創る側”に回ることを願っています。このシリーズが、そんな皆さんのお手伝いができることを心から願っています。

補足

ただし、このシリーズではFigmaの使い方についてはあまり深く触れませんので、Figmaの操作に慣れた後に取り組むことをおすすめします。FigmaについてはYoutubeにて、完全無料で公開しているのでぜひここから始めてください!

こんにちは!今回は、現在BONOで更新中の「ゼロからはじめる、UIの見た目のつくり方」シリーズについてお話ししたいと思います。

このシリーズはUIデザインの勉強をはじめて、”Figmaの使い方はちょっとわかった!”人向けに作成しています。UIをゼロから作るのはまだ大変ですが、プロと一緒に作る順番、サイズの決め方、考え方を進めていくチュートリアルです。**車の教習でいう”隣にわかっている人がいる状態で基礎を実践する”**ようなレベルをイメージしています。

以下の項目でこのシリーズをご紹介します。

  1. “隣にわかっている人がいる状態でUIを作る”シリーズ
  2. サービスの全体像をデザインして、ゴールイメージを早めに知る
  3. 途中まで無料!!でデザインを進められます
  4. 補足-Figmaの操作は必須

1. “隣にわかっている人がいる状態でUIを作る”シリーズ

今回のシリーズでは、ToDoサービスを題材に、ブラウザのUIデザインを一緒に作成していきます。

ToDoサービスを選んだ理由は、ソフトウェアの基本動作である「作成/削除/編集」、UI基本構造である「コンテンツ/ナビゲーション/アクション」をシンプルに考えられるからです。

このシリーズでは、見た目だけでなく、UIの基本的なユーザビリティを担保する方法も一緒に学んでいきます。これにより、学習者はUIの見た目を作成するだけでなく、基本的な使いやすさも意識できるようになるでしょう。

2. サービスの全体像をデザインして、ゴールイメージを早めに知る

ソフトウェアデザインの世界では、見た目だけ良くしてもダメで、操作性も同じように担保しながらUIの見た目を決めていかなければなりません。以下の項目を実際のUIに近いものを作りながら、一通りまずは通ることができます。

1度通ることで個別に学ぶ時の理解度が上がることを狙っています。

▼ こういう要素をまずは一通り体験

  • UIデザインの基本原則
  • 色彩やフォントの選び方
  • レイアウトやグリッドシステムの活用方法
  • ユーザビリティを考慮したデザインのポイント
  • プロトタイプ制作やデザインツールの使い方
  • 参考デザインの使い方
  • 自己フィードバックをもとにしたデザイン改善方法

いきなり個別の話について知っても「いつどうやって使うの?」となると思うので、まずは1回デザインしてみる。を大事にしているシリーズです。

3. 途中まで無料!!でデザインを進められます

このシリーズは基本的にBONOのメンバー向けに作っています!が、UIデザインを始める、理解するきっかけになると思って作っているので、”最初のホーム画面を作成→ブラッシュアップ”するところまで誰でもBONOにアクセスすれば閲覧、トライできるようにしています。

それ以降学びたくなったらBONOでは「ロードマップ」をもとに、未経験からでもUIデザインのスキルがしっかり身に付く実践型コンテンツを用意しています。まずははじめてみる人が増えると嬉しいです。以下のリンクから動画を閲覧できるのでぜひ覗いてみてください!



「ゼロからはじめる、UIの見た目のつくり方」

これらのコンテンツを通じて、デザイン初学者がUIデザインの基本を習得し、見た目と操作性を兼ね備えたデザインが作れるようになることを目指しています。今後も様々なコンテンツを追加していく予定ですので、ぜひお楽しみに!

それでは、皆さんがUIデザインの世界にどんどん挑戦して、1人でも多くの人が”創る側”に回ることを願っています。このシリーズが、そんな皆さんのお手伝いができることを心から願っています。

補足

ただし、このシリーズではFigmaの使い方についてはあまり深く触れませんので、Figmaの操作に慣れた後に取り組むことをおすすめします。FigmaについてはYoutubeにて、完全無料で公開しているのでぜひここから始めてください!