degoogleは脱Googleの為に作られた代替アプリ等のリストです。Googleから距離を取りたい時に重宝するリソース等がリスト化され、Githubでも共有されています。 検索や解析、グループ、フォト、Gmail、Workspace、Youtube、ニュースに翻訳にアラート、カレンダー、ドキュメントやスプレッドシート、ドライブなどなど他のあらゆるGoogleのサービスの代替サービスも纏められています。 更に追跡の防止、各デスクトップアプリやOS、スマホアプリなどなどGoogleが関わっているサービスやアプリの代替方法が大量にリスト化されています。 とはいえ完全互換でもないですし、現実的に難しい問題ではありますが、個人的にも、もう昔のGoogleはいないと思っているので、自分が出来る範囲で自己防衛に努めようと思っているので参考に見てみようかと思います。 degoogle

Milligramは軽量でミニマルなUIフレームワークです。必要最低限のコードでクリーン、圧縮版で2KBと軽量な設計ながら欲しいUIコンポーネントは一通り揃っていて使いやすそうな印象でした。大きな特徴がこれといってないので肥大化した有名なフレームワークと比べて取っ付き易いですね。IEを含む殆どのブラウザ最新Ver.に対応、ライセンスはMITです。 Milligram

HackMDはmarkdownで書いたドキュメントを複数人で編集、リアルタイムプレビューが可能なツールです。オープンソースとしても公開されています。サインインはしてもしなくても使えるみたいですね。時間なくてあまり触ってませんが、僕が動作サンプルを触った時はエラーが出てしまっていました。今夜にでも時間が作れたら再度試してみようと思います。ライセンスはMITとの事。 HackMD

Plain JavaScriptはjQueryを使わずにDOM操作等を行う方法を調べることが出来る逆引きリファレンスサイトです。jQueryはJavaScriptに詳しくなくても容易にDOM操作を可能にしてくれましたが、様々なニーズに応えていったために肥大化しました。ちょっとしたDOM操作だけならわざわざ重いファイルを読み込まずに実装した方がパフォーマンスを損なわずに済みます。が、その方法がわからない、という方も少なくないかもしれません。そういった方の為に、jQueryを使わずに純粋なJavaScriptによるDOM操作の方法を調べられる、というもの。一部の方には便利な逆引きリファレンスサイトではないかなぁと思います。 Plain JavaScript

Lime TextはOSSとして公開されているSublime Textクローンのテキストエディタです。もともとSublime Text愛用者さんだったみたいですが、Sublime Text開発陣にユーザーとして不安を感じ、自作に至ったそうで、本ツールのゴールを明示しています。100％オープンソース、Textmate互換、クロスプラットフォームなどを意識しているようですね。今後が楽しみです。ライセンスは二条項BSDライセンスです。 Lime Text

Light TableはOSSとして公開された先進的なIDEです。Clojure製で、PythonやJavaScript、HTML、CSSなどの言語をサポートしています。Clojure、JS、Pythonは実行結果をその場で確認出来ます。まだα版ですが、OSSになった事で開発スピードの向上も期待出来そうですね。 Light TableOn github

Twitter Bootstrap用の、目次生成スクリプト・tocify.jsのご紹介です。見出しを探し出して自動で目次を作る、みたいなやつ。実装も楽でユーザーにも優しい実装なのは素敵ですね。 冗長化したページではスクロールは面倒なので目次とページ内リンクを作ろう、というもの。見出しを探して自動生成します。 アニメーションスクロールや入れ子にも対応しています。IEも7から対応との事。 $(function() { $("#foo").tocify(); });セレクタを指定して <div id="foo"></div>空要素を用意すればいいだけみたい。 オプションも豊富に揃っています。詳細は以下よりどうぞ。 tocify.js

Androidに特化したUIデザインパターン のギャラリーサイト・Android niceties のご紹介です。自動で次のページを読み 込んでくれるのでサクサクギャラリーを 見る事が出来ます。特化型のギャラリー は少ないので覚えておいて損は無いと 思います。 AndroidのUIデザインパターンを専門に収集しているギャラリーです。Tumblrが使われています。 1つのサイトに数枚のキャプチャが横並びで掲載されています。スクロールすると次のページを自動で読み込んでくれるのでサクサク確認出来ます。 ↑ ちょっと分かりにくいかもですけど、キャプチャ下部にサイトコンテンツ別で分けられたタグが有ります。 ↑ キャプチャのサイズの変更も可能。 暇なときのインスピレーション向上にいかがでしょう。ご利用は以下よりどうぞ。 Android niceties

Twitter Bootstrap用のテーマを 作成出来る、というジェネレーター 的なもの。それだけでなく、作成 しながらスマフォやタブレットで の表示状態も確認出来ます。 Twitter Bootstrapのデザイン作成ツールです。Twitter BootstrapはレスポンシブWebデザインに対応していますので、このジェネレーターでもスマフォやタブレットデバイスのサイズで表示確認が出来る様になっています。 確認しながら作成できます。リンク色とか背景色とかボタンのカラーとか。使い方はよくあるジェネレーターと相違ないので割愛します。 簡易的なものではありますが、上記のようにスマフォやタブレットデバイスのウィンドウサイズにリサイズして表示を確認する事が出来ます。 コードは通常のCSSだけでなくLESS形式でも発行可能です。 もう少し使い勝手が良くなると嬉しい。今後に期待です。Twitter

