connpass

SNS・webサービス

製品・商品・サービス

http://connpass.com/

connpassのwebサービスサイト。人をつなぐIT勉強会・イベント支援を提供している。ソースコードを見ると、会社ロゴのコメントなどの遊び心もあり。

schoo

SNS・webサービス

製品・商品・サービス

https://schoo.jp/

schooのwebサービスサイト。SNSアカウントの登録が可能で、動画による授業が受講できる。一方的な授業進行でなく、若い女性などを学生代表として据えて対談形式の授業をすることで、視聴者に飽きさせない工夫をしている。

doorkeeper

SNS・webサービス

製品・商品・サービス

https://manage.doorkeeper.jp/

doorkeeperのwebサービスサイト。イベント主催者がイベント開催を通じてコミュニティを築くためのプラットフォーム。シンプルで効果的な画面設計。

peatix

SNS・webサービス

製品・商品・サービス

http://peatix.com/

peatixのwebサービスサイト。ユーザーは、イベントの掲載および応募ができる。SNSアカウントのログイン機能、paypalによる決済機能なども搭載されている。イベントの種類はwebに限らず、多岐にわたる。

COMPEDIA

SNS・webサービス

製品・商品・サービス

http://compedia.jp/

クリエイターのためのコンテスト・コンペ情報をまとめた、ポータル配信サイト。ユーザーは、コンテスト情報の掲載および応募ができる。無駄なデザインがなく、情報がとても分かりやすい。

ATND

SNS・webサービス

製品・商品・サービス

https://atnd.org/

ATNDのwebサービスサイト。イベントの告知・運営管理ができて、参加者はSNSアカウントで気軽に利用可能。

dots.

SNS・webサービス

製品・商品・サービス

http://eventdots.jp/

dots.のwebサービスサイト。エンジニアのための勉強会・イベント情報を検索できる。FB,TW,G+などのSNSアカウントでログイン可能。技術資料のスライドショーなども公開しており、とても役立つサイト。

wechat

SNS・webサービス

製品・商品・サービス

http://www.wechat.com/ja/

wechatのwebサービスサイト。中国で流行している、LINEと同じようなサービス。ウェブサイトは一枚絵を貼っているだけで、アプリのダウンロードページなど関連リンクへのサテライトとして作成されている。

chatwork

SNS・webサービス

製品・商品・サービス

http://www.chatwork.com/ja/

chatworkのwebサービスサイト。業務の効率化と会社の成長を目的とした、メール・電話・会議に代わるコミュニケーションツール。ワイド設計で、サービスをシンプルに分かりやすく伝えている。

airbnb

SNS・webサービス

製品・商品・サービス

https://www.airbnb.jp/

Airbnbのwebサービスサイト。ユーザーは、本サービスに登録してある世界中のシェアハウスを検索・利用できるし、自身の持ち家をシェアハウスとして登録もできる。フラット・レスポン。少ない情報量で効果的な伝達を果たすレイアウト設計。

攻殻機動隊 Information Site

ニュース・ポータル

映画・ビデオ・テレビ

https://www.bandaivisual.co.jp/koukaku-special/

攻殻機動隊のインフォメーションサイト。メインコラムをぶち抜いて、壁紙背景のキャラクター素子を主張。簡易な作りの中で、攻殻機動隊の電子的な空間を演出している。

GARO PROJECT

LP・プロモ・ブランド

映画・ビデオ・テレビ

https://garo-project.jp/

特撮作品・牙狼(GARO)の公式ポータルサイト。パララックスにより、上部ナビから左袖ナビへのレイアウト変更をしており、余ったスペースにキャラクタービジュアルを設置。作品の世界観を存分に盛り込んだデザインになっているだけでなく、配信情報も見やすく分かりやすい。。

株式会社カトリデザイン事務所

公式・コーポレート

web制作

http://katori.me/index.html

株式会社カトリデザイン事務所のウェブサイト。左袖ナビゲーションのシンプルな造り。代表の写真があることで、親身な付き合いをしてくれそうなイメージを与えてくれる。

株式会社ジオコード

公式・コーポレート

web制作

http://www.hp-maker.net/

株式会社ジオコードのウェブサイト。左袖ナビゲーションタイプ。記事コンテンツをサムネイル表示しており、アニメーションをつけて視線を惹かせている。右側のスペースで会社の目的を強く訴求している。

W3G合同会社

公式・コーポレート

web制作

https://w3g.jp/

W3G合同会社のウェブサイト。ワイドのレスポンシブ設計で、ベーシックなタイプ。製作実績において、上品さの表現に長けている。高級なサービスを取り扱う時に、参考にしたい。

1minus1

公式・コーポレート

web制作

http://1minus1.com/

