ASCII.jp：バラバラの画像がぴったり揃う美しいパララックス｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/12/18 34 users ASCII.jp CSS3 先端サイト 画像

今回の注目サイト： Benoit Challand http://www.benoitchalland.com/ デジタルアーティスト「Benoit Challand」のポートフォリオサイト。 パララックスを利用したサムネイル一覧表示 シンプルなポートフォリオサイトに、ページ遷移やメニュー表示などのスムーズなエフェクトによって新鮮さを加えている「Benoit Challand」。 トップページの作... 続きを読む

ASCII.jp：あのサイトとはひと味違う！こだわりマウスオーバー20連発 (1/2)｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/10/24 55 users ASCII.jp CSS3 先端サイト ＩＣＴ 随所

今回の注目サイト： Omnisense http://omnisense.net/ ICTを駆使したプロダクトを紹介する、フランス企業のWebサイト。 サイトを彩る多彩なアニメーション フラットデザインをベースに、随所に気持ちいいアニメーションを取り入れている「Omnisense」。コンテンツごとに用意されているさまざまなアニメーションは、どれも洗練された動きで、サイトの魅力をぐっと高めている。 ... 続きを読む

ASCII.jp：スクロールアニメーションによる立体コンテンツの見せ方 (1/2)｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/07/22 42 users スクロールアニメーション ASCII.jp CSS3 見せ方

今回の注目サイト： MANUEL RUEDA http://www.manuel-rueda.com/ Manuel Rueda 氏のビデオ作品を紹介するポートフォリオサイト。 スクロールによって立体的に浮かび上がるサムネイル サムネイルに視点をフォーカスさせる仕掛けが目を引く、動画のポートフォリオサイト「MANUEL RUEDA」。ページ中央にあるサムネイルには奥行きが設定されており、スクロール... 続きを読む

ASCII.jp：差がつくメニューアイコン 25個のCSSアニメーション｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/07/07 79 users CSSアニメーション ASCII.jp CSS3 先端サイト

今回の注目サイト： Studio Songes http://www.studio-songes.fr/fr/ フランスの建築事務所のWebサイト。 随所に使用されているアニメーション 美しい建築写真が、存在感のあるタイポグラフィとともに目に飛び込んでくるサイト「Studio Songes（ステュディオ・ソンジュ：スタジオ夢）」。ダイナミックなページ全体の動きに加えて、ページの右上にある小さなメニ... 続きを読む

ASCII.jp：動くインフォグラフィックでサイトを楽しくするアイデア (1/3)｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/06/25 83 users インフォグラフィック ASCII.jp CSS3 先端サイト

今回の注目サイト： Knormal http://www.knormal.com/profile/ デザインとテクノロジーをもとにブランディングやWebサイト制作などを手がける、米国のエージェントのポートフォリオサイト。 気持ちよく回転する円グラフ シンプルなフラットデザインを採用した「Knormal」のポートフォリオサイト。このサイトでは、3枚の画像からなる円グラフを重ね合わせ、CSSアニメーシ... 続きを読む

ASCII.jp：SVG線画が美しいリッチアニメーションの作り方 (1/2)｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/06/09 330 users ASCII.jp CSS3 先端サイト Portfolio

今回の注目サイト： Béatrice Créations http://carlphilippebrenner.com/portfolio/beatricecreations フランスを拠点に活動するデザイナーであるカール・フィリップ・ブレナー氏のポートフォリオサイト。 ページ遷移が楽しい繊細で滑らかな動き CSS3を使った滑らかな動きと大胆なタイポグラフィが魅力的な「Beatrice Creat... 続きを読む

ASCII.jp：マウスオーバーで動くなめらかカルーセルパネル (1/2)｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/05/26 53 users マウスオーバー ASCII.jp CSS3 オランダ 講義

今回の注目サイト： Universiteit van Nederland http://www.universiteitvannederland.nl/ オランダの大学教授の講義を無料配信しているサイト。 軽快でなめらかなカルーセルパネル 毎週アップロードされる充実した動画コンテンツを、カルーセルパネルやボックスレイアウトで賑やかかつコンパクトにまとめている「Universiteit van Ne... 続きを読む

ASCII.jp：CSS Transitionsを使った3Dロールオーバーのアイデア (1/2)｜先端サイトに学ぶCSS3/jQueryアニメーションデザイン

2014/05/12 62 users アイデア ASCII.jp CSS3 先端サイト jQuery

フラットデザインやミニマルデザインといった「Webデザインのシンプル化」が進む中、アクセントとなる「ちょっとした動き」を取り入れるWebサイトが増えています。本連載では、ブログ「Stronghold」のメンバーが、いま注目のWebサイトを毎回1つピックアップ。特徴的なインタラクション表現を紹介するとともに、CSS3やjQueryを使って実装する方法を解説します。（編集部） 今回の注目サイト： DE... 続きを読む