• 株式会社ブラケット
  • エンジニア
  • 矢部 剛嗣

「自分だけのストア」を作る。デザインのこだわりを実現するWebフォントという選択肢

  • -
  • このエントリーをはてなブックマークに追加
    -
  • tweet

通常、Webサイト上に表示されるフォントは、PCやモバイル端末といった閲覧者のブラウザに依存することになる。しかし、表示される「文字」まで含めてサイトをデザインし、オリジナリティーを表現したい人も多いだろう。そんな時に活用したいのが「Webフォント」だ。

Webフォントは、サーバー上にあるフォントファイルを参照することで、好きなフォントをサイト上に表示できる仕組みだ。閲覧側の端末に指定されたフォントがインストールされていなくても、制作側で指定した書体を美しく表示することができる。

誰でも簡単に自分だけをオンラインストアを開設できるサービス「STORES.jp」。40万店舗以上が利用している同サービスでは、ストアオーナーが1人ひとりのこだわりをデザインで表現できることを大切にしている。

そのこだわりを細部にまで反映させるために導入しているのが、Webフォント配信サービスの「TypeSquare(タイプスクエア)」だ。その具体的な活用法を、同サービス運営チームの矢部 剛嗣さんに伺った。

15名のチームで運営するSTORES.jp

キャリアスタートは、Windowsの業務アプリケーション周りを中心に4年、その後、Web系に進みました。ブラケットには、Rubyのコミュニティの中で弊社の高木と会って話した中で面白そうな会社だなと思って、遊びにきたのがちょうど1年ほど前ですね。

現在、私が関わっているのは、STORES.jpという、インターネットの知識がない方でも簡単に自分だけのオンラインストアを開設できるサービスです。

弊社は基本フラットな組織で、サービス毎にチームを組んで開発を行っています。STORES.jpは15名のチームで構成されていて、6名のエンジニアの他に、営業、ディレクター、デザイナー、カスタマーサポートのメンバーがいます。

リアルな「お客様の声」を聞く工夫を重ね、サービスを運営

STORES.jpの開発に関しては、社内の意見やカスタマーサポートからあがってきたユーザーの声をベースに、弊社代表の光本と開発チームで優先順位を決めて進めています。

お客様の声は、カスタマーサポート経由以外に、実際にお会いして聞くこともあります。「うちの社員とランチしませんか?」とTwitterで呼びかけて、ストアオーナーさんからご意見をいただく機会を設けているんですよ。

と言うのも、すでにある機能について、「つけてほしい」というご意見をいただくことがすごく多いんです。私たちが伝え切れていないことが大きいのですが、それを伝えるためにも、ランチや勉強会といった実際にお会いできる機会を持つようにしています。

他にも、最近試しているのはチャットでのユーザーサポートです。さまざまな面からユーザーの声を聞けるように、仕組み化を進めています。

ネットの知識がなくても「おしゃれな」オンラインストアが持てる

STORES.jpのウリは、簡単におしゃれなストアを誰でも作れる、ということです。リアルでお店を開くことはとても難しいですが、ネットでは簡単にできます。

自分だけの、自分の色のストアを持つってすごく楽しいことですよね。そこでSTORES.jpでは、オーナーさんがかなり自由にサイトのデザインをカスタマイズできるようになっています。

▼40万店舗以上のオンラインストアが集まるSTORES.jp

STORES.jp

その中で、ストアオーナーの方に「フォント」を自由に選んでいただくために導入しているのがWebフォント配信サービスの「TypeSquare」です。

TypeSquareを使うと、自分のサイト上に好きなフォントを表示させることができるようになります。普通のサイトであれば、閲覧者の端末にインストールされているフォントしか表示することはできないですよね。

でもWebフォントではサーバーに置いてあるフォントライブラリを参照するので、どこから閲覧しても好みのフォントが表示される状態にすることができます。

「TypeSquare」を導入し、フォントにも選択肢を用意

STORE.jpでは、具体的に言うとサイトのロゴやページタイトルの表示にTypeSquareから選んだWebフォントを表示できます。自分のイメージに合ったストアデザインを実現するための選択肢のひとつして、ご利用いただいているイメージです。2014年の6月から利用しています。

ストアオーナーさんから、「STORES.jpは簡単におしゃれな感じにストアが作れることがすごく魅力的!」といった声をいただくことがよくあります。これは、Webフォントを選ぶだけで統一されたデザインのストアを手軽にオープンできる点も評価していただいているのだと感じています。

▼管理画面から簡単にTypeSquareのWebフォントを選択できる

STORES.jp

▼選ぶフォントを変えることで、ロゴ(文字)の見え方も変化

STORES.jp

ロゴの場合、STORES.jpでは自作の画像をアップロードして使用することもできます。ただイラスト制作ソフトを持っていない方にとっては、やはりハードルが高いんですよね。

そこでTypeSquareを導入したことで、本格的なロゴを用意できない方も、オリジナリティを持ったロゴを使うことができるようになりました。ストアの印象に合ったフォントを選択していただくことで、手軽にクオリティが高いロゴが表示できることも、オーナーさんからもご好評いただいています。

ブラウザデフォルトのフォントとは、違った印象を与えられる

弊社ではTypeSquareが提供するすべての機能が使える「アドバンスドプラン」を利用しています。現在、実際に導入されているストアの数は約5,000店舗です。特にストアの名前が日本語で、和の商品を取り扱っているストアでご利用いただいている例が多いですね。

例えば400年の伝統を持つ高岡銅器の鋳造・金属加工技術を生かして商品開発を行っている博鳳堂 炭谷三郎商店さんのロゴにも、TypeSquareが提供するフォントが使われています。ブラウザデフォルトの明朝体を使うよりも、より繊細な印象を受けますね。

▼ロゴにTypeSquareのフォントを使用する、博鳳堂 炭谷三郎商店のページ

博鳳堂 炭谷三郎商店

最近STORES.jpでは、ストアのデザインを始める際に「テーマ」を選ぶだけで、イメージに近いストアができあがるという機能を追加しました。

「テーマ」では、背景の柄やカラーのほか、Webフォントもあらかじめ設定しているため、ストアのイメージをより多彩に表現できるようになりました。この「テーマ」を通して、より多くのお客様にWebフォントを利用していただけるようになりました。

「ストアを開けば売れる」という状態を生み出していきたい

売上がきちんと立ってるストアさんは、基本的なことを地道にされている方が多い傾向にある印象です。リアル店舗と同じなんですよ。

人気のストアさんは、SNSでの情報発信の頻度が高かったり、ストア上でも季節ごとに並べる商品を細かく変えていたり、基本的なことをきっちりやっていらっしゃることで結果的にストアのファンが増え、売り上げに繫がっていらっしゃいます。

今後のSTORES.jp全体の理想形で言うと、ストアを開けば売れる、というサービスにしたいと思っています。オーナーの方が自分でプロモーションを頑張らなくても、売れるシステムにしたいんです。

できるだけ売上の上がるストアさんが増えるように、今後もSTORES.jp独自の形を追求していきたいですね。(了)

▼この記事を読んだ人へのオススメ記事はこちら

  • -
  • このエントリーをはてなブックマークに追加
    -
  • tweet