写真から配色パターンを自動作成！ マイテーマを作ろう 「他人が作った配色」だけでも相当遊べるKulerだが、そのうち本来の目的である「配色パターンの作成」を試して、ぜひ“マイテーマ”を作ってみたいもの。とはいえ、何もないところから色の組み合わせを考えるのは、やっぱりちょっと面倒くさい……。そんなものぐさな人にも便利な方法がある。 1つは、すでにある（誰かが作った）テーマをもとにカスタマイズする方法。先ほど紹介したとおり、各テーマの詳細画面にあるアイコンをクリックするだけで、配色パターンの編集画面に移動できる。編集画面ではPhotoshopでもおなじみのカラーホイールを使って簡単に色を選択できるので、気に入らない色だけをちょっと変えてみてもいい。また、設定した「ベースカラー」を基準として、Kulerにある程度お任せでテーマを作ってもらうのも可能だ。 もう1つ、画像をもとに自動的に配色パターン
jQueryって何 JavaScriptのフレームワーク みんな超使ってる ややこしいことが超簡単にできる John Resigってすげー人が作ってる とにかくイケてる なぜjQueryはイケてるのか 超短く書ける。そう作られてる。 Write Less, Do More. たくさんプラグインがある。使うの簡単。 DOM操作周りにめちゃ強い。 JavaScript始めるのにもオススメ。 ブラウザごとの差異も吸収してくれちゃう ブラウザ上でなんかするのに必要な機能が詰まってる プログラム書く流れ JavaScriptに限らず、大体こんな感じ。 こんなん作りたい APIを調べる それをどーやって使うのか調べる なんか難しそうだったらフレームワークとか調べる 文法を知る（大体どれも大きくは変わらない） 書いてみる APIとかフレームワークとか知らん 大丈夫です。 そんなん普通、調べないと知りませ
tech.kayac.com、ささやかにリニューアルしました！ tech.kayac.comをご覧の皆さん、はじめまして。意匠部ME課のfuchigamiといいます。 どうして技術部ブログに意匠部の野郎が？って感じですが、 技術部ブログのリニューアル記念ということで、ちゃっかりcanvasについて記事を書こうと思います。 最初なので、、、 簡単にぼくの属性を説明すると、html5とか好き、CSS3とか好き、canvasとか興味ある、非モテ、javascriptはjQueryがなんとなくわかる程度、非リア充。こんな感じです。 今回のリニューアルではコーディング全般を担当しました。 特に、プログラミングに関してはド素人だ！ということを強調しておきます。 そんなぼくが、canvasを使ってキラキラした背景を作ってみました 「リニューアルするからには新しいことがやりたいよね。だったらhtml5とc
購入編 会社にて amachang「秋だけに akky ですね。Macbook が欲しくなってきました」 akky（苦笑） amachang「新しい Macbook が欲しくなってきました」 akky（苦笑） amachang「買って来まーす」 akky（苦笑） Apple Store 銀座にて amachang「Macbook Pro の 13 inch のやつください」 店員「はい。 2 種類ありますが」 amachang「高いほうのやつください」 店員「キーボードは JIS と US どちらにいたすますか」 amachang「US ください」 店員「こちらでよろしいですか?」 amachang「JIS よりキー少ないのですね」 店員「はい。英数キー、かなキーなどがありません」 amachang「えっ」 店員「えっ」 amachang「JIS ください」 店員「かしこまりました」 am
運営元のロゴ Copyright © 2007-2026 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
How to turn your photo into movie-like effect using Photoshop? « ebin
What you need to have: Adobe Photoshop What you will learn: colour mood adjustments + depth of field effect + film effect PS: ⌘ key for Mac users / CTRL key for Windows users Colour mood adjustments 1. Adjust the Hue/Saturation: ⌘U/CTRL-U 2. Adjust the brightness and contrast: Menu > Image > Adjustments > Exposure… Depth of field effect 3. Duplicate current active layer by dragging it to the ‘crea
PSDTUTSのエントリー「Photoshopでゴールドに輝くテキスト エフェクトの作り方」の紹介です。 How To Create A Gold Text Effect In Photoshop 上記画像は、グラデーションの具合をあまり検討せずにぱっぱと作ったのでいまいちですが、グラデーションを変更することにより、ゴールドだけでなくシルバーなどにも応用ができます。 チュートリアルにキャプチャ入りで説明があるので、簡単に流れを。 背景の作成。 レイヤースタイルで、背景を作成。 「グラデーションオーバーレイ」の設定は、 描画モード：通常、不透明度：100%、グラデーション：#000000から#443501で逆方向、角度：90、比率：138%。 背景にフィルタ処理。 [フィルタ] - [テクスチャ] - [テクスチャライザ] フォントは、「Times New Roman」を使用。 テキストのレ
CSSにおける技術を学べる素敵なまとめエントリ。 しばらくここでお勉強してみようかと思いましたので記事にしておきます。 あらかじめ言っておくと、リンク先のタイトルにあるような101個のリンクがあるわけではない。 これから続くと言っているので続きに書くのか・・・それともリンク先のまとめもその数に入れているのか。 計算すると40個もないので不明ですがあらかじめご了承ください。 CSSその技術 ダウンロードして学ぶものやチュートリアルなどもあり、英語がダメダメな方でも何かと使えるものが豊富です。 101 CSS Techniques Of All Time- Part 1 Today we are presenting a round-up of 101 CSS techniques designers use all the time. Definitely worth taking a ve
Prototype.jsとはなにか Prototype.jsは、Sam Stephenson氏を中心とするチームによって開発されているAjax対応JavaScriptライブラリだ。単体でもAjaxian.comの2006年と2007年の調査で最もよく知られたAjaxフレームワークに選ばれるほどの人気を得ているが、実はWebアプリケーション・フレームワークRuby on Railsのプロジェクトで開発されているプロダクトであり、同フレームワークに同梱されているため、Ruby on Rails経由で使用されるケースも多い。 ライブラリはMITライセンスで公開され、ドキュメントはクリエイティブ・コモンズ(Creative Commons)ライセンスのAttribution-Share Alike 3.0で公開されている。詳細はライセンスのページで確認していただきたい。 これから6回にわたって、こ
線を組み合わせてリボン状に加工し、美しい画像を作成するPhotoShopチュートリアル 2007年11月21日- CornOnCob : SwooshyLines Tutorial In this tutorial, I will show you how to make an abstract ribbon-like effect using only Adobe Photoshop 線を組み合わせてリボン状に加工し、美しい画像を作成するPhotoShopチュートリアル。 次のような美しい画像を作成するチュートリアルです。 PhotoSohpであれば、素材を使わずとも、こういった美しい画像が作れます。 応用することで、オリジナルの美しい画像が幾通りも作れそう 関連エントリ PhotoShopでMacOS、Leopard風ロゴを作るチュートリアル 煙風エフェクトをカッコよく作るPhotoS
前回はXMLのデータをSpryで読み込み、データセットを作成してテーブルに表示するところまでご説明しました。今回はそのデータセットの機能を使ったプルダウンメニューの作成と、プルダウンメニューで選択した内容によって変化するフィルタ機能を作成します。少しだけJavaScriptの関数を作成する必要がありますが、まさにAjaxの醍醐味ともいうべき、優れたユーザインタフェイスが完成しますので、ぜひ挑戦してみてください。 前回の表示されたXMLのデータを見てみると、その中に共通のカテゴリが複数あることにお気づきでしょう。これを１つのメニューにまとめ、ユーザが選択できるようにしてテーブルの表示内容をすっきりさせましょう。 まずは、 ds_category という名前のデータセットを作成して、Product.xmlのXMLデータの中から Category ノードにある値だけを取得してみましょう。スクリプ
ウェブデザインに限らず、何かパソコンを使ってデザイン関連の仕事をするにはあの「Photoshop」を使いこなすことが必須らしいとはわかっていても、いまいちどういう風に使えばいいのかわからない、あるいは、仕事でPhotoshopを使ってはいるが必要な機能のみを使っているだけであって、ちょっと凝ったことを聞かれると即答できないのでテクニックをブラッシュアップしたいと思っている……そんな人向けに役立つPhotoshopをマスターするためのチュートリアルをいろいろと集めてみました。時間のあるときにでも少しずつ眺めていけば、なんでもできるようになるかも。 チュートリアルの詳細は以下の通り。 まずは基本的なテクニックを具体例と一緒に解説しているサイトを3つほど。初級テクニックから高等テクニックまで具体例を交えて解説しています。 Photoshop Tutorials from PhotoshopCAF
「Ajax 月送りカレンダー」を複数ブログで利用している場合の変更方法です。 2007.03.20 この方法は元記事に反映しました。 月送りカレンダーは表示月を cookie で保存することで、リロードや次回のブラウザ起動時に前回と同じ月を表示するようにしていますが、複数ブログで利用した場合、同じ cookie データ（=カレンダーの表示年月）にアクセスしてしまうため、一方のブログがもう一方のブログの表示年月を取得してしまう可能性があります。 仮に、ブログAに2007年3月（のエントリー）があり、ブログBにはその月のエントリーが存在しない場合、ブログBの表示でブログAの「2007年3月」という cookie データを取得した場合、ブログBではカレンダーが正常に表示されないという不具合が生じます。 ということで、とりあえずテーブル型カレンダーで複数ブログに対応するためのカスタマイズを紹介しま
JavaScriptでLightBox風のインストーラ用ウィザード作成ライブラリ「ModalBox」 2007年02月27日- ModalBox ? An easy way to create popups and wizards JavaScriptでLightBox風のインストーラ用ウィザード作成ライブラリ「ModalBox」。 次のように、LightBox風に同一ページ内で動作するウィザードを作成することが出来ます。 動画が軽くてサクサク動くこのUI は使いどころによってはかなり便利なサイトであるという印象を与えることが出来そう。 実装方法は次の流れ 1) まず、JavaScriptファイルとCSSファイルを読み込みます。 <script type="text/javascript" src="includes/prototype.js"></script> <script type
ITmedia エンタープライズ：第2回 Zend Frameworkの各コンポーネントを一気に制する (1/3) 前回は、Zend Frameworkの概要とその導入方法について説明しました。今回は、各コンポーネントの使用方法について紹介していきます。「Zend Frameworkの各コンポーネントを一気に制する」という記事の紹介。 Zend_Controller_Router、Zend_Controller_RewriteRouter、Action Controller、Zend_View、Zend_Dbなどの基本コンポーネントの紹介です。 ちなみに、2007年2月末のバージョンが最新となっており、Preview 0.8.0が最新バージョンです。 1.0が待ち遠しい感じですが、0.8.0ということで、公開されて丁度１年ほどになりますが、以前に比べるとだいぶバージョンアップされてるようで
［PHPウォッチ］第33回 “PHP版Ruby on Rails”symfonyフレームワーク1.0正式リリース！ PHPのリリースでは，5.2系の5.2.1，4.4系の4.4.6と立て続けにリリースされた。それ以外にも，Railsライクなフレームワークであるsymfonyの1.0正式リリースや，Month of PHP Bugs（MOPB）サイトの公開など，多くの活動の成果が発表された。今回は，これらについてのレポートと，symfonyのレビューをお届けする。 PHPリリース関連情報 PHP 5.2.1，PHP 4.4.6リリース：セキュリティ問題を含めたバグの修正が中心 2月14日にPHP 5.2.1とPHP 4.4.5がリリースされた。その後，PHP 4.4.5にて発生した問題に対応するため，3月1日にPHP 4.4.6がリリースされた。いずれも，脆弱性の修正や，機能改良を含めたもの
先日、「惑星が爆発したような画像を作成するPhotoshopのチュートリアル」を紹介してくれたlov2helpでまたしても興味深いチュートリアルが公開されています。 「空から光が差し込む神々しい景色」が簡単に作成できるチュートリアルです。神秘的な雰囲気がたまりません。覚えておくとよいかも。 では以下にそのステップをご紹介。 ↑ まず、500ピクセル×500ピクセルの画像を新規で作成します。 ↑ 「フィルタ」→「描写」→「雲模様1」で雲の素地を作ります。 ↑ さらに「雲模様2」を4回～5回ほど繰り返します。 ↑ 「イメージ」→「色調補正」→「レベル補正」を行います。 ↑ 「フィルタ」→「表現手法」→「押し出し」を選択。雲がぐぐっと迫ってきます。 ↑ 「イメージ」→「色調補正」→「階調の反転」。雲っぽくなってきました。 ↑ 次に「背景の複製」を行います。 ↑ そして「フィルタ」→「ぼかし」→「
Web2.0のデザイン的要素として「グラデーションをかける」という重要なものがありますが、このグラデーションのかけ方が実際にやってみると実に難しい。ネット上でいろいろ調べてみるとグラデーションのかけ方自体は様々な方法やチュートリアルが見つかるものの、「何が正解なのか？」というのは見つかりません。つまり、何がそのときに最もベストな方法なのかがわからないわけです。 また、ブログのテンプレートを選ぶ際にも、どのようなグラデーションが自分の目指すテーマのブログにふさわしいのかも基本的な知識がないとなかなかわかりにくいものです。 というわけで、今回はグラデーションを使ったデザインの仕方について。デザインをしない人でもどのデザインを選べばいいかがわかるように書いてみました。 ■間違ったグラデーションなど無い まず一番わかりやすいグラデーションについての誤解はこれ、汚いグラデーションやださいグラデーショ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
