Twitterのタイムラインを表示するブログパーツ – creamuちょっとメモ。 Twitterのタイムラインを表示するブログパーツのスクリプトです。テストで貼ってみたけどあまり意味なさそうだから、いつか何かのサイトで使うときのために残しておきます。 Twitter公式のものをカスタマイズしています。以下のページの「ウィジェット」から作成できますね。このページはなかなか見つからなかったりするので、一度見てみてください。 Twitter / 活用術 ウィジェットは以下のような感じです。 天気がよくて気持ちいいですね。今日もいろいろ進めるぞ。
レスポンシブデザインに使えるjQueryプラグイン集 – creamu
「20 Useful jQuery Plugins for Responsive Web Design」という記事で、レスポンシブデザインに使えるjQueryプラグインが20個まとまっています。 上記はPHOTO SWIPE。スマートフォン用に、スワイプできるスライドショーを作ることができます。 isotope アニメーションでオブジェクトの位置が変更されます ResponsiveSlides.js シンプルなクロスフェードタイプのスライドショー The Heads-Up Grid オーバーレイでグリッドラインを表示 jQuery Masonry fluidなレイアウトが実現できる scrolldeck 矢印キーでページ移動、動きのあるプレゼンテーションを可能にする Elastislide ウィンドウサイズの変更に対応した、レスポンシブなカルーセルギャラリー AUTOMATIC IMAGE
Photoshopでクオリティーの高いデザインをするチュートリアル – creamu
Photoshopでクオリティーの高いデザインをしたい。 そんなときに参考になるのが、『Create a Clean and Professional Web Design in Photoshop』。Photoshopでクオリティーの高いデザインをするチュートリアルです。 新規ドキュメントの解像度設定（1200 x 950px）や、ロゴやメニューの作り方、グラデーションの具合、marginの取り方など、ディテールまで参考になるチュートリアルになっています。 記事の最後にある「clean-professional-weblayout」からPSDファイルをダウンロードできますね。 ぜひ見てみてはいかがでしょうか？ Create a Clean and Professional Web Design in Photoshop 日曜日ももう終わりですね〜。猛烈作業中なのでがんばります。
写真をうまく撮るためのTips – creamu
さて、デジカメについての本を読んで結構知識がついたのでまとめておきます。 撮影モードを「プログラム（P）」にする。 絞り値とシャッタースピードを自動で組み合わせてくれる機能ですね。 ピント設定は中央1点のスポットAFにする。 マルチよりも真ん中1点で合わせるのが基本だと。そしてシャッターを半押ししたあとにフレーミングする「AFロック撮影法」を使います。 プログラムモードにしたあとはプログラムシフト 「ここはシャッタースピードを速くしたい」というときに、コマンドダイヤルを回す。絞り値とシャッタースピードはシーソーの関係で、自動で適正になってくれる。「シャッタースピード優先」と「絞り値優先」を選べるんですね。これを「プログラムシフト」といいます。 流し撮り（追い写し） カメラを被写体の動きに合わせて動かしながらシャッターを切る撮影技法。シャッタースピードが速ければくっきりと、遅ければ躍動感のあ
MovableType4.2でカテゴリーアーカイブをドロップダウンにする方法 – creamu
ちょっとメモ。 MovableType4では、「ウィジェット」っていう名前で、サイドバーのコンテンツが管理できます。 「検索」や「最近のブログ記事」などですね。MT3で「module」タグが使われている箇所です。 サイドバーのコンテンツをドラッグ&ドロップで表示・非表示を管理できます。順番を並び替えることもできますね。 サイドバーは、以下のようなソース1行で読み込むことができます。 <$mt:Include module=”サイドバー”$> ソースに日本語が使われているので、よぅわからんと思って今まで全然使っていなかったんですが（MT3のソースをコピーして、SSIで読み込んでいました）、使ってみるとすごく便利！SSIと同じですね。 MT3ではデフォルトでデザインが崩れていた「検索結果テンプレート」とか、アーカイブページなども、MT4では崩れません！トップページだけデザインとCSSをいじって
Google Chromeのエクステンション30 – creamu
Google Chromeを使っている（アドオンがあるなら使いたい）。 そんなあなたにおすすめなのが、『30 Irreplaceable Chrome Extensions』。Google Chromeのエクステンション集です。 便利そうなのをざっとご紹介しますね。 Aviary Screen Capture キャプチャ（スクリーンショット）が撮れる Xmarks Bookmarks Sync Firefox、Safari、IEとブックマークを同期 Evernote Web Clipper Evernoteに簡単に投稿できる Chrome Gestures マウスの動きで「戻る」「進む」などを制御できる Google Similar Pages beta (by Google) よく似たページを探してくれる Feedly 雑誌のようなスタートページにできる。Google ReaderやTw
WordPress構築前にやっておくこと – creamu
もう一つメモ。WordPressをローカルで構築して、テストサーバ、本番サーバにインポートして移行する場合、画像のファイルパスには気をつける必要があります。 画像のファイルパスは絶対パスでDBに入るので、外部サーバに持って行ったときにDBの中を書き換える手間が発生してしまうんですよね。 なので、サイトルート相対で書いておくとその書き換えが不要になるので楽です。 「設定 / その他の設定」で、上記のように「ファイルへの完全な URL パス」にサイトルート相対パスを記述。この場合は「/wp-content/uploads」としていますが、先頭にスラッシュをつけていれば、任意のパスに設定可能です（「/images」など）。 参考にしてみてください！ 天気がよすぎるので出かけようかな。
独自のWordPressテーマを作るチュートリアル20+ – creamu
TUTORIAL LOUNGEで、独自のWordPressテーマを作るチュートリアルがたくさん紹介されています。 ざっといくつかご紹介。 Photoshopで作るモックアップ（PSDダウンロード付き） WordPressのテーマを一から作る方法 Part 1（PSDダウンロード付き） WordPressのテーマを一から作る方法 Part 2（PSDダウンロード付き） WordPressのテーマを一から作る方法（PSDダウンロード付き） WordPressとjQueryでベーシックな新聞スタイルのデザインをするチュートリアル（PSDダウンロード付き） GreenPressのWordPressテーマデザイン（PSDダウンロード付き） デフォルトのテーマをカスタマイズしていく方法 水彩画タッチのブログデザインをするチュートリアル（PSDダウンロード付き） PSDファイルがダウンロードできたり、デ
デザイナーのためのロゴデザインのチュートリアル&素材45+ – creamu
97412913, iStockphoto/ Thinkstock よりよいロゴをデザインしたい。 そんなときに参考になるのが、『45+ Beautiful Logo Design Tutorials and Resources for Designers』。デザイナーのためのロゴデザインのチュートリアル&素材集です。 いい感じのものが揃っていますね。 3D Logo Tutorial illustratorとPhotoshopを併用して3Dのロゴを作るチュートリアル Logo Design Project Step By Step Walkthrough コンセプトメイキングから実制作までを解説した記事 Design a Grungy Circular Logo 円形でグランジのテクスチャ感のあるロゴの作り方 Step By Step Logo スケッチからロゴを作るまでのチュートリアル
ロゴをデザインするときの8つのルール – creamu
ロゴデザインがしたい。 そんなときに参考になるのが、「Eight Helpful Rules for Logo Designers」。ロゴをデザインするときの8つのルールです。 印象的なものが揃っていますね。 より少ない色、より少ないフォント 一般的なフォントを使う。ArialやTimes New Romans、Helveticaなど シンプルな形が美しい ハイライトやグラデーション、シャドウを使わない 美しいロゴは、どんなメディアで使われても美しい 白黒でも美しく見えるのがよいロゴ メッセージを伝えるために、シンプルな構成がマスト 覚えやすいロゴにすべき。ナイキやコカコーラ、オリンピックのロゴなど Logo pondやLogospireなど、インスピレーションになるようなサイトもいくつか紹介されています。 ロゴデザインをするときの参考にしてみてはいかがでしょうか？ Eight Helpf
illustratorで3Dのグラフ・チャートを作るチュートリアル – creamu
76800027, Creatas/ Thinkstock illustratorで綺麗なグラフを作りたい。 そんなときに参考になるのが、『Create Beautiful 3D Graphs and Charts in Illustrator』。illustratorで3Dのグラフ・チャートを作るチュートリアルです。 円グラフツールで数値入力してグラフを描き、「効果 / 3D / 押し出し・ベベル」で立体感をつけたり（ベベル：曲面を選択）と、魅力的なチュートリアルとなっています。 aiのソースファイルがダウンロードできるので、一度見てみてください。 Create Beautiful 3D Graphs and Charts in Illustrator GoogleカレンダーのToDo リストで、案件の一覧を管理するようにしてみました。結構便利。
サイトをかっこよくするためのjQueryプラグイン25+ – creamu
サイトにかっこいいUIを実装したい。 そんなときにおすすめなのが、『25+ Best jQuery Plugins To Beautify Your Website』。サイトをかっこよくするためのjQueryプラグイン集です。 初めて見るものもあっていい感じです。 YoxView lightbox系の画像オーバーレイスクリプト。ナビゲーションとキャプションがフェードアウトしたりとディテールが気持ちいいです Fade In and Out Tooltips for Prototype and Scriptaculous フェードイン&アウトで表示されるツールチップ Sweet Titles Transparent and Fading Tooltips ページロード時に、画像をフェードインして表示させるスクリプト Captify Displays Pretty Image Captions
2010年の間に見ておきたいjQueryプラグイン12 – creamu
jQueryのプラグインをチェックしておきたい。 そんなときにおすすめなのが、『12 Helpful jQuery Plugins to Check Before Ending April 2010』。2010年の間に見ておきたいjQueryプラグイン集です。 いい感じのものがまとまっているので、いくつかご紹介しますね。 jQuery ajaxContactForm plugin フォームのバリデータ。背景色を変えることでシンプルにアラートしてくれる。MITライセンス Image Puzzle Using jQuery 画像のパズルゲームを作れるプラグイン jQuery Mega Menu jQueryを使った、見た目も動作もクールなドロップダウン型メガメニュー JCoverflip Macのカバーフローのようなギャラリーインターフェースを作れるプラグイン jQuery Bubble Po
WordPressで構築された美しいサイト40 – creamu
サイトをWordPressで作りたい。 そんなときに参考になるのが、『40 WordPress-Powered Websites With Awesome Designs』。WordPressで構築された美しいサイト集です。 かなりかっこいいサイトが揃っています。 Theme Garden WordPressのテーマを配布しているTheme Garden Aaron Irizarry テクスチャとタイポグラフィーが美しいデザイナーのブログ kazuhide fukuyama 日本のフリーランスデザイナー、Kazuhide Fukuyama氏のポートフォリオサイト UpThemes メニューやスクリーンショットの置き方、ボタン等、洗練されたデザインのUpThemes Awesem 反応の速いドロップダウンメニューと、スライドショーが美しいAwesem WordPressユーザの方は、一度見て
見ておきたいFlashサイト60 – creamu
Flashサイトからインスピレーションを得たい。 そんなときにおすすめなのが、『60 Creative Flash Websites You Should Not Miss』。見ておきたいFlashサイト集です。 かっこいいのが揃っているので、いくつかご紹介します。 If Your Milk Carton MoOOos, You Win! ミルクをモチーフにしたかわいいゲーム Case-Mate: I Make My Case iPhoneのケースデザインができるサイト Plate Interactive 遊び心のあるストップモーション IKEA Soft Toys AID IKEAの、ぬいぐるみの売り上げをSave the ChildrenとUNICEFに寄付するプロジェクト Infrared5 コンサルティングファームであるInfrared5のコーポレートサイト。重なった紙が切り替わっ
WordPressをこじゃれたものにするためのテクニック10 – creamu
devSnippetsで、WordPressをこじゃれたものにするためのテクニックが紹介されています。 ざっといくつかご紹介。 » Implement a Nice & Clean jQuery Sliding Panel in WordPress 2.7+ ログインパネルをスライディングパネルにして短いWelcomメッセージを表示 » jBreadCrumb パンくず要素が長すぎる場合にスマートに折り畳んでくれる » Sliding Boxes and Captions with jQuery マウスオーバーするとスライドして画像が切り替わるインターフェース » Fantastic News Ticker Newsvine-like using Mootools mootoolsを使って縦にスクロールするニュースティッカー » J Post Slider 画像をローテーションしたりして記
WordPressをカスタマイズするTips10 – creamu
WPSHOUTというサイトで、WordPressをカスタマイズするTipsが紹介されています。 いくつかご紹介しますね。 ・カスタムフィールドを使わずにトップページにリサイズされたサムネイル画像を表示する WebDeveloperPlusを参考に実装 ・ピックアップコンテンツギャラリーをjQueryで実装 雑誌のようなデザインの要素の一つに、画像を使った特集コンテンツがある。 WebDeveloperPlusをWordPress用に書き直している ・エントリーの下にソーシャルメディアへのリンクを配置する ソーシャルメディアアイコンはA quick Googleから探せる。 DeliciousやDiggへ追加するパラメータの付け方を紹介 ・人気のあるエントリーを表示する WP-PostViews pluginが便利 結構いい感じのが揃っていると思うので、一度見てみてください。 » 10 Ti
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
クールなモダンセリフ書体「Accent™」 – creamu
美しいフォント100選 – creamu
ポートフォリオ・フォトログ用のWordPressテーマ14 – creamu