意外に知らないんだなーと思って。 Meiryo UI はWindows7から登場したメイリオフォントの改良（もしくは派生）版です。 メイリオはVistaからですね。 このブログはヒラギノの次にMeiryo UI 、次にメイリオ指定です。 どちらが良いのかは個人差分かれると思います。 大きな違いはカナと文字詰め。 Meiryo UI のカナは半角と全角の中間？というくらい Narrow な感じ。 文字間も詰められていて、これを使うと、かなり全体的に詰まった印象です。 メイリオは一応プロポーショナルフォントらしいですが、和文が等幅なので感じられず。 カナが入ると、かなり横幅が変わってきます。 このようにまとまった文章で見比べると、テキストのボリューム感もだいぶ違いがわかります。 ブラウザでの見え方はこんな感じ しまった・・・英字はArialで表示されてます。 同様の事

こないだロゴを変えてサイトデザインも変えたわけですが、ロゴはもっともっともっと時間かけてやりたいところだったんですが、自分の性格上、それだといつまで経ってもやらないので一気に勢いでやりました。自分のブログですから、また気が向いたらマイナーチェンジを加えていく予定です。 自分のブログなんかでなく、お客さまのロゴ制作をする上で注意している点がいくつかありますので、今回はその辺りを書いてみようと思います。せっかくなのでMaka-Veli.comロゴと併せて とにかく最初は「作らない事」これにつきます まず、とにかく下調べ とにかく競合他社を調べまくります。 どんなロゴを使っているか そのロゴからどんな雰囲気を感じ取れるか どんな人が顧客、潜在顧客なのか（ターゲット） ここで仰天。教えてもらったんですが、なんと有名アニメ（？）のキャラと丸かぶりでしたよ。 良い悪例なので晒しておきます

いつも楽しみ読まさせて頂いてるWP-Dさんから面白い記事が。 コンセプトが無いデザインは味の無い料理と一緒。という話。 / WP-D まったくの同意。もう既にタイトルで「同意！」と思ってしまいました。 ロゴも拝見 させていただき、きちんとつめ込まれたロゴで素敵だなーと思いました。 ちょうどその日、他にもロゴ系で面白い記事があって読んでいたのですが、 10 Tips to Design Memorable Logos | Smashing Hub http://smashinghub.com/10-tips-to-design-memorable-logos.htm ロゴは本当に一球入魂と言いますか、 それ1つで全てを表現しなければならない、非常に大事なモノだと思います。 ロゴから受ける印象と、中身（企業やサービス）を知った時に受ける印象、 そしてそれが独り歩きしますから

Facebook眺めていて、OGPがちゃんと設定されてるのに表示されないモノがあったので少し調べてたんです。先に言っとくと、その件は個人の中ではまだ解決してないんですが、その他のところで気になったのがあったのでメモしときます。 OGPってアレですね、Facebook等でシェアされた時に表示される情報を設定するヤツ。例えば <meta property=”og:title” content=”MAKA-VELI.COM” /> としたら投稿のタイトルが MAKA-VELI.COM になるヤツ。 詳しくはこちら で、気になったのは、これらがきちんと設定されていたページにも関わらず、ogpのimageが表示されていなかったんです。 デバッガー通せばキャッシュされて表示されるかな？と思ったんですが、 なぜかデバッガーではきちんと設定されていた項目になぜか警告とエラーが。 ソース中で

（思いっきり個人的な備忘録ですんません。。） 大分今更感満載ですがメモ。 google mapsのデザイン等はご存知の通りStyledMapTypeというAPI等で変更可能で、JavaScriptで変えたい部分の指定してあげる。※Google Map Ver3以降 意味わからん、という場合はGoogle Maps API Styled Map Wizardで、見ながら変更 左のSelectorでゴニョゴニョといじって、右のMap Style、Addを押すとスタイルが指定されます。最終的にMap Style、下部の「Show JSON」をクリックして出てくるのを使用する、と。 jQuery使ってマーカーなんかも出来るみたいです。 APIと少しのjQueryコードでGoogle Mapの地図の色を変更する – かちびと.net GoogleMapsの参考はギャラリーサイトなんかで

ユーモアのある人生を。　IT / Web / Design / Device / Photo / Movie / Music / LOVE…and HUMOR.　Masato's LifeStyle BLOG 先日、 「デザイン未経験、プログラム出来ず人間がWebディレクターとして前線に立つ為に心がけていること」 という記事を 書きましたが、これは社会人としての心構え的なものでしたので もっと 具体的に、ディレクターとして気をつけている事を今度はメモします。 ぶっちゃけどちらもWebあんま関係無(ry 一番恐れているタスク（プロジェクト）から手をつける 一番気をつけているかも。 タスクが積み重なってくると、優先順位がおろそかになります。 そして、一番仕事しづらい、恐れている事を後回しにしてしまう事があります。 あとでゆっくり、じっくり このタスクは負担が大きいから後で とか

