背景パターンタイル自動生成
■Bookmark:javascript:■ヤンプー
Tiled backgrounds designer
背景連番パターンの画像を最低限の操作で作れ、ダウンロードできるウェブアプリサイト。
色を選んで図形を選んで角度とサイズを選んでApply Backgroundを押したら生成画面の背景が今つくったものに更新されます。自分で図形がアップできたらさらに便利なのに…。
トップ >> Bookmark >> javascript
Tiled backgrounds designer
背景連番パターンの画像を最低限の操作で作れ、ダウンロードできるウェブアプリサイト。
色を選んで図形を選んで角度とサイズを選んでApply Backgroundを押したら生成画面の背景が今つくったものに更新されます。自分で図形がアップできたらさらに便利なのに…。
GlassBox
おそくなりましたヤンプーです。
これフラッシュ?ってくらいのコンテンツがcssとjsで作れるんですねー。
ナビドラッグ・透過、ボックスエリア透過・リサイズ・ボックス内スクロール、アンカー式ページジャンプ、背景写真の差し替えなどの動きがあります。なにかでつかえるかもしれないのでめもめも。
グルメ:OSAKA-INFO 大阪観光情報
いつの間にか2月半ば…引越ししたけどダンボールのまま荷物を置いていて半月たってしまったヤンプーですこんばんは。今日はソララさんから教えてもらった大阪のタウンポータルサイトをナレッジ!マップ機能をかなり考え抜いてつくられているようで、スクロールにくっついているこの動作はかなり使いやすいです。
1-click Award
毎年面白いコンテンツを集っている1-click Award。
オフィシャルサイトも、作品に負けないユーモアなサイトになっています。
今年のギミックは、ブログシールと自動でサイトを回遊する仕組み。
お尻を向けているおじさんが立っていて、おじさんのお尻にマウスをさす(クリック)すると、おじさんは痛さで走り出します。ウェブページを飛び出して、別のウェブサイトを何枚か通り過ぎてオフィシャルサイトに戻ってきます。途中通り過ぎたサイトは、ブログシールを貼って参加している別サイトの中からランダムで選ばれるようです。
今までブログシールやポータルの広告で、このような飛び出し系の手法はたまにありましたが、数秒置きに自動で回遊する仕組みと組み合わせているのは始めて見ました。なるほどってかんじです。リアリティーがます方法ですね。
standardimage graphic and photography
FICC所属デザイナースズキケンイチさんのセルフポートフォリオだと思われるサイト。滑らかなスクロールとライトボックスを使ったシンプルでダイナミックな動きで、Javascriptで組まれています。
ImgArcとWorks部分のサムネイルのフォーマットが変更できます。こういう風なのが複雑に作れるようになるとAjax的なのが作れるようになるんだろうなと、こういうのをみるとJavaScriptの可能性が広そうで勉強しないといけないんだろうなと思っちゃいます。
IEでみてみたら…あら?
ModalBox — An easy way to create popups and wizards
ライトボックス系の同じHTML内にレイヤーを使ってポップアップを作るオープンソース。
358 W San Carlos St, san jose, ca - Google Maps
最近GoogleMapにStreetView(上)という新機能と渋滞情報(下)が追加されてるようです。StreetVewは人視点で360°見渡せたり視点の中心の人形をドラッグして別の場所を見たりできます。まだあめりかの主要都市限定です。早く日本版にもつけてほしい機能です。
Marcio Simnch Photography . main2
写真ポートフォリオサイトなんですが、操作が変わっています。
現状、実験的な機能ですが、イラレのハンドツールのように、ドラッグして紙面(画面?)をずらしていく機能が付いています。FLASHではなくHTMLでの機能です。ごくたまになにかの案件で使えたら便利ってことがありかもしれませんねー。
TurboTanks Tank Game
Javaでつくらた、壁を兆弾させて敵にぶつける戦車がモチーフのシューティングゲームです。物理計算がしっかり作られているため、シンプルなのに奥が深いです。撃った弾は跳ね返るので自分に返ってくることもあります。自分の弾にもぶつかります。あせって乱射してしまうと自分に弾が返ってきてすぐゲームオーバーしてしまいます。動きがすごい滑らかなので、グラフィックがチープなのが返って新鮮だったりします。
声ペディア -しゃべるWikipedia-
Wikipediaのテキストを自動音声でしゃべってくれるコンテンツです。男性・女性を選ぶこともできます。漢字もちゃんと音声になってます。あとルー語変換という機能も付いています。ルー大柴のように単語を無意味にカタカナ語にしてしゃべります。
例:
開発及びライセンス販売を行う
↓
イクスプロイテイション及びライセンスセールスをパフォームする
Gucci
ゆったりとしたコンテンツの切り替わり、写真の動き、メニューの動きなど今までフラッシュを使っての表現でしたが大手ブランドがのサイトでフラッシュなしでここまで表現してます。

