ケーススタディ: テンセントの再設計は美しい始まり

情報環境の変化により、テンセントはポータル、ブログ、ビデオ、モバイルを接続する設計を改訂し、自社の高品質なリソースを深く統合するようになりました。改訂されたインターフェースは明確かつシンプルで、デザインは滑らかで、美しいインターフェースは非常に珍しいものです。

Tencent のウェブサイト アドレス: www.qq.com。ニュース ポータルにこのようなインターフェイスがあるとは思いませんでした。おそらく誰もが私ほど深く理解できるわけではないでしょう。それを設計した人なら、それがどれほど難しいか知っているはずです。

テンセントはなぜバージョンを変更したのでしょうか?

Facebook、Youtube、Twitter、モバイルアプリケーションが急速に発展している一方で、ニュースポータルの元祖であるYahooは衰退している。 12 年前、ポータルは包括的で豊富な情報ディレクトリを提供することに誇りを持っていました。今日では、人々は情報を入手するための入り口として、ソーシャル ネットワーク、ソーシャル メディア、ビデオ、モバイル インターネットを使用する傾向が高まっています。 Tencent.comの編集長である陳菊紅氏は、「プラットフォームが最初の入り口ではなくなったとき、私たちのコンテンツが深く展開する時が来たことを認識し、テンセントが所有するTencent Weibo、Tencent Video、Tencent.comを深く統合して、より大きなエネルギーを放出するべきだ」と強調した。

Weibo、ソーシャルメディア。驚異的なスピード、膨大な断片化されたデータ、そして極めて高いユーザーエンゲージメントと普及力を備えています。 Weibo は、多くの著名人が世界中のあらゆる分野の視聴者やメディアとコミュニケーションをとるためのポータルであり、メディア報道にとって重要な情報源です。さまざまな詳細が微博上で沸点となり、ウーロン事件は「楽しく」沸き起こり続け、世論のホットスポットは際限なく動揺した。

ロンドン五輪が巻き起こした「世界メディア戦争」において、微博は無視できない新興勢力となっている。易思玲の勝利は60秒以内に数千万回転送され、孫楊の微博投稿は常に無限のYYを集め、劉翔が倒れたときは、一般の人々からの膨大な量の微博投稿が新浪のサーバーをクラッシュさせた。地球上の10人に1人が、Weibo、Twitter、Facebookを通じてオリンピックを視聴しました。国際オリンピック委員会は、ロンドンオリンピックが史上最もソーシャルなオリンピックであったと公式に発表しました。 Weiboは時間と空間の壁を打ち破り、「インスタントプッシュ」を利用して「時間差ゼロ」と「距離ゼロ」の現実の光景をもたらすこともできる。筆者は、Weibo が今日のニュース業界にとって非常に重要であると深く感じています。Weibo は Sina 上で登場し、Sina Weibo のトラフィックは Sina ポータルのトラフィックを上回っています。 Baidu でニュースを検索すると、最新の Weibo の結果がページの下部に表示されます。

情報技術の継続的な発展により、ビデオは間違いなく最も有望なメディア形式となっています。情報伝達の観点から見ると、ビデオは豊富な情報をシンプルかつ鮮明に、直接的に提示することができ、テキストや画像にはない利点があります。リアルタイムの報道のためには、テレビは特定の時間帯に放送されるようにスケジュール設定する必要がありますが、無線によるライブ放送はより即時性と臨場感に優れています。人々はますますテレビから離れ、いつでもどこでも視聴できる膨大なリソースを提供するオンライン ビデオへと移行しています。

iResearch のレポートによると、2012 年にオンライン ビデオは、ユーザーの間で 1 日あたりの平均使用時間が最も長いインターネット アプリケーションになりました。これは中国で最大のアプリケーションであり、そのユーザー ベースは今も拡大し続けています。 Tencent Video の月間ユーザーカバー率は Youku に次ぐ第 2 位であり、現在最も大きな発展の可能性を秘めています。今後、各動画サイトはコンテンツ、サービス、プラットフォームへの投資をさらに強化し、オンライン動画は再び発展のピークを迎えることになるかもしれない。