人の教育の話。 人をマネジ、教育する際に、自分のモノサシ基準で動いてる人が多いように思えるんですが、これがどうなのかなぁと悩んでいます。 そもそも「人 」っていうのは「十人十色」と昔から言うように、同じ考え方の人間はほぼ皆無だと思っています。それがどんなに親しい人でも、限りなく距離がゼロになる事は無いはずです。それは生まれ持った性格と育った環境で「世界」という物をどう捉えているか、視点が様々だからと思います。 そんな中、人材育成として人に物事を教える行為は、自分の価値観を押し付ける行為に成り下がっている場合が多いんじゃないか、と思ったのです。 例えば何かミスを起こしてしまった部下がいるとします。 具体的に書いてみますと、、 Aさん（女性）：入社2年目 大学でデザインの勉強をし新入社員として入社。同期はほとんどが営業畑でデザイナー志望が少ない中、元々持っていた才能が今年から開花

最近流行り(？)の「見積額」じゃないです。見積書自体の書き方。 ディレクターやってるとこういうのが気になってしょうがないのです・・・ sample.pdf 最下部にデータ置いておくんで、好きに使ってください。リンクも名前....MOREわかりやすい見積書の書き方 is a post from: Maka-veli.com

-失礼ながら、お嬢様の目はルイジアナでございますか？- 料理の紹介みたいなタイトルになってますが、ディナーの後じゃなくせっかくなので今見ていってください。この記事を読むには約5分かかりますが、人によっては2秒で終わります。先駆者の言葉というのは、古いながらもやはり現代に通じる物が多々あります。デザインで煮詰まった時に先駆者の言葉を見つめると、新しい発想がパーンと出てきそうですね。SHARPENS YOU UP ©FRISK ※なお、冒頭の一文に意味はありません。ノリです。 すべての芸術は自然の模倣に過ぎない。 - ルキウス・アンナエウス・セネカ (ローマ帝国時代の政治家/哲学者/詩人） 全ての芸術は自然の模倣。 つまり自然界にある物はデザインに優れ、本当に必要な物だけにシェイプされ、人間が求める美そのもの、ということでしょうか。 自然から得られるインスピレーションは大きいと思いま

コピーって、イマジネーション湧く素晴らしい手法だと思います。 インスピレーション用に、歴代受賞作品を新しい順にご紹介※毎年分ではありません。 読むポイントは、社名を見て背景を想像すること。 ※画像はイメージをわかりやすくするために、こちらで「勝手に」入れたモノです。 天国に遅れてやってきた妻が、 いきなり私にビンタした。 朝日生命保険　保険王プラス 部長が目にしみる。 シービック / デオナチュレ男シリーズ 家は路上に放置されている。 セコム / セコム・ホームセキュリティ ずるいよ。 チョコ食べてるときに、そんな話するの。 明治製菓 / 明治ミルクチョコレート １度だけ話せるとしたら、なんて言いますか？ アイシア / 新社名「アイシア」の認知度アップのための広告表現 父親の席は、花嫁から一番遠くにある。 キヤノン販売 / キヤノン PowerShot S1IS 死

デザインに限った話でもなく、作られるモノ全てに共通する、そう、アレです。神は細部にナンチャラカンチャラ。頭や理論は理解していても、具体的に落としこむ、あるいは制作中は見えなくなってしまうものです。じゃあ具体的に考えておくことで、実践で活動できればなーと思いたったので記事に。ちなみに書き始めは年明け早々1月1日、遅く起きた午後、いやもう夕方。頭痛いっす。そんなわけ本題どうぞ。 例えばWebサイト さん・おいけ オンラインストア http://www.sun-oike.co.jp/webshop/ キャッチコピーの感じにルビをふっています。 ひらがなの柔らかい雰囲気がプラスされ、 更に下部にあるナビゲーションの縦ズレがリズムを生んで楽しいです。 IKEYAN WEB http://www.ikeyan.jp/ 「Twitter」等の見出しに、わかりやすく、小さなアイコンが添えら

Webサイトを眺めていると、よくロゴの扱い方が雑な物をよく見受けられます。どうもWebの場合はそれが多く見られる気がします。「印刷をしない」 からでしょうか？僕も当時、よく叱られてました・・・ アイソレーションゾーンとは アイソレーションゾーンとは、ロゴ等の周りにある『余白』の事です。 ロゴ周りでなくても、キャッチコピーやタイトルの周りに取ることが多いはずです。 タイトルやキャッチコピーなどの場合は、 ジャンプ率を高めに設定する場合は2~4倍くらいでも良いと思います。 逆にジャンプ率を低めに設定した、あまり強調を必要としない場合でも、 1つ分くらいは空けるとすっきりしますね。 スペースを上手く使える人はプロデザイナーっぽいですよね。 ホワイトスペースは「無駄」じゃありません。 隙間があるからといって、あれこれ詰め込むのはいかにも素人っぽいです。 ロゴレギュレーション 大

全12カテゴリー。分野別で見る、 Webサイトを構築する上でそれぞれ注意すべきポイント Webサイトの目標＝プロジェクトの目標、ではないということ。 続：Webサイトを構築する上で注意すべきポイント に続き、第三弾です。 前回までは、業界別それぞれの注意点や、そもそもサイトを作るという事とは？などについて書いてきましたが、今回はもう少し深く、マーケティングを視野に入れて考えてみたいと思います。企業のブランディングについてです。 そもそもブランディングとは何か ブランディングとは、企業、法人がお客さまやユーザー等へ、自社のブランドを構築・訴求する為の活動その物です。ロゴやデザインに留まらず、接客方針、キャッチコピー、地域性など、様々なモノが対象になり、それを伝える事、そしてターゲットの頭・心にその概念を留めさせ、同業他社との差別化を図る為に行います。 良質なモノに、ある特定の印が付

完全に自分用ですがせっかくなのでシェア 前にこんな記事を書いたんですが、 それをiPodに入れてクルクル切り替えてお客さんに見せるのに使いたく、作りました。 色合いの微妙な議論になった時に便利です。 サイズはiPod C....MOREDLフリー。色見本をiPodやiPhoneに入れておくと、イザという時にとっても便利なので作りました。 is a post from: Maka-veli.com

いち早く70%～80%程度の完成度で人に見せられるものを作ることがいかに重要か、という話 これに便乗した形になってしまってますが、スケジュールに関してはやはり大事な部分なので思う事を綴っておきます。ちなみにこの記事と元ネタの図はとても共感できます。重複もありますが、以下、少し視点は違いますが自分のスケジューリングに関する考えです。 釈迦に説法、ミニにタコ、じゃなくて耳にタコかもしれませんが。 以前書いた配色初心者でも効果的なカラーデザインが出来るようになる4つの工程 でも少し書いてますが「雰囲気のキーワードを出す」と似たような物なのです。 どんなプロジェクトでも軸は必要です。 例えばWebサイト・サービスや映像、プロダクトだけでなく、 イベント、採用なんかでも目的が存在します。 その目的に対してどんな事が理想のゴールになるか、 これが軸、いわゆるコンセプトに近いものなりま

よく本とかでも書かれていますし、 人によって考え方が違うのであまり書く気なかったのですが、 自分の勉強のタメにと、思った事を書いてみます。 作法が違う 良く出るお話。 紙デザインは媒体によって大きく求められる物が変わります。 雑誌 新聞広告 チラシ パンフレット 看板 専門誌 ここではあれてこれらも紙デザインと呼ばせて頂きます。 これらは大きく目的が分かれる事があります。 広告系にはインパクトが、事業案内などのパンフレットには 中身をしっかり伝える可読性とブランディングが、など。 逆にWEBサイトは オフィシャルサイト 販促サイト SEOランディングページ など、どれも当然「WEBページ」というくくりなので、 そこまで違いは無いにしろ、その中での目的がはっかり分かれます。 しかし、 紙とWEBで大きく分かれる特徴としては WEBサイトはSEOやユーザビリティ、アク

どーも。最近SNSの使い方がわからなくなりつつある僕だよ。 久々にデザイン系のネタ。いや、ちょっと乗り遅れたタイポグラフィネタか・・・ 広告で数字が一番の訴求対象になる場合は多く、 数字だけで完結する物もあります。 そういった場合は、数字デザインをこだわりたいですね。 テレビ東京新卒採用サイト 7chと第7感って事でかけてますね。 モビット 数字を強調させる設計ですね。数字自体の効果が凄くキレイ。 No.DesignTech The 10 意味不明にカッコ付けてみました。以下が見せ方と自作サンプルです。 目次 数字以外を小さく 丸で囲ってみる 枠端で薄く背景に イタリックに 比較させる 数字だけを強調 弱い要素のアイキャッチに 数字だけでも シンプルな物は英字と組み合わせるのも 本文中は太字、下線を取り入れてみる 数字以外を小さく 見たい、見せたいのは数字です。 広告の