タグ

designとtipsに関するjamgのブックマーク (24)

  • 分かりにくいメイキングオブループ絵

    超適当ループ絵作成講座。 要望があったのでメイクングっぽいのをつくってみました。 自己流もいいところなので、無駄冗長がてんこ盛りです。 しかも管理人日語が下手で分かりにくいです。 「へーこんなことしてるのこの菌類!」くらいの気持ちでご覧ください。 (ちなみにハロウィンので説明しようと思ったんですが、あれ原画残ってないので単純な絵で説明します) 作成に使うもの:絵・フォトショ (フォトショがそこそこ使えるのを前提に説明してます。 フォトショの使い方に関してのご質問はご勘弁ください)) 1:まず絵を描きます 解像度が高い画像を用意した方が完成がきれいです。 ハロウィンのは360dpiでした。200はあるほうがキレイです。 正方形や長方形から飛び出してる構図の方がループさせやすいです。 (これは四角いのでしにくいです…) 2:完成サイズを決めます 完成サイズの大き

  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    jamg
    jamg 2009/09/09
    "フォントはWindowsならメイリオがきれい。無料だし。"えっ?
  • 渋谷員子のドットの匠

    渋谷員子のドットの匠 インデックス こんにちは、渋谷です。 みなさん、ドット絵は好きですか?描いてみたいですか? 描いてみたいけれども、どうやって描いていいかわからないし、上手に描けない。。。 そもそも、どうやって描いているの?? そんな初心者のみなさんのために 私がじっくりレクチャーしていきますので、お付き合いくださいね。

  • デザイナーがDTPからWebに移行する際の11のアドバイス

    デザイナーがDTPからWebに移行する際の11のアドバイスをThe Design Cubicleから紹介します。 Transitioning from a Print to a Web Designer 以下、その意訳です。 DTPからWebに移行する際、今まで培った法則やスタイルを捨てるということではありません。Web向けにそれらのスキルを活用します。 実際、紙を模倣したデザインの人気は高く、ニュースサイト、Eコマースサイト、ブログなど多くのウェブサイトで採用されています。 1. Design your sites and images at 72dpi 72dpiでデザイン Webは300dpiではなく、72dpiを使用します。 2. Use RGB RGBを使用 カラーモードはCMYKではなく、RGBを使用します。 3. Design in Photoshop 作業はPhotosho

    jamg
    jamg 2009/04/14
    ヘタなことされるよりはいっそ pdf でいいよ、とか思ってしまう。
  • ギャルゲーブログ 便利な画像ください

    2024 07 ≪ 12345678910111213141516171819202122232425262728293031≫ 2024 09 1 名前:名無しにかわりましてVIPがお送りします[] 投稿日:2009/04/03(金) 18:12:02.98 ID:yaF+8D9a0 こういうの 3 名前:名無しにかわりましてVIPがお送りします[] 投稿日:2009/04/03(金) 18:24:20.37 ID:/Xltw/6C0 12 名前:名無しにかわりましてVIPがお送りします[] 投稿日:2009/04/03(金) 18:41:12.88 ID:yaF+8D9a0 既出だけど東京地下鉄路線図 15 名前:名無しにかわりましてVIPがお送りします[] 投稿日:2009/04/03(金) 18:51:27.61 ID:/Xltw/6C0 首都圏路線図はこれが一番 http://w

  • テキストをかっこよく魅せるPhotoshopのチュートリアル集:Part 11

    テキストをかっこよく魅せるPhotoshopのチュートリアルの紹介です。 How to Create High Quality Metal 3D Text Striking Text Effect U

  • 美篶堂

    伊那製所 〒396-0111 長野県伊那市美篶6768-2 TEL: 0265-76-7772 FAX: 0265-76-7733 伊那製所直売所の営業時間について 美篶堂東京営業所 〒162-0814 東京都新宿区新小川町5-9クラフト孝和1F づくりハウス内 TEL: 03-5946-8817 FAX: 03-5946-8817 アクセスマップ : Google MAP Online Shop: http://misuzudo.shop13.makeshop.jp/ ご来店予約のお願い

    美篶堂
  • デザインに関するよいお言葉 : could

    デザイン言葉 デザインに関するよいお言葉 以前、UXに関するよいお言葉という記事で、様々なデザイナーが残した UX に関する言葉を引用しました。今回はネット上で見つけたデザインに関する様々なメッセージを紹介します。 Edwin H. Land クリエイティビティに必要な側面のひとつに「失敗を恐れない」がある。 Saul Bass デザインとは考えを視覚化することである。 MetaDesign 深みのない美しさは、単なるデコレーションである。 Josef Albers デザインでは、1+1=3 になることがある。 Paul Rand すべてがデザイン。すべてが! Frank Lloyd Wright 形態は機能に従うとは誤解である。形態と機能は一心同体で密接に繋がっている。 Steve Jobs デザインは見た目や感覚的なものだけではない。デザインとはいかに機能するかである。 Joel Sp

    デザインに関するよいお言葉 : could
  • CSS Spriteを活用しよう - DesignWalker

    CSS Spriteを活用しよう - DesignWalker
    jamg
    jamg 2009/01/28
    CSSの書き方はアサノさん経由で大分前から知ってたけど、いざ書いてみると結構面倒なんだよなぁ。http://www.mushline.com/junky/2003/11/15/231249 CSS Sprite っていうのかー。jQueryが気になる。
  • 用紙サイズと画面サイズ

    用紙サイズの規格には、A判とB判があり、それぞれの縦横比は1:1.4となっています。 また、A4判、B5判などのように、後に続く数字によって紙の大きさを表しています。 数字は、サイズが1/2になる毎に1ずつ増えていきます。 また、解像度は、1inch(25mm)あたりのドット数を、DPI(Dot Per Inch)という単位で表します。 以下に、各解像度毎の用紙サイズと画面サイズの対応表を示します。 A判用紙サイズ対応表 用紙 種類 用紙サイズ (mm) 画面サイズ(dot) 72DPI 144DPI 300DPI 600DPI

  • Web2.0風デザインのための秀逸チュートリアル68選 | S i M P L E * S i M P L E

    こ、これはかなり使えます・・・。 が、とっても紹介が難しいのでさらりと。今回は実験的なエントリーとして画像一切なしで。 『Web2.0風デザインのためのチュートリアル68選』です。 » Web 2.0 Webdesign-Tutorials | Dr. Web Weblog 以下の7つのカテゴリーにわかれています。 サイトをこれから作るぞー、という人には大いに参考になる素晴らしきチュートリアルかと思います。 ビジュアル効果系(1~11) ロゴ系(12~25) テキスト(26~33)系 バッジ系(34~39) ボタン系(40~46) レイアウト系(47~60) Web2.0まとめ系(61~68) 個人的には1、2、12、13、40、41あたりが好きですね。今後使えそう。 しかし、こういう海外サイトのまとめをまとめとして紹介するのは難しいですよね・・・。そのまま紹介するのも「どうなの、それ?」

    Web2.0風デザインのための秀逸チュートリアル68選 | S i M P L E * S i M P L E
  • Webデザインとグラフィックの総合情報サイト - MdN Interactive - Webデザイン超基本のお作法50選

    Webデザインには、どんなにビギナーだったとしても、プロのWebデザイナーを名乗る人がやってしまうと恥ずかしい“マナー”ともいえる制作上のルールがあります。「知らなかった」、「教わっていない」では通用しません。なぜなら、アナタはプロなのですから。 そんな超基の“Webデザインのお作法”を50個選定し、サイト設計、テキストデザイン、画像と色彩、レイアウト、その他の5つのテーマ別に解説していきます。この特集を通して、“Webデザインのお作法”をしっかり習得、あるいは復習して、カンペキに身に付けてください。

    Webデザインとグラフィックの総合情報サイト - MdN Interactive - Webデザイン超基本のお作法50選
  • チープカ - はてなダイアリーのデザインを作るうえでのtips

    CSS | 01:06 | はてなダイアリーのデザインをいじる上ではてなダイアリー独自に気をつけなくてはいけないものについて例をあげてみます。DOCTYPE宣言が互換モードまず一番問題になるのがここでしょうか。気をつけなくてはいけないのはなんといっても「IEで見るとwidthにpaddingがふくまれる」という点です。これはIE7になっても変わりません。そのためwidthとpaddingを同居させた要素を記述した場合にIEと他のモダンブラウザでは表示が変わってしまいます。回避策で一番簡単なのは同じ要素にwidthとpaddingを同居させないということです。ただしはてなダイアリーの構造上h1とかでwidthとpaddingを一緒に使わざるを得なくなったりするのでそん時はハックするしかないです。はてなのヘッダを透明にするはてなのヘッダは配色がしやすいように、画像部が透過されるようになりました

    jamg
    jamg 2007/02/11
    まったく関係ないんだけどファビコンが黒くて吃驚した。
  • そろそろCSSハックの良し悪しについて考えてみる(書式編) | Blog hamashun.com

    関連リンク そろそろCSSハックの良し悪しについて考えてみる(書式編) そろそろCSSハックの良し悪しについて考えてみる(管理編) おまけ付き Re:CSS の用途をわざわざ (X)HTML に限ることはない スターハックに端を発するアレコレ スターハックに端を発するアレコレ まとめ編 フルCSSでサイトを制作する際に、まだまだ避けては通れないのがCSSハックです。 巷には色んなハックが溢れていますが、今回は良いハックと悪いハックを『書式』をキーにして考えてみたいと思います。 なお、ハックはあくまで最終手段であり、使わないにこした事は無いという事を、事前に書いておきたいと思います。 また、一部CSSハックと呼ぶには語弊があるテクニックもありますが、ブラウザ実装の差異に対する技術、といった意味合いで、この記事ではハックで統一しています。 バリデータに通るか否か まず最低条件として、バリデータ

  • Dive Into Accessibility

    この文書は2つの質問に答えるために書いてみたんだ。 1コ目は、「なんでサイトをアクセシブルにした方がいいのか」。 だから、ここの情報はサイトを持ってない人には向かないかも。 2コ目は、「じゃどうしたらサイトをアクセシブルにできるのか」。 1コ目の答えが納得できるものじゃなかったら、2コ目はどうでもいいってことになるよね。 じゃ行ってみよう。 Dive Into Accessibility(英語版)をダウンロードする HTML英語版)をダウンロード PDF英語版)をダウンロード Dive Into Accessibilityを読む 目次 掲載された順序のままにならべてある、すべての情報はこちら。はじめてココ の文を読むときにおすすめの読み方。 人に基づいた情報分類 ここではどんな人に役立つかによって、情報が分けられています。 障碍に基づいた情報分類 ここではどういった障碍があるときに役立

  • Faviconをつくるときに参考にしたいデザイン&ツールいろいろ | P O P * P O P

    アドレスバーやブックマークの左側に表示されるFavicon(こんなの↓ですね)に関する記事がありました。 参考になりそうなきれいなデザインやツール類があったのでご紹介。これからFaviconつくるぞー、という人はよろしければどうぞ(それよりもこのブログのFaviconをなんとかしなくては・・・)。 » Inspire Yourself: 50 Remarkable Favicons | Smashing Magazine 下記に一部をご紹介。 ■ 花びら系デザイン ↑ カラフルですね。 ■ 丸系デザイン ↑ 丸を上手に使ったデザインはWeb2.0ぽい気がします。 ■ 文字系デザイン ↑ Googleの「G」やmixiの「m」もそうですね。はてなはブックマークは「B」、ダイアリーは「D」などと分けているようです。 ■ 模様系デザイン ↑ 凝ってますね。 ■ 四角系デザイン ↑ Appleは四

    Faviconをつくるときに参考にしたいデザイン&ツールいろいろ | P O P * P O P
  • Modern Syntax : ポリッシュド・テキストの作り方

    さて、モダシンラジオのデータをホスティングしてもらっているSpotify for Podcasters(旧Anchor)の私のページはこちらです。 https://podcasters.spotify.com/pod/show/kazuyoshi-nagasawa このSpotify for PodcastersページのRSSは以下になります。こちらのRSSではenclosureタグなどでlength値などがしっかり入っているのでこれを購読しておくとよいかと思います。 https://anchor.fm/s/66ff2830/podcast/rss ここで聴く!という人は以下のプレイヤーからどうぞ。 んで、これまではGoogle Drive上に保存したmp3ファイルを聞きたい方は以下のリンクをクリックしてください。ブラウザ内で聞けます。 https://drive.google.com/f

  • セクシーなCSSホバーボタンを作成するチュートリアル:phpspot開発日誌

    NuBlue Blog Sexy CSS Hover Button needed to make a big button which gave the illusion of being pressed in when a user hovered the mouse over it for a client. セクシーなCSSホバーボタンを作成するチュートリアル。 次のようなボタンを作成するのに、PhotoShopでのチュートリアル&CSSサンプルが紹介されています。 ボタンは、ホバー時に画像が切り替わります。 HTMLコードは次のようにXHTML。 <ul id="bigbuttons"> <li class="gallery"> <--put your link in here--> </li> <li class="contact"> <--put your link in he

  • caramel*vanilla » アメリ風Photoshopのアクションを作ってみた

    jamg
    jamg 2006/12/05
    うほ、いいアクション
  • Photoshopで写真をベクターアートにするチュートリアル

    左が元になった写真で、右がそれをPhotoshopを使ってベクターアート化したもの。 こういうのはどうやってするのだろうか?と思っている人向けのチュートリアルです。実際の作業手順をムービーでダイジェスト風に見せるというのも含まれているので、完成に至るまでの手順を見るだけでも面白い。 詳細は以下から。 Vector Art with Photoshop - Online Tutorial at Melissa Clifton page 1 ベクターアート化したものをアップにしたのはこちら。拡大しても画像が荒れないのはベクターアートのいいところ。 Melissa Clifton Gallery - Bjork Vector 完成までの手順を約59秒のムービーに圧縮したモノ。実際の作業時間と使用しているレイヤーの数も表示されています。 YouTube - Bjork Vector Art 2

    Photoshopで写真をベクターアートにするチュートリアル