新登場!新実装のパーツでデザイン性アップ【アルバムブロック編】

先日、ブロックのデザインを手軽に変更できる、ブロックDressの提供についてお伝えしましたが、
今回はその中でも、アルバムブロックについてもう少し詳しくお伝えしたいと思います。

ブロック単位のDressで使える、タブやアルバムのデザインを提供!

ブロックDressの概要と使い方

使い方はとても簡単!
デザインを変更したいブロックのブロックデザイン(ブロックDress)を変更するだけ
ブロック単位のDressで使える、タブやアルバムのデザインを提供!

ブロックDressの選択画面

※画面は開発中です

色変更も簡単

提供されるブロックDressのテンプレート(ブロックDressテーマ)にはあらかじめDressカラーが設定されているので、サイトへの調整も簡単です。メインカラー、サブカラー4、5が初期設定されています。

ブロックDressに設定されたDressカラー

あらかじめDressカラーが設定されていれば、サイトで使用している色に置きかわります。

アルバムブロックの新デザイン一覧とおすすめの使い方

フォトフレーム

写真をフチあり印刷したような、画像に白枠のついたデザイン。

こんなサイトにおすすめ!

フチがあることで画像一つ一つが独立して引き立つので、画像をしっかり見せたいポートフォリオサイトやブログなどにおすすめ!

ラウンド/サークル

画像を丸く切り抜いたデザイン。

ラウンドのデザインに加えて、マウスオーバーで画像が傾く動きのあるデザイン。

こんなサイトにおすすめ!

丸みが出て柔らかい雰囲気が出るので、女性や子供向けの商品、サービスサイトなどに。

ショートコメント

マウスオーバーで画像の下にコメントが表示されるデザイン。

こんなサイトにおすすめ!

他のアルバムブロックに比べ控えめにコメントが表示されるので、少しクールな印象に。コーポレートサイトの実績などに。

アスキュー

傾いた配置と、マウスオーバーのギミックで動きのあるデザイン。

こんなサイトにおすすめ!

配置の段階で動きがあるので、ポップな雰囲気のサイトに!

利用上の注意点

ラウンド、サークルはDressで画像を丸くする設定をしていますが、綺麗な円にするには正方形の画像を使用しましょう。
また、基本的にはカラム数を1段で使用するのではなく、分割して使うことをお勧めします。

カラム1段で使用した時と画像サイズがバラバラの時の違い

カラム1段で使用した時と画像サイズがバラバラの時の例


実装まではもう間もなくです!利用できそうなシーンがあればぜひ使ってみてください。

Dressでできることを詳しく見る

BiNDup GuideBook

Web作成サービス「BiNDup」の最新ガイドブック。サイトを外注せず自作する方のために制作から集客までできることをまとめました。

今すぐ資料をダウンロード
  • POINT

  • アルバムブロックにDressを適用するだけ
  • キレイに見せるには、アルバムの画像サイズを揃えるのが望ましい
  • アルバムのデザインは、サイトのコンセプトや雰囲気によって使い分けると良い

あわせて読みたい