もっともっと、もっと先へ。株式会社アットワークMore and more,
further and further.

手書き風SVG文字アニメーションをローディングとして使う

手書き風の文字アニメーションは、jsでマスク画像（svg）をアニメーションさせて、文字本体が描かれていくように見せるのが一般的です。今回は、サイトのアクセントとして手書きのロゴが一筆書き風のアニメーションで表示されるロー […]

自社サイトのヒーロー部分に、ちょっとした工夫でSVGアニメーションを取り入れました。これまでは静的なビジュアルを置いていただけだったのですが、「最初に目に入る部分でもう少し印象を残せないか？」と考えたのがきっかけです。 […]

Appleのサイトなどでよく見かけるのギミックですが、GSAPで再現してみました。GSAP（GreenSock Animation Platform）は、高性能かつ制御性の高いJavaScriptアニメーションライブラリ […]

Scroll-driven Animations とは CSS Scroll-driven Animations は、スクロール位置に連動してアニメーションを制御できるCSS/Web APIの仕組みです。従来はJavaS […]

デザインの現場で静止画を扱うことには慣れていても、「アニメーション」と聞くと少しハードルが高く感じる方も多いのではないでしょうか。タイムライン、キーフレーム、書き出し設定…、専門的な用語が並ぶだけで身構えてしまうかもしれ […]

今回もサイトデザインからWordPressでの実装案件で、SVGのロゴのアニメーションやメインビジュアルのスライドインなどのアニメーションを実装しました。内部SEO対策も施したており、カテゴリー分岐なども柔軟に設計。長く […]