TOP  >  video

Tag : video

2011年10月10日

HTML5とJSで動画に画像をWEB上で合成する「HTML5 Glasses!」

HTML5とJSの組合せでWEB上でできるとこは格段に広がり、様々な実験的なコンテンツが世界では展開されていますが、今日紹介するのはアイデア次第で面白いプロモーションに使えそうなHTML5とJSで動画に画像をWEB上で合成する「JavaScript Face Detection + Canvas + Video = HTML5 Glasses!」です。

こちらはHTML5で再生されているビデオにCanvasを利用して、ビデオに追従するエレメントを表示させるというものです。
実際どんなものか動画が公開されていましたので、下記からご覧ください。

動画は以下から

ユーザーが撮影した動画に対してなにかを合成したり、動画コンテンツに合成する絵を分けてコンテンツを変化させたり、様々な事ができそうな技術だと思います。

Library」にソースコードや実装方法などが公開されています。気になる方は是非チャレンジを。

続きを読む
posted 09:00  |  
Category: WebDesign   
このエントリーをはてなブックマークに追加
2011年02月11日

HTML5で作られたビデオプレイヤー集「10 Best HTML5 Video Player」

次世代の言語として期待されているHTML5、すでにスマートフォン関係の標準ブラウザで対応し始めていることもあり、利用したことが有るという方もWEB制作者であれば多いのではないでしょうか?今日紹介するのはそんなHTML5で作られたビデオプレイヤーをまとめたエントリー「10 Best HTML5 Video Player」です。


FryPlayer – HTML5 Video Player

全部で10種類のHTML5で作られたビデオプレイヤーがまとめられていましたが、今日はその中から幾つか気になったものを紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 11:44  |  
Category: WebDesign   
このエントリーをはてなブックマークに追加

過去の記事からランダムで表示

2011年09月29日

ポートフォリオ制作のアイデアソースとなる「20 Awing Portfolio Websites」

デザインや開発を行っている方にとって、作品をまとめたポートフォリオは、自分の技術やデザイン力を知ってもらう重要な手段です。そこで今回は、ポートフォリオ制作に役立つデザインやアイデアに優れたポートフォリオサイトを集めた「20 Awing Portfolio Websites」を紹介したいと思います。


Sam Dallyn – Art Direction/Design

さまざまなクリエイターが見せ方にこだわって制作したサイトが、豊富に紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2009年03月16日

ハイクオリティーなフリーアイコンセット「43 Creative Examples Of High Quality Free Icon Sets」

様々なものやサービスを分かりやすく表現してくれるアイコン。制作をしていると作ったり使ったりする機会も多いかと思います。今日紹介するのは非常にクオリティの高いアイコンセットをまとめたエントリー「43 Creative Examples Of High Quality Free Icon Sets」を紹介したいと思います。

free43icons01
Massive Media Icons

全部で43個のアイコンが紹介されていますが、今日はその中から特に気になったアイコンセットをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 11:04  |  
Category: WebDesign   
2014年06月18日

wordpressを取り入れたいwebサイト制作に活用できる「20 Free WordPress Themes」

wordpressには、フリーで利用できるテーマがインターネット上で多数配布されており、デザインやコンテンツ内容に応じて使用したことがある方も多いのではないでしょうか?そんなwordpressテーマを20種集めた「20 Free WordPress Themes」を今回は紹介したいと思います。

wordpress140618_1
Future – Free WordPress Theme | DesignOrbital

ベーシックなタイプから、ワイド感のあるタイプまで、さまざまなレイアウトのテーマがまとめられています。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: WordPress   
2014年05月29日

デザイナー必見 webやスマートフォンに対応したクリエイティブなUIキットまとめ「35+ Free UI Kits for Web Designers」

インターネット上でフリーで配布されているUIキットは、制作時間の短縮はもちろん、手軽にクオリティを高めることができる便利な素材。今回はそんなUIキットをまとめた「35+ Free UI Kits for Web Designers」を紹介したいと思います。

ui140529_1
Dribbble – Iphone Gold Ui Kit +Free PSD by Tintins

webやスマートフォンなどに対応したUIキットがたくさん紹介されています。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: Design   
2008年11月10日

