タグ

ブックマーク / ics.media (5)

  • 新感覚!メソッドチェーンでアニメーションがスラスラ書ける「Tween24.js」を作りました - ICS MEDIA

    新感覚!メソッドチェーンでアニメーションがスラスラ書ける「Tween24.js」を作りました アニメーションを作る時に、「思いついた演出をすぐに実装したい」「頭の中ではできているのに、コーディングするのが面倒」と思ったことはありませんか?アニメーション作成にはライブラリを使用することが多いと思いますが、使い方を調べて覚えて、ドキュメントからコピペしたり、ひたすらタイピングをして… 私はこれらの問題を解決するために、「Tween24」というライブラリを作りました。Tween24はメソッドチェーンで記述するのが特徴で、たった1行でアニメーションが実装できます。依存ライブラリもなく、単体で動作します。アニメーションライブラリの多くはオブジェクト型でプロパティを指定するためタイピングが多くなりがちですが、メソッドチェーンであればエディターのコード補完機能でスラスラと記述できます。 その他にも、メソ

    新感覚!メソッドチェーンでアニメーションがスラスラ書ける「Tween24.js」を作りました - ICS MEDIA
    gebugebu
    gebugebu 2021/04/10
  • VS Code & TypeScriptとp5.jsで始めるモダンなクリエイティブコーディング入門 - ICS MEDIA

    ページの背景で動くダイナミックなパーティクルやラインアニメーション、あるいはちょっとした遊びごころの溢れるキャラクターアニメーションなど、webページにクリエイティブな表現を組み込めるようになりたいと考える方はエンジニアにも多いでしょう。 この記事では、基的なJavaScriptの知識があれば誰でも始められるp5.jsというライブラリを使用して、クリエイティブな作品作りの入門を解説します。 環境面では、フロントエンド開発のデファクト・スタンダードとも言えるVisual Studio Code(以下VS Code)とTypeScriptを使用して、モダンで快適な開発環境を作ります。 環境構築といっても、とくに難しい作業はありません。記事を読みながらぜひ、オリジナルの作品作りにチャレンジしてみてください。 ▼ VS Codeでp5.jsを使って制作している環境の例 クリエイティブ・コーディン

    VS Code & TypeScriptとp5.jsで始めるモダンなクリエイティブコーディング入門 - ICS MEDIA
    gebugebu
    gebugebu 2021/01/31
  • 次世代のフォント技術 バリアブルフォントの世界 - ICS MEDIA

    補完するのは登録された軸のみになります。たとえばitalの値が1種類しか登録されていないフォントitalの値によらず一定の傾きをもちます。 オプティカルサイズとは、サイズに連動した文字のスタイルです。フォントサイズが小さなときは簡略化された表記、大きなときは細かく装飾されたフォント、というように設計されることがあります。 標準ではフォントサイズに依存しているため手動での変更はできませんが、一部のフォントでは変更が可能です。先ほどのデモにおいても、オプティカルサイズに応じて文字バランスが微妙に変更されることが確認できますね。 Roboto-Flexフォントを例に バリアブルフォントはまだそれほど普及していないこともあり、入手元がそれほど多くありません。今回は、オープンフォントライセンスで配布されているRoboto-Flexフォントを使用します。 GitHub - Roboto-Flex 記

    次世代のフォント技術 バリアブルフォントの世界 - ICS MEDIA
    gebugebu
    gebugebu 2020/10/09
  • JavaScriptで始めるジェネラティブアート - 生物アルゴリズムの応用 - ICS MEDIA

    ジェネラティブアートという言葉をご存知でしょうか? アルゴリズムによって作られる芸術作品を指す名称です。Pinterestで「generative art」と検索すると静止画、動画ともにたくさんの作品を見ることができます。 無機質さを感じさせるものもあれば、まるで生きているように感じる作品もあります。創作者たちはどのようなところから着想を得ているのでしょうか? 彼らの中には数学的な幾何学模様や物理現象、果ては生物が織りなす複雑なパターンをコンピューターで再現することにより作品を作る者もいます。 記事では特に「生物」に焦点を当てます。生物の複雑な営みを紐解いた背景や、それをアルゴリズムに落とし込むことで可能になった表現を紹介します。 記事を読むことで日常に潜むあらゆる現象が芸術の種に見える喜びを感じていただければ幸いです。 サンプルはHTML CanvasとJavaScriptで作成して

    JavaScriptで始めるジェネラティブアート - 生物アルゴリズムの応用 - ICS MEDIA
    gebugebu
    gebugebu 2020/02/21
  • Adobe MAX 2015で発表されたアドビが研究中の新技術〜 スニーク・ピークで発表された未来の11の技術 - ICS MEDIA

    Adobe MAX 2015で発表されたアドビが研究中の新技術〜スニーク・ピークで発表された未来の11の技術 アメリカ・ロサンゼルスにて開催されているアドビシステムズ(以下、アドビ)のクリエイティブティ・カンファレンス「Adobe MAX 2015」。初日の基調講演(参考記事「[速報]Adobe MAX 2015 基調講演レポート」)に続いて、二日目は「スニーク・ピーク」というアドビが開発中の実験技術を紹介する講演が行われました。紹介された技術は将来的に搭載されるかもしれない技術であり、未来のAdobe Creative Cloudの新機能を一足先に知ることができます。現地に渡った弊社ICSの池田が速報レポートとしてお伝えします。 簡単な操作で新しいフォントを作り出せる技術:Project Faces フォントの骨格を解析し、字形を自由自在に調整し新しいフォントを作成できる技術。 ▲フォン

    Adobe MAX 2015で発表されたアドビが研究中の新技術〜 スニーク・ピークで発表された未来の11の技術 - ICS MEDIA
    gebugebu
    gebugebu 2015/10/08
  • 1