Snapkit Logo

クイックスタート#

このガイドではSnapkitで画像アップロードとリアルタイム最適化を始める方法を紹介します。

1. 画像アップロード#

画像をアップロードする方法は2つあります：

  • Webダッシュボード: ファイルをドラッグ＆ドロップするかアップロードボタンをクリック
  • Figmaプラグイン: Figmaを使用しているチームはFigmaプラグインから直接アップロードできます

2. リアルタイム変換を適用#

URLに変換パラメータを追加することで、リアルタイムで画像を最適化できます。

以下の例では画像を次のように最適化します：

  • format=webp: WebP形式に変換して最大80%のサイズ節約
  • w=200: 幅を200ピクセルにリサイズ
  • dpr=3: 高解像度ディスプレイ用に3倍ピクセル密度を適用

結果、元の画像と比較して3倍高速な読み込み速度と鮮明な画質を提供します。

https://snapkit-cdn.snapkit.studio/landing-page/fox.jpg?format=webp&w=200&dpr=3

オリジナル画像

Fox オリジナル
JPG、1920px
2.5秒読み込み時間、346KB

最適化された画像

(format=webp&w=200&dpr=3)

Fox 最適化
WebP、200px、高解像度
0.05秒読み込み時間、35.4KB

10倍小さく、50倍高速

さらなる変換オプションについては、イメージ変換ガイドをご確認ください。

次のステップ#

サポートが必要ですか？#

ご不明な点がございましたら、いつでもお気軽にお問い合わせください：

おめでとうございます！これでSnapkitで高速で最適化された画像を提供する準備が完了しました。