学習アプリのマップを表示するために必要な画像を作成しています。
進捗6では、以下のような1つの大きな画像ファイルを用いてマップを表示していました。(「いらすとや」の画像を組み合わせて作成しました。)
進捗6 マップの画像
これを、小さな画像ファイルをいくつか作成しておき、これらをタイル状に敷き詰めて、全体で1つの画像のようにしてマップを表示する方法に変更します。
例えば、それぞれの外観がよく似た(似ているが異なる) マップA,マップB,マップC,… を用意するとします。前者の方法は、その都度、新しい画像ファイルを作成しなければなりません。後者の方法は、既存の小さな画像の配列パターンを変更するだけでマップを表示できる特長があり(下図参照)、画像ファイルの作成に費やす時間コストを削減することができます。画像の管理も容易になると思われます。
この「小さな画像ファイル」の作成には、GIMPというフリーソフトを使用しました。
窓の杜 GIMPのダウンロードページ
https://forest.watch.impress.co.jp/library/software/gimp/
GIMPでは、エアブラシ(スプレーで着色するような処理)や、ぼかし(画用紙に塗ったクレヨンをこすったような色合いにする処理)などの画像加工ができるため、自然な質感を引き出すことができます。例えば、芝生の画像は次のように作成できます。
いろんなエリアのマップを表示できるように、基となる画像ファイルを作成していきます。
(前回記事)あゆむアプリ 進捗14
(次回記事)あゆむアプリ 進捗16
<お問い合わせ>
このブログの管理者へのお問い合わせは、こちらからお願い致します。
進捗6では、以下のような1つの大きな画像ファイルを用いてマップを表示していました。(「いらすとや」の画像を組み合わせて作成しました。)
進捗6 マップの画像
これを、小さな画像ファイルをいくつか作成しておき、これらをタイル状に敷き詰めて、全体で1つの画像のようにしてマップを表示する方法に変更します。
例えば、それぞれの外観がよく似た(似ているが異なる) マップA,マップB,マップC,… を用意するとします。前者の方法は、その都度、新しい画像ファイルを作成しなければなりません。後者の方法は、既存の小さな画像の配列パターンを変更するだけでマップを表示できる特長があり(下図参照)、画像ファイルの作成に費やす時間コストを削減することができます。画像の管理も容易になると思われます。
この「小さな画像ファイル」の作成には、GIMPというフリーソフトを使用しました。
窓の杜 GIMPのダウンロードページ
https://forest.watch.impress.co.jp/library/software/gimp/
GIMPでは、エアブラシ(スプレーで着色するような処理)や、ぼかし(画用紙に塗ったクレヨンをこすったような色合いにする処理)などの画像加工ができるため、自然な質感を引き出すことができます。例えば、芝生の画像は次のように作成できます。
いろんなエリアのマップを表示できるように、基となる画像ファイルを作成していきます。
(前回記事)あゆむアプリ 進捗14
(次回記事)あゆむアプリ 進捗16
<お問い合わせ>
このブログの管理者へのお問い合わせは、こちらからお願い致します。