モバイルインターネットは未来です。未来はここにあります。短期間のうちに、BlackBerry と Nokia はハイエンドから人気が落ち、Apple と Android が人々の注目を集め、クラスメイトの大半がスマートフォンを持ち歩いていたようです。モバイルインターネットは驚くべきスピードで普及しています。 CNNICの最新データによると、今年6月末時点でモバイルインターネット利用者数は3億8800万人に達し、初めてPCを上回り、モバイルが最大のインターネット端末となった。蔡文生氏の話を聞いて、彼がもはや PC インターネット プロジェクトに投資しておらず、モバイル インターネット プロジェクトにのみ投資しており、「PC は死んだ」とさえ言っていることに気付きました。彼の言葉は単なる参考ですが、今がモバイルインターネットの爆発的な発展の時期であることがわかります。多くの重要なアプリケーションには「モバイル版」という言葉が付けられています。将来のポータルの主な戦場はモバイルインターネットになります。

オリンピックでは…

テンセントはオリンピック前に緊密な統合を完了しました。統合の即時的な効果を見てみましょう。 Tencent.comの最前線にある「ロンドンオリンピック」欄では、動画とミニブログがオリンピックを支配している。テンセントのオリンピックページ（2012.qq.com）では、ほとんどの報道がマイクロブログとビデオで行われています。オリンピック報道にはWeiboと動画が欠かせない役割を果たしており、両者を統合する必要があると考えています。

テンセントはすでにあらゆる面で強い。同社のWeiboは急速に発展し、Sinaに次ぐ地位にあり、同社のビデオはYoukuに次ぐ地位にあり、同社のワイヤレスWeChatは非常に人気があり、同社のポータルは改訂前にも高い順位にあった。統合後、テンセントの総合的な優位性はより顕著になるでしょう。さらに、テンセントは人材、物的資源、時間の面で十分な準備を整えており、国際社会はテンセントのオリンピック報道能力に驚嘆している。

7月3日早朝、常に厳格な姿勢を貫いてきたテンセントは、「次世代のテンセント」を創るというスローガンを掲げ、「テンセント・ドットコム創立以来最大の改訂と調整」を終えた。

では、古いバージョンと新しいバージョンの違いは何でしょうか?

修正者が私たちに知らせたい変更点を確認するには、上部の「新バージョンの紹介」をクリックしてください。

ワンクリックログイン:

ワンクリックでWeiboスペースのメールボックスの友達にログインします。ログイン後、ユーザーはいくつかのパーソナライズされた設定を実装できます。さらに、ログインIDに基づいて関連データを収集し、データを分析した上でインテリジェントな情報プッシュを実現できます。このサービスを望むかどうかはユーザー次第であることを明確にすべきだと強く主張する人もいた。ユーザーのプライバシーに関わるこの問題で、Google は訴えられている。作者は「好きでしょうね」のような言葉を見るのは不快ではないと感じています。検索エンジンは、膨大な量の情報の中から私たちが求めているものを見つけることができるため、私たちがオンラインになったときに最初に訪れる場所になることがあります。たとえ広告であっても、必要なものであれば、喜んで受け入れるでしょう。スマートプッシュ通知には将来性があると思います。

人々は見るのが大好きです:

このセクションでは、過去数時間で人気だったマイクロブログを集めています。このモジュールの上には、Tencent サービス モジュールがあります。サービス モジュールは非常に高いステータスを持っています。以前のバージョンでは、最も目立つ位置にありました ^o^。 「みんなが見たい」リストをよく見てみると、クリックしたくなるものがかなりあることに気がつきました。マウスを合わせると写真とテキストの概要が表示され、直接放送やコメントをすることができます。マウスをタイトルの上に動かしたときの滑らかな質感、左上隅の小さな点、そして小さな点によって生じる細いグラデーションが気に入っています。

