catch-img

【Shopifyストア運用支援】画像サイズの一括変換(前編)

ECサイトを運用していて必ず必要となるのが商品画像の表示サイズの変換。最近のデジタルカメラは性能が良く、スマートフォンでも4K画質(3,840×2,160)を超える画像を撮ることができますので、これをECサイトに掲載するには表示サイズ、ファイルサイズとも小さくする必要があります。

フリーソフトやオンラインサービスでも画像表示サイズを小さくしてくれるものがありますが、Pythonでも簡単に行うことができます。また、少しコードは増えますが、深いフォルダに整理した画像ファイルも一発変換するということもできるので、結構便利かなと思います。それではさっそく。

目次[非表示]

  1. 1.Python対話モード
  2. 2.画像表示サイズの変更
  3. 3.サムネイルの作成



Python対話モード

今回は、コマンドプロンプト・Python対話モードでの操作を中心に説明していきます。


コマンドプロンプトの起動

Windowsキーと「R」キーを同時押しして、「ファイル名を指定して実行」の窓が開いたら cmdとタイプしてEnterキーを押します。これでコマンドプロンプトが開きます。


画像処理ライブラリ Pillowのインストール

Pythonを起動する前に、画像処理ライブラリ(パッケージ)の Pillowがインストールされているかを確認します。すでにインストール済みでしたらこの作業は不要です。

コマンドプロンプトで pip show pillowを実行します。インストール済みだと、パッケージの情報が表示されます。インストールされていない場合は、WARNING: Package(s) not found: pillow という警告が表示されるので pip install pillowを実行してインストールしてください。


Python対話モードの起動

続いて、コマンドプロンプトで Pythonを実行して対話モードを開きます。

(Python対話モードを終了するときは、quit()と入力するか、Ctrl+Zを押してください。)

※Windows版Pythonには「py.exe」というPythonランチャーが同梱されています。「py.exe」は Windowsフォルダーにインストールされており、システム変数の PATHを書き換えたときなど、Python本体にパスが通っていなくてもコマンドプロンプトで「Py」を実行すると Python対話モードを開くことが可能です。


Pillowのインポート

最初に Pillowをインポートするため、Pythonのプロンプト(>>>)で import PIL.Image as Imageを実行します。pipでインストールしたのは PillowなのになぜPILをインポートするのか、import pillowじゃないのかと疑問に思うかもしれません。これは、PILというパッケージはすでに開発が終了しており、その派生(後継)として開発されているのが Pillowで、パッケージ名はPILをそのまま継承されているというわけです。この辺が少しややこしく感じるかもしれませんね


画像ファイルを開く

PIL(Pillow)のImageモジュールがインポートできたら、Imageモジュールのopen関数でhonda_cb250r_black.png という画像をオープンして、その結果を imgというオブジェクトに代入します。対象の画像が間違っていないかを確認するには、 img オブジェクトのshowメソッドを実行すると既定の画像ビューワで指定した画像ファイルを開くことができます。そして画像ビューワを閉じるとPythonの対話モードに戻ることができます。

表示されたペイントブラシのタイトル部を見るとImage.openで開いた画像ファイルの名前ではなく、一時ファイル(テンポラリファイル)が表示されていることが分かりますね。


Python対話モードからWindowsコマンドを使う

「画像ファイル名を忘れた!」とか「画像はどこのフォルダーにあったっけ?」というときはWindowsのコマンドを使って目的の画像ファイルを探すことができます。エクスプローラーを立ち上げて探すとか、もう1つのコマンドプロンプトを開いて Windowsコマンドで探す方法もありますが、ここは Python対話モード内から Windowsコマンドを使う方法を紹介します。

import osして、os.system() 関数に Windowsコマンドを渡すだけです。例えば、os.system('cd images')とか、os.system('dir *')というふうに実行できます。


Windowsでよく使うコマンド

Windowsのコマンドの詳細はここでは触れませんが、よく使うコマンドとして下表のものは覚えておいて損はないでしょう。また、一部のコマンドを除き、/?オプションを指定するとそのコマンドのヘルプが表示されるので、使い方に迷ったら /?オプションをお試しください。

コマンド

概要
記述例
cd
カレントディレクトリを移動する
>cd
>cd subdir
>cd ..
cls
コマンドプロンプトの表示をクリアする
>cls
copy
ファイルをコピーする
複数ファイルを結合することもできる。
>copy a.txt b.txt
>copy a.txt+b.txt c.txt
del
ファイルを削除する
>del a.txt
exit
コマンドプロンプトを終了する
>exit
md
ディレクトリを作成する
>md subdir
more
テキストファイルを1ページ分表示する
>more a.txt
move
ファイルを移動する
>move a.txt subdir
>move subdir newdir
rd
ディレクトリを削除する
>rd subdir
ren
ファイルをリネームする
>ren a.txt b.txt
type
テキストファイルを表示する
>type a.txt

各種コマンドを更に詳しく知りたい方は、下記を参考にしてください。

https://docs.microsoft.com/ja-jp/windows-server/administration/windows-commands/windows-commands


画像表示サイズの変更


さて、話を戻して、画像の表示サイズを変更していきましょう。


元の表示サイズを確認

