ko-ga

株式会社FORKのデザイナーです。猫ラブ。

ko-ga

株式会社FORKのデザイナーです。猫ラブ。

  • 4009 Designer's Book

    • 369本

    株式会社FORKのデザイナーたちが普段考えてる事や、デザインへの取り組みなど、多種多様なテーマで発信しております！

  • 4009 Designer's Review

    • 32本

    株式会社FORKのデザイナーたちが、各々の観点で最近気になるサイトをレビューしています！

AfterEffects1年生が脱初心者のためにやったこと

みなさん、こんにちは。もう5月も終わりですね。 さて、私が初めてAfter Effectsに触れたのは一昨年の夏、社内研修でのことでした。 その後、社内の動画チームに所属してちまちまと学びを積み上げること約1年半。全くの初心者の状態から、ある程度思い描いたアニメーションを実現できるレベルまでスキルアップしてこれたかなと思います。 そこで今回は、これまでどうやって学習してきたのか、インプットの方法や初学者に特におすすめのチュートリアルなどをまとめてみたいと思います。 これ

ko-ga

    • デザイナーズブックリスト -kogaが選ぶ3冊-

      " You kiss by the book. " 本といえば、思い出すのはシェイクスピアの悲劇『ロミオとジュリエット』のこの一節。 「お手本通りにキスなさるのね。」と訳されますが、かつて本は希少かつ高尚で芸術品と等しく美しいものとされていたことから、この"book"は2人のキスのロマンティックな美しさを象徴的に伝える表現なのだそう。 上記は大学で受けた講義の記憶ですが、私にとっての本はなんだろう？と考えると、知識の源泉であり、他者の靴を履く道具であり、子供時代の思い出で

      ko-ga

      • AEでリング状に回転するテキストアニメーションをつくる

        みなさん、こんにちは🐾 今回は、社内の動画部のレクチャー会（Norishioさん記事参照）で取り上げたリング状に回転するテキストアニメーションの作り方をまとめたいと思います。 見た目より簡単なのでぜひ挑戦してみてください！ テキストレイヤーのアニメーターについて このアニメーションでは、文字をアニメーションさせる機能「アニメーター」を使用します。 AEにもともと入っているテキストアニメーションのプリセットもこの機能を組み合わせて作られているようです。 テキストレイヤーの中

        ko-ga

        • AEでアイソメトリック表現をつくる

          こんにちは、みなさん年末年始はいかがお過ごしでしたか？ 私はみかんを30個食べました。 さて今回の記事では、先日公開されたFORKコーポレートサイトのKV動画から、冒頭で使用したアイソメトリックな画面の作り方をまとめたいと思います。 3Dレイヤーを用い、カメラをアイソメの角度に配置することで作成できます。 今回はアニメーションの作り方というより、アイソメトリックな画の作り方になるので、上の動画の角柱を例に挙げてご紹介したいと思います。 では、さっそく作り方です☟ 1.

          ko-ga

        AfterEffects1年生が脱初心者のためにやったこと

        ko-ga

        • デザイナーズブックリスト -kogaが選ぶ3冊-

          ko-ga

        • AEでリング状に回転するテキストアニメーションをつくる

          ko-ga

        • AEでアイソメトリック表現をつくる

          ko-ga

        マガジン

        • 4009 Designer's Book
          369本
        • 4009 Designer's Review
          32本

        記事

          私が選ぶ Good Web Design 2022

          こんにちは、デザイナーのko-gaです。 この記事では、2022年に見たWEBサイトのなかで、 特に印象に残ったサイトを【私が選ぶ Good Web Design 2022】として3つご紹介したいと思います。 私は昨年から社内の動画・アニメーションチームに所属していることもあり、Webサイトを見るときもアニメーションや演出に注目することが多くなりました。 そこで、今回は演出やアニメーションの観点からおっ！と思ったものを取り上げたいと思います。ぜひリンク先に飛んで味わってみて

          ko-ga

          私が選ぶ Good Web Design 2022

          ko-ga

          【AE】 CC Page Turnでページめくりのアニメーションをつくる

          みなさん、こんにちは。 #Fork動画部5本目の記事は、After Effects標準エフェクトの「CC Page Turn」を使ったページめくりのアニメーションをご紹介します。 完成形がこちら！ 7/10の参院選に合わせて、日めくりカレンダーのように紙をパラパラとめくる動画にしてみました。 以下、つくり方です。 1. 素材を用意 今回はイラレで用意しました。ページごとにレイヤーを分けておきます。 角度や配置はAE上で調整するので紙面に載せたい内容を作成すればOKで

          ko-ga

          【AE】 CC Page Turnでページめくりのアニメーションをつくる

          ko-ga

          「レンズ補正」でつくるワープのトランジション

          こんにちは、今月からFork動画部の活動の一環としてnoteを書くことになりました。 私自身、脱初心者を目指してまだまだ勉強中ですが、同じく勉強中の誰かの制作のヒントになればという思いで発信していきます…！ 今回は、視界が歪んでワープするようなトランジションを紹介します。 使用するのはAE標準エフェクトの「レンズ補正」です。 次のシーンにぐっと引き込まれるようなインパクトのあるトランジションですが、案外簡単につくれてしまいます。 レンズ補正とは？レンズ補正は、その名の通

          ko-ga

          「レンズ補正」でつくるワープのトランジション

          ko-ga

          発想力が素敵！なクリエイターさんたち on Twitter

          今回は私が普段から拝見している、Twitterで作品を発信されているクリエイターさんについてです。 特にジャンルは絞らず、発想力が素敵だなぁと思う方々を勝手ながら紹介したいと思います。 Tanico / フォトグラファー見立てや超自然な表現でおもしろい写真作品をつくっている方です。 ビビッドなカラーバックが印象的。ユニークな作品を数多く生み出していて完全にファンです。 あっと驚くような発想にはどことなく吉田ユニさんに通ずるものを感じます…(吉田ユニさん大好き) Tanico

          ko-ga

          発想力が素敵！なクリエイターさんたち on Twitter

          ko-ga

          レタースペーシングをじっくり深める一冊

          今回は読書の秋にじっくり読みたいデザイン本、 『レタースペーシング タイポグラフィにおける文字間調整の考え方』をご紹介したいと思います。 こちら、まるまる一冊レタースペーシングについて解説したディープな本なのですが、今まで感覚で語られがちだった文字間調整の理論が図解とともにひとつひとつ紐解かれていてとても分かりやすいです。 見本帳ではなく「視点集」❝ レタースペーシングは見る人によっても良しあしが変化します ❞ まず冒頭で語られるのは、レタースペーシングには人によって感

          ko-ga

          レタースペーシングをじっくり深める一冊

          ko-ga

          『無敵の未来大作戦』に心の元気をもらう

          今みんなに読んでほしい大好きな漫画、黒崎冬子さんの『無敵の未来大作戦』について書きました。 昔の少女漫画を思わせるうるわしい絵柄とふんだんに盛り込まれたギャグ、そして非常に令和的な価値観で描かれる、ちょっと変わったハイテンションな学園オムニバス漫画です。 物語は同級生の良々田（いいだ）くんが「聖人」に選ばれるところから始まります。 少子化対策としてつくられた「聖婚」という制度。聖婚とは、一定以上の資産を有する富裕層に一夫多妻・一妻多夫を認めて、出産や育児の金銭的なハードルを

          ko-ga

          『無敵の未来大作戦』に心の元気をもらう

          ko-ga

          色のユニバーサルデザインとWebデザインのこと：②実践編

          前回に引き続き、Webデザインをするうえで色覚異常や高齢者の見え方にどう配慮するかというお話をしたいと思います。 今回は、具体的にどんなところに気を付けるべきかということについて、日々の制作の中で考えたことをまとめてみます。 立ち止まって考えたいポイント色の役割は、イメージを呼び起こす「感性的役割」とわかりやすさに関わる「機能的役割」に大別されますが、色のユニバーサルデザインで問題となるのは後者。色別の情報を見分けられない、注目すべき情報がわからないとなると、理解度が大きく

          ko-ga

          色のユニバーサルデザインとWebデザインのこと：②実践編

          ko-ga

          色のユニバーサルデザインとWebデザインのこと：①色覚多様性について

          昨年こっそり取得した色彩検定のUC級。 色のユニバーサルデザインに特化した級で、勉強自体とても面白かったのですが、デザインの実務にはまだいまいち活かしきれていないと感じていました。 そこで、Webデザインをするうえで色のユニバーサルデザインをどう捉えればよいのか、制作の中でどんなところに気をつければよいのか考えてみたので、備忘録を兼ねてまとめます。 2回に分けて投稿する予定ですが、今回は色のユニバーサルデザインと色覚多様性についてのお話です。 色のユニバーサルデザインとは様

          ko-ga

          色のユニバーサルデザインとWebデザインのこと：①色覚多様性について

          ko-ga

          ちょっとクリエイティブになれる朝活カメラ散歩のすすめ

          本当は二度寝大好き、できるならギリギリまでお布団にいたい… そんなデザイナーがちょっと早起きして続けたいと思った、朝のカメラ散歩についてのお話です。 みなさん、朝活ってしてますか？ 私は前述のとおり朝が弱く、朝活の「あ」の字もないような人生を送っていました。 ところがふと思い立ち、始業前にカメラを持って近所を散歩するという朝活を始めてところ、朝ならではの魅力にすっかりはまってしまい今のところ2ヶ月継続できています。 そしてこの朝活が仕事にとってもメリットになっているかも、

          ko-ga

          ちょっとクリエイティブになれる朝活カメラ散歩のすすめ

          ko-ga