しかし、私はWeiboのコラムのタイトル「みんな大好き」が好きではありません！多くの場合、「みんな大好き」の4つの大きな文字のすぐ下に表示されているのは、自然災害、人災、または悲しいことや恨み深いことです。誰もがそのような不幸を「見るのが好き」で、愛されれば愛されるほど良いのでしょうか? もちろん違います。「愛」はコラムのタイトルでよく使われる言葉に過ぎません。それとも、それは私の個人的な偏執症なのかもしれません。いつも少しぎこちなく、居心地が悪いと感じています。名前を変えて、「みんなが見ている」「微博ホットディスカッション」「ホットスポットフォーカス」「ホットスポットロール」など...もっと人道的ですが、他にも使える名前はたくさんありますよね！

オプションのストック、映画とテレビのパーソナルセンター、読書のパーソナルセンター:

「財務」欄の「お気に入りの株」、「読書」欄の「映画とテレビの大ヒット作」、「パーソナルセンター」をそれぞれクリックすると、ユーザーの個人ページに移動します。また、選択した銘柄の上部には「モバイル版」と表示されます。これまで、ポータルはユーザーに一方的に情報を提供するのみでしたが、現在では、ユーザーの参加レベルが高まり、一方的なやり取りが期待されるようになっています。フレンド機能はなく、ユーザー同士のコミュニティ交流ではありませんが、今は比較的シンプルで、今後さらに増えていくと思います。

テンセントビデオ

3 つのページを比較すると、Tencent Video のインターフェースが最も美しいことが簡単にわかります。デザインは若々しい傾向があり、ユーザー層が若いことがわかります。私はテンセントでパターンを見つけました。よくデザインされたページは、製品が真剣に受け止められ、その操作に多くの労力が費やされていることを示しています。一方、一部の製品は時代遅れで、インターフェースにまったくデザインがなく、一般的にそれほど労力が注がれていません。そうですね、人手が足りない、最初にすべての機能を完了する必要がある、製品を開発する前に運用を行う、など、さまざまな理由が考えられます。

しかし、一連の美しいインターフェースは、この製品が真剣に扱われていることを示しています。比較すると、読書セクションのパーソナル センターのインターフェイスは、ビデオ セクションのパーソナル センターのインターフェイスほど魅力的ではないというのは本当ですか。異なる扱いとはどういう意味ですか。現在、テンセントビデオは人気映画やテレビドラマコンテンツの90％以上をカバーしています。また、テンセントビデオはユーザー生成コンテンツを受け入れると同時に、映画会社やテレビ局と協力して番組を制作し、独自のディレクターを育成し、独自の「テンセント制作」コンテンツを出力しています。ここでこれらのプレーヤーの存在が目立つのを見ると、Tencent Video が 2011 年 4 月に市場に参入して以来急速に成長してきた理由がおわかりいただけるかもしれません。

先ほど、ポータルの発展のためには、ポータルをWeiboと動画と統合する必要があると述べられました。現在、テンセントはWeiboと動画にかなりの投資をしていることがわかります。Weiboと動画の発展のためには、Weiboと動画をポータルと統合する必要があります。

インタフェース

改訂後、外部から高い評価を受けた。他の要素とは別に、美しいインターフェースは、まず第一に製品がユーザーに受け入れられるのに役立つことが多いと思います。次に、インターフェースについてお話しましょう。

欠点

1. 要点が散在している。モジュール内の重要なポイントが十分に区別されていません。

ページ全体の各モジュールの要点は、さまざまなモジュールに散在しています。幸いなことに、エッセンスを選択するという原則に従って、このページは長くありません。各モジュールのタイトルは一貫しており、重要なポイントが明確に区別されていません。一目見ただけでは、重要なポイントがあまりわかりません。タイトルを注意深く読んで、重要なポイントを見つけなければなりません。ざっと目を通すことが日常となり、中学校の教室でそれらの単語を注意深く読む感覚をとうに忘れていました。多くの場合、私たちはニュースリストの一部を真剣に受け止めず、時にはニュースがそれ自体で私たちの目に飛び込んでくることもあります。このページは非常に洗練されていますが、リストは整然と一貫して並んでおり、強調がうまく表現されていません。

Baidu の「リアルタイム ホットスポット」はなかなか良いです。あらゆるカテゴリのニュースをリアルタイムで表示します。ニュースを気にしない人でも、見かけたらクリックしたくなるでしょう。

