Illustrator（Photoshop） のペンツールできれいなパス、ベジェ曲線を描くためのコツ（私流）
Illustrator や Photoshop のペンツール。 初心者の頃は、きれいな曲線が描けなくて悩んだものでした。そんなペンツール、パスの初心者さんのための、ペンツールできれいなベジェ曲線を描くコツを、一連の操作方法とともにまとめてみました。 ペンツールに挫折しちゃった人も、もう一回チャレンジしてみるきっかけになればうれしいです！ ペンツール初心者さんが対象の記事です。 Photoshop や Illustrator のペンツール … はっきり言って私はへたっぴーです。ペンツールは切り抜きをするときやイラストを書く時など、絶対に使いこなしたいツールですよね。ペンツールで描く曲線をベジェ曲線、アンカーやハンドル（後述）も含めてパスって呼んだりもしますが、この曲線が初心者さんにはとにかく難しい …。初心者さん向けの Illustrator の本や Webサイトを見ても、ペンツールできれい
Index :: Webデザイナーズレシピ
Sample Design Webデザインのサンプルです。 DropDown Navi jQuery を使ったドロップダウンメニューです。 Contents Slider jQuery Cycle Plugin を使ったスライダーです。 Form Validation フォームに入力された値を、送信前にその場でチェックします。jQueryプラグイン使用。 Form UI Elements チェックボックスやラジオボタン、セレクトボックスを画像で装飾！セレクトボックスにはjQueryプラグインを使用しています。 jQuery UI Accordion & Tabs jQuery UI を使ったアコーディオンとタブです。 Box Equal Heights コンテンツの量によって、バラバラだったボックスの高さを jQuery で揃えています。 Masonry jQueryプラグイン、Mason
Webデザインの1pxを作るためのPhotoshopのレイヤースタイルいろいろ
色んな Webサイトを見ていると、1px にこだわって作られたキレイなデザインがたくさんあります。私は Photoshop を使っているので、Photoshop のレイヤースタイルを使って、1px の細かい所を作る Tips をまとめてみました。基本的な操作ばかりなので、これから Photoshop で Webデザインをやってみたいなーという人向けの記事です。 色んな素敵なデザインの Webサイトを観察していると、1px の細かいところまでこだわって作られてるデザインってとても多いですよね。1px … Webデザインでは一番小さいサイズ。「神は細部に宿る」という言葉もあるけれど、1px までしっかり作られたグラフィックはとても美しいですね！ 今回は Photoshop を使って、いろんな 1px を作ってみました。とは言っても難しいグラフィックデザインを作るわけではなくて、レイヤースタイル
CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました
Webデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基本的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦
デザインに使えるちょっとしたCSSのスニペットいろいろ
Webサイトのデザインには、画像が必須といってもいいと思うんですけど、画像を使わずにピュアな CSS でできるデザインにも、とても素敵なものがあったりします。これからはスマートフォンサイトを作ることも増えそう ...。回線の遅いスマートフォン向けのサイトでは、画像を使わないで CSS のみでデザインする ... っていう機会も増えそうですね。 8 になっても CSS3 が使えない IE ですが、CSS3 を使わなくても、工夫しだいでいろんなデザインエフェクトを表現できますよね！記事中 CSS3 を使ったスニペットもたくさんでてきますが、どれも簡単にできて、ちょっとデザインを素敵にする？コード集です。自分のブログなどでやっているものを中心に、少しまとめてみました。 ちょっとした CSS スニペット 目次 ボックスに使うCSSスニペット テキストに使うCSSスニペット 画像に使うCSSスニペッ
CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ
Webデザインをするときに、必ず使うスタイルシート。思うようなレイアウトを作るために、チェックしておきたいブロックレベル要素や、インライン要素のクセみたいなのをまとめてみました。後半はスタイルが反映されない原因のひとつ、スタイルの優先順位についてです。 Attention 記事公開時からいろいろと勉強して、この記事内で紹介している事柄で、間違った解釈をしていたなーと気がつきました。 この記事の中でいくつか追記してありますが、詳しくは、新しく書いた 11月7日の記事：CSSでレイアウトするなら絶対覚えておきたい配置のルール：フロートや絶対配置、z-index とかいろいろ を読んでみてくださいね！ New Post Webサイトをデザイン、レイアウトするのに欠かせないのが CSS（Cascading Style Sheets、スタイルシート）ですね！今では CSS3 が話題を集めていて、CS
WebからEvernoteへ。私（Webデザイナー）がしているちょっとかわった情報整理術
私はフリーランスで Web デザインをしています。仕事柄からか、毎日 feed を読んで Web の情報をクリップしてますけど、使わなければ無駄な時間を過ごしてるだけ ...。情報の精査、そしてその情報から得たものを、最終的に自分のものにするためにこんなことをしています ...。何だかまとまりなくて長くなっちゃったけど ... X( みなさんはどんな風にしてますか？ 私は毎日 feed を読むのが習慣になっています。Webデザイナーなんて仕事をしているせいか、自分のスキルアップや仕事の効率化につながる情報がないかなーなんて思って、小さいながらアンテナを貼っています。feed だけじゃなくて、ツイッターや facebook を見るのもそんな感覚です。 でも、毎日そんな風に溢れてる情報に囲まれてると、情報の整理や自分のスキルアップにつなげるまでに、多すぎる情報で溺れてしまいます …。feed
デザインの基礎力をワンランクアップしたい私（Webデザイナー）の注意書き
Webデザインは、紙の上のデザインと違うところも多いと思います。でも同じデザインですから、歴史ある DTP デザインから学ぶことはいっぱいあります。デザインの基礎の基礎、レイアウトについて、デザインするときに気をつけたい基礎の部分の注意書きです。 毎日インターネットを見ていると、素敵なデザインの Webサイトに出会います。ときにはひと目惚れしちゃうようなこともあります。そんなデザインにあったとき、どうして素敵なのかなーと考えるのも勉強のうち。そう思って素敵なデザインはストックしておいて、自分なりにそのデザインが素敵な理由を考えてたりします。 デザインの理由 どうしてそういうデザインをしたのか … デザインには理由があります。気まぐれに色を選んだり、要素を配置したりしないからです。なので自分のデザインの理由、どうしてそういう風にしたのかということを、口で説明できないとダメだと言われます。もち
積極的に取り入れたい9つのCSS3（+jQuery）テクニック
CSS3（+jQuery）を使った、ちょっといいかも！と思うエフェクトを集めてみました。 まだまだ非対応ブラウザが多い CSS3 ですが、できるだけ積極的に使ってみたいなーとも思ってます。 まずはいろいろ試してみることからはじめてみましょう！ CSS3 の登場で、いろんな CSS のトリックを使ったエフェクトが考えられてます。まだまだ CSS3 に非対応のブラウザも多いので、全てを CSS3 で表現する訳にはいかないのが現状ですが、私的には積極的にどんどん取り入れていきたいなーとも思ってます。 海外ブログなどで、色んな CSS3 を使った Tips が紹介されているので、その中からいくつかご紹介します。どれもサンプルを作って試してみたものばかりです。以下の環境で動作確認もしています。 Mac : firefox、Safari、Chrome Win : firefox、IE8、Safari、
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