制作にかかる手間はフラッシュよりかかるんじゃないかなー?とおもいましたが…。Ajaxの実績が豊富なチームが作ると、この方がつくりやすいのかもしれません。
ソースを見ても、SEOに強そうではなく、斬新・先進的ということで大きく評価されているサイトのようです。

MSNのマップコンテンツです。
GoogleMap・Yahoo!Map・Mapionなんかからかなりで遅れてマップコンテンツの登場ですが、処理速度もかなり不安定…。
MSNの場合Mapは重要性の低い扱いなのかもしれませんね。
8 1-2 eight & half:エイトアンドハーフ
オシャレなヘアメイクショップのサイトです。ふんわりけ写真がポップアップしたり、ふんわり上下スクロールしたり、ふんわり詳細ページが隙間から出てきたり、けっこうインタラクティブに見えますが全部JavaScriptでうごいています。たぶん全フリースクリプトシェアスクリプトだと思います。
まずうまく使ってるなと思ったのは…
http://oitake.jugem.jp/
いろいろ面白いジャバスクリプトをダウンロードできる個人実験ブログです。
このひといろいろ作ってるみたいですが、まずはcsvを表の形を保ったまま画像にするアプリケーションでとか作ってるみたいです。線のいろは文字の色、書き出し形式などいろいろ設定できます。

リンクをオーバーすると1文字ずつばらばらにぶるぶるするエフェクトです。
。.・ MaruTenTen
ページ内を真っ黒にして、「。」と「、」と「・」だけが白くでるようにしてみたら、星空みたいになるんじゃないかな?っていうアイデアから生まれたブログシールのようです。ツールをクリックすると…
Anova Jesper Bentzen
なんでもいろいろできちゃうクリエイターさんのサイトみたいです。
刺激+参考になりますねー。
モーションも3Dもデザインもスクリプトもできる人みたいです。
Google マップ
google mapでサテライト機能にすると、衛星写真のデータになりますね。
で。
横川駅より西方面は解像度が高かったんですが、最近まで横川駅から東は一段階解像度が低かったのですが、最近やっとデータが入ったようです。これで、紙屋町近辺やうちのグランディール三篠もきれいに見れるようになりました。
やっと身近になってきた感じですねー。
We Fell Fine
*遅いPCだと結構負荷がかかるサイトかもしれません。
海外のサイトです。
たぶんJavaでできてます。たぶん…。
集計されたブログの記事のデータをカラフルな点にして漂わせています。
点一つ一つのおもな処理…
The Baby Name Wizard: NameVoyager
赤ちゃんにつけた名前をグラフにしたコンテンツです。
アルファベットをいれると、リアルタイムにグラフ不が変動します。
膨大なデータをきれいに表示できているとお思います。
グラフの最大数が画面いっぱいに出るように、自動でフィットする処理になってたり
細かく作ってあるなーとおもいました。
これJavaでできてます。
| SUN | MON | TUE | WED | THU | FRI | SAT |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 | 31 |