提案：「重要なニュース」の魅力を高め、より速いスピードで更新し、ここにあらゆる重要なポイントを集めます。重要なポイントを強調したい場合は、デザインを少し犠牲にして、タイトルを他の目を引く色でマークすることができます。

2. クリックされたリンクは区別されない

クリックされたリンクとクリックされなかったリンクの区別はありません。タイトルは整然とした一貫した行に配置されており、どのリンクが閲覧されたかを区別する違いはありません。ユーザーは、きちんとした一貫性のあるリストの山を調べて、今日新しく更新されたものを見つけるべきでしょうか? ユーザーはあなたに何かを返す義務があると思います。

さらに予想外で理解できないのは、すべてのニュース ポータルが同じことをしているということです。ユーザーが Web サイトを開いたときに、クリックしたリンクが画面いっぱいに表示されることを心配しているのでしょうか。どうやら私の更新ペースは遅いようです。もし本当にそうなら、なぜわざわざ真実を隠す必要があるのでしょうか？それに、今日の情報更新のスピードは10年前とは比べものにならないほど速いです。この点を無視することに慣れてしまっていて、変わっていないのでしょうか？

リンクをクリックして区別することには、いくつかの利点があると思います。

リアルタイムの更新を強調表示します。 「わあ、アップデートがあるよ。クリックして見てね！」

クリックされなかったリンクを強調表示します。 「なあ、このリンクは今までクリックしたことがないな。クリックして見てみよう」と、見逃したニュースを見るのに便利です。

クリックされたリンクを強調表示します。 2回目に開いて「あれ？昨日クリックしたトピックが今日どこにあるのか見たいんだけど」と聞くのに便利です。

クリックされたリンクは区別されません。実際、私は個人的にこれについて非常に憤慨しています。例えば、最初は何気なく見て要点を探していたのですが、その日はちょっと時間が空いていたのでもっと読みたいと思いました。読んでいないニュースを探すのは難しく、ニュースを全部読んだという達成感は得られませんでした。将来的には、クリックしていないリンクがはっきり見えたり、更新内容がはっきり見えたりするようになることを期待しています。ニュースの画面をクリックする感覚を試してみます。

提案: ページの変更の影響を軽減することを検討してください。クリックされたリンクを区別するために、薄い灰色に変更することができます。

アドバンテージ

メリットについてお話ししましょう。

1. ゆったりしていて混雑していない

一見すると、緩やかなヘッダーにより、検索ボックスはカジュアルでシンプル、自信に満ち、シックで控えめ、そして非常に快適に見えます。いつもは混雑して複雑なポータルページで、余白を感じるのはとても貴重です。テキストの行間隔は広く、ページの長さは短く、約4200px、SohuとNetEaseは約5000px、SinaとPhoenixは約6000pxです。明らかにコンテンツは洗練されてきましたが、「ポータルには包括的なコンテンツがなければならない」と主張した人々は、この点について楽観的ではありません。作者は、これは単なるホームページだと考えています。その後ろにはさらに多くのリンクがあり、必要なホットなトピックに関する詳細なトピックがあります。さらに、ニュースがある限り、私はそれを隠さず、持っていない限りは公表する方法を常に考えます。

2. 一貫性

このページはシンプルで新鮮、ページの流れはスムーズかつ自然、テキストは明瞭、クリーン、まばらで整然としており、コンテンツ モジュールは見た目に美しいです。滑らかさと明瞭さは、主にページ デザインの強い一貫性によるものです。ページの古いバージョンと比較すると、タイトルの行間隔は 12 ピクセルから 14 ピクセルまでさまざまですが、新しいバージョンのページでは行間隔が 14 ピクセルで均一になっています。各モジュールのコンテンツ表示構造は、一般的に似ています。モジュール間の境界線は上から下まで統一されたスタイルで、外観も似ています。

ページの古いバージョンを確認してください: http://www.infomall.cn/cgi-bin/arcv-nohead/20100913/http://www.qq.com/

3. ボックスの代わりに線を使う