英国のウェブ制作会社1minus1のウェブサイト。レスポンシブ設計・カラフルなフラットデザイン・適度なパララックスを適用したワイド設計のページ。必要最低限のテキストで、ビジュアルによる強い訴求力を発揮。海外チックなサイト作成の際、ぜひ参考にしたい。

株式会社LIG

公式・コーポレート

web制作

http://liginc.co.jp/

株式会社LIGのウェブサイト。言わずともしれたオウンドメディアの金字塔。まずパッと目立つのはバズコンテンツなのだが、その裏で、じつはユーザーの導線設計が極めて綿密。ニュースサイトなど、情報発信系のウェブサイト制作の際には、事前に必ずチェックしておきたい。

株式会社グッドパッチ

公式・コーポレート

web制作

http://goodpatch.com/jp

株式会社グッドパッチのウェブサイト。UI設計を主力としており、ワイド設計に、適度なパララックスと効果的なvideoを用い、モダンかつ分かりやすい表現に仕上げている。ワイドなレスポンサイトの情報設計する際には、必ずチェックしておきたい。

株式会社プラルト

公式・コーポレート

web制作

http://www.prartweb.com/

株式会社プラルトのウェブサイト。昔ながらのオーソドックスなデザインで、とにかくシンプルで見やすい。情報設計をする上の基本として参考にしたい。

株式会社フォーデジットデザイン

公式・コーポレート

web制作

http://4dd.jp/

株式会社フォーデジットデザインのウェブサイト。レスポンシブ設計のお手本のようなサイト。情報設計として、コンテンツページの訴求力にも強く優れる。自社ブログも掲載しており、これから会社のウェブサイトを作成する人は、ぜひ参考にしたい。

株式会社Gear8

公式・コーポレート

web制作

http://gggggggg.jp/

株式会社Gear8のウェブサイト。ワイドデザインの情報設計に優れる。動物と絡めたブランディングが絶妙。写真・テキストの使い方など、ぜひ参考にしたい。

株式会社 BIRDMAN®

公式・コーポレート

web制作

http://www.birdman.ne.jp/

株式会社BIRDMANのウェブサイト。HTML5のvideoとjsでグリグリと円滑に動くグラフィック・ムービー主体の造り。web業界においてデジタルプロモーションの最先端をいく。狭いスマホ画面においても高いブランド性を保つ。ぜひ参考にさせて頂きたいサイト。

株式会社ネットフォレスト

公式・コーポレート

web制作

https://www.netforest.ad.jp/

株式会社ネットフォレストのウェブサイト。videoを活用したビジュアルテイストのリッチなデザイン。製作実績を見てもゴージャス・高級感なデザインが多く、ブランディングなどを手がける人は、ぜひ参考にしたい。

株式会社オガワスプリング

公式・コーポレート

工業・製造メーカー

http://ogawaspring.co.jp/

株式会社オガワスプリングのウェブサイト。自社製品のバネの画像・説明を中心にシンプルな構成をしており、とても伝わりやすい。予算の限られた中で、参考になる。

日立製作所

公式・コーポレート

工業・製造メーカー

http://www.hitachi.co.jp/

日立製作所のウェブサイト。HTML5のレスポンシブ対応。メインビジュアルにvideoタグによるムービーを据えているなど、他のメーカーに比べ、今風のデザインになっている。

Galaxy サムスン電子

公式・コーポレート

工業・製造メーカー

http://www.samsung.com/jp/home/

製品のGalaxyに特化した、サムスン電子ジャパンの公式サイト。主力製品を入り口にした、効果的な手法。

ソニー株式会社 ポータルサイト

公式・コーポレート

工業・製造メーカー

http://www.sony.co.jp/

ソニー株式会社の公式サイト。製品・事業・グループ会社などの情報を総括する自社ポータルサイト。会社規模が大きくなった時の対応策として、参考になる。

日本IBM

公式・コーポレート

工業・製造メーカー

http://www.ibm.com/jp-ja/

日本IBMのウェブサイト。幅100%ワイド設計で、レスポンシブ。グローバルナビはメガナビゲーションになっており、また全体のデザインもシンプルで見やすい。

株式会社キーエンス

公式・コーポレート

工業・製造メーカー

http://www.keyence.co.jp/

株式会社キーエンスのウェブサイト。優れた情報設計のおかげで、数多くの情報をうまく処理しており、とても見やすく分かりやすい。ユーザビリティ・機能美を優先したデザイン。

トヨタ自動車株式会社 公式企業サイト

公式・コーポレート

工業・製造メーカー

http://www.toyota.co.jp/

レスポンシブ設計の見本のようなサイト。左袖ナビゲーションを使い、メインビジュアルによる訴求力をうまく強めている。