about project かつてWebに“動き”と“驚き”をもたらした「Flash」。その自由な表現力は、多くのクリエイターを魅了し、日本でも中村勇吾氏の「MONO*crafts（1999年）」に代表される革新的なサイトが次々と誕生しました。しかし一方で、動作の重さ、セキュリティリスク、スマートフォン時代への対応が難しいといった弱点も抱え、2020年に公式サポートは終了。これらの作品はすでに「ロストテクノロジー」となっています。 このアーカイブは、そんなFlash時代に生まれた日本のWebデザインの“片鱗”を後世に残す試みです。2007年から運営していたWebデザインギャラリーで紹介したサイトを中心に、当時のスクリーンショットとInternet Archiveのリンクを掲載しています。アーカイブにデータが残っている作品群は、当時のままのサイトを実際にご覧いただけます。 なお、2007年以
0----1----2--- みたいな形式のテキストでタイムラインアニメーションを作れるライブラリを作りました。 しゅうまいさんと「Webでタイムラインアニメーションを作るのがだるい」的な話をしていて、 AAみたいな発想で楽をできないかなと思ったのが発端になっています。 まずは下記のデモを見てください。 See the Pen TimelineDown Example by hashrock (@hashrock) on CodePen. 下記の文字列を渡すことで、４つの絵文字がそれぞれ個別のアニメーションをします。 const p1 = "--------0----1--2-------"; const p2 = "---------0----1--2------"; const p3 = "----------0----1--2-----"; const p4 = "---------
人づてに聞いたところ…進撃の巨人のムック本に、「作者の諌山氏が、ポーズマニアックスというサイトで絵の勉強をした」という記述があるらしい（進撃の巨人OUTSIDEより）。 ふーん、ポーズマニアックスねぇ… ポーズ… え、あれ、ポーズ… ポ…ポポポポーン！？ え、それって、僕が昔に作った個人サイトじゃね？ ポーズマニアックス！ 実は12〜3年ほど前、僕がノリで絵の勉強サイト、ポーズマニアックスというのを作って運営していた。3Dのポーズモデル数百体掲載され、WEB上でグリグリ回転できる、当時としては画期的なお絵かき練習サイトだ。社会人1年目につくった趣味の裏サイト。「30秒ドローイング」というお絵かき練習Flashもあった。時はまさにウェッブ2.0ブーム、一人でサービスをまるごと作ってみたいお年頃だったのである。 当時は日本で、pixivの次にトラフィックがあったお絵かきサイトだと思う（たぶん）
さて…Animateの基本的なアニメーションの機能は教えたよ。 ふにゃっ！ でも、Animateを使いこなすためにはシンボルについて 詳しく理解する必要があるんだ。 ごくり…！ シンボルとインスタンスの違いはわかるかい？ えっと… シンボルはライブラリに入ってるもので、 インスタンスはライブラリからステージに配置されたものふにゃっ！ フフフフ…正解だよ。 シンボル ライブラリに入ってるイラストやアニメを管理するもの インスタンス ライブラリからステージ上に配置されたもの。シンボルの分身。 常にマスターシンボルの内容を反映する。 元となったシンボルの中身を変えれば配置したインスタンスもそれと同じものになるよ。 それを利用してステージにたくさん配置したお花の色をカンタンに変えてみよう。 ------------------------------------------------------
ソフトバンクの「SUPER! FRIDAY」キャンペーンがきっかけで（関連記事）、21世紀初頭にネットで流行した「吉野家コピペ」が一時期Twitterでトレンド入りするなど話題になっています。そんな中、コピペと同時期に流行した関連FLASH動画作品を、作者のポエ山（@poeyama）さんがTwitterへ再投稿するまでに至りました。カオスな流れを小1時間問い詰めたい。 軽妙なあおり文句が合成音声で矢継ぎ早に放たれる（画像提供：ポエ山さん） そもそも「吉野家コピペ」の源流は、ある個人サイトで2001年に発表されたテキスト。当時の大幅な値引きキャンペーンがもとで混雑していた吉野家の様子を、皮肉を込めた軽妙な文章で表現していました。 昨日、近所の吉野家行ったんです。吉野家。 そしたらなんか人がめちゃくちゃいっぱいで座れないんです。 で、よく見たらなんか垂れ幕下がってて、150円引き、とか書いてあ
SVGアニメーションを用いると、さまざまなサイズのディスプレイで印象的なマイクロインタラクションを実現できます。マイクロインタラクションの導入によってUI改善に役立てているケースもあるでしょう（参考記事『SVGで始めるマイクロインタラクション入門』）。SVGでアニメーションを実装するには、CSSを使う方法、JavaScriptを使う方法、動画作成ソフトを使う方法等、さまざまなアプローチがあります。 今回は、HTMLコーダー、フロントエンドエンジニア、デザイナーの分野別のSVGアニメーションのアプローチ方法を挙げ、具体的な実装方法について紹介します。 【コーダー向け】CSSでSVGアニメーションを実現する方法 HTMLコーダーにオススメするSVGアニメーション実現方法の1つは、CSSプロパティを使う方法です。 SVGはCSSプロパティによってグラフィックの形状を変更できます。たとえば、次のコ
日本時間の今月１８日に閉幕した、世界で最も歴史のあるフランスのアニメーション映画祭「アヌシー国際アニメーション映画祭」。この映画祭で２２年ぶりに、日本人監督の作品が最高賞を受賞しました。 湯浅政明監督の「夜明け告げるルーのうた」 です。人魚の女の子と出会った少年の心の動きを丁寧に描いたこの作品。実は 「残業なし・土日休業」 で作られ、内容だけでなく、長時間労働が当たり前のアニメの制作環境に一石を投じています。作品の高い質を保ったまま「働き方改革」を実現させた、アニメの新たな作り方とは？（科学文化部・岩田宗太郎記者） 湯浅政明監督の「夜明け告げるルーのうた」は、両親の離婚を理由に、寂れた漁港の町に引っ越してきた中学生の男の子「カイ」が、人魚の女の子「ルー」と出会い、それまで他人に閉ざしていた心を徐々に開いていくというストーリーです。 世界で最も歴史のあるアニメ映画祭として知られる、フランスの
このサイトでは、震災前（2011年１月）と震災後（2013年１月）の被災三県（福島、宮城、岩手）を中心とした全国の企業間取引データを視覚化し、「震災後に失われた取引」を業種別、都道府県別に見る事で、それぞれの業種や都道府県がどのように被災地と関わってきたのかを知る事ができます。
F-siteに関わるすべてのみなさんに、大切なお知らせです。 活動停止について 本日、2016年2月13日をもちまして、F-siteは2002年から続けてきた非営利団体としての主要な活動を停止することになりました。 具体的には、活動の2本柱であった、F-siteセミナーの継続開催と、Webサイト（f-site.org）の更新が終了となります。また、FacebookページとTwitterアカウントについても、Webサイトと同様に更新を終了します。 発足から長年に渡り、のべ約5,000人のご参加をいただいたF-siteセミナーは、数多くのスピーカーとボランティアスタッフのご協力なくしては、続けてくることができませんでした。この場を借りて、厚くお礼申し上げます。 活動停止の理由 活動停止にいたった理由は数多くあります。中でも大きい理由の1つとして、実際に活動を運営、サポートするためのスタッフが減
エフェクト作成ツール「Effekseer」(エフェクシアー)を使ったエフェクト作成の入門講座第3弾です。普段エフェクト作成やゲーム開発をしない方も、本記事をきっかけにエフェクト作成に興味をもってもらえたら嬉しいです。前回のエフェクトと同様に、作成したエフェクトはUnityに読み込んで使用したり、連番画像ファイルに出力することでWebGLやFlash等にも利用できます。「Effekseer」の使い方は第1弾の記事「エフェクト作成入門講座 Effekseer編 UVスクロールを使ったマグマエフェクトの作成」で解説していますので、あわせてご覧ください。 今回のお題：Fカーブを使った吹雪エフェクト やってみよう：吹雪エフェクトの作成 エフェクトの構成図です。今回は大きく5つのパーツから成り立っています。サンプルファイルをダウンロードして、記事と照らし合わせながら進めることができます。各エフェクトの
スマホのアプリ開発を検討する際に、ネイティブ言語と中間プラットフォームのどちらを選択するべきか迷う方は多いのではないでしょうか？ ネイティブ言語であるObjective-C/SwiftやJavaを選択するほうがパフォーマンスが高いと言われていますが、それで開発すると固有のOSだけにしかデプロイできません。中間プラットフォームであるAdobe AIRやUnityを使うとiOSとAndroidの両方にアプリをデプロイできますが、見返りにネイティブと比べてパフォーマンスが低下すると言われています。 本記事ではスマホアプリ開発の技術選定の参考になることを目指し、異なる4種類の技術を使ってiOSでの描画パフォーマンスを検証しました。 今回使用したテクノロジー・フレームワーク Swift 1.2 (Sprite Kit 1.6) Unity 5.0 PhoneGap 4.2.0 (WebGL と pi
Flash Player 11のStage3Dに対応した3Dライブラリ「Away3D ver 4.1」を使ってレンズフレアーとパーティクル表現を作ってみました。次のリンクでデモとソースコードを公開していますので、ぜひお試し下さいませ。 Demo (要Flash Player 11.8) Source (Flash Pro CC または Flash Builder で利用できます) マウスで画面をドラッグ・アンド・ドロップするとアングルを動かすことができます。 パーティクル表現の試作の変遷 – 2010年頃 このパーティクル表現ですが、2010年ごろからずっと試作を続けてます。Flash が GPU に対応する前の時代(Flash Player 9)の頃から、Papervision3Dを使って表現を試してきました。この頃はFlash Playerのパフォーマンスの限界から、パーティクルの数も
ここ1年くらい、僕はソースコードなどを github で公開しています。 つい先日まで書いていた連載記事 GAE for Flasher のサンプルソースコードや、 東京てら子で発表したデモ、今まで作ったライブラリや便利クラスなど なんでもかんでも github で公開しています。 しかし、プログラムに慣れた人ならともかく、これから AS3 をガシガシ勉強していこう！ といった方や、AS3 自体はガシガシかけても基本的に SVN 等バージョン管理システムを 使わない方にとっては github 自体がやはり少し敷居が高いイメージがあるという話を聞きました。 GAE for Flasher の記事自体、ある程度 AS3 に関する知識のある人を想定していたとはいえ 流石に当たり前のように使い過ぎたかなと反省の意を込めて github 超入門( for Flasher ) を書く
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く