「飛び出す写真」を簡単に作るPhotoshopチュートリアル | POP*POP
たまにこんな（↑）写真って見かけますよね。インパクト絶大な写真です。 そんな写真を簡単に作る方法がこちらで紹介されていました。ちょっと人とは違ったサイトを作りたい方はいかがでしょうか。 » Out of Bounds – The Something Awful Forums Photoshopで作成します。ではどうぞ！ ↑ 元となる写真はこちら。 まず作るレイヤーは3枚。下から順に黒の背景、素材、フレーム用のレイヤーとなります（↓）。 ↑ 次に矩形ツールで白色の長方形を作成します。 そして、選択ツールで長方形の内部を切り抜きます。これでフレームができあがりました。 ↑ 次にフレームの形を変えます。フレームのレイヤーで「Ctrl+T」を使ってフレームだけを選択。 右クリックし、「遠近法」でフレームの形を変えます。「自由な形に」を選べば微調整も可能です。 ↑ あとは、不必要なところを黒く塗りつ
動画で学ぶPhotoshop （27のテクニック） | POP*POP
下記のサイトで「You Tubeで見るPhotoshopのチュートリアル」という記事が紹介されていました。YouTubeだけじゃなくてMetacafeの動画もありましたが・・・。 どちらにしろ文章だとわからないことでも動画だと簡単に理解できることもあります。細かい操作の多いPhotoshopやIllustratorなどはこうした動画チュートリアルに向いているかもですね。 » Use YouTube to learn Photoshop: etc: quick links to good stuff 以下、オリジナルの記事を尊重しつつ、内容の紹介というスタンスでいくつかご紹介・・・。 ■ Web 2.0-Style Logo Web2.0サイトでよく見かけるのロゴの作成方法です。光っているようなロゴですね。 ■ PHOTO EFFECT エフェクトの詳細です。どこにでもあるような電車の中の写
Lucky bag::blog: CSS を作成する際のお約束
CSS を作成している際に、当然の如くブラウザによって描画結果に違いが出てくるわけで、ムキーとか言いながらその差異を埋めていく作業が一番面倒っちゃあ面倒。んで、ボックスモデルやその他ブラウザごとのバグ以外で、極力そう言った差異を少なくするためには、一番最初に全称セレクタを使ってブラウザのデフォルトスタイルを消してしまうのが手っ取り早い。 * { margin: 0; padding: 0; font-style: normal; font-weight: normal; } ここらへんは基本だと思ってたんだけど、未だにこれをやっていなくて、あのブラウザとこのブラウザで見た目が違うんですけどってのは結構いたりする。上記に text-decoration: none; や font-size: 100%; なんかを加えても良いかも知れないけど、最低限マージンとパディングは無くしておくことをお薦
徹底研究！プロフィール写真の載せ方（実例つき） - ココロ社
こんにちは。プロフィール写真研究家のココロ社です。 みなさん、mixiやブログにつきものの、「プロフィール」の欄に、どんな画像を入れるかというのは迷うところかと思います。考えすぎた挙げ句面倒になって、適当にしている人もいるかと思うのですが、それはmottainaiです！ 今日は、ホームページ歴が１０年近くあり、ありとあらゆるプロフィール写真を貼ってきて痛い目に遭ったりいい思いをしたりしたわたくしが、心を込めてプロフィール写真のノウハウをお伝えするので、参考にしていただければ幸甚です。 プロフィール写真に関する大前提２つ mixiやブログに載せるプロフィール写真について、おさえておきたい大前提が２つあります。「プロフィール写真なんて適当でいいやん」と思っている方こそ、ご一読してハッとしてください。そう…口を大きく開けてね… １．もっとも繰り返し見られるコンテンツは、プロフィール写真である あ
ブログ文章術
前回にひきつづき考えている。 “だれが読んでもわかるように書く”のは、理想や目標としてはありえるけど、ほんとうに、ぼくたちは“だれが読んでもわかるように”書きたいんだろうか？ ということについて。 何かを表現するときに「３つの距離」を気にしたりしている。 １つは、自分だ。 自分への距離。 表現するものは、自分に届くだろうか？ 本当に自分が表現したいことだろうか？ 表現の出発点である自分自身を裏切ってないだろうか？ ２つめは、相手だ。 目の前にいる相手。 何かの共同作業なら、スタッフのことだ。 歌を歌っているのなら、その場で聞いている目の前の相手のことだ。 目の前にいる相手は、すぐその場でリアクションを返してくれる。 瞬間瞬間で、表情や言葉で、高速で微細でインタラクティブなやりとりを交わせる。 その相手に届くようにするにはどうすればいいだろうか？ ３つめは、世界だ。 目の前にいない相手への距
:::STOP'N LISTEN::::::to the silence:::::
このウェブスペースへは、まだホームページがアップロードされていません。 早速、エックスサーバー上へファイルをアップロードしてみましょう。 アップロードの方法などは、サポートマニュアルをご参照ください。
センス不要！文章を読みやすくするデザイン4つの鉄則
*ノンデザイナーズ・デザインブックが新装増補されたため、再度のご紹介です！ 誰かに読んでもらうために作成する文書（テキスト）の数々。それは企画書だったり、報告書だったり、はたまたチラシだったりブログだったり。そんな文書をセンスが全くなくても読みやすくする4つのレイアウト・装飾法が… 覚えるべき鉄則は4つだけ ここで覚えてほしい鉄則はたった4つ。そう、 近接 整列 反復 コントラスト この4つだけです！ちなみにこれから紹介する内容は『ノンデザイナーズ・デザインブック』からの受け売りです。この本、残念ながら各所で売り切れちゃっているみたいですね…。 1．近接 近接の原則というのは、関連する項目をまとめてグループ化するということです。関連する項目を空間的に近づければ、それらは関係のない断片の群ではなく、一つのまとまったグループに見えるようになります 近接では、要素ごとにテキストのかたまり（ブロッ
ヤコブ・ニールセンによる 「ブログデザインの間違いトップ10」 - モジログ
先日の「Top Ten Web Design Mistakes of 2005」（和訳）が注目を集めていたヤコブ・ニールセンが、ブログ版「デザインの間違いトップ10」を発表した。 Jakob Nielsen's Alertbox - Weblog Usability: The Top Ten Design Mistakes http://www.useit.com/alertbox/weblogs.html 以下がそのトップ１０。 （近々日本サイトに和訳が載ると思うので、タイトルだけ） 1. No Author Biographies 著者のバイオグラフィーがない 2. No Author Photo 著者の写真がない 3. Nondescript Posting Titles 記事のタイトルが説明的でない 4. Links Don't Say Where They Go リンクが行き先に
Online Generators | Developer's Toolbox | Smashing Magazine
Responsive design is a default these days, but we are all still figuring out just the right process and techniques to better craft responsive websites. That’s why we created a new book — to gather practical techniques and strategies from people who have learned how to get things done right, in actual projects with actual real-world challenges. Neatly packed in a gorgeous hardcover, the book featur
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
caramel*vanilla » Blog Archive » WordPressでLightboxを超簡単に使ってみる