まえがき
Snykのマスコット犬「パッチ」を応援したい方…だと？
Snyk Advent Calendar 2023 ページ に、「こんな人におすすめ」の項目を発見！
Qiita & Snyk イベントでも、Snykのウェアを着た方に話しかけた最初の話題は、このマスコット犬についてでした。パッチ！その時、初めて名前を聞きました。
Snykのマスコット犬パッチ誕生物語
１つ前の記事でも書きましたが、SnykのBlogは、ネタを探しで、あちこち読みましたが、もちろん、マスコット犬Patchに関しては、検索してすぐ読みましたよ。
Snykは、犬への愛があって良いなぁ。
むしろ何というか… DevSecOpsネタより、こっちのパッチを先に書きたかった。
なんせ子供の頃に、通学路にいる近所の犬は全員仲良しだったくらい。現在は、近くの大きな神社のワンコ集会に集まる子たちとも仲良しですからね。
しかし。Snyk アドベントに、いきなりワンコ話で登場するわけにもいかないでしょう？
いちおうオトナだし、正しい節度というものを考えなくてはいけないのですね。でも前日に長めの投稿をさせて頂いたので、もう良いよね？（開放感）
アイコンのデザインの変遷…コアラ？
さて、最も注目したのは、このページ。
Snyk Blog - Celebrate International Dog Day with #DevelopersBestFriend
何とタイトルにハッシュタグ #DevelopersBestFriend なんて付いてるし。
最初の段落 How Patch Became Our Mascot 以下の部分です。
ドーベルマンがモデルで、しかもそのデザインの変遷がここに。詳しくは英語ですがブログを読んでいただくとして、まずはその画像をご覧ください。
このページを読むと、なんとSnykのアイコンはコアラだったかもしれないのです！
コ、コアラ…？セキュリティのイメージからは、少し違うかも知れませんね。
神は細部に宿る
さて、私は元デザイナー出身のエンジニアなので、日頃からやたら（ムダに）細かいとこを見たり、気になるとすぐページのソースをチェックしたりします。
Snykのメインサイト左上アイコン、ホームに戻るロゴ。
まぁ普通はサイトを訪れるとここに注目しますね。そして人々は記事を読み、インストールを促されたり、ページを移動したりする。
しかし、ページを作る側の立場からすると、全てを見てほしい！目立つとこだけじゃなくて、ちゃんと全部デザインしてるんだから、細かい部分まで見てほしい！
そう、「神は細部に宿る！」なのですよ。ディテールまでしっかり見てほしい。
フッターに隠された秘密の愛
見たよ！左下のフッターにマスコット犬への愛を見つけたよ。
小さいけど、ここにもしっかりマスコット犬パッチが。
きっとなんかあるぞ。デザイナーの私はニオイを嗅ぎつけたのであった。犬好きだしね。
ただロゴ貼ってるだけ？…いいえ。
では早速ですが、ソースを見てみましょう。
なんだと！「div.animated-patch | 80x80」とな。
ありがちな、フッターだしこんなもんだろ的なPNG画像だけ貼るんじゃなくて、これはSVGで何かしてるでしょう。でも何してんだろう？animateして動いてる？
なんせ4K画面で見ると小さくて目立たないけど、マウスポインタをアイコン近くで動かすと、確かに左右に顔を振っている。
いゃ…まてよ、上にも振ってるように見える。芸が細かいなぁ（ステキ）
ほら、気になると止まらないでしょう？ここでSVGと仕組みがどうなってるのか？何枚あるのか？思わず深掘りして調べてしまいました。（完全にDevSecOpsから逸脱）
なんと！PNGの1枚で足りそうなところ、SVGファイル14枚で構成してる！おー。
ここにもマスコット犬パッチへの愛を感じますね。
全国の犬好きエンジニアの皆さまへ
それでは、全国の犬好きエンジニアと皆さまと共にマスコット犬パッチの動きを確認するため、FireFox v.121 で最大限まで拡大してみました。
ページがレスポンシブ反応して、左上部のロゴよりフッターのanimateロゴが少し大きくなってますが、私はMacで「⌘+」を複数回やって、拡大表示した以外何もしていません。
（ロゴを勝手に改変したりするの、それダメなやつですから、ね！）
こんな細かいとこまで配慮して制作した、Snykのデザイナーさんに喝采！パチパチ。
小さい表示だと気付かなかった、左右上の他に、下を見る表情もあるんですね。残念ながら、GIFアニメだと正確な動きまでは再現しないのですが、ここに愛を感じます。
皆さんもぜひ、Snykサイト で実際にやってみてください。動きがかわいいなぁ。
まだ愛は続く…
そう、タイトルには（その１）とありますね。そう、もちろん（その２）もあります。
マスコット犬への愛が溢れすぎて、暴走しています。
良かったら → （その２）もどうぞご覧ください。ぜひ！
じつは私本人もこんな展開になると思ってなかったのですが…でも良いの。
もう１ページ増えちゃいました。はぁぁ愛が止まらない♫