上記の広告は１ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ひょんなことから地図を作ることになりました。

そういえばちゃんと地図を作ったことってないかも、。
地図って意外といつ作ることになってもおかしくない気がするし、
これを機に地図作りのノウハウを学んでおこう!

ということでアレコレ調べたりしながら地図を作りました。
いくつか得たこともあったのでここに記しておきます。


まず「地図　トレース」とかのキーワードでGoogle検索しました。
考え方としましては、地図を用意してそこから必要な部分だけを
なぞって作っていくつもりです。

Web用地図を作成しよう 仕事に使えるグラフィックス入門
このページが見つかりました。
てかこのページを見れば今から僕が書く作成過程は
意味なくなっちゃうんですが…
でも、せっかくのでやりますよ!

あと 似顔絵名刺の作成 このサイトの左のメニューの
「地図・ロゴトレース」のリンク先にある地図が良さそうだったので
デザインはこれをパクる参考にすることにしました。


その１　地図を用意する
ヤフーの地図情報のページ（http://map.yahoo.co.jp/）
で必要な地図をいくつかプリントスクリーンして
つなぎ合わせて大きな地図にしました。
こんなもの載せていいのか微妙ですが、まあ大丈夫でしょう。
ちなみにソフトはFireWorksです。



その２　完成形を考える
そもそも地図が必要なのは”わかりやすく”するためです。
今回は板橋駅および下板橋駅から目的地までの地図なんですが
幸い板橋駅と下板橋駅は垂直の関係になっていたので
下板橋駅が下、板橋駅が右になるよう地図を回転させました。



その３　道をトレースする
今回は矩形ツールを使って道を描きました。
ポイントは”いかに簡素化するか”ですね、たぶん。
ゆるやかなカーブなんかは直線でＯＫ!
なぜならば人は次の曲がり角までは直進してると思うものなので。
本当の位置関係よりも、実際に歩いてみた感覚と
出来上がり地図の見易さを優先させるのが良さそうです。



その４　線路を描く
ピックアップする道が決まったところで線路を描きます。
これけっこう面倒くさそうでどうしようかと思っていたんですが
コチラのサイト（なんしゃましまし）のFireWorksのページで
メチャつかえるコマンドが配布されていました。
今回はそれを使って線路を描きました。



その５　修正する
ここまで順調だった（でしたよね!）作業がここで怪しくなりました。
適当に並べておいた道（矩形）をつなげてキレイにしようと思ったのですが
やり方が分かりません。
たぶんIllustratorとかだと上手い具合にパスが結合できたと思ったんですが
FireWorksでどうやるのかなかなか分からなかったので、
仕方なくブラシツールでしこしこ白塗りしました。


なんとかＯＫ!


その６　目印を入れる
特に曲がり角なんかに分かりやすい建物の名称を書き入れました。
”信号○つめを右折”というのが分かるので
あまり目立つ建物がない場合などは信号を入れると良さそうです。



その７　プロトタイプ
下図を排除して問題ないか、様子を見ます。
あ、ちなみこれには目的地は入れてないのですが、
本物には目立つように書き込みました。




その８　完成
縮小すると字がやけに小さくなってしまったので
小さな紙に印刷することなどを考慮して字を大きくしました。
さらに目印を加えたりして...　完成！