Border

franky

Web / Design, Develop (2021)

franky, Inc.のWebサイトのデザインと実装を担当した。
ロゴデザインとVIはタカヤ・オオタによるもの。

VIを踏襲し、ラインを使ったあしらいを多用した。ソリッドなデザインだが、画像を大きめの角丸にしてバランスを取っている。
メインビジュアルは数種類のラインアニメーションがループで再生される。PixiJSで実装。
シンプルなデザインの分、ナビゲーションやボタンなどの細部のインタラクションにこだわっている。

サイト自体はNext.jsで構築した。CMSにはContentfulを採用し、ニュースやメンバーなどは管理画面から更新できるようになっている。

URL

https://franky.inc/

Design Tool

  • Figma

Teck Stack

  • Next.js /
  • PixiJS /
  • Contentful