コンテンツの分割はボックスから線へと移行しました。フレームには抑制感がありながら、ラインは明快でシンプルなので、より軽やかで自由な感じがします。ボックスは分離感が強いため、ボックスが多すぎると、ページの内容が複雑すぎると感じられます。コンテンツを線で区切ると分離感が軽減され、ページ全体の統合性が高まり、自然でスムーズで統一感のあるページになります。

4. ページ区切り感を軽減するディテール

テンセントサービスの旧バージョンでは、青いテキストリストは左側にありました。しかし、新バージョンではそれを直接行わず、右側に移動しました。分類テキストを右側に配置するデザインはほとんどなく、通常は左側に配置されます。デザイナーが多大な努力を払ったことがわかります。左に配置すると、全体から見るとページが青い線で区切られているように感じられ、分離感が強まり、統一感が弱まります。デザイナーの努力が本当に気に入りました。

5. 色の使い方

使用されている色はきれいで、濁りがなく、透明感を保っています。このページで使用されている色はとても気に入っています。文字は明瞭で、ページ全体に濁った部分はありません。元のやや濃いグラデーションと丸い角を削除し、以前の濁った背景を放棄するか、明るく自然で純粋な背景を使用します。旧バージョンと比べると、埃が拭き取られたような感じがします。 Sina、NetEase、Sohuと比較すると、この色使いは非常に文学的で新鮮です。テンセントのユーザーの多くは比較的若い世代であるという長年の言い伝えは、私も少しは理解できます。しかし、それに比べると、Tencent Video や QQ Music のインターフェースは可愛くて若々しいです。

新バージョンと旧バージョンのカラーマッチングは以下のとおりです。

6. 広告

正直に言うと、広告はページの雰囲気に大きく影響します。広告はきちんと配置されており、写真の質も高いです。文字で埋め尽くされたページにも、軽快で生き生きとした印象を与える写真が必要です。広告はたくさんあるが、どれも粗悪なものではない。色彩豊かで、騒々しく、無秩序で、デザインは考慮されていない。広告とデザインは一体となり、デザイナーは消えることのない貢献を果たしてきた。 Tencent (2012.qq.com)、Sina (2012.sina.com.cn)、Sohu (2012.sohu.com)、NetEase (2012.163.com) のオリンピックページをそれぞれ開きます。テンセントの広告はナイキとコカコーラです。 Sinaは、フットボールスクールの広告です。 Sohu は Jianxin Fund、NetEase は Jiaduobao です。品質、ブランド、これ以上言う必要はないと思います。 4年後には誰がオリンピックで活躍しているのか分からないので、急に勇ましさと悲しさを感じます。

7. 雰囲気

私はただこのページがとても美しいと思うだけです。実際、その美しさの中には壮大さが隠されています。 Sina、Sohu、NetEase のページ幅は依然として約 960 ピクセル、970 ピクセル、980 ピクセルで、フォント サイズは 12 ピクセルです。 Tencentのページ幅は約1000pxで、フォントサイズはすべて14px以上です。

Google のミニマリスト スタイル、Apple の光に敏感なスタイル、メトロ タブレット、最近人気のフレッシュ スタイルなどがこのページに少しずつ表示されています。しかし、実はそれ以上に、それはデザイナー自身の超越なのです。このページがとても気に入りました。初めて見たとき、衝撃を受け、言葉の無力さを感じました。

彼女は使命を持ってやって来ました。完全に成功することはできなかったかもしれませんが、目標に近づいていました。テンセントはすでに他のポータルをリードしており、そのポータルも必ず改訂されるでしょう。どのような変化が起こるのか楽しみです。インターネットでは最初から正しいことをする必要はない、重要なのは繰り返しの間に継続的に修正を加えることだ、という人もいます。これはまだ始まりに過ぎず、未来を待っています。

原題: ケース分析: テンセントのウェブサイト再設計の美しいスタート

キーワード: ケース分析、テンセント、ウェブサイトの改訂、美しい、開始、情報グリッド、変更、プロンプト、ウェブマスター、ウェブサイト、ウェブサイトのプロモーション、収益化