
Photoshopの基本を5分間で3週間で習得する
designbase
専門知識がなくても簡単に学べる Photoshop の基礎講座です。デザインや 1、2 年生で Photoshop ツールを早く学ばなければならない方、副業として Photoshop を使いたい方、自分の事業を立ち上げたい方、YouTube クリエイターやブログ、Instagram を運営している方は、この講座を受講すると非常に役立ちます。始めることが半分です。皆さん、心配しないでください。
입문
Photoshop
これ以上Gif、Videoに頼る必要はありません。アフターエフェクトで制作したアニメーションをコードで出力し、JavaScriptでさまざまなインタラクションを実装する方法を学びます。あなたも魅力的なウェブサイトを作ることができます。

アフターエフェクトで作業したアニメーションをLottieファイルに出力する方法
Lottieで出力したJSONファイルをJavaScript経由でWeb上でモーションを実装する方法
Airbnbで作成されたライブラリ
Lottieを始めましょう🎈
Airbnbで作られたホットなライブラリ、 Lottieをご存知ですか?

Lottieを使用すると、高品質のアニメーション
自由に作れます。
Lottieについて最初に紹介すると、動くアニメーションのデータ値をJSON形式で出力し、実際のコードでWebやアプリで適用できるようにする技術です。そのスキルを学ぶと、もうGif、Videoに頼らなくても動くアニメーションを実装できるようになります。
このレッスンでは、ロッティについて詳しく学ぶことができます。 Lotyを使うための環境を最初に設定し、アフターエフェクトで制作したアニメーションをBodymovinを介してコードに出力し、JavaScriptでさまざまなインタラクションを実装する方法を学びましょう。
そのリンクからlottieで作られた例をもっと見ることができます。
例 - クリックしたときにロティアニメーションを実行する画面
例 - スクロールの度合いによるロティアニメーションの実行
例 - アフターエフェクトで製作して出力したアニメーション
止まっていることに
これ以上
満足できない
情熱マンレップデザイナー
私が働いた
アニメーションをコードに
Webに適用したい
能力型デザイナー
Lottie.js
早い時間で
身につけたい
Webパブリッシャー
私はコーディングを行うプロダクトデザイナーです。デザイナーの観点からどのような部分が難しく、どの部分を実装したいのかについて非常に共感しています。
私たちが学ぶことは途方もないものではありません。難しく見せていなかっただけで、いざとすれば誰でもできることです。ロティを学び、魅力的なデザインをしましょう。
ちなみに、アフターエフェクトで感覚的なアニメーションを教える講義ではありません。作業したアニメーションをコードで出力する方法、Webに適用する方法、およびJavaScriptでどのようにインタラクションを実装するかに焦点を当てた講義です。短くて密度の高いコアだけを教えてくれます。
合計9つの講座映像が用意されており、基礎と上級こうして2つのセクションに分かれます。
基礎では、Lottieコードを分析し、使いやすくHTML、CSS、JS、JSONファイルに分割する方法をまず学びます。 Lottieが基本的に提供する機能を使用し、操作方法を習得できます。
Advancedでは、JavaScriptを使用してマウスオーバー、スクロール、クリックなど、さまざまなアクションへのインタラクションを実装できます。 GIFとは最大の違いです。フレームを好きなように直接コントロールできます。
Q. ロティを学ぶと何がいいですか?
エペックで作業したアニメーションをWeb、アプリに適用できます。デザインのクオリティを高める要素です。
Q.コードを知らないデザイナーですが、役に立ちますか?
Lottieが何であるか、どのように機能するかという原則だけを知っていても、開発者とコラボレーションするときに楽しい作業をすることができます。ただし、基本的なHTML / CSSおよびJavaScriptの知識があれば、より豊富な活用が可能です。
Q. 講義を聞く前に準備すべきことはありますか?
講義に使用されるツールは、アフターエフェクト、ビジュアルスタジオ、イラストレーターです。そのツールの使い方を知ってみることをお勧めします。そしてJavaScriptの基礎知識を持っていなければ、高度な講座を難なく聞くことができます。
Q. サンプルファイルを提供しますか?
当然提供します。勉強することができる限り難しくないように講義に使用したサンプルファイルを提供します。
Q. アフターエフェクトの使い方やアニメーション制作法も教えてください。
アフターエフェクトで感覚的なアニメーションを教える講義ではありません。作業したアニメーションをコードで出力する方法、Webに適用する方法、およびJavaScriptでどのようにインタラクションを実装するかに焦点を当てた講義です。
学習対象は
誰でしょう?
アニメーションとインタラクションに興味を持つ多くのUIデザイナー
Webコーディングの良いWebデザイナー
ロッティの使い方を習得したいWebパブリッシャー
前提知識、
必要でしょうか?
HTML、CSSの基礎知識
Javascriptの基礎知識
After Effectの使い方
35,288
受講生
393
受講レビュー
32
回答
4.8
講座評価
5
講座
디자인베이스는 누구나 쉽게 디자인을 배울 수 있도록 디자인 강좌를 만들고 있습니다.
저는 현업에서 UXUI 디자이너로 활동 중이며 입문자의 입장을 잘 알기 때문에 꼭 필요한 내용만 담아 강의를 제작합니다. 포토샵, 일러스트레이터뿐만 아니라 프로덕트 디자이너로서 알아야 할 다양한 툴과 코딩 지식을 갖추고 있습니다. 😊
- 인프런 수강생 3.1만 명 / 수강평 4.8점
- 실무 경력 8년차 디자이너 (스타트업 창업, 에이전시, 인하우스)
- 유튜브 구독자 8.1만 명
실무에서 바로 사용하실 수 있도록 정확한 내용과 양질의 강의를 제공하겠습니다. 📖
全体
9件 ∙ (55分)
講座資料(こうぎしりょう):
全体
11件
4.6
11件の受講レビュー
受講レビュー 5
∙
平均評価 5.0
5
私にとって本当に役に立つ講義でした。 エペックもスクリプトもよく分からないデザイナーなのになんだか!私も作れるだろうな~という感じを受けます。先生ありがとうございます。
力になるスカンピョンありがとうございます!ㅎㅎㅎ
受講レビュー 1
∙
平均評価 5.0
受講レビュー 1
∙
平均評価 5.0
受講レビュー 14
∙
平均評価 4.7
受講レビュー 4
∙
平均評価 5.0
¥4,230
知識共有者の他の講座を見てみましょう!
同じ分野の他の講座を見てみましょう!