カーテンをスルスルとアニメーションで開閉するスクリプトをBuild Internet!から紹介します。 Animate Curtains Opening with jQuery demo デモでは「Pull Me」とあるロープをクリックすると、カーテンがスムーズなアニメーションで開閉します。 オプションで、トリガーの変更、カーテンの開閉時のサイズ(%, px)、開閉時のスピードなどを調整できます。 スクリプトはjQueryのプラグインのため、実装にはjquery.jsが必要です。
紙の端っこや真ん中など一部が焼けこげた、高解像度のペーパーのテクスチャ素材をSixre Visionsから紹介します。
Illustratorの基本的だけど、マスターしておきたい効果的なエフェクトをWeb Designer Wallから紹介します。 Mastering Illustrator Effects 以下、各ポイントをピックアップしたものです。 上記サイトではチュートリアルのAIファイルもダウンロードできます。 間のびしない矢じり 角丸を素早く綺麗に描く 正確なジグザクのライン オブジェクトの収縮と膨張 変形のエフェクト ラフにするエフェクト 落書き風のエフェクト Illustratorのエフェクトを使用時のTips 間のびしない矢じり [効果]-[スタイライズ]-[矢印にする]で矢印のエフェクトを使用できます。
光、光源、光線、光跡を効果的に使用したPhotoshopのチュートリアル集のPart 13です。 Michael Jackson Wallpaper Soul Rebel Poster Tutoria
ちょっとした動きから、ダイナミックな動きまでアニメーションのエフェクトを加えるJavaScriptのフレームワークをSix Revisionsから紹介します。 10 Impressive JavaScript Animation Frameworks
Fresh eMediaから、個人でも商用サイトでも無料で利用できるPhotoshopのブラシを紹介します。 各画像をクリックすると、ブラシを表示します。
画像にビデオや砂の嵐のノイズをのせるスタイルシートをMatthew James Taylorから紹介します。
ビフォーとアフターをバーでスライドして切り替えるスクリプトをCatch My Fameから紹介します。 jQuery Before/After Plugin demo ※「before」と「after」の表示は付け加えたものです。 デモでは、画像にカーソルを重ねると分割するバーが表示され、左右にドラッグすることで画像のビフォーとアフターが表示されます。
色が徐々にアニメーションして変化していく効果を作成するjQueryプラグイン「jquery.color」 2009年07月10日- Plugins | jQuery Plugins 色が徐々にアニメーションして変化していく効果を作成するjQueryプラグイン「jquery.color」。 特定の色から別の色になめらかにアニメーションさせるには中間の色を計算して反映する必要がありますが、jQuery.color があれば簡単に実装できるみたい。 ↓↓↓徐々に色が変わっていく↓↓↓ ↓↓↓まだまだ変わります↓↓↓ デモページ - Animate Boxes ボタンを押してみましょう。 サイズの変更をしちゃうとレイアウトが崩れちゃうということであんまり使うことは無いのかもしれませんが、ボックス要素の色をアニメーション変化させ、目立たせるという用途にはなかなか使えそう。 関連エントリ アニメーショ
100 Outstanding Login Forms | Design Reviver ログインフォームのデザイン集100種が紹介されています。 以下は100種という膨大なデザインの一例。これだけそろっているとお手本を探す手間は省けて、イメージどおりのフォームをクイックに真似ることが出来そうですね。 Nasibriyani lounge Virtual Paper Loginform すべて見る パターンにまとめてみて分析してみても面白いかも。 関連エントリ 黒ベースのダークでクールなWEBデザイン集 グラデーションをうまく使って立体感を出したサイトデザイン集 ベクターベースのダイナミックWEBデザイン集 韓国のすごいデザインサイト集
Sketch Style: Ten Fonts and Ten Design Elements スケッチスタイルのフォント集色々。アルファベットだけでなく、以下のようなイラストがメインのフォントなんかもあるみたいです。 文字だけで描画できるということで、Photoshopのエフェクトなんかもかけやすそうです。 Doodles and Sketches Hand-drawn vector icons 全部見る スケッチ系はなかなか人気のようで、最近こうした特集はよく見かけますね 関連エントリ Photoshopで写真を味のあるスケッチ風画像にするチュートリアル 手書き英文フォントいろいろ 手書き風の矢印画像のベクターデータ集 ガレージセールに使えそうな手書き風フリーフォント 手書き感がすごくいい感じの有名サイトアイコンセット「Handycons 2」
36 Color Gradient Sets For Photoshop and Resource Sites: Part 1 | Graphic and Web Design Blog - Inspiration, Resources and Tools 立体的に見せたりできるPhotoshop用グラデーションセット集がまとまっているエントリをご紹介。 Apple Gradients BOLD gradient pack Shattereds Gradients 全部見る これらを利用して綺麗なオブジェクトをすばやく作って効率的なデザインに役立てられるかも。 関連エントリ グラデーションをうまく使って立体感を出したサイトデザイン集
Pure CSS Timeline ? Notebook | MattBango.com CSSで年表が作れるコード「Pure CSS Timeline」。 次のような、角丸でAppleっぽい(?)年表が作れるみたいです。 HTMLマークアップは以下のように, div と ul で組むみたいです。 <div class="timeline"> <ul class="events"> <li style="width: 42.48%; left: 57.2%;">Design & Typography <em>(2007 - 2009)</em></li> <li style="width: 56.68%; left: 43%;">Photography <em>(2006 - 2009)</em></li> <li style="width: 71.3%; left: 28.4%;
SEO Knowledge 3大検索エンジンでの順位を一括検索できるツール提供サイト「SEO Knowledge」。 自サイトなどのURLを入力し、特定のワードを元に順位を一括してチェックできるツールが公開されています。 早速、javascriptist.net で試してみました。 解析するURLとキーワードを入力して「このサイトを解析」で解析します。 javascript や css といった指定のキーワードによって検索した順位の結果を一覧で表示できます。 javascriptist.net は、javascriptという検索ワードでは、Google で 31位、Yahooで34位、MSNで2位という情報が1回のアクセスで簡単に引き出せます。 また、キーワードごとの調査用ページも存在していて、たとえば、「php」というキーワードの場合、次のように、3つそれぞれの検索エンジンでの順位を比較
Function Web Design & Development [ Blog ] Free Icons: Function Icon Set, 128 Completely Free Icons 綺麗で汎用に使えそうなアイコンセット集「Function Icons」。 次のようなアイコンが公開されています。矢印やコメントアイコンの他、クレジットカード用のアイコンなど、128種類にわたるアイコンが収録されています。 すべて 48x48 の PNG 形式で配布されているようです。 関連エントリ iPhone用アイコンみたいなソーシャルアイコン集「Social Network Icon Pack」 「フォローしてね」を表すTwitterアイコン集 物凄く綺麗なアイコンセットが色々
30 Easy To Follow Photoshop Layout Design Tutorials プロレベルなサイトデザインのPhotoshopチュートリアル集。 次のような非常にクールなデザインレイアウトの作成チュートリアルをまとめたエントリが公開されています。 Design A Creative Unusual Layout ページは四角形という概念を打ち砕く奇抜なレイアウト Design a premium Wordpress blog with Photoshop 綺麗にまとまったレイアウト Design an awesome colorful layout カラフルなグラデーションが美しいレイアウト Clean and Colorful Web Layout カラフルで目を引くレイアウト 全部見る といった感じで、物凄い量の教材があつまっています。 英文というのを乗り越えて
コンバージョンのプロセスは、入り口が広く出口が極端に狭い「じょうご」にたとえられることがあり、最適化の取り組みを出口の方に集中させているマーケターは多い。じょうごの出口におけるコンバージョン率を調べる効果的な方法の1つは、直帰する訪問者を除いた独自のユーザーセグメントを作成することだ。こうしたセグメントからは、自サイトに関心を持つ訪問者のみについて、サイトとの関わり方を示すがわかるので、サイトの変化を知る優れた方法となる。なにしろ、そういう訪問者こそ、お金を払ってくれる顧客になる可能性が最も高い相手なのだから。 だが、じょうごの入り口はどうなっているのだろうか? サイトにやってきてもすぐに去ってしまう訪問者が多い? もしそうなら、最も取りこぼしの多いページがどれなのかを詳しく調べてみる必要がある。 SEOで最も力を入れるべきページを特定しないうちに、慌ててサイトを変更してはいけない。じょう
今回から3回にわけて、消費者(コンシューマー)に対して企業Webサイトは何をすべきかということをお話したいと思います。今日、さまざまな業種業態の企業がWebサイトを展開しています。パソコンや家電製品、航空券、ホテルの宿泊予約、保険など、さまざまな商材やサービスがWebサイトで提供されているわけですが、言うなれば「1つの店舗」にも匹敵するWebサイトをまかされたWeb担当者の皆さんの悩みは多く、その種類も多岐にわたると思います。そこで、「サポート」「マーケティング」「ロイヤリティ向上」をテーマに、これからの3回でそれぞれフォーカスして、それらの悩みの解消となるべくお話を進めたいと思います。 Webサイトはクレームを言いやすいもし、あなたが普段使っているものやお気に入りのもの、ついこの前買ったちょっと高かったものなどに不具合があったり、壊れてしまったりしたらどうしますか? 「こんなはずではなか
Twitter関連の便利なツールがかなり 紹介されて来ていて、そろそろ混乱 してきたのでまとめます。 リンク先は日本語で解説してくれて いる記事にしています。されていない ツールやサイトは載せていません。 今現在は165個のツールがありましたが、今後追加していく可能性もあります。 TwitterWikiに載ってるサービスは極力載せていないつもりですが、若干被ってるかも。 全てのサービスを試したわけではありません。MacとiPhoneは持って無いですし。。。 また、リンク先を日本の記事にしたのは、海外のサービスに直接貼っても 使い方が分からなければ意味が無いと思った為です。 なので、リンク先がかなり偏っていますが重ねてご了承下さい。 ※コメント頂いたので15個追加して180個更に20個追加して200個に育った。 ※8月アップデート>17個増えて217個 ※9月アップデート>30個増えて247
Twitterまとめサイト「さまざまなめりっと」管理人のまなめさんが、Twitter上で起きた注目のニュース3本をクローズアップして紹介。これだけ読めば、Twitterの最新動向が分かる! ……かも。 7月6日から7日にかけて、「【短冊】○○になりますように。#tanzaku」といった形で「願かけ」をするユーザーが続出し、小さなブームを生んだ。 このブームは「明日七夕か! 願い事を書くハッシュタグないのかな?」という1人のユーザーのつぶやきから始まったもの。ハッシュタグとは「#tanzaku」のように、言葉の前に「#」を付けるもので、特定の話題や出来事を検索する際に便利なタグだ。 「#tanzaku」として書き込まれた内容は、「就職できますように」「給料が増えますように」といった就職難の現状を反映するような書き込みから、「彼氏/彼女ができますように」という切実な願いまで、ユーザーの生活を垣
「すそわきがの治療ってどんな方法がある?」「スソガの匂いを隠せるデオドラントクリームを探している」このような悩みを抱えている人は、たくさんいます。 すそわきがの治療方法やスソガの匂い隠しにおすすめなデオドラントクリームをまとめてみました。スソガでお悩みの方は、ぜひ、参考にしてみてください。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く