トリミングは ための重要なテクニックです。不要な背景情報を削除したり、画像のアスペクト比を変更したりすると、閲覧者の画像への集中力が大幅に向上します。  、顔検出を含む多くのトリミング方法を提供します。このチュートリアルでは、自動注目点トリミング (   ) と、これを使用して画像の最も顕著な、または重要な側面をトリミングする方法に焦点を当てます。特に、コントラストの高い領域が最も顕著であると考えられます。 画像を改善する imgix は crop=entropy 基本的なエントロピー クロップ 次の画像をトリミングして、画像から大量の静的な黒い背景を削除するとします。   umbrella.jpg?w=640 最初のステップは、  パラメータと パラメータ、および モードを設定することです。これにより、選択した幅と高さの境界を満たすように画像のサイズが変更され、余分な画像データがトリミングされます。 w h fit=crop   fit=crop   幅: w=200 高さ: h=200 フィット: フィット=トリミング umbrella.jpg?w=200&h=200&fit=crop  imgix のデフォルトのトリミングは画像の中心から開始され、指定されたパラメーターの範囲外にあるデータが削除されます。ただし、画像をトリミングするだけでなく、傘を中央に配置する必要もあります。これを行うには、クエリ文字列に を追加して、「中央」が画像の最も顕著な側面になるようにします。傘は画像の他の部分と強くコントラストを成すため、焦点になります。 crop=entropy   fit=crop&crop=entropy   クロップ: クロップ=エントロピー umbrella.jpg?w=200&h=200&fit=crop&crop=entropy 目標は、静的な黒い背景を大量に削除して被写体の中心に置くことでした。この例では、画像の主題は赤い傘であり、  を追加することで、トリミング機能が赤い傘を中心に配置できるようになりました。ただし、画像の被写体は必ずしも無生物であるとは限りません。 crop=entropy 面中心のトリミングの代替手段 次の画像のサイズを変更し、モデルの中央に配置されるように切り抜きたいとします。     womanlandscape.jpg?w=640 画像は三分割法を使用して撮影されており、モデルを中心からずらしたままにして、視覚的に魅力的な画像を実現しています。ただし、Web サイト上の複数の場所で使用するために、画像の小さなスニペットを作成したいとも考えています。   fit=crop     womanlandscape.jpg?w=200&h=200&fit=crop トリミング機能は画像の中心に焦点を合わせており、モデルは中心から外れているため、彼女はスニペットに完全には表示されません。顔検出トリミング機能を使用して、画像を顔の周りの中央に配置できます。   fit=crop&crop=faces     womanlandscape.jpg?w=200&h=200&fit=crop&crop=faces 顔検出クロップ モードは彼女の顔を正常に検出し、画像をその周りの中央に配置しました。ただし、私たちは彼女の服装にも興味がありますが、それは完全にフレーム内に収まっているわけではありません。モデルの膝が部分的に隠れているため、代わりに を追加して、衣装全体がシーンに含まれるようにします。 crop=entropy   fit=crop&crop=entropy     womanlandscape.jpg?w=200&h=200&fit=crop&crop=entropy エントロピー クロップはどのように機能しますか? 顔トリミング モードは顔を探してその中心を中心にトリミングしますが、エントロピー トリミング モードは高コントラストの領域を探してそこに焦点を当てます。   fit=crop     fit=crop   上の図では、画像内のコントラストの高い領域を強調表示するように画像を変更しました。修正されたバージョンでは、画像内の注目点 (この場合はサンショウウオの頭) が示されています。エントロピー クロップ モードでは、画像の静的な色が無視され、代わりに黒と白が交わる領域に焦点が当てられました。サンショウウオの明るい色は、背景に対して高いコントラストを提供します。 以下の例では、エントロピー クロップ モードの高コントラスト領域に焦点を当てる機能により、縦向きか横向きかに関係なく、サンショウウオが画像の被写体として中央に配置されます。同様の方法で画像にハイコントラスト領域があると仮定すると、  を使用して、さまざまなデザインにさまざまなサイズやアスペクト比を適合させることで、画像を自動的にアート ディレクションすることができます。 crop=entropy   fit=crop&crop=entropy     こちらでも公開しております。 詳細については、  参照してください。 imgix ドキュメント ページを 無料の imgix アカウントを作成するには、 ここをクリックしてください デモをリクエストしたり、質問がある場合は、 ここをクリックしてください

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

Sign Up for Free

Get A Demo

Read the Docs

Visit Website

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

長すぎる; 読むには

Make resilience your competitive advantage

シームレスなPOIクロッピング:画像フォーカス抽出の自動化

About Author

コメント

ラベル

この記事は

Related Stories

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

ユニークなエコシステムを支えるビットコインUTXOのモデル

ワークフローを10倍に向上させる方法: 必須アプリ17選

フロキのヴァルハラがインドのスリランカツアーのアソシエイトスポンサーに加わる

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

ユニークなエコシステムを支えるビットコインUTXOのモデル

ワークフローを10倍に向上させる方法: 必須アプリ17選

フロキのヴァルハラがインドのスリランカツアーのアソシエイトスポンサーに加わる

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps