「サンプル」カテゴリーアーカイブ

花子の「部品」と「画像」を組み合わせて「春」の風景を!

目白と梅の木のイラスト

世の中が便利すぎて、人は絵心さえいらなくなる・・・。そんな時代が来るとはとても思えないけれど、「絵心がないなあ」と自分が思っている人にとって、いろいろな「部品」とか「素材」があると、まずはなんとなくイメージが作れる、という時代は確かにもう到来しています。

そんな中で「花子」という歴史の長いドローソフトが、今年2月10日に新バージョンがリリースされました。便利機能が増え、使いやすくなったところもあります。花あそびのサイトでも新機能の説明がありますが、花子の一番新しいバージョンに限らず、イラストや図面を作成する時に何が伝えたいのか?どのような構図で?どういったイメージがよい?といった課題は、どの作品でも、共通課題ではないか、と思います。

逆に言えば、表現したいものがはっきりしていて、なおかつある程度の素材と何らかの道具さえあれば、その想像していたものが描画できます。すばらしい才能とか、長いパソコン経歴などがなくとも、まずは遊び心を持って、アイデアを出し、道具を使う基本さえわかれば、あとは試行錯誤とちょっとの努力でよい結果が得られるだろうと思います。

長い前置きはさておき、今回の投稿で「春」を思い出させる風景(記事の冒頭にある絵)を花子で作る方法を解説します。(花子2012の手順と、それ以前のバージョンとの手順が変わるところも説明します。)

■ステップ1・・・伝えたいこと・構図と大体のイメージを決める

春のイメージの構図

これはまず重要です。「春」というキーワードが頭の中にあり、ふわふわの雲が浮かんでいる「青空」が背景で、「鳥」「木の枝」に止まっている風景がよいかなと。 でも、実際はまだ2月なので、葉っぱがついた枝というよりかは、芽が出始めている木の枝がいいのかな?と思いました。

そこで、紙と鉛筆でも花子でもよいのですが(むしろ、「手段」を考えないで紙と鉛筆を使ったほうが手早いかもしれません)、右図のように大まかな構図を簡単に描いてみましょう。「登場人物」はどのような配置でどこに出るか、まず考えてみます。

■ステップ2・・・ベースとなる部品(素材)を探す

もちろん、絵を描くことに自信のある人なら、自分で描いてもよいでしょう。けれども、時間がなく、あまり絵を描くことに自信のない人は、花子の「部品」から始めると、後からスムーズにいくかもしれません。時と場合によって方法を決めましょう。

ステップ1でいくつかのキーワードを想像してみましたが、イメージに合う部品はないのだろうか。花子の「部品」のパレットを開いて、キーワードを入力していろいろと探し出します。よさげなものはドラッグアンドドロップで新規図面に貼り付けます。(クリックしても挿入できますが、もし図面上にほかの図駅や画像がすでに選択されている場合、差し替えられてしまいます。)

花子2012の場合(部品パレットは左側に配置)

花子2012「部品パレット」の位置

花子2011以前の場合(部品パレットは右側の「クリップウィンドウ」に配置)

花子2011「部品パレット」の位置

いろいろと花子の「部品」を検索した結果、まず「木」と「鳥」のキーワードにふさわしそうな素材が見つかりました。「青空」はあとで自分で描くことにした。

■ステップ3・・・部品(素材)を好みに合わせて加工!

花子の「木」と「目白」の部品サンプル

部品は挿入したままでもいいのだけど、想像したものにより近づけるためには不必要な部分を取り除きましょう。
まず木の黒い輪郭を取りましょう。

<花子2012の場合>木を選択して、画面右側の「属性」タブをクリックし、「カラー」パレットの「線種」を「なし」にする。

<花子2011以前の場合>木を選択して、画面右側の「編集」タブをクリックし、「カラー」パレットの「線種」を「なし」にする。

次にその青色の実をピンク色にしましょう。花子2010から追加となった「カラースキーマ」機能を使うと便利です。ついでに木の皮の色をもう少し濃くしましょう。

<花子2012の場合>木を選択して、画面右側の「属性」タブをクリックし、「カラー」パレットの「カラースキーマ」のアイコン(カラースキーマのボタン)をクリック。

<花子2011の場合>木を選択して、画面右側の「編集」タブをクリックし、「カラー」パレットの「カラースキーマ」のアイコン(カラースキーマのボタン)をクリック。

カラースキーマの操作についてビデオを用意しました(5分程度)。よかったら、ご覧ください。

http://www.youtube.com/watch?v=XMpILVv2cGA&context=C36d1a0aADOEgsToPDskJN3B6mYunDT7usGjxwa7az&w=620&rel=0

次に、鳥の形と色を少し調整しましょう。(これはメジロかな?)

部品の「枝」の部分は不要なので、図面に貼り付けた鳥と梅の木の枝を選択し、メニューの図形―合成―解除を選択します。すると、点だらけで表示されますが、これは正常なのでご安心を。

合成解除の例 鳥イメージの加工に仕様したツール

図形の選択ツール(図形の選択ツール)が選択されていることを確認し、図面の開いたところにクリックしてから、梅の花と枝の不要な部分を一つ一つ選択して DELETE ボタンでどんどん削除しましょう。

ここまでできたのなら、次は好みに合わせて微調整ができます。

僕はくちばしを少し大きくして、目の玉をじゃっかん前のほうに寄せることにしました。また、足を一回り大きくし、目の玉の位置を前方にして、最後にカラースキーマ機能でくちばしと胴体の色をもう少し自然な色にしてみました。自分好みにいろいろと遊んでみてください。

そして空です。鳥と木だけでは雰囲気がつかめないため、花子フォトレタッチで「青空」と「雲」を作ります。

<操作方法>図面に鳥と木を大まかなところに配置をし、メニューの「挿入―イメージ―領域を指定して作成」を選び、カーソルのクリック&ドラッグで鳥と木を大きく囲むようにして花子フォトレタッチが立ち上がる。

花子フォトレタッチに挿入した後の「鳥」と「木」のイメージ

<花子2012メモ>作図パレット(画面左側:作図パレットボタン)―イメージの編集―「花子フォトレタッチの起動」(花子フォトレタッチの起動アイコン)をクリックして花子フォトレタッチの絵を挿入することもできるが、初期状態ではサイズが小さいため、花子フォトレタッチの「画像」―「画像のサイズ」コマンドでサイズ変更を後からする必要がある。 すると花子フォトレタッチで新規画面が開きます。鳥と木のイメージが配置されているはずです。

そして CTRL + A キーで全部選択して、DELETE キーを押します。(もとの部品はもともと花子で使った図面に残っていますのでご安心ください。)

この先は、花子フォトレタッチで空模様を簡単に描きます。

■ステップ4・・・花子フォトレタッチで空模様を描く

1.花子フォトレタッチの塗りつぶしツール(花子フォトレタッチの塗りつぶしツール)を選択し、「カラーパレット(基本色)」を出す。

花子フォトレタッチのカラーパレット(基本色)

2.カラーパレット(基本色)の「追加・変更」ボタンをクリック。「グラデーション作成」のダイアログが出る。

花子フォトレタッチの「グラデーション作成」

3.グラデーション作成ダイアログの「カラーバー」の小さい三角記号(▼)をクリック&ドラッグして既存の色の位置を変更するか、カラーバーの上にクリックをして「追加」パレットから新規に色を作成。

花子フォトレタッチの追加パレット

4. グラデーションのパターンが作成できたら、カーソルを画像ウィンドウの上に置き、クリックする。画像が一面グラデーションにかかっていることがわかる。

グラデーションの方向を反転したいときは、カラーパレット(基本色)の ボタンをクリックして、もう一度グラデーションをかけます。カラーパレットの「設定」ボタンでさらに細かく調整できます。

5. 最後に雲を描きます。いろいろな方法はあるが、一番手っ取り早いのはブラシのツールです。メニューの「レイヤー」―「新規レイヤー」を選び、雲を自由に描くためのレイヤーを作ります。次にツールパレットのブラシ(花子フォトレタッチのブラシツール)を選択し、下図のような設定をしておきます。

結果として、こんな風景が描けます。

花子フォトレタッチで描く「青空と雲」の風景

花子フォトレタッチを閉じると、花子に戻り、レイヤーが統合されます。
最後に、「鳥」と「木」をうまく位置あわせをし、出来上がり!

図解機能でライフマップを作る

ライフマップの一部(サンプル)
自分にとって一番大切なことはなんだろう?いろいろな関心どころがある中で、その関連性は?―そう考えたときに、花子の「図解」機能は役に立ちます。

「図解」の機能は、花子2005からあり、かなり古いバージョンでも使えます。(ご参考まで、Mac OS XのOmniGraffleでも、「アウトライン」を入力して割と似たようなことができるので、是非お試しあれ。)以下、花子の図解機能を「図解」と呼びます。

「ライフマップ」とは?

自分の人生の中で関心のあること、人、やりたいことなどを図解にしたものを「ライフマップ」と言います。単なる「人生設計」としてとらえる人もいるかもしれないが、むしろ、過去の出来事や縛りを考えずに、「これが大切だな」「こんなことがしたいなあ」「こんなことに興味がある!」などを、見える形にするのがライフマップです。

作り方は自分次第です。もちろん、花子のようなソフトがなくても、鉛筆と紙だけでも十分に作れるでしょう。この記事で花子の「図解」機能を特におすすめしている理由は、関心事の関連性とつながり方をすぐに把握でき、再配置・色づけ・大きさ変更ができるため、紙と鉛筆より自由度があるカモ?ということです。

僕が作成したライフマップはこれです。(ちょっとゴチャゴチャしていますが。)

花子で作成したライフマップのサンプル

あまり堅苦しく考えず、まず頭の中にあるものをどんどん出して、何らかの形に整理して図解にすると、面白い発見があるかもしれません。

図解はどうやって作るの?・・・花子の「図解」便利機能を紹介!

図解の使い方は簡単です。花子の新規図面を開き、クリップウィンドウ(画面右側)の「図解」タブをクリックして表示します。図解の種類(スタイル)を選び、「アウトライン」の黄色いダイアモンド記号のあとにひたすら文字を入力します。最後に「新規作成」のボタンをクリックしてまずは出来上がり。

図解の作り方フロー

図解を新規作成してから、図の中のどれかの図形をクリックして、個別に編集することができます(ただしある程度まで)。線種・塗り・文字属性などが変更できます。

図解全体をクリックして「カラーセット」を使えば、いろいろなバリエーションが作れます。

花子の「カラーセット」で作成したサンプル

結構、楽しいです。

「カラーセット」パネル(プレビューモード)

実際に図解を作成しなくても、図解を選択解除して(図面のどこかにクリックするか、ESCキーを押す)、カラーセットのバリエーションをクリックするだけでプレビューが出ます。また、なにも選択されていない状態で図解の「スタイル」パレットのバレエ―ションをいじることもできます。「どんなもんが作れるんだろう」と思ったときに、事前に試してみることができ、便利です。

また、自分の図解を作って、個々の図形を自分の好みの線色・塗り色に修正して、カラーセットのパレットの下向きの矢印アイコンをクリックすれば、そのスタイルはまた別の図解を作るときに使えます。

なお、「カラーセット」は「図解」機能で作った図解にしか使えません。「作図」、「部品」パレットなどで作成した図解の色の組み合わせを変更するには、「カラースキーマ」()を使うと便利です。

カラースキーマ機能で編集した図解

「図解」機能のメリット

  • 図解の形は簡単に変えられ、同じ情報を違った角度で見ることができる
  • 図解の中の個々の図形はある程度、属性(線種、塗りの色、形、配置など)が変更できる
  • 図解に項目を追加すれば自動レイアウトが行われる
  • カラーセットが豊富であり、カスタムのものも追加できる
  • カラースキーマを使ってさらに色のバリエーションが可能

「図解」機能の弱点

  • 項目を追加すると真上の項目の書体情報が破棄されることがある(バグ?)
  • 項目の追加・削除により、思わぬ配置になることがある
  • 「図解」に入力した文字列は、「入力ウィンドウ」には表示されない(花子の通常の文字入力機能と独立している)
  • 詳細設定が少なく、大まかなものしか作れないため、あとで「図解解除」をして自力で調整作業がどうしても必要
  • 花子2012の「クリックスタイル」は適用できない

<お知らせ>

花子などのドローソフトで作ったライフマップの図解、Exploring花子で共有しませんか。あなたがお作りになったライフマップを当サイトで公開します。(報酬はなにもないのですが、サンプルの記事として紹介させていただきます。著作権はもちろん、投稿者のものであり、あとから削除してほしいといわれれば対応させていただきます。)

ご興味のある方、ぜひお問い合わせフォームでご連絡ください!

花子フォトレタッチを見極めよう―その3(グラデーションとブラシ)

ずっと昔から花子とペアになっている「花子フォトレタッチ」。花子2010ではまだバージョン3のままだが、バージョン3でも少し面白くて独特な効果が得られる。ただ、使い方は決してシンプルではないので、ここではちょっとしたワザを紹介したい。

hanako-photoret-colorp  例えばグラデーション。花子フォトレタッチのカラーパレット(右図)には5つのカラーモードがあり、その4つめのもの(図の赤い線で囲ったもの)がグラデーションを設定するものだ。

花子フォトレタッチのグラデーション設定は使用中の描画ツールによって使い方が変わる。

ブラシツール(hpt-brush-icon )の場合は「方法」「繰り返す」と「変化する長さ」という設定がある。右図の「設定」ボタンを押すと、それらのオプションが選択できる。

また、塗りつぶしツール(hpt-nuritsubushi-icon )の場合は「方法」「設定」と「種類」というオプションがある。

グラデーションの基本操作として、三つのステップがある。

hpt-gradation-steps

 

①塗りつぶしモードを選ぶ

②グラデーションの種類を選ぶ

③必要に応じて細かい設定をする

①はよいとして、②は初期(デフォルト)のパターンがあり、そのまま使えるが、「追加・変更」からは新しいパターンを作成することもできる。

また③の設定は、上記で説明した使用中ツールによって変わるものであり、ブラシを使っている場合と塗りつぶしツールを使っている場合と中身が違ってくるので要注意。

ブラシを使っている場合、上記の設定を自分好みに変更して、例えばこのような効果が得られる。

star-brush-curves 

グラデーションの「変化する長さ」の値によって、グラデーションの色が変わる間隔を設定することができる。

上記の画像は、ブラシの「形状の呼び出し」から星形のブラシを選択してブラシの形を決めた。さらに、ワコムのペンタブレットを使って筆圧によって星を大きさを描きながら調整できるので、便利だ。

また、塗りつぶしツールの場合は「設定」ボタンを押してこんな効果を簡単に作れる。

gradation-green 

可能性は無限に近いので、いろいろと遊び感覚で試しながら機能の使い方を学べる。ブラシ効果と塗りつぶし効果を組み合わせて、例えば下記のような画像は手軽に作れる。

starburst-world

PowerPoint for Macで作成したデータを花子で活用!

以前にこのブログでMacで花子データを扱うことについて投稿したことがある。ただ、その情報は単純に花子データを花子ビューアで見るだけの話であり、花子データ(JHD形式)をMacで開いてフルに編集することまで及ばなかった。

もちろん、花子のデータをMacでどう使うかによって、出力形式と方法も変わるが、Macで作成したデータを花子で編集したい場合は、PowerPointがためになる。

例えば、PowerPoint for MacでPowerPointデータを作成し、それをWindowsの花子に読み込むことができる。また、逆のこともできる。

ただ、やはりソフトのメーカーもOSも違うため、これは完ぺきな作戦ではない。さて、MacのPowerPoint 2008(いまの最新バージョン)のデータを花子に読み込んだ場合は、どのような結果になって、またどういった点に気をつけないといけないのか、一例を少し見てみよう。

PowerPoint 2008 for Mac→花子2010へ

下記のスライドは、PowerPoint 2008 (Mac) で作成した、ごく一般的な表紙スライドだ。shiretoko-slide-ppt2008

シンプルに見えるが、実はPowerPointの独特な機能をいくつか使用している。例えば…

  1. 「知床」の字にわずかなグラデーション塗り
  2. 写真はスライド背景に埋め込み
  3. 書体はMacの「ヒラギノ角ゴ」を使用
  4. フォントのイタリック体を使用

といった具合だ。

このPPTX形式のファイルを花子2010にそのまま読み込むと、どうなるのだろうか。

shiretoko-slide-jhd2010 「悪くないんじゃない?」と思われるかもしれない。確かに、一見して雰囲気的にはそう変わったようには見えない。

しかし、よーく見ると、PowerPointデータを花子に変換して明らかに変わったしまったことは下記の通り発見できる。

shiretoko-jhd2010-points

  1. PowerPointで設定したわずかなグラデーション塗りを設定したところ(「知床」の字)が、黒のべた塗りの字になってしまった。
  2. スライドの背景に埋め込んだ写真が、背景スライドから外れて、ほかのオブジェクトと一緒になってしまった。
  3. せっかくMacで選んだカッコいい書体はWindowsのMSゴシックに変換されてしまい、平凡な感じになった。
  4. PowerPointで設定したイタリック体は花子に読み込んだ時点で30°の斜体文字に変えられ、やや見栄えの悪い見た目になった。

では、これらの課題を乗り越えるために、どうすればよいのだろうか?

例えば:

  • PowerPointで設定する字のグラデーション塗りは花子で破棄されるため、PowerPointでテキストボックスを選択して「切り取り」をしてから「形式を選択して貼り付け」を選び、「PNG」として文字を貼り付ければ、グラデーション塗りの文字を花子でそのまま表示できる。(ただ、文字としては編集できなくなるので、要注意。また、文字の輪郭が多少ギザギザに見えることもある。)
  • スライドの背景は花子ではまた花子の「背景スライド」に戻せばよい。(ただ、スライドがたくさんあるときは面倒な作業が伴う。そのままにしておいても基本的に問題はないが、ファイルサイズの肥大化につながることもあるので、なるべく背景スライドを使う。)
  • 書体はMacにあってもWindowsにあるとは限らないので、なるべくOffice系の共通フォントをつかったほうが無難。
  • イタリック体文字の変換は花子の弱点だ。なるべくデータを花子に読み込んでから、イタリック体を設定したほうが時間の節約になる。

ただ、上記の例はたったの一例に過ぎない。内容によってはもう少し手を入れないといけないので、スムーズな変換を期待しないで覚悟の上で変換を進めることが懸命だ。

以上、いろいろと注意しなければならないことはあるが、Macで作成したプレゼンテーションやスライドショーを花子で扱うことはときによって便利なので、MacとWindowsの両方で作業をしなければならない人には必須な技となる。

花子2010の「カラースキーマ」のプロになろう!―その1

dining-set-initial花子2010のコンテンツにある「ダイニングテーブル」の部品で実例をみよう。

元々の画像は右にある。

まず、ダイニングテーブルと椅子を選択し、「図形―カラースキーマ」のメニューコマンドを選ぶか、カラーパレットにあるカラースキーマのボタン(color-schema-button )をクリックして「カラースキーマ」のダイアログを出す。

color-schema-1右図のように、ダイアログが表示される。が、カラーポイント(カラーホイルの中にある◎で囲まれている部分)がたくさんありすぎて、これだと編集が若干大変かも。

そこで一旦このダイアログを閉じ、ダイニングテーブルを合成解除して、まず色を変更したい部分だけ、選択をしてもう一度カラースキーマを選ぼう。

hint-box-1

次に、お皿、椅子の座布団とテーブルクロスを選択し、もう一度カラースキーマに挑戦。

color-schema-2

必要な部分だけを選択したため、カラーポイントが減った。さっそく編集してみよう。まずカラーポイントをどれか、直接クリックして回してみる。

「すべてのカラーポイントを連動させる」という鎖のようなアイコン(color-rendou-icon )がつながっている状態(オン)であれば、カラーポイントを回すことによってほかの色も相対的に回転し変わっていく。

カラーポイントを円の真ん中に移動すればするほど、全体の色が薄くなっていく。また、反対に円の外に向けてカラーポイントをドラッグすると、全体的に色が濃くなっていく。

このようにして色々な組み合わせが気軽に作れる。

dining-set-try1

  では、この中の一つかいくつかの色をそのままにして、ほかの色を変更したいときはどうすればよいのか?

color-point-kotei

固定したい色(カラーポイント)をクリックしてロックのアイコンを「色を反映しない」(かかった状態)にすれば、そのカラーポイントが太い二重の四角に変わる。これで色は固定される。

紛らわしいことに、これ以降ほかのカラーポイントを編集すると、固定したカラーポイントの色も連動して変わるように見えてしまう。しかし、「プレビュー」にチェックを入れて原画を確認すると、確かにいろは固定されているので一安心。

ここで覚えておく大事なポイントとして、四角になっているカラーポイントはいくらいじっても変わらない、という点だ。もっと奥が深いのだが、カラースキーマ、グラデーションと透明度設定でこのように仕上げてみた。

Diningsetdarker

まだカラースキーマについてよくわからなければ、「ここまで出来る!花子 技ありテクニック集」の112ページにそれなりに詳しい説明はあるので、ご覧あれ。

バージョンアップをしなくても良いのだろうか・・・。

hanako-larger-icon 今週の金曜日(2月6日)に、花子2009が発売となる。

そこで、今日の大不況といわれる中、「花子のアップグレードをしなくてもいいんだろうか?」と自問自答する人々は少なくないはずだ。僕も、その一人だった。

花子でもほかのアプリケーションでも、疑問と答えは一緒だ。つまり・・・

  • いま現行持っているバージョンで、特に不自由はしていないか
  • 新しいバージョンを入れることによって、確実に改善されることはあるか
  • バージョンアップをして、これまでできなかったことができるようになって、
    うれしいこと
    はあるか?

上記のことを順番に考えた上で、バージョンアップをすればよいと思う。

まとめていうと、下記のことが参考になるかもしれない。

花子2008まで不自由だったこと、花子2009で解決される点

花子2008までの困りごと

花子2009での解決策

black-cloud-icon 花子形式以外の画像ファイルは、扱いにくいところがあった

yellow-star 画像ファイル(GIF/JPEG/PNGなど)を、エクスプローラの「プログラムから開く」ことができるようになった

yellow-starJHD形式(花子)のファイルのサムネール(縮小版)がエクスプローラで表示できるようになった

yellow-star花子の「ファイル-開く」コマンドから画像データを直接開くようになった

black-cloud-iconプロ向け印刷用途にはあまり向かなかった

yellow-starIllustratorへの書き出し(EPS形式)の制度が確実に上がった(特にグラデーションの再現が大きく向上)

black-cloud-icon図形の形を思うように変更できなった

yellow-star「図形加工」の新機能で、2つ以上の図形を重ね合わせて形を結合したりくりぬいたりすることが簡単になった

black-cloud-icon文字入力ウィンドウは、あまり見やすくなくて自由に項目を扱えなかった

yellow-star文字入力ウィンドウで項目の移動、置き換えなどができるようになった

yellow-star 文字入力ウィンドウで文字の色、下線や太字などが表示できるようになった

black-cloud-iconPOP文字はあまりうまく作れなかった

yellow-starPOP文字の機能が搭載された

これだけでも、多くの人にとってかなりの理由になるかと思う。特に、PowerPointの補助ツールとして花子を使っているユーザーにとっては、「図形加工」の機能が大変便利だろう。

確かに、少なくても花子12(2002年リリース)の時代から、「幅を付けて塗りつぶす」「交点で塗りつぶす」「交点で切断して削除」といった機能があって、ある程度、図形の形の変更に対応できた。

しかし、無意味な制限も多く(塗りつぶし色が設定されている図形には使えない、また図形の数が多いとエラーが出るなど)、ここで諦めてしまった人は少なくなかっただろう。(当方も、その一人だった。)やっと2009バージョンから、下記のような図形操作が、花子で簡単にできるようになって、花子を強力なドローツールとして再考する時期が訪れたと考える。

図形加工のサンプル・・・こんなことがで1クリックできるようになった!

zukei-kakou-sample_02_02_02

世の中にはもっとすてきなサンプルがあるとは思うが、基本的には図形と図形を重ねて操作するものでいろいろな形が作れる、という考え方なので、かゆいところに手が届くと思う。

バージョンアップの話から脱線したが、このような新機能があって、花子2009の新バージョンを導入して自分の困りごとが解決されるか(または少し楽になるか)、答えは人それぞれだと思う。しかし、これはメージャーリリースとは言えないにしても、特に図形加工の機能はソフトの使いやすさに大きく貢献する機能なので、花子のヘビーユーザーにはまずイチオシのバージョンアップだ。

ただ、花子フォトレタッチのバージョンアップを期待している人々には、残念ながらまた今年も飛ばされたので、とりあえず現行バージョン(v3.0)で辛抱するのか、GIMPやPhotoshop Elementsなどを代用して来年まで待とう。

牡丹の絵(花子の透過画像の表示問題その2)

3月14日に投稿させて頂いた、「花子の透過画像の表示問題について」いくつか貴重なコメントが投稿された。

それを受けて、いったいどのようにして、花子2008を使って透過部分のある画像(アルファチャネルが含まれるPNGまたはGIF)を、滑らかに表示できるのだろうか、少し実験をしている最中だ。

1つの結果は下記のとおり。

Botanwithbkgdfromhanako

牡丹の画像は、「日本の伝統文様」(MdN出版)から借用。
よくみると、牡丹の花の輪郭に、ギザギザがある、つまり滑らかではない表示になっている。イメージとして、だいたい雰囲気は伝わるとは思うが。

その元画像は、PSD形式(Photoshop)のものであり、Photoshop 7で開いて、牡丹の部分だけのウェブスライスを作成して、「ウェブ用に保存」のコマンドで、PNG-24の透過画像として出力した。また、それを花子の「ファイル―他形式の保存/開く―画像・イメージデータを開く」で図面に読み込み、それをダブルクリックして花子フォトレタッチで「画像―タッチ・モザイク・ノイズ」で少し布のような効果を加えてみた。

しかし、元々Photoshopで編集していた画像は、このように表示された。

Botanphotoshopreduced

背景の市松模様は、透過部分を表している。

花の輪郭部分が、元々、こんなに綺麗だったんだー。

しかしこれがあっても、花子で選択した図形を即座に、ビットマップの世界で編集できるなんて、やはり、花子の大きな特長だと思う。下記のとうな効果、花子フォトレタッチですぐにできる。

Botanwithidoukouka

白い花だけにピント合わせて、あとは「画像―ぼかし・シャープ―ぼかし・変形」で左側のブラー効果をかける。色々な可能性がある。また、花子フォトレタッチで画像を閉じたときに、またベクトルの世界、花子に戻ることになる。(上記の画像の背景部分だけは、花子本体で作成した。)

こうしてビットマップとベクトルの世界に自由に行き来することは、ある意味で、グラフィックスソフトのあるべき姿だと思う。イラストレーターのライブ・ペイントという機能は、どちらかというと、ベクトルの世界で作ったものを、またベクトルの世界で、あくまでPhotoshop感覚で着色ができるようなものだが、花子と花子フォトレタッチの組み合わせで、同じことが可能だ。

あとは、どれだけ解像度と、画像の輪郭の滑らかさを要求するのかだけだ・・・。

図形効果「光彩」―その2

花子2008の「JSフォントエフェクト」ツールで字を作成して、花子2008で「光彩」の図形効果と背景などをつけたサンプル。波線は、花子の「コンテンツ―部品」で「波」を検索し、合成解除・グループ解除をして必要な部分だけを抽出。さらに、光彩(かすかな白)をかけて、全体的にぼやとしたイメージができた。

Aquarian_2 

一切、花子フォトレタッチを使用せず、全部花子2008で作成した。

泡を描くために、泡ひとつを描いてから、それをコンテンツパレットの「ストック」に保存して、描画ツールの「部品スタンプ」を選び、泡をたくさん描いてみた。また、背景色は、透明度のあるグラデーションを2種類、使って重ねてみた。

なお、ひとつ注意事項がある。花子2008の新しい図形効果は、Web出力(GIF・PNGやJPEGなど)ができないという、とても都合の悪い問題を抱えている。そのために、次の方法でイメージを出力するときに、図形効果がついてこない。

  • ファイル―他形式の保存―ホームページ素材として保存
  • Web画像の切り出し(描画ツールボックス)
  • 解像度を指定して切り出し(描画ツールボックス)

「だったら、図形効果をどうやって出力すれば・・・?」との声に対して、出力したい図形を選択してから「ファイル―一部保存―選択図形」の方法がある。しかし、出力サイズは指定できないので、出力してから花子フォトレタッチやその他のビットマップエディターで画像のサイズ変更をする必要がある。面倒だけど。

光彩で「地球」。

ついつい花子2008の新機能で遊んでみた。

