ユーザー エンゲージメントとソーシャル共有に依存するオンライン マーケットプレイスを管理している場合、ユーザー生成コンテンツと画像 (UGC/UGI) は最も価値のある資産の一部です。 Yelp のようなレビュー サイトでは、ユーザーは写真を通じてレストランの質を絶賛したり、嘆いたりできます。旅行サイトは、所有者が美しい写真やビデオで訪問者を引き付けるのに役立ちます。最後に、  のような写真共有サイトは、写真家が独自の感性を披露し、露出を増やすのに役立ちます。 Unsplash ただし、UGI は取り扱いが難しく、間違った場合のペナルティが大きくなる可能性があります。この記事では、UGI をプログラムで処理する方法を紹介します。これにより、信頼を構築し、ユーザー エクスペリエンスを向上させ、ワークフローを簡素化できます。 ユーザー生成コンテンツのメリット ユーザー生成コンテンツ、特に画像や動画は、増え続けるユーザー ベースを構築するのに最適です。サイトやアプリで健全なエコシステムを構築する場合、次の 3 つの方法で UGI の力を活用できます。 友人、隣人、仲間、同僚は、マーケティング メッセージを信頼するよりも、お互いを信頼しています。 Stackla による最近の調査では、消費者の 60% が家族や友人からのアドバイスに基づいて購入を決定していることがわかりました。接続が本物である場合、より多くの信頼があります。 信頼: 人々の好みや好みはそれぞれ異なります。個性が強まる世界では、ユーザーはパーソナライゼーションを求めています。ユーザー生成コンテンツは、ニッチな視聴者にリーチし、そのニーズに応える優れた方法です。 パーソナライゼーション: さらに、ユーザーから画像を取得することは、コンテンツを生成するためのより実用的で費用対効果の高い方法であることが多く、特にオンライン マーケットプレイスの場合はそうです。 費用対効果: ユーザーが作成した画像を処理する際の注意事項 UGC を使用している場合、毎日何百万とは言わないまでも、何千もの UGI を扱っている可能性があります。画像は、経験の浅いインフルエンサー、ベテランの写真家、またはその中間の人物によるものです。その結果、これらの画像の形式、サイズ、品質は非常に多岐にわたる可能性があります。 一方、コンテンツを消費するサイト訪問者は、次のような最高のエクスペリエンスを期待しています。 高速な画像の読み込みとページ速度 レスポンシブデザインとデバイス適応性 標準化されたフォーマットと構成 ブランドセーフティとコンテンツモデレーション ユーザーの期待と UGI 処理の課題との間のギャップを埋めることは困難な場合があります。そして、これらすべてのニーズを解決する単純なソリューションを見つけることは、ほぼ不可能に思えるかもしれません。ただし、費用対効果が高く、信頼性が高く、スケーラブルなソリューションがあります。この記事の残りの部分では、それらが何であるか、およびそれらをいかに簡単に展開できるかを正確に示します。  1. 高速読み込みとページ速度の最適化 画像や動画、特にユーザーが作成したものは、多くの場合、Web ページで最大のファイルであり、ページの速度が遅くなります。 SEO がビジネスにとって重要である場合は、画像の最適化と圧縮を試みる必要があります。これにより、ページの速度、   、ひいては検索結果が向上します。 Imgix を使用すると、3 つの一般的な手法を組み合わせて、画像ファイルのサイズを縮小し、ページの速度を上げることができます。 Core Web Vitals   AVIF や WebP などの次世代形式で画像を提供する 画像のサイズを適切に変更する Imgix にベストエフォート圧縮を適用させる 以下の例では、元の画像のファイル サイズは 3.3 MB です。最適化された画像は、同じように見えますが、ファイルサイズはわずか 215kB で、元の画像より 93% 小さくなっています。これにより、読み込み速度が大幅に向上します。これは、URL クエリ文字列として  3 つの単純な変換を使用することによって実現されます。 fm=webp&auto=compress&w=2000   元の画像 - 3.3MB    .リンクをクリックすると、サイズが縮小されます。 最適化された画像 - 215kB    2.レスポンシブデザイン デバイスとブラウザーが急増する中、1 つのイメージ バージョンに依存して、さまざまな環境に適応し、それぞれの環境で見栄えを良くすることはできません。逆に、さまざまな次元の派生ファイルを手動で生成するのは、労力がかかり、ほとんど拡張できません。 幸いなことに、  属性は、利用可能なオプションに基づいて最適な画像サイズを特定するようブラウザに指示することで、その必要性を軽減します。さらに、アートディレクションには Imgix と 要素を使用できます。 <srcset> <picture> 解像度切り替え用ソースセット   <picture> アートディレクション用 3. ビジュアルの品質と構成を標準化する ほとんどのユーザー生成画像は専門的に作成されたものではありません。多くの場合、それらは明るすぎたり、暗すぎたり、単に互いに一貫性がありません。視覚的な品質とまとまりを向上させるには、標準的な画像拡張セットを検討する必要があります。また、1 日に数千件以上の UGI を処理している場合、自動化によって大幅な時間を節約できます。    — RGB チャンネル全体のハイライト、ミッドトーン、およびシャドウの分布を調整することで、画像をより鮮やかにします auto=true  — 赤目除去を提供します auto=redeye 顔のピントとフレーミングも重要です。ニュースの主題の表情は、ズームインして適切にトリミングすれば、どんな言葉よりもニュアンスのあるストーリーを伝えることができます.また、ユーザーからの製品レビューをホストする場合、ユーザー アバターは信頼性と信頼性を高めます。いくつかの Imgix API パラメータにより、顔の検出、フレーミング、トリミングが簡単になります。    — 画像を中央に配置する面を選択します。特定の面を分離したり、複数の面を含めることができます。以下の例では、  とその他のいくつかのパラメーターを使用して、子供の顔を選択しています。  faceindex faceindex=2    — 顔の周りのパディングの量を定義します。以下の例では、他のいくつかのパラメーターとともに、  を使用してモデルの顔にズームインします。  facepad facepad=1    — 画像にマスクを設定します。以下の例では、他のいくつかのパラメータとともに、  を使用してモデルの顔の周りに円形のマスクを配置しています。  mask mask=ellipse 注意点として、Imgix は顔情報を保存したり、写真の個人を特定したりしません。すべての検出はオンザフライで行われ、EU データ保護規制に準拠しています。  4. コンテンツの監視とモデレーション UGI では、コンテンツの安全性も重要な考慮事項です。 Imgix  潜在的に暴力的、成人向け、またはその他の疑わしいコンテンツを自動的に検出するのに役立ちます。コンテンツ アラートを使用すると、ユーザーが生成した画像をすばやく簡単に整理でき、コンテンツのモデレートをより効果的に自動化できます。  Asset Manager は、 ユーザー生成の画像処理を開始する ユーザー生成コンテンツの量、種類、複雑さが増すにつれて、あなたとあなたのチームの負担が増大する可能性があります。 Imgix は、訪問者に最高のビジュアル エクスペリエンスを提供し、ページのパフォーマンスを向上させ、開発者やデザイナーの余分な作業を排除できるように構築されています。 こちらにも掲載。 この記事で示されていることは、Imgix が提供するものの表面をなぞっただけです。次のリソースをチェックして、Imgix がビジュアル メディアのニーズにどのように役立つかを確認してください。 一般的な UGI 変換について学ぶ 無料の imgix アカウントを作成する これらのケース スタディを読んで、お客様が UGI をどのように使用しているかを確認してください。 イベントブライト ペクセル 不動産ワイヤー (REW)

Sign Up for Free

Get A Demo

Read the Docs

Visit Website

このオーディオは、ストーリーの元の言語で制作されています。

信頼性、パーソナライゼーション、および効率性のために UGI を動的に処理する

About Author

コメント

ラベル

この記事は

Related Stories

HackerNoon Coded: HackerNoonが最も活発に活動している上位10カ国

タップして稼ぐ：テレグラムはソラナより先に次の100億人の暗号通貨ユーザーを獲得する可能性がある

ユーザー中心の暗号通貨製品の作成: 顧客からのフィードバックの重要性

18 種類の開発者ツールで生産性を向上しましょう 🚀🔥

HackerNoon Coded: HackerNoonが最も活発に活動している上位10カ国

タップして稼ぐ：テレグラムはソラナより先に次の100億人の暗号通貨ユーザーを獲得する可能性がある

ユーザー中心の暗号通貨製品の作成: 顧客からのフィードバックの重要性

18 種類の開発者ツールで生産性を向上しましょう 🚀🔥

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps