1クリックで画像から便利なカラーパレットを作成でき、共有もできるオンラインサービス -Colorpilgrim
手元やオンラインの画像からカラーパレットを1クリックですぐ簡単に作成でき、共有もできるオンラインサービスを紹介します。 もちろん、他の人が作成したカラーパレットをダウンロードすることもできます。 Colorpilgrim [ad#ad-2] Colorpilgrimでカラーパレットを見る Colorpilgrimでカラーパレットを作る Colorpilgrimでカラーパレットを見る Colorpilgrimでは数多くのカラーパレットがカテゴリごとに登録されています。 これらを見るのに登録は不要です。 ※カラーパレットのダウンロードには、登録が必要です。 下記にいくつかご紹介。
色をベースにフリーの背景画像や色パターンが検索できる「ColRD」:phpspot開発日誌
Discover ? ColRD.com 色をベースにフリーの背景画像や色パターンが検索できる「ColRD」。 左のナビゲーションから色をクリックするとその色に似た背景画像やカラーパターンが表示されます。 画像に関しては、ライセンス形態も画像を選択するとその場で表示され、パブリックドメインなどの画像はそのままサイトの背景として使ってもよさそう カラーパレットやグラデーションをブラウザ上で作ってシェアするようなこともできます 色を使うソーシャルサイトということでなかなか面白いアイデアですね 関連エントリ 背景画像に更にドットパターンを合成して超カッコよくできるjQueryプラグイン「Vegas Background」 背景画像を自動リサイズしてうまくフィットさせられるjQueryプラグイン「Backstretch」 背景画像に使えるド派手なフリーのベクターイメージ２０
素敵な配色を見つける・作る、カラースキーム設計やグラデーション・パターン作成に役立つ -ColRD
さまざまなカラーパレット、グラデーション、パターンを見るだけでなく、作成して共有することもできるColRDを紹介します。 ColRD [ad#ad-2] カラーを見つける カラーを作る カラー作成に役立つツール カラーを見つける まずは、ColRDの「Discover（見つける）」から紹介します。 ColRDでは、カラーに関する4つのカテゴリが用意されています。 Discover Color Discover Palette Discover Gradient Discover Pattern
画像をドラッグ&ドロップで複数まとめてアップロードし、一括でサムネイル画像に変換できるWebサービス・Batch Thumbnail Generator - かちびと.net
日曜日ですねー。休日を如何お過ごし でしょうか。たまにはWebサービスの ようなものでもご紹介。個人的には あんまり使わないんですが、ちょっと したときに便利かもと思ったので シェアして見たいと思います。 タイトルじゃ全然ピンと来ないと思うんですが、ローカルから画像をまとめてドラッグ&ドロップでアップロードして、ドラッグで一括サイズ調整し、一括DLできる、みたいなやつ。 複数まとめて同じサイズのサムネイルを作成できます。サイズもドラッグで調整可能です。 画面にドロップすればどんどん追加できます。 サイズは一括で変更する。 サイズがOKならボタンクリックでzipでもらえます。 アップした画像はセンターでクロップするか否か、背景やフォーマット(PNG かJPG)の選択も出来ます。 このサービスが凄くいい、というか、CMSの管理画面にあると便利かなって少しだけ思いました。用途は限られそうですけど
CSS編集がブラウザ上でリアルタイムに行えホスティングもしてくれる「WebPutty」:phpspot開発日誌
WebPutty: Simple, fast, and powerful CSS editing and hosting. - WebPutty CSS編集がブラウザ上でリアルタイムに行えホスティングもしてくれる「WebPutty」 次のような２ペインにわかれたUIで右のCSSをいじると即座に反映されるようなツールをブラウザベースで提供。 セレクタを選択すると、影響を受ける要素がハイライトされます Publishボタンですぐさま公開。 ムービーでその便利さを見ることができます 関連エントリ CSSで様々なアニメーションが実現できる「Animate.css」 プロクオリティでフリーの(X)HTML/CSSテンプレートいろいろ CSSのナビゲーションメニューサンプル５５
ブラウザ上で複雑なレイアウトが作れる「Layzilla.com」:phpspot開発日誌
HTML layout generator - Layzilla.com ブラウザ上で複雑なレイアウトが作れる「Layzilla.com」 空白のキャンバスにボタンをポチポチ押していってドラッグ＆ドロップすることでレイアウトをどんどん組み立てられます。 レイアウトを配置した例。それぞれ、ふちをドラッグすればリサイズ可能 終わったらソースコードをジェネレート 次のようなそこそこ綺麗なHTMLが出力できます。 勿論、CSSも出力できます。 関連エントリ 複雑なCSSレイアウトをウェブ上で簡単に作成できる「The 1Kb CSS Grid」 レイアウト作成に役立つCSSグリッドレイアウトジェネレーター集
あなたのPNGとJPEG画像をまとめて最適化してくれるオンラインサービス -Kraken
PNGとJPEG画像の画質をほとんど損なわずにファイルサイズを軽減してくれるオンラインサービスを紹介します。 Kraken -Online Image Optimization Tool [ad#ad-2] Krakenの使い方は簡単です。 サイトにアクセスし、 Kraken ページ中央のグレーのエリアに、画像ファイルをドラッグします。 ※ドラッグ非対応ブラウザは「Select files from disk」ボタンでファイルを選択します。 ファイルのアップロードが完了すると、すぐに最適化が完了します。
Webサイトの表示速度を計測するシンプルで見やすいWebサービス・Pingdom Tools - かちびと.net
Webサイトの表示速度をファイルごとに 計測してくれるツールです。表示速度 を可視化してくれるんですが、その速度 を遅くしているのはどのファイルなの か、というのが一目で分かります。 GoogleのPage Speedももちろん使うん ですが、まぁこれはこれでありかなと。 最近サーバーを変えてから担当の方とパフォーマンスの改善の話を相談していて、昨日はmysqlとapacheのチューニングを行って貰い、施工前後のサーバーへの負荷をデータに取って検証して貰いました。 そんなわけでまだ503が出たりとご不便お掛けしていますが、概ね原因が把握できてきましたので今後はパフォーマンス改善に移行します。ご不便をお掛けして申し訳ありませんでした。 で、今日の話題です。そんなパフォーマンス改善施工ですが、当然Webサイト側でも出来ますので、どんなファイルがWebサイトの表示スピードを妨げているかをこのツー
画像からカラーパレットを生成しカラーコードをHEXやRGB形式でコピーできる「Pictures To Color」
画像からカラーコードを取得するようなサービスにはPic2Colorのようなものもありますが、配色を一覧するカラーパレットの操作性や視認性がいまいちだったり、カラーコードがHEX形式だけだったりします。 また、サイトから直接使っている色を抜き出すI Like Your Colorsのようなものは、これまた見た目もいまいちで、HEXのみ。どれも一長一短ありといった感じです。 今回ご紹介するのは、カラーコードをHEX以外のRGBなどの形式でもクリップボードにコピーでき、配色のカラーパレットをHTMLで一覧することもできるWindows用のフリーソフトです。 組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! 画像から色コードをコピー、一覧できる「Pictures To Color」 「Pictures to
あなたのTwitter, WordPress, Tumblrを美しいタイムライン状にするオンラインサービス-Timekiwi
指定したTwitter, WordPress, Tumblrなどから、簡単に美しいレイアウトのタイムラインを作成するオンラインサービスを紹介します。 Timekiwi [ad#ad-2] Timekiwiの使い方 Timekiwiを使ってみました Timekiwiの使い方 Timekiwiの利用は、個人に限りに無料です（商用は有料）。 下記ページにアクセスし、Twitterならアカウント、WordPress, TumblrならURLを入力し、「Show me my timeline」ボタンをクリックします。 timekiwi — create a beautiful timeline. あとは、すこし待つだけで、自動でタイムラインが作成されます。 Timekiwiを使ってみました コリスのTwitterとWordPressで作成しているコリスで試してみました。 まずは、Twitterから。
2GBまでのファイルを登録無しで、簡単に共有(送信)できるオンラインサービス -just beam it
登録など面倒なことは一切無しで、簡単にファイルを共有できるオンラインサービスを紹介します。 共有というより、一度だけダウンロードできるURLを発行するファイル送信サービスと言った方がいいかもしれません。 just beam it [ad#ad-2] just beam itの特徴 just beam itの使い方 just beam itの特徴 利用するのに、登録など面倒なことは一切必要ありません。 ファイルは2GBまで。 一度だけダウンロードできるURLを発行。 アップロード側から、ダウンロードの進捗を見ることが可能。 just beam itの使い方 just beam itの使い方は、簡単です。 以下、2つのブラウザで紹介します。 アップロード側 Chrome(ブルーの枠） ダウンロード側 Firefox(グレーの枠）
あなたのウェブページが機能しているか7つの面からチェックできるオンラインツール -Spur
Spur [ad#ad-2] Spurの使い方 入力フォームにチェックしたウェブページのURLを入力して、「Spur it on」ボタンをクリックします。 画像でチェックしたい場合は、「Spur it on」ボタンの下にある「Upload an image」をクリックします。 クリックすると、ウェブページに7種類のエフェクトを与え、そのままでは気がつきにくい面からさまざまなポイントを確認することができます。 以下、その7種類のエフェクトを紹介します。 Grayscale グレースケールはデザインからカラーを取り除くことで、ユーザーの目がページのどこに引き寄せられるか確認するのに役立ちます。 見出しはブラックの背景にホワイトのテキストで高いコントラストを確認できます。 ロゴとナビゲーションはコンテンツサイトにドロップバックしています。 最新情報のコンテンツはグレースケールになると、コントラス
画像無しでアーガイルやタータンチェックなどのパターンを生成する -Patternizer
[ad#ad-2] 生成したパターンの利用方法 ページに利用する際は、下記のように記述します。 外部ファイル 「patternizer.js」を外部ファイルとして指定します。 <script type="text/javascript" src="patternizer.js"></script> HTML ページ内に空のcanvas要素を配置します。 <canvas id="bgCanvas"></canvas> <div class="wrapper"> <div class="content-wrapper"> <!-- Content here --> </div> </div> CSS 背景を固定表示にするために「position: fixed;」を指定し、コンテンツは「position: absolute;」と「left: 0px;right: 0px;」を指定します。 #bg
WebAPIを綺麗にスタイルしてデモ付きでドキュメント化できる「Swagger」:phpspot開発日誌
Swagger: A simple, open standard for describing REST APIs with JSON WebAPIを綺麗にスタイルしてデモ付きでドキュメント化できる「Swagger」 TwitterやFacebook等、大きいサイトはAPIを提供して利用者が自由にアプリケーションを作成して便利に使えますね。 成功の理由にはAPIも大きく寄与していそうです。 そこで新しくWEBサービスを作る際にはMySQLなどを直接叩くのではなく、APIをまず開発するという開発手法を取っているところもあるのではないでしょうか？ APIをまず作っておいて、それをベースにサイトを作っていくとAPI作成の手間が省ける上にスケーラビリティなんかも確保しやすかったりで本格的にやる場合はよい開発手法な気がします。 そんなAPIを作ったはいいけどうまくドキュメントがまとめられていなかった
JPEG画像を劣化させずにサイズダウンし保存、ワンクリックでサクッとFlickrやPicasaに投稿できるWebサービス・JPEGmini - かちびと.net
画像の最適化サービスですが、ちょっと珍しい タイプだったのでメモ的にご紹介。フォーマット はJPEGだけなので用途はかなり限られます が、画質を劣化させることなく、サイズを大幅 にダウンさせ、保存し、いつでも手軽に写真 をFlickrやPicasaに投稿できます。現在は 無料で使えるそうです。 現在はベータテストのようで、無料で使うことが出来ます。ワンクリックでFlickrに投稿できるので、写真素材などをFlickrにストレージしている方はこのサービスを間に使うのもありかもですね。 シンプルでいいですね。名前の通りJPEGだけですが、まだ立ち上げ間もないようでフィードバックも募集しているみたいです。 1枚1枚やるならログインは不要ですが、アルバムとして保存するにはログインが必要（無料）です。FacebookやGoogleアカウントでもログイン出来ますよ。 アルバムの作成 アルバムを作るには
ブラウザ上でカッコいいメニューを作れる「Menu Maker CSS3」:phpspot開発日誌
JavaScript - Menu Maker CSS3 jQuery - CodeCanyon ブラウザ上でカッコいいメニューを作れる「Menu Maker CSS3」 次のような検索窓つきのメニューをブラウザ上でパラメータ調整するだけで作れちゃう仕組みです。 jQueryプラグインベースのメニューが作れます。有料＄４ですが、なかなか面白い仕組みだったのでご紹介です。 作成画面 関連エントリ 超カッコいい確認ダイアログをjQueryで実装するチュートリアル jQueryを使ったアニメーションする投票グラフを作るチュートリアル 古いブラウザも考慮した角丸実装jQueryプラグイン「DivCorners」
知って損なし！WEBサービスにおける「β版」の定義とノウハウ : LINE Corporation ディレクターブログ
はじめまして！新規開発グループのNobeです。 オンラインゲームではよく聞くβ版・βテストという言葉。 最近ではWEBサービスにおいても「β版」という言葉がみられるようになりました。本日は、その定義とノウハウをお伝えさせて頂こうと思います！ β（ベータ）版とはそもそもどんな意味なのか。Wikipediaではこう書かれています。 ベータ版（ベータばん、β版）とは、正式版をリリースする前にユーザーに試用してもらうためのサンプルのソフトウェアである。 ベータバージョン、試用版（しようばん）、あるいは俗語的に人柱版（ひとばしらばん）という場合もある。 人柱（笑） さらに、オープンベータとクローズドベータというものがあり、 一般向けにオープンに公開するか、ユーザーを限ってクローズド公開するかに分かれます。 ゲームなどでみるベータ運用の一般的に認知されている目的は、 ・バグフィックス ・負荷試験 ・デ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブラウザ対応表とかでよく見かけるようなチェック表をサクッと生成するWebサービス・Compare Ninja - かちびと. net
2011年、スマフォ・デスクトップ用のクロスブラウザ確認ツールのまとめ
IDEA * IDEA
