『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。
![ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d77d155c3be664f5a333fcb3638d787d8217ad9/height=288;version=1;width=512/http%3A%2F%2Fphotoshopvip.net%2Fwp-content%2Fuploads%2F2016%2F03%2Fimage-hover-effect-top.jpg)
背景画像をブラウザいっぱいに表示するスタイルシートのシンプルなテクニックを紹介します。 デスクトップだけでなく、スマフォやタブレットにも対応、しかもたった一行なのでスニペットに加えておくと便利です。 デモを幅480pxで表示 コンセプト 「background-size」をビューポート全体をカバーするために使う 「background-size」はレスポンシブ対応にする時に非常に有効なプロパティです。値に「cover」を使うことで、背景画像を相対的に自動で調整します。 ※IE8以下はサポートしていませんが、後述のスクリプトを使用するとbackground-sizeが機能するようになります。 「Media Queries」をスマフォ対策として使う スマフォなどの小さいサイズのスクリーン用にMedia Queriesを使って、小さいサイズの画像ファイルを使うことができます。もっともこれはオプシ
こんにちは、あんみつ(@murata_atsumi)です。 この記事はCAMPHOR- Advent Calendar 2014の20日目の記事です。 私ブログが超苦手で普段からあんまり書かないから、何書こうか迷ったのですが、 一応CAMPHOR-には主にデザインの部分で関わることが多いので、 デザインのことを書こうと思います! はじめに エンジニアの皆さん、そしてそうじゃない皆さんも、たまに『メイン画像』を作らなければいけないときがあるんじゃないでしょうか。 メイン画像というのは、こういうのとか (引用:https://www.cyberagent.co.jp/recruit/fresh/internship/ ) (引用:http://tokyometro10th.jp/future/opendata/ ) こういうのとかですね。 または、Facebookページのカバー画像や、OGP用
【画像表示の不具合について】 皆様方へは、ご迷惑をおかけし大変申し訳ございません。 現在もまだ、一部の画像に関しまして反映されない不具合が継続しております。 現在、修正にあたっております。復旧まで今しばらくお待ち頂きます様、何卒お願い申し上げます。 フォト蔵 システム部 【写真検索の不具合について】 皆様方へは、ご迷惑をおかけし大変申し訳ございません。 現在、「写真検索」におきまして、検索後ページに何も表示されないなどの不具合が発生しております。 調査並びに修正にあたっております。復旧まで今しばらくお待ち頂きます様、何卒お願い申し上げます。 フォト蔵 システム部 【画像タイトル及びタグ入力における不具合について】 皆様方へは、ご迷惑をおかけし大変申し訳ございません。 現在、フォト蔵は、画像タイトル及びタグ入力におきまして、後に記載の漢字が含まれる場合、タイトルが表示されないや、文字化けする
こんにちは。LIGブログ編集部です。 LIGのWebデザイナーの業務の一つに、日々更新されるLIGブログ記事の「アイキャッチ画像を作成する」という仕事があります。 今回は、累計1万枚以上のアイキャッチ作成から得た「集客を加速させるアイキャッチのデザイン」をLIGブログ編集部より紹介させていただきます。 ※この記事は2014年に公開されたものを再構成しています。 アイキャッチとは アイキャッチとは、文字通り目を引きつけるもので、Web上ではターゲットユーザーの注意を引き、クリック意欲を刺激してWebサイトやブログに訪問してもらうことを目的としたクリエイティブです。 記事一覧ページのサムネイル画像や、SNSでシェアしたときに表示されるOGP画像などに利用されます。 アイキャッチの必要性 では、なぜWebサイトやブログ記事にアイキャッチが必要なのでしょうか。LIGブログではアイキャッチ作成に力を
2014年9月9日 CSS, Webデザイン 以前このブログで背景に動画を使ったWebサイトの作り方を紹介しましたが、やはり動画を準備するのは少しハードルが高いと感じる人もいますよね。そこで今回は導入しやすく印象に残りやすい、大きな背景画像を用いたWebサイトの作り方を紹介します! ↑私が10年以上利用している会計ソフト! 背景に大きな画像を使うメリット・デメリット 大きな背景画像のメリットは、なんといってもその迫力です。言葉を使わずとも、そのWebサイトを通じて伝えたいイメージをストレートに表現できます。その写真が高画質で、クオリティが高いほど印象にも残りやすいので、近年海外を中心に多くのサイトで用いられている手法です。 しかし、いくつかの注意点をおさえておかないと、どんなに素敵な写真であっても効果が半減してしまいます。ひとつは画像が大きければ大きいほど、ページの読み込みに時間がかかって
必要なテクスチャ素材を探していて時間がかかったり、 やっと見つけたと思ったら商用利用不可だったり、 と素材を探すのは結構手間です。 そんな時には、テクスチャも作ったが早いです。 PhotoShopの知識を深めるためにも、テクスチャの作り方をまとめてみました。 もくじ 布 紙 木目 レザー・皮 金属 石 炎 水 ガラス 空・雲・雷 草・芝生 地面 ザラザラ系 布 布地のテクスチャの作り方 布テクスチャの作り方(Photoshop) デニム生地風テクスチャ作成法 デニムっぽいテクスチャーの作り方。 フェルト風のテクスチャ作成方法 PhotoshopでApple風布地テクスチャを作る 紙 しわくちゃの紙のテクスチャを作成する Photoshop – 古い紙を作ろう! 01 Lesson1 和紙風のテクスチャ作成 - MdN Design Interactive 和紙のテクスチャをPhotosho
画像の一部をズームアップできるjQueryプラグイン「jqZoom」を紹介します。 jqZoom 1.概要 Amazonをはじめとする、オンラインショッピングサイトですっかり定着した機能として、画像のズームアップがあります。商品の質感やディテールなど、念入りに確認したいときに大変重宝します。 本エントリーで紹介するプラグインを利用すれば簡単に設置することができます。 画像ズームアップのプラグインはいくつか出回っているようですが、元画像を単に拡大するものが多く、商品の質感やディテールを見せるものとしては実用的ではありません。 その中でjqZoomプラグインは、元画像と別にズームアップ用の大きな画像を用意できるので使い勝手がいいと思います。また豊富なオプションも用意されています。 2.サンプル サンプルを作りました。 もっともシンプルなサンプル サムネイルで切り替えられるサンプル ということで
All the tools you need for professional photo editing at your fingertips. Powerful & easy-to-use: A robust photo editor like Photoshop online but with fewer learning curves. A complete suite of photo editing tools: From basic adjustments like brightness and contrast to advanced editing features like retouching portraits, you can do it all with Fotor. Edit photos online in bulk: Edit all your photo
Fast & efficient imagecompressionOptimize JPEG, PNG, SVG, GIF and WEBP
編集編 1. 使えるものはOffice Picture Managerでも使え Lightroom, Photoscapeその他いろいろありますが、使えるものはなんでも使いましょう。撮って出しなんて中級者になってから考えればよいのです。 クソ写真も編集次第でどうとでもなります。 wonodas.hatenadiary.com 構図編 2. 自信がないなら3分割交点構図 三分割交点構図は七難を隠します。いたるところでおすすめされているのはそんなわけです。 デジカメならたいていガイドが付いているのでそれに従ってとればよいだけ!簡単です。 (Nikon D90/Nikkor 50mm f1.4) 3. 日の丸構図は真上または真正面から。水平と垂直をきっちりとること 実は難しい日の丸構図。撮るなら真上、真下。水平と垂直は必ず出す。なお画像内に直線が含まれる場合、収差の少ないレンズを選ぶ必要がありま
Photoshopは画像加工や写真のレタッチに適したデザインソフトですが、実はPhotoshopひとつ使えるだけで、WEBデザインやロゴマーク、ポスターなどあらゆるデザインが可能になります。 これまでスリームデザインでは、Photoshopを使ったさまざまなデザインチュートリ... 適当な切り取りで完成する自然な合成方法レディッシュブラウンの背景に女性の画像をドラッグしてレイヤーを重ねる。 背景色に合成した際に統一感を出すため、あらかじめ女性の色味を整えておきます(※最終的に調整してもOK)。新規レイヤーを作り背景色に近い色で塗りつぶします。 後ろから 背景 ≫ 女性 ≫ 色 のレイヤー順になっており一番前面の色レイヤーの不透明度を20%程度に調整して描画モードを通常からピンライトに変え女性レイヤーと統合。 統合した女性レイヤーの描画モードを通常から比較(明)に変えると黒い部分が透けるよう
露出不足写真悩ましいですね、こんな暗いの入稿するんだ…なんて思ったり、しませんけど、しませんてば。 でももっと楽に明るくしてベースを作っちゃえばいつもの補正でいけるのになぁ、とは思いますよ…ね? そこで! 効果のほどをごらんください。 どうでしょ?むりくり明るくした感あまりありません。色もそれほど破綻してませんよね。 では、やり方。 ちょー簡単です。 いじょ。 トーンカーブやレベル補正などを描画モード「除算」で乗せるだけ、です。 (注意:描画モード「除算」の搭載はPhotoshop CS5以降です) 乗せた直後は、 こうなっちゃったり真っ白になったりするんでビビりますが、 シャドウポイントをそのまま、ぐいっと持ち上げると、どんどん色が出てきます。 一番上まで持ち上げると元の画像に。反応が敏感なので、トーンカーブをキーボード操作した方がいいですね。 ショートカットキーはこちらで→Photos
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く