シンプルで実用的なアイコンセット集「The Most Usable Web Icons Available」

アイコンのデザインというのはとても難しい物で、シンプルでそしてわかりやすく、複数あるならすべてテイストを揃えなければ行けません。もしアイコンを自作するのになれていないのであれば、フリーで使えるアイコンセットを見つけるのが得策かも知れません。今日紹介するのはシンプルで実用的、尚かつフリーで使えるアイコンセットを集めたエントリー「The Most Usable Web Icons Available…and FREE」です。

様々なアイコンセットが紹介されていて、最後の方にはゲーム関係のアイコンセットもオマケとしてつけられていました。

詳しくは以下

(続きを読む…)

続きを読む
posted 04:55  |  
Category: WebDesign   
tag: webdesign
2012年07月16日

最近リリースされた、jQueryプラグイン10選「10 jQuery Plugins that Will Make your Life Easier」

世界中で利用されている便利なjavascriptライブラリjQuery。多くのWEBデザイナー、デベロッパーの手によって日夜新しいプラグインが生み出されていますが、今日紹介するのは最近リリースされた、jQueryプラグイン10選「10 jQuery Plugins that Will Make your Life Easier」です。


blur.js

背景との間にぼかし効果をあたえるものや定番のシンプルでミニマムなツールチップ、写真の上に自分で書き込むペイント機能まで、様々なjQueryプラグインがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:00  |  
Category: WebDesign   
2017年08月07日

食べ物を中心にまとめられた可愛らしいデザインアイコンまとめ「100 Free Food and Party Icons」

UI面の向上に一役買ってくれるアイコン。視覚的サポートとして非常に役立つ存在であり、特に食べ物だったりアクションを表現する際には効果的で直感的な理解につながります。今回ご紹介する「100 Free Food and Party Icons」は食べ物やパーティーシーンなどを表現したアイコンがを中心にまとめられたアイコンセットです。

100FreeFoodandPartyIcons_top

カラフルでポップなアイコンが全部で100個種類まとめられています。収録されているアイコンは下記よりご覧下さい。

詳しくは以下

(続きを読む…)

続きを読む
posted 08:30  |  
Category: Design , WebDesign   
2011年11月30日

デザイン性の高いイベント告知サイトまとめ「32 Nice Event Websites」

企業やショップなどを紹介する常設のサイトと、スペシャルコンテンツ・イベントなど短期間のみ利用するサイトと、webサイトにはまったく主旨の異なる2タイプのジャンルが存在しています。そんな中から今回紹介するのは、イベント告知用に設置された趣向性の強いデザインをまとめた「32 Nice Event Websites」です。


Full Frontal 2011- JavaScript Conference

イベント内容を単刀直入に伝えるデザインから、イベントの雰囲気をイメージ的に伝えるデザインまで、さまざまなテイストのwebサイトが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2011年07月11日

エラーページもグラフィカルに表現「30 Interesting 404 Pages」

webページが表示されない時に変わりに画面に登場する「404 error」。文字だけの味気ないタイプのものが一般的ですが、今回は「404 error」をグラフィカルに表現したwebデザインページ集「30 Interesting 404 Pages」を紹介したいと思います。


Error |  Brandstack

一目見たら忘れられない、個性的なデザインの「404 error」ページが多数紹介されています。気になったデザインをいくつかピックアップしてみましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2015年11月20日

ワークスペースのイメージアイテムが集合したベクターキット「FREE Elegant Vector Kit with 60 Workspace Elements」

仕事デスクの上ではいろいろなアイテムを使用していると思いますが、今回はそんなワークスペースのイメージアイテムが集合したベクターキット「FREE Elegant Vector Kit with 60 Workspace Elements」を紹介したいと思います。

elements1

非常に洗練されていながら、どこか柔らかさを感じることができるイラストベクターのセットがダウンロードできるようになっています。

詳しくは以下

(続きを読む…)

続きを読む
posted 02:43  |  
Category: Design   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。
VR・ウェアラブル・センシングなど様々な技術が一般化され、手に届く範囲で製品化が進んでいます。VR MEDIAは拡張する現実から未来を探るBLOGです。
Template deisgn by iDEACLOUD inc.
トップに戻る