ITエンジニア/デザイナ向けにオープンソースを毎日紹介

HexaFlipは写真などのコンテンツを立方体にして回転させられるJavaScriptライブラリです。

写真やコンテンツの見せ方を工夫すれば、閲覧した人の受ける印象は全く変わってきます。ただ表示するだけでは面白くない、と考える方はHexaFlipを使って回転するコンテンツなんていかがでしょう。


並んだボックスが不定期に回転します。


こういう写真の回転も格好いいです。


時間表示。マウスでドラッグして時間を変更できます。


デモ動画です。

写真のようなコンテンツやロゴが回転したりしていても面白いかも知れません。回転するアニメーションGIFはよくありますが、JavaScriptで実装しているのでユーザに合わせたコンテンツや、イベントによるアクションが実現できるのが魅力でしょう。

HexaFlipはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。


MOONGIFTはこう見る

最近この手のライブラリが使われているのはHTMLスライドではないでしょうか。スライドをただ切り替えるのではなく、そこにアニメーションを持たせたり、ダイナミックなコンテンツ変化を行うことでユーザの目を引くことができます。

同様に回転しないと思っていた要素が突然回転したりすると思わず目を奪われるものです。他にもほんの少し大きくなる、跳ねる、色がグラデーションするなどユーザの認知度を高める工夫は他にも色々考えられそうです。

HexaFlip

dmotz/hexaflip · GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2