タグ

ブックマーク / maka-veli.com (25)

  • そろそろグラフィックリッチなメタファ、スキュアモーフィックとか楽しいコラージュも欲しくなってきた / Maka-Veli .com

    どっぷり世界観に入らせるメタファとか、コラージュとか非現実的の中間な感じも好きだし、もちろんリアルを追求したデザインとか、やっぱこういうの、好きだなぁ… OhDeer Games! http://www.ohdeergames.com/ スクロールするとの中に入ってく。楽しい。 Cornelius Krump http://corneliuskrump.com/ ヒゲめ...。 How To Spend It http://howtospendit.ilsole24ore.com/ 数字が全部宝石やスカーフで表現されてる。撮影で作ったのかな? OH-MY-DESIGN.com http://www.oh-my-design.com/ 日人 Akiyoshi Ishigamiさんのサイト。アートな感じでカッコいい。 Pasta Maltagliati http

  • デザインノイロハが面白かった / Maka-Veli .com

    僕はあまり知らないのですが、「モーニング」のWeb版で「モーニング・ツー」というのがあるようで、そこで連載されていたのがこの「デザインノイロハ」という漫画です。 それが今回、電子書籍になって発売されたので読んでみたのですが、これが面白い・・・ 『デザインノイロハ』とは 卒業してから1年間、世界中を旅していた花井裕太は就職面接で地雷を踏みかけるも、なぜか採用され、デザイン事務所「3.2.1.」の新人デザイナーとしてこき使われる日々。事務所の先輩の面々は良くも悪くも個性的で、裕太は振り回されるばかり。ようやく自分ひとりでやる初仕事を任され、意気が揚がるものの、クライアントであるエステサロンの女社長はしたたか、かつ強引で……。 “新人”が溢れる季節に贈る、期待の新人漫画家による新連載! ※MORNING MANGA.COM より引用 主人公は当にズブの新人で、デザイン業界特有のハードワ

  • #Font 和文(日本語)フォントメーカー 一覧 / Maka-Veli .com

    和文(日語)有料フォントをざざーっと見比べたい時って皆さんどうしてますかね? って友人に聞かれて、そういえば欧文みたいにまたいでサクサク見れたらいいのになぁーなんて思ってて。僕はとか雑誌とかで探したり、フォントメーカーサイトを見まわったりしてるんですが、何か良いのご存知ないでしょうか? そんなわけで、よく使っていたり、買いたいなーって狙ってるの合わせて、和文フォントメーカーサイトを挙げておきますね。 モリサワ http://www.morisawa.co.jp/ AXIS http://www.axisfont.com/ フォントワークス http://www.fontworks.co.jp アドビ http://www.adobe.com/jp/products/type.html 大日スクリーン http://www.screen.co.jp/ga_product/

  • 約400種の欧文フォントが全部無料(商用可)でWebFontも使えちゃうFont Squirrelって素敵 / Maka-Veli .com

    もう数年前にコリスさんやCREAMUさんで紹介されてましたが、恥ずかしながら知らなかったです。こんなに素敵なサイトがあったなんて。 最近DesignModoで紹介されていたので知りました。 すげー関係無いけどCREAMUさんのブログ超好きです 全部フリー 基的には全て商用可。だそうです。 100% Free For Commercial Use. ただしフォントそれぞれにライセンスはあるので一応、要確認。 とても探しやすく、種類も豊富。400近くはあるんじゃないでしょうか? 個人的には探しやすい点がとても気に入りました。 そしてもう一つ素敵なコンテンツがあったのですが Webfont kit がDLできる。そして作れる。 うちのサイト名やナビゲーション等に@font-faceでLeague Gothicを使ってますが、この@font-faceでwebfont使う時に必要な

  • 自分がロゴを作る時に意識してるポイント / Maka-Veli .com

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

  • 味付けは包丁を握る前が命 [ロゴデザイン時の注意点] / 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つで全てを表現しなければならない、非常に大事なモノだと思います。 ロゴから受ける印象と、中身(企業やサービス)を知った時に受ける印象、 そしてそれが独り歩きしますから

  • そのデザイン処理、こんな風に工夫すればもっと良い物になりますよ / Maka-Veli .com

    お前偉そうだなシリーズ第一弾 まぁ全部、全体のデザイン次第ですし、流行りモノ感もありますが。 ちょっとだけ変えると、グッとクオリティ上がりますよー的な小ネタです。そしてかなり個人的趣味です。 シャドウ ドロップシャドウなんかは手軽にクオリティ上げられていいですよね。 ただシャドウはつけすぎる(濃すぎる)と主張が強くて重くなりがち。 シャドウ自体はただの効果・装飾ですから、体を引き締める程度にかけておけば良いと思います。 また、単なる上下・左右のシャドウではなく、球体・曲線でシャドウを上手く入れていくと面白いですよ。柔らかみもありますし。 グラデーション 立体感を出してチープな印象を防げるグラデ。 ただ、最近はベタ塗りでビビットに見せる装飾が流行ってきましたね。 思い切ってベタに変えるのも手。 もしくは、かなり差を狭くして「これグラデ?」と思わせるくらいのモノが良いかも

  • わかりやすい見積書の書き方 / Maka-Veli .com

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

  • UXデザイナー(User Experience Designer)は本当に必要なのか? / Maka-Veli .com

    ※超今更です。今更UXかよと言われそうで恥ずかしいんですが、まだまだUIUXが混同されがちだなーというのと、じゃあUXって必要なのかよ?というモヤモヤを整理したいなと思い書きました。 UXデザインとは まず前提ですが、UX(User Experience)デザインとは、 ユーザーエクスペリエンス(UXと略記されることが多い)とは、ユーザーがある製品やシステムを使ったときに得られる経験や満足など全体を指す用語である。ウェブ上での商品販売などソフトウェアやビジネスに関連して使われることが多いが、インタラクションデザイン全般に適用される概念である。例えば自動音声応答装置は貧しいユーザーエクスペリエンスをもたらすデザインとしてよく引き合いに出される。VIA:Wikipedia と、あります。 ユーザーエクスペリエンス=直訳するとユーザーの経験・体験と翻訳されますが、ユーザーが満足するかしな

  • ディレクターとは?Webディレクターなら覚えておきたい知識・技術、そしてスタンス / Maka-Veli .com

    Twitterで話してたんですが、『ディレクター』って当に微妙なポジションだなぁと感じました。 というか、そもそもディレクターって何でしょうね? ディレクターと聞くと、まだまだ映画のディレクターの方が知名度高いのではないでしょうか。 そこから来て、やはり日では、現場監督的な位置づけが多いんですかね。 Webディレクターは、プロジェクトを指揮・管理する役割が多いはずです。 ※だから決して偉いというわけではないです。あくまでも繋ぎをする作業者ですから、上下関係はありません。 Webディレクターの系統 Webディレクターは、大体「Web制作会社」「システム開発会社」「サービスプロバイダー系会社」「広告代理店」等に配属され、更に 営業寄り 企画寄り デザイン寄り システム寄り という具合で分かれると思います。 それぞれ活躍する場が違うので良いと思うんですが、 それに伴い、ディ

  • ロゴの扱い方でプロとアマの差が出る。アイソレーションゾーンとレギュレーション・ビジュアルアイデンティティについて / Maka-Veli .com

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

  • ブランディングとは何か。ブランディング活動の基本をWeb制作時に意識しよう。 第三弾『Webサイトを構築する上で注意すべきポイント』 / Maka-Veli .com

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

  • 自分で言うのもなんだけど、激務ディレクターの僕が手が回らない時に気をつけてる事と高効率化の方法 / Maka-Veli .com

    の手を借りたい程作業が多くて手が回らない時に僕がよくやる効率化の話。 リマインダー方式 作業を振って忘れます。 何でもかんでも他人に任せるのは良くないですが、(クオリティ維持的に見ても) ただ、クオリティに関係無く、どっちが作業やっても良いという場合は振ってしまいます。 例えば 不明点をまとめ、先にメールで質問しておく 設計図、概念図を書いて、不備が無いかチェックをしてもらう 現状把握のまとめを同意を得る為にメールして見てもらう 普通の話ですが、、、 作業のスパン毎に、取っ掛かり等の大事な部分をこちらで行い、 残りを他人に委ねて完成に近づけておきます。 メールでもそうですが、投げておいて、返事の時に思い出す方式です。 そして見てもらう事で、問題点の洗い出しを行なってもらいます。 ポイントは、先に、すぐにとりかかる事です。 重要ポイントで、すぐに出来そうな物はすぐ取り

  • ドロップシャドウって色んな種類あるんで、PSD作ってみました。もちろんフリー・商用可。ダウンロードしてっちゃって下さい。 / Maka-Veli .com

    色んなサイト見てると、当色んなドロップシャドウかけてるんで、じゃあどういうのが見てて気持ちいいかなーと思って色々とやってみました。 サンプル作ったは良いけど持っててもアレなんで、PSDをZipで固めて置いておきます。 お好きにどうぞ。※PSDダウンロードは最下部にあります。 普通のドロップシャドウ。 普通ですね。ほんと、普通です。 両端めくれ上がってる系。 よく見られますよね。紙なんかの表現の際はけっこうリアルに見えますよね。 より、めくれちゃってる系。 もう少し立体感を出したタイプですね。照明が強めなイメージ。 使い所が意外に難しい。 真ん中が浮き上がってる系。 うちのトップページでも使ってます。 個人的にはセンター合わせの際にバランス取りやすいかなーと思って。 なぜか浮いてる系。 平面で、なぜか浮いてる感じ。 あんまり好きじゃないかも・・・ くっきりシ

  • アナタはどの部分に目がいきますか?デザインの基本:視線誘導や視認性について。(エロいようで真面目な話) / Maka-Veli .com

    まずはこの画像をクリックしてご覧ください。 上記画像は話題のPinterestですが・・・ もしアナタが男性なら、 この辺りに目が行ってないですか? もしアナタが女性なら、 この辺りですか?(浅はかでしたね・・・女性はもっと違うところですね) そんなの当たり前? じゃあなぜだと思います? 色分けすると・・・ 目立つのは左の黒っぽい2点か、右上の赤1点じゃないでしょうか。 人の目は色で判別しがちと思われますが、デザインは色だけじゃないって事ですよね。 これらの例は少し強引な意味づけしてますが、大筋はおわかりになると思いますので、その体で話を進めます。 もちろんこれらの例は、能的に視線が誘導させられてるのですが、 この視線誘導には色んな手法がありますよね。 Z / Fの法則だとか、色の問題だとか、あとは上記のように性別的な問題。 Webサイトデザインの場合 左上や

  • PhotoShopで最適な画像保存をする為に。ニアレストネイバー法やバイキュービック法でのリサイズやJPEG圧縮などを検証したよ。 / Maka-Veli .com

    どうも。某サイトのクオリティにがっかりしてる松です。 これからは自分らしく普段通り書いていこうと思いますので宜しくお願い致します。 さて、今回はPhotoShopの画質変換・圧縮についてです。 ニアレストネイバー法、バイリニア法、バイキュービック法でのリサイズと、保存時の圧縮率パーセンテージ別、更に写真の特徴なんかとを比較すると何か新しい発見があるかなぁとふと思いましたので検証してみます。そもそも、それ何?という方も、簡単な説目を書いておきますので合わせてご覧ください。 それと「プログレッシブ、プロファイル、カラーマネージメント」なんかが複合的に絡むとややこしいので割愛。 一番シンプルなアルゴリズムなんじゃないでしょうか? 変更前の座標と、変更後の座標を、ピクセル単位で計算し移動させ、そのピクセルに対して変更前の色を割り当てる。 ドットをそのまま拡大、縮小する ような感覚で

  • ” 神は細部に宿る ” じゃあどうすれば良いんだ?を細かい部分に落としこんで具体的に考えてみた。 / Maka-Veli .com

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

    www_taca
    www_taca 2012/01/05
    つねにディテールは意識したい
  • 配色初心者でも効果的なカラーデザインが出来るようになる4つの工程 / Maka-Veli .com

    タイトル間違えました。 「僕みたいなクソデザイナーが配色する時に騙し騙しデザインする手法」です。 配色には色々作法があります。そして言葉もあります。加法、減法、色の三属性、伝統、政治的意味合い、などなど。厳密に出したらキリがありませんし、プロじゃないので、細かい事は抜きにして、個人的に抑えておく簡単なポイントをまとめてみました。 雰囲気のキーワードを出す なんとなくのキーワードを出します。 カッコイイ! うぉ!すっげ!って感じ クール とにかく渋く。鳥肌立つ感じで 可愛いっぽく。 やっぱ少し可愛くが良い ラブリー♡ もうワクワクーって感じで♥ シンプルに。 余計な物はいらん インパクトどーん とにかく覚えてもらいたい! 爽やかーーー キレイに見せたい! 楽しい! チョーハッピ スーパーハッピ ノ…(ry など。 ここで決めたキーワードがベースになります。 常に頭に入れてお

  • 数字はデザインに重要な要素。数字の見せ方10個(サンプル有り〼) | ユーモアのある人生を。【Maka-Veli.com】

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

  • ディレクターが思う。Webサイト設計時に必ず注意したい2つこと(+1) | ユーモアのある人生を。【Maka-Veli.com】

    まず前提として、「ヒアリング」がディレクターとしては最も重要な要素ですが、 これは別の機会とさせて下さい。 ヒアリングを行う上で、もしくは行った上での対策3つです。 いわゆるターゲッティングです。 必ず必要になる設計要素で、 これが無ければWebサイトの成功は無いと個人的には思っています。 なぜターゲッティングが必要か? 見たい人が見ないサイトでは、存在価値がありませんよね。 これは、設計時や表面上のデザインに大きく影響します。 女性向け、男性向け、10代、50代、様々なターゲット層を 踏まえ、サイトを構築する事が重要です。 どのように行うか? ターゲットを想定し、見せたい情報は何か、ユーザーが知りたい情報は何か? そしてどんな人が訪れる可能性があるか? それら全てを想定します。 よく行われるのは「ペルソナマーケティング」と言われる手法で、 ペルソナ=架空の人物