DOM操作用の軽量JavaScriptフレーム ワーク・Chibiのご紹介。圧縮版で 5KBほどのフレームワークで、単純な DOM操作をjQueryライクに出来ます。 オールドブラウザにも対応してくれて るみたいです。 単純なDOM操作用に作られたJSフレームワーク。軽量、IE6やモバイルを含む、様々なブラウザに対応できるみたい。 ChibiはDOM操作に特化したJSライブラリ。圧縮版で5KBほどです。単純なDOM操作だけの為にjQueryを使っているサイトなら、こういう軽いサイズのフレームワークを使ったほうがパフォーマンスの改善も期待できますね。 Sample 動作テスト。a要素を別窓になるように操作しました。 <script src="chibi-min.js"></script> <script> $('a').attr('target','_blank'); </script>こん

この手のは沢山出回っているので今更 っていう感じの話題ですけど、個人的 にはどのライブラリも利用しやすい 感じではなかったので簡単なコード で出来るものを作ってみます。 最近、人気のスライダー系プラグイン、Nivo SliderがレスポンシブWebデザインに対応しました。 The Nivo Slider is Responsive! これ以外にもググればプラグインは沢山出てきますので、選択肢は沢山ありますが、短いコードで済むに越した事は無いので試しに書いてみます。 Sample Sample on jsfiddle $('img:gt(0)').hide(); setInterval(function() { $('img:first-child').fadeOut(0).next('img').fadeIn().end().appendTo('div'); }, 4000);​コードは特

Androidアプリ専門のUIギャラリー サイト・Android App Patternsの ご紹介。iPhoneのは多いですけど、 Android専門は初見でした。インス ピレーション向上に覚えておいて 損は無いかもですね。 AndroidアプリのUIギャラリーです、パーツごとにカテゴリ分けされています。 Androidアプリのパーツ別ギャラリー。メニューとかリスト、ログインページ、プロフィールページなど様々なカテゴリに分けられています。 サインアップページのインターフェースなどなど。 タッチデバイスを取り入れたスマートフォンアプリにとってUX向上はユーザー獲得のための重要なファクターとなり得ますのでこうしたギャラリーからインスピレーションを高めたり、実際に触れるのは必要不可欠ですね。 今後も数が増えてくれると素敵な感じになりそうです。以下よりどうぞ。 Android App Patte

スマフォ向けのアプリ開発者さん向けの リソースサイトで良さそうなのがあった のでシェア。デザインやツールなどを 淡々と紹介するMobile Tuxedoです。既に 結構な量が紹介されていますので購読先 に加えて見ては如何でしょう。 開発者さん向けのサイトですねー。多岐にわたってリソースを紹介しています。Twitter bootstrapをWordPressテーマにして運営、すでに10P以上の情報を掲載しています。このスピード感凄いですね。

日曜日です。如何お過ごしでしょうか。 さて、今日も軽い話題・・HTMLファイル を送信するとそのページで利用している classやidを抽出、cssの雛形としてDL 出来るようにするWebサービスです。 用途が思い浮かばない・・と、思ったんですけど、良く考えたらリニューアル案件なんかで地味に便利かも。 HTMLファイルを送信したらその中で使われてるclass名とかが書かれたcssを吐き出すってだけのサービスです。 PHPとjQueryプラグインのUploadifyが使われています。アイルランドの学生さんが作ったそうですよ。 送信するとcssの雛形を作ってくれます。 まぁそんだけなんですけどデザインの訴求力があったのでなんとなくご紹介しました。・・でも、なんで熊なんだろ。 以下よりどぞ。 Bear CSS

Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデート] よくアクセスいただくのでハブ的な役割くらいは果たそうと思います。 jquery / jQueryの本家です。 jQuer

お問い合わせを頂いたのでついでに ご紹介。Twitterのウィジェットのような ものをお探しだったようですが、現在の 公式のウィジェットではなく、色々とcss でカスタマイズ出来るようにしたいとい うご希望でした。Twitterの投稿を表示す るだけなら3行もあれば実装出来ます。 タイトルはやや釣りに近いです。知らない方向け。 Webクリエイターボックスさんで表示されてるような感じにしたい、というご希望でした。なぜ僕に質問して頂いたかは謎ですがお答えさせて頂きます。 ウィジェットやjQuery、RSSを使って～等、色々と方法はありますが、自分で表示もデザインしたい、シンプルでいいというのであれば3行もあれば表示させる事が出来ます。 APIキーを取得して～等の面倒な手順も要りません。 [note]statuses/user_timeline/ユーザーのアカウントID.jsonの形式のjson

今いる場所を取得、GoogleMapに ピンを打って保存し、その情報にタグ やラベル、写真を加えて保存する事が 可能な地図系のiPhone無料アプリ、 Place Tagsのご紹介です。 今いる場所を取得、GoogleMapに ピンを打って保存し、その情報にタグ やラベル、写真を加えて保存する事が 可能な地図系のiPhone無料アプリ、 Place Tagsのご紹介です。 なかなか便利そうだったのでご紹介です。カフェ巡りが好きなのでちょこちょこ使いそうです。 似たようなアプリは他にもありそうですけどね。。無料ですし、個人的に用途がピッタリだったのでシェア。 起動画面。 起動すると上記のような画面になりますので右上の+ボタンをタップすると位置情報を取得。 場所のタグ（名前）を保存します。住所をタップすれば地図を確認出来ます。 地図はGoogleMapが使われています。 さらにその位置情報にメ

一旦以下のようなページに移動してから、Post itemをクリックするとGoogleBuzzに投稿されます。↓ GoogleリーダーにもRSS登録されるのかと思いましたが平気そうでした。最初は少し躊躇しました。。 HTMLコードです。 <a href="http://www.google.com/reader/link?url=【URL】&title=【記事タイトル】&srcTitle=【サイト名】">この記事をGoogleBuzzに投稿する</a>WordPressなら以下のようなコードで設置できると思います。 <a href="http://www.google.com/reader/link?url=<?php the_permalink() ?>&title=<?php the_title(); ?>&srcTitle=<?php bloginfo('name'); ?>">この記