その前に、元の画像の表示サイズを確認します。imgオブジェクトのsizeプロパティを確認すると (690, 460)というタプル※が表示されます。これは画像の表示サイズの幅と高さを表しています。img.width、img.heightでもそれぞれ幅と高さを確認することができます。

※タプルとは Pythonにおけるデータ型の1つでリストや辞書と同様に複数の要素を管理することができるものですが、リストや辞書は要素の追加・削除・変更ができるのに対して、タプルはそれらができません。その代わりに使用メモリが少なく、演算が高速にできるのが特徴です。


resize リサイズ

さて、いよいよ表示サイズを変更します。img.resize((幅, 高さ))と記述するだけです。記述例では、幅を320ピクセルとしていますが、高さはアスペクト比を保つため、元画像の高さ×新画像の幅÷元画像の幅で計算しています。また、ピクセル数は整数で指定する必要があるため int型にキャスト(データ型の変換)しています。新しい画像を表示してみると下図のようになります。



画質が粗い場合の対策

画質が荒い場合は resizeのオプションに Image.LANCZOS を指定してください。


Image.LANCZOSは Pillowパッケージ内で定義された変数で、フィルターの種類を表しています。フィルターには次のような種類があり、上段ほどパフォーマンス重視(低画質)、下段ほど高画質(低パフォーマンス)となっています。このオプションを指定しなかった場合はデフォルト値として PIL.Image.BICUBICが使われるようです。

・PIL.Image.NEAREST

・PIL.Image.BOX

・PIL.Image.BILINEAR

・PIL.Image.HAMMING

・PIL.Image.BICUBIC

・PIL.Image.LANCZOS

(出典)https://pillow.readthedocs.io/en/stable/reference/Image.html


リサイズ後のファイルを保存

リサイズが済んだら、save関数に保存先ファイル名を渡して保存します。os.system(‘dir’)で確認すると、リサイズ後のファイルが生成されていることが分かります。



サムネイルの作成

画像の表示サイズを変えるもう1つの方法として、サムネイル画像を簡単に作ることもできます。


thumbnail サムネイル

Imageオブジェクトの thumbnail関数に(幅, 高さ)のタプルを渡すと、画像のアスペクト比を維持したまま指定したサイズに収まる最大サイズに変換されます。なお、thumbnail関数は破壊的メソッドになっており、resizeのように変更後のオブジェクトを返すのではなく、元のオブジェクトを直接変更してしまうことに注意が必要です。


サムネイルの保存

そして、サムネイル化されたオブジェクトをsave関数でファイルに保存します。



前編はここまで。次回、後編では、大量の画像ファイルを一気にリサイズできるようにしたいと思います。それではまた!



※ HONDA CB250Rの画像は下記URLからお借りしました。

https://www.honda.co.jp/motor-lineup/


トランスコスモスShopifyエンジニア
トランスコスモスShopifyエンジニア

トランスコスモスは日本で5社しかない最上位の「Shopifyプラスパートナー」です。最上位認定を堅持しECサイト制作・Shopifyアプリ開発を担うのが、トランスコスモスShopifyエンジニアチームです。Shopify構築によって得られた知見などをブログ記事にて発信していきます。

関連記事


【無料】セミナー動画視聴

2021年7月13日オンラインECセミナー動画【無料視聴】

デジタルシフトが求められる今、D2Cへの関心が高まり、ダイレクトにお客様とつながる D2C ビジネスは注目を集めています。本セミナーでは、顧客視点で取り組むD2CとEC事業を成功させるために不可欠なプラットフォーム『Shopify』の歴史・メリットなど基本のすべてをお伝えさせていただきます。

2021年1月27日オンラインECセミナー動画【無料視聴】

トランスコスモスのEC支援に対する豊富な実績をもとに今後の変革に必要と考えられる「CRM、データドリブン、生産性向上」をテーマとした当社コンサルティングサービスについて、講義形式のセミナー開催

2020年11月30日オンラインECセミナー動画【無料視聴】

【Shopify構築・運用セミナー】拡大するEC市場に不可欠なバックエンド業務の最新トレンド。EC事業を成功させるために『効率化に向けたバックエンド業務の最新トレンド』と題して、Shopify構築・運用に連携できるサービスをご紹介。


EC関連サービス

お気軽に
お問い合わせください

Shopify(ショッピファイ) ECストア構築・運用代行

トランスコスモスは日本に5社しかない最上位の「Shopifyプラスパートナー」企業です

Shopify人気記事ランキング

 Tag(タグ)

 記事検索

 カテゴリー

 【無料】募集中セミナー

全9件中 1〜 4件を表示

 【無料】資料ダウンロード

Shopify操作マニュアルのダウンロード一覧

ショッピファイの管理画面の使い方を図解で開設した操作マニュアル資料をPDFにてダウンロード頂けます。

ECサービス紹介資料無料ダウンロード一覧

トランスコスモスのEC関連のサービス資料の一覧ページです。PDFにて概要のわかる資料を「無料」でダウンロードして頂けます。

セミナー発表資料の無料ダウンロード一覧

トランスコスモスのEC関連のWEBセミナーで使用した資料一覧ページです。PDFにてセミナーの内容がわかる資料を「無料」でダウンロードして頂けます。

全3件中 1〜 3件を表示

Shopify認定パートナー企業

トランスコスモスは日本に5社しかない最上位の「Shopifyプラスパートナー」です。
Shopifyでのサイト制作ならお任せください