布地のパターンファイル20 – creamu
継ぎ目のない布地のパターンを探している。 そんなときにおすすめなのが、『Tileables Pattern Pack #4』。布地のパターンファイル集です。 いい感じのパターンになっていますね。ダウンロードすると、patファイルが入っているので、それを開くとPhotoshopにパターンとして登録されます。 PSDファイルも入っているので、レイヤーごとにどんな布地なのかを確認できます。 テクスチャやパターンを探している方は、一度見てみてください。 Tileables Pattern Pack #4 引越し先が見つかりました。来月引越しなので、それまでにいろいろと進めようと思います。 JAVAプログラマへご応募いただいている皆様、ありがとうございます。ばたばたしていてまだ返信できておりませんが、本日中にご返信いたします。 あと今日は税理士さんと打ち合わせ。数ヶ月分の損益書等を出してもらいました
Photoshopでリアルな紙のテクスチャを作る方法 – creamu
リアルな紙をPhotoshopで描きたい。 そんなときに参考になるのが、『Create a Realistic Paper Texture in 5 Minutes 』。Photoshopでリアルな紙のテクスチャを作る方法です。 以下のような流れで解説されていますね。 1280 x 1024pxの新規ドキュメントを作成。「長方形選択ツール」で矩形を描いて、qを押下。クイックマスクモードに入る。「フィルタ / ピクセレート / 水晶」でセルのサイズに「3」を入力してOK。もう一度qを押下してクイックマスクモードを解除、「Cmd+shift+alt+N」で新規レイヤーを作って、dを押下後、「Cmd+Delete」で選択範囲を白で塗りつぶす。「Cmd+D」で選択範囲を解除 「焼き込みツール」で露光量を20%にし、紙を暗く汚い感じに見えるまで塗る。その後、「フィルタ / テクスチャ / テクスチャ
クオリティーの高いアイコンデザインチュートリアル35 – creamu
98125356/ iStockphoto/ Thinkstock かっこいいアイコンを自分で作りたい。 そんなときに参考になるのが、『35 icon design tutorials in Photoshop and Illustrator』。クオリティーの高いアイコンデザインチュートリアル集です。 Photoshopと、illustratorのチュートリアルがたくさん紹介されていますね。かなり細かく解説されているのでわかりやすいのと、psd、ai(eps) ファイルがダウンロードできるものもあります。 How to Make a Professional Buddy Icon in Photoshop Photoshopでスーツ姿の男性のアイコンを作るチュートリアル Icon design tutorial:How to make a Calendar icon iCalのような、カレ
素晴らしいWebデザインチュートリアル集 – creamu
デザインの幅を広げたい。 そんなときにおすすめなのが、『The Ultimate Collection Of Brilliant Web Design Tutorials』。素晴らしいWebデザインチュートリアル集です。 クオリティーの高いものが揃っていますね。いくつかご紹介します。 Design an Italian Restaurant Web Layout レストランのサイトをデザインするチュートリアル。デフォルトで入っているカスタムシェイプをうまく使う方法など Create a Sleek, High-End Web Design from Scratch 背景のテクスチャやブラシをうまく使った、クールなサイトのデザイン手法 Create a Photo-Realistic Web Layout 木のテクスチャをうまく使ったデザイン Design a Non-Profit Web
リアルな万年筆を描くPhotoshopチュートリアル – creamu
ペン等の絵を自分で描きたい。 そんなときに参考になるのが、『How to Create a Realistic Fountain Pen』。リアルな万年筆を描くPhotoshopチュートリアルです。 かなり細かく解説されていますね。ぼかし（ガウス）やぼかし（移動）、選択範囲の拡張・縮小やグラデーション、シャドウ（内側）などのディテールまで、一通りやってみると別のものを作る時にも参考になるかと思います。 原文には書かれていませんが、「ビュー / 表示 / グリッド」（command + @）でグリッドを表示しながらやると、ペンツールで作業しやすいですね。 PSDを作ったのでよかったら見てみてください。 How to Create a Realistic Fountain Pen 日曜日！今日も天気いいですね〜。久々に六本木まで行っていろいろ進めようかな。
HTML5のクールなサイト – creamu
DIVE INTO HTML5というサイトを見つけました。 HTML5でサイトを作っていますね。フォントには@font-faceを使って、EOTファイルを使っています。 HTML5からWeb Fontsとして、サーバにフォントファイルをアップロードすることで、ユーザのPCにインストールされていないフォントでも利用できますが、IEはライセンス情報を埋め込んだ特殊なフォントファイル（EOTファイル）のみ認識するため、別途EOTファイルの作成が必要です。その対応をしているようですね。 デザインフォントに見えるところも、テキストになっているので、なかなかいい感じです。 DOCTYPE宣言と文字コード指定もシンプルですね。 HTML5の参考に、ぜひ見てみてください。 Dive Into HTML5 ウィンドウのサイドにFollow meボタンをつけました。と思ったらフォロワーが一気に、いつもより多い
シンプルだけど便利なCSSプロパティー5 – creamu
WebDesignerWallで、シンプルだけど便利なCSSプロパティーが紹介されています。 ざっとご紹介しますね。 CSS Clip 画像にレクタングルのマスクをかける Min-height 高さの最小値を指定する「min-height」。コンテンツの高さがサイドバーよりも低いときなどに。IE6に対応させるハックもある White-space 「white-space:nowrap」を使って、アルファベットが途中で切れてしまうときに改行させる Cursor ボタンがDisabledになったときに「cursor:default;」を指定してクリッカブルでないことを明示する Display inline / block displayプロパティーを使って、ブロックレベル要素をインライン要素に。その逆もあり 復習がてらに一度見てみてください。 5 Simple, But Useful CSS
象徴的なロゴデザインをする方法 – creamu
JUST CREATIVE DESIGNで、象徴的なロゴデザインをする方法が紹介されています。 ロゴデザインには、以下のような要素が必要であるとのこと。 シンプルである 記憶できる 時代にとらわれない 用途が広い 企業特有のものである また、著者である「Jacob Cass」の頭文字をとって、J&Cの架空のロゴをデザインするプロセスが載っていますね。 サンプルのEPSファイルが以下からダウンロードできます。 download here 完成前と完成後のイメージが載っているので、一度見てみてはいかがでしょうか？ Tutorial: How To Create An Iconic Logo Design 久々にドクターマーチンのブーツがほしくなったから買いに行こうかなっ♪
WordPressを高速化するテクニック18 – creamu
wpbeginnerで、WordPressを高速化するテクニックが紹介されています。 いくつかご紹介しますね。 ・キャッシュする WP Super Cacheプラグインを使ってページをキャッシュ ・直リンクを禁止する 以下の.htaccessで直リンクを禁止 #disable hotlinking of images with forbidden or custom image option RewriteEngine on RewriteCond %{HTTP_REFERER} !^$ RewriteCond %{HTTP_REFERER} !^http://(www\.)?yourdomain.com/.*$ [NC] #RewriteRule \.(gif|jpg)$ %u2013 [F] #RewriteRule \.(gif|jpg)$ http://www.yourdomain
写真が綺麗なレシピサイト6 – creamu
前からまとめてみたかったのでまとめてみます。 写真が綺麗なレシピサイトです♪ 101 Cookbooks Simply Recipes smitten kitchen Cookthink Group Recipes All recipes 中でも、Simply Recipesにはしびれています。Elise Bauerさんが一人で運営されているブログ/パーソナルWebサイトとのことですね。数百のレシピがあって、自分や家族、友人に食べてもらってるとのこと。 こういう女性や主婦が増えてくるとおもしろいですね。 ほかにもいいレシピサイトがあったら教えてくださいーー。 外苑前のカフェで飲みながらブロギング。ちょー楽しい。 CIBONEでプレゼントを買ったぞ。あと6/26 – 7/26までセールをやってて、50 – 70%オフになっててあやうくソファを買いそうになりました☆
illustratorでどんなフォントもスケッチフォントに変える方法 – creamu
vectipsで、クールなTipsが紹介されています。illustratorでどんなフォントもスケッチフォントに変える方法ですね。 ↑みたいなフォントが作れます。 1. テキストツールでテキストを入力 2. 塗りと線をなしにする 3. アピアランスパネルで、新規塗りを追加 黒を選択 4. 効果 > スタイライズ > 落書き で以下のように設定 5. 2ptの黒で線を追加 6. 線を選択した状態で 効果 > パスの変形 > ラフ で以下のように設定 以上ですね。 さらに、1クリックでこの効果が適用できるように、グラフィックスタイルパネルで新規グラフィックスタイル登録しておけば、1発で効果を適用できますね。 詳しくは以下からどうぞ。 » Turn Any Font Into a Sketch Font MacのDockを自動的に隠す設定にしてウィンドウが広くなりました☆表示するの好きだったんだ
フォーム内容をタグ風に見せてくれる『Autobox2』 – creamu
以前にも「テキストボックスのリストをタグに変えてくれる『TextboxList』」で紹介したことがあるけど、似たスクリプトのご紹介。 フォームに入力してEnterを押すと、ぽんぽんとタグ風にリストしてくれます。 かっこいいフォーム作成に使ってみてはいかがでしょうか？ » Autobox2 今日もばり天気いーですねーGW気分だな。
角丸でとてもかわいいlightbox系ポップアップ『prettyPhoto』 – creamu
Stephane Caronさんのブログで、「jQuery lightbox clone – prettyPhoto」というタイトルの角丸でとてもかわいいlightbox系ポップアップが紹介されています。 白の角丸、黒で透過の角丸、黒で透過のスクエアなど、とてもかわいいデザインになっています。 ポップアップするスピードも気持ちいいので、かなり使えるのでは。 This script is licensed under Creative Commons Attribution 2.5. So you can use it in all you projects even commercial ones. ライセンスは「Creative Commons Attribution 2.5」。商用利用も可能とのことですね。 ブラウザチェックも以下の通りされているようだから安心ですね。 ・Firefox
テクスチャをうまく使ったデザイン40選 – creamu
サイトでテクスチャをうまく使いたい。 そんなときに参考になるのが、『40 Textured Websites for Design Inspiration』。テクスチャをうまく使ったデザイン40選だ。 以下にいくつかご紹介。 The Blizzards Darnology Versions Derek Sholl Decent Weblog Alpine Meadows その他のリストは以下から。 » 40 Textured Websites for Design Inspiration テクスチャをうまく使ったデザイン、デザインの参考にしてみてください。 文体を微調整してみる。堅苦しくならずに口語体に近づけていこうかな。 気が向いたので画像を作ってみたけどこんなことしてる場合じゃないのでがんばります。。
Webデザイナーのためのプリントアウトできるスケッチブック – creamu
紙にデザインラフを描きたい。 そんなときにおすすめなのが、『Sketchbook for web designers』。Webデザイナーのためのプリントアウトできるスケッチブックだ。 このエントリーでは、↑のようなフォーマットのスケッチブックが4種類紹介されている。プリントアウトして使うことが可能だ。 First problem that we encounter when we are building web browser on paper is – what size should it be? We have monitors with different size. And we also have different paper formats A4, A3… First thing I did is to compare the most common A4 format
スタンダードな画面パターン13選 – creamu
サイトのインターフェースを設計したい。 そんなときに参考になるのが、『Designing Web Interfaces: 12 Standard Screen Patterns』。スタンダードな画面パターン13選だ。 以下にご紹介。 Master/Detail 垂直か水平レイアウト。ナビゲーション固定で操作画面をユーザに認識しやすいようにしている Column Browse 垂直か水平レイアウトで、始めのカラムからユーザをナビゲーションしていく仕組みを提供している Search/ Results キーワードでダイレクトにユーザをナビゲートするときに使われる Filter Dataset 検索条件を絞り込んで精度を上げるときなどに使われる Forms フォーム画面はユーザビリティとデザインについて考え抜かれていなければならない Palette/ Canvas ファイルを作成するときなどに使わ
illustratorのペンツールが訓練できるチュートリアル『Illustrator Pen tool exercises』 – creamu
Design illustratorのペンツールが訓練できるチュートリアル『Illustrator Pen tool exercises』 illustratorのペンツールをもっとうまく使いたい。 そんなあなたにおすすめなのが、『Illustrator Pen tool exercises』。veerle’s blogによる、illustratorのペンツールが訓練できるチュートリアルだ。 「Download the AI file Download the Illustrator (compatible with version CS, CS2 and CS3) Pen tool exercise file here.」 上記の箇所からaiファイルがダウンロードでき、チュートリアルを背景としてペンツールの練習をすることができる。とてもわかりやすくためになるチュートリアルだ。 CS、CS
モダンCSSにおける黄金比とは？ | CREAMU
CSSでのレイアウトに黄金比を取り入れたい。 そんなときに参考になるのが、『Golden Ratio in modern CSS』。モダンCSSにおける黄金比だ。 このエントリーでは、960pxのdivがある場合、960 / 1.62 = 593px が左カラム、960 – 593 = 367pxが右カラムになるといったように、黄金比を取り入れたレイアウトの方法が解説されている。 その他にも、 line-height = font-size x 1.62 paragraph margin = paragraph line-height x 1.62 / 2 といったような設計の例が紹介されている。 結論としては、 Many people will argue, that this technic is an utopia and we cannot spend time coding ne
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
クオリティーの高いillustratorのブラシ30 – creamu
光をうまく使ったサイトデザイン25選 – creamu