chot.design - 毎日ちょっとずつデザインを学ぼう

公開中のカリキュラム

UIデザイン制作テクニック

実践的なUIデザイン制作を行います。お題に沿って、サンプルのアプリのUIデザインを作ってみましょう。

ランディングページ制作テクニック

ランディングページ（略してLP）とは、商品やサービスの紹介を1枚のページで表現し、購入や申込みなどを促進するためのWebページです。レイアウト・装飾の基本的な考え方が詰まったものですので、写真加工・アイコン制作・イラスト制作・バナー制作などが身についてきたらぜひチャレンジしてみましょう。

実践

バナー制作テクニック

Webサイトにはなくてはならない「バナー広告」。文言や写真・イラストの配色やレイアウトを工夫して、クリックしてもらいやすいバナーづくりにチャレンジしましょう！実際によくあるようなECサイトやゲーム、Webサービスのバナー広告をPhotoshopやIllustratorを使って作っていきます。

実践

名刺制作テクニック

Illustratorを使った名刺の作成にチャレンジ！用紙サイズの指定や、トンボの付け方、文字のレイアウトやちょっとした工夫まで丁寧に解説します。

実践

UIコンポーネント入門

Webサイトやアプリあるいはゲーム、またはこれから出てくる新しいデバイスの画面デザインをしていく上で、考えなくてはならないのが「UI」です。このカリキュラムではUIデザインの初心者を対象に、UIについて学んでいきます。

応用

写真加工テクニック

Photoshopを使って写真を加工するテクニックを身に付け、様々なシーンに合わせてイメージが用意できるようにトレーニングしていきましょう。レトロ風・イラスト風・おしゃれに・可愛い・カッコいいなど、様々なバリエーションのレッスンが受けられます。

応用

イラスト制作テクニック

Webサイトやアプリにイラストを効果的に取り入れると、よりオリジナリティのある印象に残るデザインを作ることができます。このカリキュラムでは様々なイラストの描き方を手順を追って解説していきます。

応用

CSSデザインテクニック

CSSを使った様々なデザインのコードを紹介します。

応用

レスポンシブWebデザインコーディング術

レスポンシブWebデザインにおけるHTML・CSSのコーディングテクニックを紹介します。

応用

Sassを使った効率的CSSコーディング術

SassとはCSSを効率よくコーディングするためのメタ言語（拡張言語）です。プログラムのように変数や関数を使って、効率よく保守性の高いコードを記述することができます。

応用

アイコン制作テクニック

WebサービスやアプリケーションのUIデザインには欠かせない「アイコン」。線だけで描かれたものから、カラフルで鮮やかなグラデーションが使われたものまで、様々なテイストのアイコン制作テクニックを紹介します。

応用

Sketchプラグインまとめ

UI/UXデザインツールの大定番「Sketch」にはたくさんのプラグインがあります。作業効率化に役立つものから、思わずクスッとなってしまうネタ系まで幅広く紹介します。

応用

Adobe Premiere Proを使った動画制作入門

最近はスマートフォンを使って手軽に美しい動画が撮影できる環境が整ってきました。またインターネット回線が低価格化・高速化したことで、ネットを通じて動画を見る機会も随分と増えました。YouTubeやインスタなどの動画配信を手軽に出来るサービスもたくさんあります。このカリキュラムではAdobe Premiere Proというツールを使って、動画編集について解説をしていきます。

基礎