WEBデザインの参考に、マーケティングデザインサーチエンジンの「Crayon」が便利

サイバーマンデー
Amazonプライム会員限定の大セール「サイバーマンデー」開催中!プライム会員限定の大セール

先日、Crayon(クレヨン)という、WEBサイトデザインの検索エンジンを見つけました。

これが、新しいサイトデザインを構想中の時に、いろいろと参考になりそうなものを、効率よく探せそうだったので紹介です。

スポンサーリンク
レクタングル(大)広告

Crayonとは

Marketing Design Search Engine - Crayon

Marketing Design Search Engine | Crayon

Crayonとは、WEB上で最も広く検索できるマーケティングデザインサーチエンジンです。(少なくともサイトにはそう書いてある。)

Crayonは、マーケターが新しいサイトを構築する時に、新しいインスピレーションを得るための、アイディア検索ツールといってもいいかもしれません。現在、1300万以上のページが登録されています。

1300万以上のページ

検索エンジンなのでキーワードを入力して、検索する機能はもちろんあります。(※日本語での検索はできない模様)

ページタイプ、業種、CMS(コンテンツマネジメントシステム)、トラフィック量、デバイスによって、簡単に絞り込めるようになっており、欲しいアイディアを手軽に手に入れられるようになっています。

この記事を書く前に、Crayonをググってみたのですが、日本語での紹介ページは無いようだったので、以下で詳しく使い方などを紹介してみたいと思います。

簡単な使い方

以下では、Crayonの簡単な使い方を紹介します。

検索機能

まずは通常の検索機能です。

例えば、カフェのページを参考にしたいときに、サーチボックスに「cafe」と入力し、プルダウンメニューから検索を選択します。

カフェを検索

すると、1300万以上の登録ページの中から、結果が表示されます。

カフェで検索

検索結果の画像をクリックすると、個別ページに飛ぶことができ、そのデザインが画面いっぱいに表示され、細かい部分まで見ることができます。

The Home Page on balboacafe.com.

もちろん、そのデザインのサイトへもリンクから飛ぶことができます。

デザインが気に入ったら、お気に入りにストックしておくこともできます。(※要ユーザー登録)

2015-02-20_12h15_35

メインメニュー

メインメニューから、ページを大まかに絞り込むこともできます。

メインメニュー

デフォルトだと、メインメニューからは、以下の項目の検索結果にアクセスできます。

  • iPhone6
  • ホームページ(Home Pages)
  • ランディングページ(Landing Pages)
  • 料金ページ(Pricing Pages)
  • チームページ(Team Pages)
  • 仕事概要ページ(Jobs Pages)
  • WordPressで作成されたページ(WordPress)
  • Squarespaceで作成されたページ(Squarespace)
  • その他(More)

ちなみに、iPhone(スマホ)向けページの検索結果は以下のようになります。

iPhone6の絞り込み結果

もちろんiPhone向けの検索結果でも、大きな画面でデザインを確認することができます。スクロールして全体のデザインも見ることができます。

The Home Page on mittera.com  built on WordPress  owned by Mittera Group  a company in the Marketing industry.

料金ページ(Pricing Pages)などの、絞り込み結果は以下のようになります。

料金ページで絞り込み

絞り込み機能

絞り込み機能

メインメニューからでもある程度絞り込むことはできるのですが、左サイドにある絞り込み機能を利用すると、細かく絞り込むこともできます。

この機能で、目当ての項目を選択していくだけで、欲しい情報を絞り込むことができ、手軽に探すことができます。

ページタイプ(Page Type)

ページタイプで絞り込み

ページタイプは、下記のなリストの中から、探しているページのタイプを絞り込むことができます。

  1. Home Page
  2. Landing Page
  3. Pricing Page
  4. Team Page
  5. Jobs Page
  6. Trial Page
  7. Press Page
  8. About Page
  9. Services Page
  10. Testimonials Page
  11. Blog
  12. Twitter Page
  13. iOS App Page
  14. Developers Page
  15. Support Page
  16. Case Studies Page
  17. Products Page
  18. Contact Page
  19. Login Page
  20. Signup Page
  21. Facebook Page
  22. YouTube Page
  23. Android App Page
  24. Pinterest Page
  25. Hours Page
  26. Maps & Directions Page
  27. LinkedIn Page
  28. Instagram Page
  29. Google Plus Page
  30. Flickr Page
  31. FAQ Page
  32. Menu Page
  33. Locations Page
  34. Tumblr Page
  35. Terms Page
  36. Privacy Page
  37. Site Map Page

トライアル、ログイン、製品、Twitter、Facebook、YouTube、プライバシー、サイトマップに至るまで、30以上のページタイプから絞り込むことができます。

業種(Industry)

業種で絞り込み

業種は、40種類の中から選ぶことができます。

  1. B2B Services
  2. Software
  3. Consumer Goods
  4. Marketing
  5. Venture Capital & Private Equity
  6. Automotive
  7. Aviation & Aerospace
  8. B2B Goods
  9. Biotech
  10. Construction
  11. Consumer Services
  12. Design
  13. Digital Games
  14. eCommerce
  15. Education
  16. Energy
  17. Entertainment & Lifestyle
  18. Environment
  19. Fashion
  20. Finance
  21. Food & Beverage
  22. Gambling & Casinos
  23. Government & Military
  24. Hardware
  25. Healthcare & Medical
  26. Hospitality
  27. Internet
  28. Legal
  29. Manufacturing
  30. Media
  31. Non-Profit
  32. Real Estate
  33. Religious
  34. Restaurants
  35. Retail
  36. Retail (High-End)
  37. Sports
  38. Technology
  39. Travel
  40. Other

業種も、ソフトウェア、教育、車、デザイン、エネルギー、ファッション、ファイナンス、食、スポーツ、テクノロジー、他多数などから絞り込むことができます。

コンテンツマネジメントシステム(CMS)

CMSで絞り込み

CMSごとの絞り込みも行えます。

  1. WordPress
  2. Squarespace
  3. Drupal
  4. Weebly
  5. HubSpot
  6. ExpressionEngine
  7. Telerik Sitefinity
  8. Joomla
  9. TYPO3
  10. Wix
  11. Webflow
  12. Tumblr
  13. Moonfruit
  14. Yola
  15. Blogger

トラフィックレベル(Traffic Level)

トラフィックレベルで絞り込み

トラフィックレベルは、Alexaのランキングから以下のように決められているようです。

  • Wicked High(10000位以内)
  • High(10001位~200000位以内)
  • Medium(200001位~750000位以内)
  • Low(750001位以上)

これらの中から、大まかなアクセス数ごとに絞り込みを行うことができます。

デバイス(Device)

デバイスで絞り込み

あとは、デバイスでの絞り込みです。

今のところは、iPhone6とDesktopしか選択項目はありません。

  • iPhone 6
  • Desktop

絞り込みテスト

例えば、WordPressで作成されたソフトウエア会社のiPhone6のホームページを絞り込むと、以下のように表示されます。

Wordpressで作成されたソフトウエア会社のiPhone6のホームページ

まとめ

Crayonでは、こんな感じで、アイディアを得たいページのデザインなどに素早くアクセスすることができます。

僕なんかは、初歩のWordpressテーマデザインの参考のみでしか、今のところ利用する能力を持ち合わせていません。それでも、いろいろな部分が参考になります。

ですので、本職のデザイナーさんの場合、様々なサイトを作成しておられるため、よりインスパイアされるアイディアが、詰まっているのではないかと思います。

サイト Marketing Design Search Engine | Crayon