CSS3アニメーションを使ったかっこいいページを簡単につくりたい！そんな人に -CSS3 Animation Cheat Sheet
Appleのプロダクトページのように、スクロールをトリガーにCSS3アニメーションが展開するようなページを簡単に実装できるCSS3 Animation Cheat Sheetを紹介します。 「Cheat Sheet」という名称が紛らわしいですが、各種CSS3アニメーションをセットにしたスタイルシートで、ページに外部スタイルシートを加え、classをちょこちょこつけるだけで、簡単にCSS3アニメーションをページに実装できます。 CSS3 Animation Cheat Sheet CSS3 Animation Cheat Sheetのデモ CSS3 Animation Cheat Sheetの使い方 CSS3 Animation Cheat Sheetのデモ デモは2種類あります。 CSS3のキーフレームアニメーションを使用しているため、モダンブラウザでご覧ください、IEは10で。 まずは、
CSS3アニメーションの基本
CSS3アニメーションの基本：脱エンジニアっぽさ！ クライアントの笑顔を引き出すCSS3アニメーション（1）（1/3 ページ） エンジニアの立場でデザインまで積み上げていくのは、なにかと難しいもの。脱エンジニアっぽさを演出し、クライアントの笑顔を引き出す、CSS3アニメーションを紹介する。 クライアントさんからのさまざまな難しい要求を解決し、ようやく納品にこぎ着けたのに、クライアントさんから出た言葉は「ちょっとやぼったいね……」というつぶやき。Webエンジニアの方からよく耳にする嘆きの声です。エンジニアの立場でデザインまで積み上げていくのは、やはり難しいですよね。 しかし、いわゆる外観としてのデザインの他に、クライアントさんを「おっ！」と思わせる便利な手法が1つあります。それは「アニメーション」です。 Webサイトでの小気味良いアニメーションは、そのユーザー体験を豊かなものにしてくれます。
SPEC vol5 | JavaScript、HTML、CSSクリエイターの採用試験 - jsdo.it - Share JavaScript, HTML5 and CSS
AS3.0で「合成」のアニメーションを作って下さい HTML5, JavaScript, CSS3を使って、カード選択から合成アニメーションまでのUIを考えてください AS3.0で「合成」のアニメーションを作って下さい サンプルはソーシャルアプリで使われる合成演出のAS3.0テンプレートになります。このテンプレートをアレンジして新しい合成演出を作って下さい。素材はどのように使ってもらってもOKです、自分で演出を付け足してもらっても構いません。今までにない斬新な演出をお待ちしています。 【素材をダウンロード(zip)】 HTML5, JavaScript, CSS3を使って、カード選択から合成アニメーションまでのUIを考えてください サンプルは一般的なソーシャルアプリで使われている合成機能のUIです。ベースとなるカードと素材を選択し、合成を行います。これをHTML5, JavaScript,
【第2回】スマホ向けアプリ開発における アニメーション技術の活用 - MdN Design Interactive
「アメーバピグ」には自分のアバター自身が動いてコミュニーケションする「アクション」機能があります。「おじぎ」「うれしい」「かなしい」など、たくさんの種類が用意されており、テキストのみでの会話に比べ、より直感的に気持ちを伝えることができます。今回はこのアクションのスマートフォン対応についてご説明します。 【今回のPoint】 ・Flashは使えないが、それ以外のアニメーション技術が利用できる ・技術の選定には、互換性およびGPU処理への対応状況がポイント ・現時点ではCanvasやCSS3で対応するのがよいだろう Flashが使えないスマホ時代のアニメーション技術 ご存知の方も多いかと思いますが、現時点ではiOSでFlash（swf）コンテンツを動作させることができません。したがって、スマートフォン環境でアニメーションを使いたい場合は別の方法を探す必要があります。 筆頭はHTML5で実装され
『スマートフォンUIのアニメーションについて』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 2012年6月にサービスを開始したスマートフォン向けソーシャルゲーム ULTIMATE RACERアルティメットレーサー）でデベロッパーをしている横田と申します。ULTIMATE RACERの開発時に、画面内のアニメーションをjQueryのanimate処理からcssアニメーションに切り替えた経緯について、自分なりの考察ともにご紹介したいと思います 対象としてはデザイナー、マークアップエンジニアでJSやcssでアニメーションの実装を始めたばかりの方が最適だと思います。 また本稿はjQueryのバージョン1.7.1を使用した場合を想定して記述しています
FlashやHTML5で作成されたカードの合成UI・演出のまとめ
もはやコーディングコンテストサイトと化しているjsdo.itですが、いま開催中の SPEC vol.5 はいつもとちょっと違います。 今回は、いつものHTML5・JavaScript・CSSに加えて、ActionScriptでのエントリーもできます！ 「じつはFlashのほうが得意！」という方にも挑戦していただいているんですが、もうすでに続々と面白い作品が集まりだしているので個人的に気になる作品をいくつかご紹介したいと思います。 今回のお題「カードの合成のUI・演出を作ってください」 Flash編 forked from: SPEC vol.5 投稿用コード - wonderfl build flash online forked from: SPEC vol.5 投稿用コード - wonderfl build flash online JavaScript編 ※スマートフォン専用 締切は
CSS3を使った演出テクニックがすごいと話題に
コロプラさんと一緒に行っているコーディングコンテスト「SPEC vol.4」。 応募締切まであと1週間を残していますが、もうすでに変態的な作品が続々と投稿されているようです。 今回もとんがった作品がたくさん集まっているので、途中経過としてその一部をご紹介したいと思います。（ぼく個人の主観でピックアップして紹介していきます。審査とはまったく関係ないですよ！） スピード感がある演出 CSSだけでモーションタイポグラフィ 立体的な動き トーナメントの演出 くまー！ 3連休は SPEC vol.4 で決まり！ SPEC vol.4の締切は7/18（水）です。 賞品はMacBook Proなどなど超豪華！ この3連休にでもぜひぜひチャレンジしてみてください！ SPEC vol.4
msto.jp - it転職 リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
iPhoneアプリ(WebView)の開発で良く使うアニメーション(javascript&CSS3)基本&tipsを備忘録として。 | Cosh Log
iPhoneアプリ(WebView)の開発で良く使うアニメーション基本&tipsを備忘録として。 ゲーム系アプリのアニメーションです。 基本的にはアニメーションのスムーズさや重さ、描画のキレイさ等の バランスを確認しつつ開発を進めるので、 グローやドロップシャドウをCSSから画像に変更したり その都度、様々な方法で実現したりしています。 ○iPhoneアプリでアニメーションをさせる場合の基礎知識（間違ってたらｺﾞﾒﾝﾅｻｲ） ・HTML5のcanvasやJQueryよりCSS3のアニメーションの方が軽い。 ・出来るだけCSS3でのアニメーションで。 ・iPhone(safari)のCSSアニメーションは高速らしい。 ・DOM操作のアニメーションはガクガクなる。 ・CSSアニメーションはアニメーション途中の座標を取得できないので、当たり判定には向かない。 ・android
スマートフォンにおけるアニメーション実装 <2013年版> - Shut the fuck up and write some code
スマートフォンにおけるアニメーション実装 ～FlashからHTML5へシフトするには～ 昨年、某セミナーにて発表させて頂いたときのスライド、未だに見られているようで有り難いのですが、それからかなり環境が激変して、ここで書かれている内容は、今となってはさっぱり役に立たないので（!!!）、改めてまとめてみたいと思います。 注：ここで言う「アニメーションの実装」とは、スマートフォンのブラウザ上で動作するアニメーションのことです。 環境の変化 昨年も例年になく変化のある年だったのは誰もが思うところですが、数ある変化の中で個人的に重要なトピックを挙げてみます。 1. スマホ＞ガラケー 具体的な数字は出せないのですが、自分が関わっている案件のサービスはユーザーはそれぞれ半分くらいの比率になってます。ソーシャルゲームの会社の方々に聞いた話でも似たような数字でした。 Lineの流行もあって若年層にもスマホ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
株式会社コロプラ【位置ゲーで毎日の移動を楽しく】