花子2008で新規搭載となった「光彩」機能を使って、地球のハローができた。

さらに、JSフォントエフェクトツールで文字を作り、それに花子でドロップシャドウをかけてみたところ、思った以上に奇麗な効果ができた。ちゃんと文字の輪郭に沿っての陰ができたので、繊細なタッチだと思う。

地球自体の図形は、「コンテンツ」パレットから拾った。

少し余談だが、花子の新しい効果(ドロップシャドウ、光彩と反射)は、透過PNG/GIFの中身の輪郭に沿って効果を描画できるようだ。設定の範囲はやや狭いが、今回の効果はかなり優れものだと感じる。

花子2008の文字枠回転とドロップシャドウ機能を有効に

「Illustratorプロフェッショナルデザイン」(X-Media社出版)のサンプルで、もともとIllustrator 10用のサンプルを手本に、花子2008で少しいじりながら作成してみた。

花子2008で作成した立体的球体とドロップシャドウのサンプル

なぜかジャストが一切公表しなかったのだが、花子2008で文字回転の表示がレベルアップとなった。かつて(花子2007まで)は、字つぶれで少々見苦しい花子の回転した文字枠が、ごらんの通り、だいぶ(完璧ではないが)なめらかで表示するようになった。

上記のサンプルは、花子2008の文字回転の描画機能が強化されたからこそ、こんなことが見栄えよくできるようになった。

<作成手順>

  1. 丸を描き、変形-移動/複写の機能で、横並びでもう4つの丸を作成。
    また、その丸の並びを選択し、もう一度、変形-移動/複写で、今度下方向に複写。
    そして、花子2008で新しく登場した「図形の選択(文字入力)Zukeinosentakumojinyuuryoku 」のアイコンをクリックして、丸を一個一個選択して、適当に文字を入力。
    (花子2008に標準搭載となっているAR P丸ゴシック体Eの書体を使った)

    Hanakoballsstep1

  2. すべての図形を選択し、文字のサイズを一斉に読みやすく変更。
    また、選択解除をし、花子2007から搭載となった「文字付き図形パレット」で、一つ一つの丸を個別に選び、マージンや配置の設定を自由に変える。

    Hanakoballsstep2

  3. 次に、「図形の選択(回転/せん断)Zukeinosentakukaitensendan 」を選び、丸を個別に一つ一つ、回転してみる。

    Hanakoballsstep3

  4. 次はグラデーションだ。カラーパレットの「塗り」タブをクリックし、グラデーションのアイコン(Colorpalettegradationicon )を選択してからカラーパレットの左上にあるアイコン(Colorpalettecornericon )をクリックし、「ユーザーパターンの編集」をクリック。新しいグラデーションパターンを作って、色を設定して(この手順は省略)、スポイトツールなどでほかの丸の図形にも適用。

    Hanakoballsstep4
    一気に大変身しましたね。

  5. あとは、少し技なのだが、丸をそのまま残して文字だけにドロップシャドウをかけたい。でも上記のステップ1で、すでに文字付き図形になっているので、どうやって文字と丸の図形を分離すればよいのか?

    そこで、花子2007で登場した機能を使おう。すべての図形を選択し、右クリックして「文字付き図形-文字付き図形の解除」をクリック。ラクショウ!
    ここから、文字枠だけを選択して、色をつけたり、「変形-図形効果-ドロップシャドウ」などで効果をつける。最後に、丸の底に薄い灰色の楕円を描き、コピーして立体感を表現する。これで出来上がり!

    Hanakoballsstep5

ちなみに、必ずしも花子2008がないとできないというわけではない。しかし、花子2008より前のバージョンだと、(1)回転した文字はギザギザに見えるので、アウトライン化してから回転する必要がある、また(2)ドロップシャドウを「変形-影」で再現しなければならず、花子2008ほど綺麗には見えない。

■花子2008の新しい効果、Web用に出力できない?!?

このイラストを作成している間に気づいたが、花子2008の「Web画像の切り出し」には、バグがあることを発見。つまり、この機能を使ってドロップシャドウの出力ができない、ということだ。その回避策として、「ファイル-一部保存」をすれば、効果もちゃんと出力できるが、ピクセルサイズの指定はできないので、要注意。これは、ジャストに要報告だな。