こんにちは!
BiNDupで、テンプレートのデザインディレクターをしている、デザイナーのオモトです。
今シーズンのテンプレートは10月と12月の2回に分けて搭載予定!
今回は、10月搭載のホームページ作成サービス「BiNDup」の新作テンプレートをちょい見せ。新しいBiNDupのプリセットテンプレートとSiteBoxを含めた全7つのテーマについて、デザインのポイントとオススメの使い方をご紹介していきます!
※各デザインテーマの中に、3種類の業種・サイト構成のテンプレートが収録されます
ナチュラルで親しみやすい白基調のシンプルなテンプレート「DAISY」
ミニマルでナチュラルな色合いと丸ゴシックフォントでほんわりとまとまりつつも、小さなフォントや細い罫線の装飾があるので、物足りなさは感じません。
テンプレートの種類は、コーポレート「介護サービス」、サービス「レンタルスペース」、オンラインショップ「ジュエリーショップ」です。
▼Webデザインのポイント「画像と座布団を重ねるデザイン」
セクションの始めにある、画像と座布団を重ねるがデザインが、女性誌のよう!文章と写真を引き立てユーザーの目を惹きます。非対称なレイアウトは、ユーザーの視線の動きにあった流れを作り出すことができ、気持ち良くページに目を通せます。
シンプルなデザインでどんな業態にも合うので、企業やサービス、店舗の雰囲気を伝えたい時にオススメのテンプレートです。
男性が好む大人格好いいを体現したダークな配色のテンプレート「TSUBAME」
男性向けの商品や硬派な印象を与えたい時に使って欲しいテンプレートです。
テンプレートの種類は、コーポレート「左官工事」、サービス「民泊施設」、ポートフォリオ「生け花作家」です。
ウィジェットにCVボタンを採用していて、どこからでもCVエリアに飛ぶことができます。
▼Webデザインのポイント「濃度の違う同色を2色使って質感を出す」
黒にさらに濃い黒を組み合わせることで質感の違いのような印象を付与。ファッションのおしゃれテクでもありますが、同色でも質感の違う色を組み合わせることで奥行きを出し、クールで洗練されたデザインが垢抜けた大人の印象を与えます。
また、セクションの見出しを大きな文字と小さな文字を重ねるデザインにすることで、インパクトと見た目の華やかさを追加。黒一色の地味さを軽減し、飽きずに読み進めることができます。
サービスのテンプレートを見る
全面に配色したキーカラーが効いている!新しいけどアナログな「TALKTALK」
モノクロ写真がアナログな印象を与えつつも、キーカラーを全面に配色することにより寂しいイメージを払拭し、スタイリッシュな印象に昇華させている、個性的なデザインです。ヒーローイメージを引き立たせる日本語と英語の文章を重ねたタイポグラフィも、ドラマチックな印象に華を添えています。
テンプレートの種類は、コーポレート「声優・ナレーション事務所」、サービス「英会話教室」、求人採用「コンサルティング企業」です。
▼Webデザインのポイント「モノクロ写真+単色」
近年、モノクロ写真が注目を集めるのは、写真内の「色」がユーザーの気を散らすからです。例えば、極彩色な写真が多いページは、ページ上で重要な要素であるCTAボタンから注意を背けさせてしまい、次のアクションへ促せない…ということも。
またデザインに単色を利用することで、クオリティのばらついた写真や素材などの要素をまとまりのあるデザインに手軽に仕上げる事ができるというメリットがあります。ぜひ素材に困っている方に使っていただきたいテンプレートです!
食欲をそそるビタミンカラーが特徴のSiteBoxテンプレート「Leonardo」
食べ物を美味しく見せるには?を追求したテンプレート。シズル感のある写真さえ用意していただければ、魅力的なサイトがあっという間に完成です!
テンプレートの種類は、コーポレート「不動産業」、サービス「ベジタブルレストラン」、求人採用「スパイスショップ」です。
▼Webデザインのポイント「流体シェイプ」
流体シェイプとは、液体が波打つ時に生まれるような曲線を取り入れたデザイン手法です。セクションの境目を流体シェイプ(波形)にする事により、デザインの中に優しさや柔らかさ、親近感を与える事ができます。ナチュラルな配色に頼らず優しさを表現できるので、濃い色をキーカラーにすることによって得られる元気な印象のまま、優しさや親近感といったニュアンスを追加したい時にオススメです。
手書き風のパターンでボタニカルな印象に!SiteBoxテンプレート「VERT」
ボタニカルでミニマルなデザインを追求したテンプレート。ベージュやグリーンなど自然の色を基調としていて、清潔感があります。
このきちんと感のあるデザインの中に、画像同士をずらして並べたコラージュ感や手書き風パターンなど女性が好みそうなラフなテイストを加える事で、ナチュラル感を演出しています。ボタニカルな商材を扱うサイトに最適です。
テンプレートの種類は、コーポレート「ガラス製造業」、サービス「料理教室」、オンラインショップ「インテリアグリーンのショップ」です。
▼Webデザインのポイント「手書き風パターン」
自然で優しい色合いだけでなく、ページのポイントに、太めのブラシでラフに書いたようなラインを加える事で、天然さを想起させるような質感が加わり、よりボタニカル感を強調することができます。
流体シェイプとリアルな紙の質感がポイント!SiteBoxテンプレート「Agatha」
オーガニックなデザイン追求したテンプレート。土色や生成色など、土着的な色合いや、デザインのポイントに明朝体を使う事で、古い日記に万年筆で記したようなアンティークな雰囲気を作り出しています。
テンプレートの種類は、コーポレート「法律事務所」、サービス「エステサロン」、オンラインショップ「フォトグラファー」です。
▼Webデザインのポイント「流体シェイプ+リアルな紙の質感」
ページ全体に敷かれた流体シェイプは、気の流れのようにゆるやかに、自然体のありのままで無垢な様子を表現しています。背景自体がユニークで視線の流れを誘導しているので、ノーマルなブロックを加えただけでもオーガニックな感じに決まります。
ミニマルを極めた大きなタイポグラフィが特徴!SiteBoxテンプレート「AYAME」
白をベースに大きな太ゴシックのタイポグラフィが特徴のデザイン。ミニマルな商材を扱うサイトに最適です。
テンプレートの種類は、コーポレート「インテリアショップ」、サービス「ライブカフェ」、ポートフォリオ「ジャズピアニスト」です。
▼Webデザインのポイント「ポスターライクなレイアウト」
全てを同じフォントに統一し、右寄せや縦に回転させることで、ミニマルデザインのポスターのようなインパクトのあるファーストビューに仕上げています。
大きなフォントは圧迫感を与えますが、フレームから画像をはみ出させる事で窮屈な雰囲気を軽減しています。
まとめと予告!
いかがでしたでしょうか。
今回ご紹介できませんでしたが、ブロックまたぎの背景を搭載したテンプレートや予約サービスを搭載したテンプレートを提供予定です!
現在制作中のブロックまたぎを使った背景だけちらっと!
より進化するBiNDupを、どうぞお楽しみに!
最新のテンプレートをすべて見る
※本文の内容は現時点での開発中の仕様のため、変更になる可能性があります。
POINT
- 2021年シーズンのBiNDupテンプレートは秋と冬2回に分けて提供
- 各デザインテーマの中に3つの業種・構成のテンプレートを用意
- 視線の流れを意識した読みやすいレイアウト、写真を引き立たせる工夫も