CSSアニメーションの進化もすごいですが、3DのCSSアニメーションも驚きの進化です! 高校を卒業したばかりの18才の少年がつくった3Dアニメーションのライブラリを紹介します。 voxel.css voxel.css -GitHub voxel.cssのデモ voxel.cssの使い方 voxel.cssのデモ 上部のアニメーションgifは、voxel.cssのトップページで楽しめます。 ファイルサイズの関係で尺を半分くらいにしているので、ぜひ全編を下記ページでお楽しみください。
HTML5製アプリParticle Developの開発の裏側〜ElectronとAngular 2で開発効率が劇的に向上―CreateJS勉強会発表資料(後編) 本記事は2016年1月26日(金)に開催されたCreateJS勉強会 (第7回) の発表資料「CreateJSで開発するクロスプラットフォームなアプリ開発〜ElectronとPhoneGapで広がる可能性〜」の後編となります。前編記事「高まるHTML5製アプリの需要」に続けて本記事ではHTML5製デザインツール「Particle Develop」の開発事例を紹介します。 HTML5製デザインツール「Particle Develop」とは 今回、Particle Developという美しいパーティクルを作れるHTML5製のデザインツールを作成しました。雪や炎、キラキラなどのパーティクル表現を作成でき、ベクターグラフィックスとなって
間違えが許されないような状況なのにも関わらず、なかなか困ったユーザインタフェースというのはあるものです。 下の図は、ずっと昔に知り合いの結婚式(人前式)に参加した時に、知人(新郎立会人)が間違えそうになったのを再現したもの。さて、こちらのフォームであなたが新郎側立会人として署名しようと思った時、どこに記入しようとするでしょうか?(人前式では、新郎新婦が署名した後、それぞれの立会人が証人として署名します) 答えは、「新郎側立会人の署名」というラベルの上にある線のさらに上の場所です。私なら、まず間違いなく新郎側立会人の署名というラベルの下に書いてしまいそうです。立会人署名のタイミングでは、新郎や新婦の署名がそれぞれの線の上に書かれているので、間違える可能性は低いかもしれませんが、結婚式で緊張していた状況ということもあり、その知人は署名欄を間違えそうになり、こちらですよとスタッフの人に指示されて
情報やデータを視覚的に表現し、受け手に直感的な気付きを与えるインフォグラフィック。一般的には「図解」のようなものとして認知されているが、ひと工夫を凝らすことで、興味や関心の低い相手を振り向かせる、コミュニケーションの強力な武器になる。 インフォグラフィックでは、図解にピクトグラムを組み合わせるなどの手法で、より感情に訴えかけるビジュアルを制作する。ここで、図解とインフォグラフィックは以下のようなものだ。 最近では、企画書や提案書にもインフォグラフィックが使用されることがある。確かに「相手を魅了する」という特徴は目的に合致するが、デザインの心得のない人間にとってインフォグラフィック制作は少々敷居が高く感じるだろう。 日本におけるインフォグラフィック制作の第一人者は、『NewsPicks』のインフォグラフィックス・エディターで、『たのしいインフォグラフィック入門』(ビー・エヌ・エヌ新社)著者の
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く