はじめてのUIデザイン

UI/UXデザインの基礎概念を学びながら、メッセンジャーアプリをデザインします

完了目安

2週間

1日2-3時間を継続して行えた時の目安の計算をしています。自分で目標を立てて取り組みましょう

料金

￥

4,378~

/月

メンバーになってはじめる

メンバーシップについてはこちら

概要

進め方

コンテンツへ

計画を立てて進めよう

概要

進め方

コンテンツへ

計画を立てて進めよう

専用チャンネルで質問や交流しよう

同じレベルの人と交流したり、進捗共有しよう

コミュニティへ

ページの内容

コンテンツ
やるメリット
概要

PURPOSE OF SERIES

シリーズの目的

連絡帳アプリをデザインしながら、UI/UXデザインの基礎概念を身につけて、スキルを上げていく土台を作ろう

UIの基本構造を学びながら、メッセンジャーアプリをデザインしますこのシリーズではUIパーツの構成や情報配置の考え方、ナビゲーションなどUIデザインをする上でよく出てくる概念を初心者向けに学べるコンテンツです。ただ座学するのではなく普通の連絡帳アプリをデザインしながら基本的な概念を理解していくことができます。

専門的にUI/UXの概念について学ぶ前に簡単に知ることで、どういう考えやアイデアでデザインをしていかねばならないのかを身につけましょう。

デザインすること

ナビゲーションの基本

UIで重要な要素の1つであるナビゲーション、階層関係についての基本概念をお伝えします。

UIの情報構造の基本

UIは全て操作性を担保してレイアウトや表示する情報が組まれています。それを実感するために構造を解説しながらデザインします。

UI/UXデザイナーの仕事について

シリーズではただデザインするだけでなくUI/UXデザイナーの仕事についても触れ、なぜ紹介している基礎概念理解が必要かを伝えます

メッセンジャー会話UIの基本

オーソドックスなメッセンジャーUIがなぜこの形になっているか？（例：相手と自分の発言の見た目が違う理由）をデザインしながら学んでいきます。

CONTENTS

コンテンツ

TRY

成長率10倍でUIデザインを身につける初級チュートリアル

TRY

2.ヘッダーUIをデザインしよう

TRY

メッセージリストUIをデザイン【余白のサイズはルールで決める】

TRY

4.UIデザインの超基本の構成を解説【デザイナーにはこう見えてます】

TRY

5.チャットUIをデザインしよう【人の目線は右と左どちらから始まる？】

TRY

デザインしたチャットUIを解説【なぜチャットの色は1色じゃないのか？】

TRY

ボトムナビゲーションをデザインしよう【アイコンは正方形で配置】

TRY

ページ同士の関係性とボトムナビのデザインを解説【ページ間の移動考えたことありますか？】

TRY

UIデザイン、仕事ではどんな流れでやるの？をお伝えします

TRY

実践してみよう!

TRY

お題連絡先一覧のUIをデザインしよう

TRY

お題を解説!

PURPOSE OF SERIES

やるメリット

このコースではただトレースするだけでなく、UIデザインで必ず出てくる基礎概念を知っていくことを目的にしています。連絡帳アプリを完成されることで、これからUI/UXの作成する上で必要な観点と基礎知識を身につけます。このシリーズをクリアして、UI/UXデザインの基礎知識を身につけていくための土台を手に入れましょう〜！

身に付くこと

ナビゲーションの基礎

UIデザインで大切な"ナビゲーション”の基礎知識に触れます

UI構造の基礎知識

意味のブロックで設計するUIの仕組みに触れます

グローバルナビゲーション

様々な役割のページを整理するナビゲーションについて触れます

階層/並行のページ構造

使いやすいUIを作る基本構造について触れます

ABOUT

シリーズについて

概要

iOSの連絡帳アプリをUIトレースしながらUI/UXデザインを行う上での基礎概念に触れるシリーズです。具体的にはユーザーが意図したページに移動できるための「ナビゲーション」「ページ階層/構造」の知識や、情報のブロックごとに意味をまとめたり、よく出てくるブロックの役割などを紹介しています。またUI/UXデザイナーの仕事についても話しており、どういう考え方や思考性、スキルが必要かも体感できるUI/UXデザイン初学者がこれから始める上での土台を築くコンテンツです。

目標

連絡帳アプリをトレースしながらUIの基礎概念を理解する。

スケジュール

1-2週間

コースレベル

入門レベル:これからUI/UXデザインを始めたい人向け

誰におすすめ

これからUI/UXデザインを始めたい人/WebデザインはやっているがUIはこれからの人

動画数

本

お題数

This is some text inside of a div block.

本

カテゴリ

【UIデザイン】ビジュアルデザイン

Design