ウェブデザインにおけるテクスチャやパターンの使い方をしっかり学びたい人用のまとめ
当サイトでもテクスチャやパターンなどを素材として紹介しますが、ダウンロードして満足するだけでなく、どのように使うかが大切です。 テクスチャやパターンを効果的に使った実例を見ながら、その使い方を紹介します。 The What, Why and How of Textures in Web Design 下記は各ポイントを意訳したものです。 1. ノイズのテクスチャ 2. リアルにするためのテクスチャ 3. ビジュアル効果を与えるテクスチャ 4. トーンや印象を明確にするテクスチャ 5. シンプルなピクセルパターンの繰り返し 6. 大きなインパクトを与えるパターン 1. ノイズのテクスチャ ノイズのテクスチャは最近のウェブデザインでとても人気があります。これは背景からボタンまで、あらゆるデザインほとんどのエレメントにマッチします。 ノイズの使い方は使う場所に依存しますが、良いノイズというのはぱ
ngnixをローカル環境のwindows7にインストールする方法を図解付きで解説。XAMPPとの併用も。 - YATのBlog
2012年 05月 28日 ngnixをローカル環境のwindows7にインストールする方法を図解付きで解説。XAMPPとの併用も。 カテゴリ： Nginx タグ：webサーバー 最近良く耳にするWebサーバーのnginxが凄く気になっているので、ひとまずローカル環境にインストールしてみました。Webサーバーを変更しただけですが非常に早いです。僕自身の目的はこのブログをNginxで動かす事ですので 今回はWordPressをローカルで動かす為に必要な環境を手配する手順を紹介したいと思います。 1.nginxとは 2.インストール 3.XAMPPを利用している環境へのインストール 4.まとめ 1.nginxとは そもそもnginxが何か？というところですが、これはいわゆるWebサーバーの1つです。Webサーバーの有名なものにApacheがあり、全世界で広く使われています。nginxもこれと同
WEB制作｜デザイン会社｜超簡単! 髪の毛の画像を1分で切り抜く方法まとめ
お客様に最適なWEB戦略で、 ブランド価値の向上、お問い合わせの増加、迅速な情報の配信、 営業・広告費用の削減、顧客満足の向上、リピート率の増加 の成功事例を実現しております。 切り抜き・マスク作業で、もうイライラしない！ 誰でも、切り抜き30秒・調整30秒で完成できる方法。 WEBサイトやLPのキービジュアルでは画像を使うことが多い。 しかし、お客様から素晴らしい画像の支給があるとは限らない。 「これ、マスクしないといけないじゃないか！」 昔からマスク専用のアプリケーションがあるほど、 マスク作業・切り抜き作業というのは 利益にならないのに、手を抜けない根気が必要な作業。 しかし、今なら誰でも簡単に、1分あればできる。 今更だが、やっとAdobeのCS5シリーズをまともに使い始めたので ここで、Photoshop CS5を使った、超簡単マスク術を紹介したい。 お題の写真 こちらが今回のお
ゼロからはじめるHTML5でのサイト制作／第9回 XHTML1.0とHTML5のコーディングの違いを確認してみよう - MdN Design Interactive
これまでの連載では、HTML5での新要素の説明やHTMLから使用方法が変更になった要素、ブロックレベル要素とインライン要素の変わりとなった「コンテンツ・モデル」や「アウトライン」などについてまとめてきましたが、ここからは今まで解説したことのまとめとして、簡単なレイアウトをxhtmlとHTML5でのマークアップを比較しながら実際に作成してみたいと思います。 解説：（有）ムーニーワークス 林 豊／田崎一成 ●HTML5の基本の書き方 XHTML1.0とHTML5の基本のHTMLの違いを再確認してみましょう。HTML5といっても基本の書き方が大きく変わるわけではありません。極端なことを言えば、DOCTYPE宣言だけをHTML5の書き方にし、コンテンツのコードを既存のままにしてもHTML5になります。今回は新要素などを適切に使用して「コンテンツ・モデル」や「アウトライン」を意識してマークアップして
カッコイイWEB管理画面を作成するPhotoshopチュートリアル:phpspot開発日誌
Design an Professional Admin/Control Panel Template in Photoshop - Bloom Design Blog | Bloom Design Blog カッコイイWEB管理画面を作成するPhotoshopチュートリアル。 次のようなカッコイイ管理画面をデザインしていく流れが見れます。 単にテンプレートを真似て作るのもいいですが、つくり方も大体わかるというのはいいですね あまりリソースをさけないところではあるかもしれませんが、管理画面も美しくしたい場合に参考にできそうです 関連エントリ 広告デザインのためのPhotoshopチュートリアル１５ 新しめのPhotoshopテキストエフェクトチュートリアル２５ パノラマ写真から小さな惑星を作るPhotoshopチュートリアル 写真のようなリアルなオブジェクトを作るPhotoshopチュート
細部にこだわったUIエレメントをPhotoshopで作成するポイント
ウェブデザインをワンランクアップさせる、リアリスティックなユーザインターフェイスエレメントをPhotoshopで作成するポイントを紹介します。 Crafting Subtle & Realistic User Interfaces [ad#ad-2] 少し古い記事ですが、現在でも役立つ情報なのでご紹介。 下記は各ポイントを意訳したものです。 オブジェクトを想像する 光沢 vs つや消し 制作に役立つTips リアリティは繊細に オブジェクトを想像する リアリスティックなUIエレメントを設計する時には、そのオブジェクトが実世界でどのように見えるか想像する必要があります。それを実現する一番簡単な方法は、そのオブジェクトをモニターの横からどのように見えるか想像することです。 これは最近のウェブデザインでもよく見かける微妙な凸型のパネルで、その外周には小さいエッジを持っています。光源は上部にあり、
Ext JS MVCアプリケーション | Ajaxサンプル開発者ブログ
Ajaxのサンプルサイト「Ajaxの覚え書き＠じゅえ(http://ajax-world.sakura.ne.jp/)」の管理者ブログ こちらのサイトを参考にして、Ext JSを用いたMVCアプリケーションのサンプルを作成してみました。 サンプルのデモを表示 サンプルのダウンロード HTML, JavaScriptファイルの配置 以下のようなディレクトリ構成にHTMLファイルおよび各JavaScriprファイルを配置します。 HTMLファイルの記述 index.htmlを以下のように記述します。 ext-all.cssおよびext-all.jsへのパスは各環境にあわせて変更して下さい。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title id="page-titl
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot Seperti yang kita pahami waktu ini ada sangat banyak permainan slot online paling sederhana yang dapat dimainkan dalam sekejap hanya cukup masuk di sana saja ojekslot terunggul. Di sini dapat ada sangat banyak bermacam permainan luar biasa yang pastinya dapat anda temukan dengan ringan. Beraneka permainan terbaik di sini dapat and
Photoshopでざらざらのノイズテクスチャをデザインする方法
参照ホームページ : Noise Texture in Photoshop – Soh Tanaka 上記のホームページのヘッダーで使用されている、ざらざらとした質感の高いテクスチャ素材は最近よく利用されるデザイントレンドのひとつではないでしょうか。 以下のホームページ、ブログなどでも利用されており、個人的に参考にしたいデザインでもあります。 Billy Tamplin dConstruct 2010 Dribble HeyIndy 今回はPhotoshopでざらざらとした質感のノイズテクスチャの作り方をご紹介します。 簡単な手順のみですが、ホームページやブログなどの背景デザインとして利用してみてはいかがでしょうか。 詳細は以下から。 チュートリアル情報 プログラム : Photoshop バージョン : CS5で作成 （古いバージョンでも可能） 難易度 : 初級者から中級者 所要時間 :
PHPでWEBサイトのスクリーンショットを作成するチュートリアル:phpspot開発日誌
Taking screenshots of websites in PHP PHPでWEBサイトのスクリーンショットを作成するチュートリアルが紹介されています。 スクリーンショットの撮影には wkhtmltopdf というオープンソースソフトウェアを利用します。 このソフト自体がMac OS XやWindows、Linuxで動作するコマンドラインツールとなっているようなのでクロスプラットフォームで動作します。 このツールを使えば、「wkhtmltoimage --quality 50 //phpspot.org/blog/ snap.jpg」のようにコマンドを打つことでスナップショットが撮れます。 コマンドラインオプションが多数あるのでPHPerじゃない方も覚えておいて損はなさそうです。 例えば、 JavaScriptをオフにした状態でスクリーンショットを撮ったり、高さや幅の指定、切抜きの
Mockup Blister Packaging in Photoshop | Envato Tuts+
Designers and clients often have different ideas about how a finished product should be presented. Designers want to show the finished artwork, clients want to know exactly how their design will look on the shelves. In this tutorial, we will demonstrate how to create a mockup for some blister packaging so that you can present your design to your clients. Let's get started! Tutorial Assets The foll
バックグラウンド画像、壁紙などを作る際に参考にできるPhotoshopチュートリアル集:phpspot開発日誌
High Quality Instructive Photoshop Wallpaper Tutorials | CreativeFan バックグラウンド画像、壁紙などを作る際に参考にできるPhotoshopチュートリアル集 次のようなイメージを作成するチュートリアル集になっています。どれもなかなかクオリティが高いので参考にできそう。 グラデーションをどれもうまく使ってますね 関連エントリ プロレベルのPhotoshopチュートリアル集 パノラマ写真から小さな惑星を作るPhotoshopチュートリアル 動画で学べるPhotoshopチュートリアル２０ 広告デザインのためのPhotoshopチュートリアル１５
無料素材・チュートリアル・デザインアイデアなど、Photoshopのシェイプのポータルサイト -Shapes 4 Free
ウェブデザインでよく使用するアロー・ショッピングカート・サークルなどのPhotoshopのシェイプ素材をはじめ、Photoshopのチュートリアル、さまざまなシェイプを使ったデザインのアイデアなど、シェイプに関するポータルサイトを紹介します。 素材をはじめ全てのコンテンツは、サイト名通り無料で楽しめます。
さあ、AWSをはじめよう！ for PHPer
春ということで、Amazon Web Services（AWS）をはじめてみませんか。 AWS盛り上がっていますね。2011年3月に東京リージョンができたことで、そろそろ触ってみようかなというPHPユーザの方も多いかと思います。 そんなあなたへ、AWSをはじめる際に役立つ情報をご紹介です。 1. AWSアカウントを新規作成して、EC2の利用申し込みを行う まずAWSのアカウントを作成して、EC2の利用申し込みを行います。 手順については、AWSエバンジェリストの @KenTamagawa さんが書かれた以下の資料が参考になります。このとおりに進めていけば、おおよそ問題無いと思います。 進める中で自分が詰まった点は以下。 郵便番号、電話番号にはハイフンを 郵便番号、電話番号はハイフンが必要なので入力するようにして下さい。 書式は日本国内のもの、郵便番号8ケタ（ハイフン入り）、電話番号は12〜
Herokuを利用したナントカstagramの作り方 - Rewish
先週の水曜日に@hilokiと一緒に作った Shibastagram - 柴犬たくさん、しばすたぐらむ というモフモフ系癒しWebをリリースしました。 スクロールすると柴犬がモリモリ出てきて無限に癒されるナイスWeb。 今回はソースコード自体を公開し、Shibastagramのチワワ版「chihuastagram - チワワたくさん、チワスタグラム」を作りながら、ナントカstagramの作り方を紹介したいと思います。 ※記事中のChihuaやChihuastagramは自分のナントカstagramに合わせて読み替えて下さい。 準備 早速いってみましょう。 注意) 以下の内容はMac環境を前提としています。UNIX/Linux系のOSを使ってる人は問題無いと思いますが、Windowsの人はRubyやRubyGemsなど必要なモノを別途インストールする必要があります。あと全部ターミナルで作業で
ブーケがスプラッシュしている超カッコいい画像作成Photoshopチュートリアル:phpspot開発日誌
Photoshop Roses bouquet splash effect for image ブーケがスプラッシュしている超カッコいい画像作成Photoshopチュートリアル。 次のようなブーケをスプラッシュさせるチュートリアルです。ブーケ以外にもスプラッシュさせることで通常ありえないエフェクトを作ってインパクト大にできそうですね。 かなりリアルに合成してますね。 関連エントリ プロレベルのPhotoshopチュートリアル集 クラウド時代にファンシーな雲を描画するPhotoshopチュートリアル ボタン作成のPhotoshopチュートリアル集
クラウド時代にファンシーな雲を描画するPhotoshopチュートリアル:phpspot開発日誌
Fluffy Clouds in Photoshop | Abduzeedo | Graphic Design Inspiration and Photoshop Tutorials クラウド時代にファンシーな雲を描画するPhotoshopチュートリアルが公開されています。 次のように可愛らしい雲が描画出来てます。 単なる円形を組み合わせて雲の形を作ります。 レイヤースタイルを使ってサクッとリアルな質感を表現。 次は雲を薄くして光沢をつけていくプロセス。上のまんまでもそのまま使えちゃいそうですね。 これは簡単な割に色々と応用できそうなテクニックですね。 関連エントリ モダンなコーポレートサイト作成用Photoshopチュートリアル 光のエフェクトを与えたクールなイメージ作成Photoshopチュートリアル２５ プロレベルのPhotoshopチュートリアル集
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Photoshop初心者でも簡単できる、かっこいいテクスチャ素材を作るチュートリアル
新着記事
http://gecko.hp2.jp/2011/05/03/vps%E5%88%9D%E5%BF%83%E8%80%85%E3%81%8C%E3%81%95%E3%81%8F%E3%82%89vps%E3%82%92%E4%BD%BF%E3%81%84%E5%A7%8B%E3%82%81%E3%81%9F%E3%80%82/