2018年に使いたいWebデザイントレンド ！ファーストビューのアイデア集 | コムテブログ

2017/09/10 77 users ファーストビュー コムテブログ アイデア集 縦書き 遊び心

作成：2017/09/11 更新：2017/09/11 Webデザイン 「提案されたものの、このレイアウトよく見るんだよなぁ」とクライアントさんに思われないように個性を出したい。今回は2018年も使える「遊び心を加えた」Webデザイントレンド、ファーストビューデザインのアイデアをまとめました。 近年増えてきたファーストビューのレイアウトは スプリットスクリーン（分割） シネマグラフ 縦書きのGナビ... 続きを読む

ついつい見続けてしまう！シネマグラフを取り入れたWebデザイン24選｜ferret [フェレット]

2015/12/04 201 users Ferret フェレット GIFアニメーション 手法 ご存知

近年じわじわと流行している、シネマグラフ（Cinemagraphs）という手法をご存知でしょうか。 シネマグラフとは、画像の一部にだけ動きを取り入れたGIFアニメーションのことです。 GIFアニメーションを使ったホームページは以前からありましたが、最近では少し変わった形で使われています。 今回は、シネマグラフを活用したオシャレなサイトと画像をまとめてご紹介します。 GIF画像を使用するため、作り方... 続きを読む

【新感覚】写真がちょっとだけ動く、素敵シネマグラフまとめ - PhotoshopVIP

2015/08/11 75 users PhotoshopVIP フォトショップ 一部分 ループ 気分

シネマグラフという言葉を聞いたことはありますか。 写真の一部分のみに無限につづくループを加えることで、不思議な世界観をつくり出す新しいGIFアニメーションのことを指し、当サイトでもフォトショップでの作り方含め、何度か紹介しています。 海外デザインブログCrazyLeaf Designで、いくら見ていても飽きない、落ち着いた気分にさせてくれる、ユニークなシネマグラフを集めたエントリー「25 Capt... 続きを読む

一部だけが動いてるgifって良いよな ぶる速-VIP

2014/12/31 391 users gif 速-VIP VIP お前ら 名無し

一部だけが動いてるgifって良いよな 1: 以下、名無しにかわりましてVIPがお送りします 2014/02/11 02:43:28 ID:GGSaa8BR0 シネマグラフというらしい お前らのお気に入り下さい 5: 以下、名無しにかわりましてVIPがお送りします 2014/02/11 02:46:29 ID:GGSaa8BR0 見てて落ち着く 6: 以下、名無しにかわりましてVIPがお送りします ... 続きを読む

Photoshopを使った今流行りのシネマグラフの作り方まとめ | 株式会社LIG

2014/08/07 128 users Photoshop 白浜 株式会社LIG 遅刻遅刻 デザイナー

こんにちは、デザイナーの白浜です。 今回は当ブログでも何度か登場している、 写真の一部がちょっとだけ動く、シネマグラフを使ったサイトまとめ パンを咥えて「遅刻遅刻」と叫びながら走ると美女と出会えるのか数学的に検証してみた）（最後の画像） シネマグラフ（画像の一部のみをアニメーションさせた画像）を作成する方法をご紹介したいと思います。 動画を準備する シネマグラフの出来は動画の出来にかかっています。... 続きを読む

写真の一部がちょっとだけ動く、シネマグラフを使ったサイトまとめ | 株式会社LIG

2014/07/03 117 users 株式会社LIG マラガ 一部 写真 サイトまとめ

こんにちは、マラガの海の贈り物ことディレクターのSEKOです。 梅雨は嫌ですね。急に大雨が降ったり、雷が発生したりと自然の恐ろしさを日々感じております。 ところで皆さん、シネマグラフという言葉を聞いたことはございますか？ Web系であればご存知の方も多いと思いますが、念のため簡単に説明させていただきますと「画像の一部分のみがアニメーションで動いている画像」です。 そうは言ってもイメージしづらいと思... 続きを読む

ウェブ制作者がチェックしておきたいアイデア満載のUIを備えたウェブデザインのまとめ -2014年上半期 | コリス

2014/06/13 336 users サムネイル ペルソナ 細部 ナビゲーション レイアウト

うまくトレンドを取り入れ、デザインの細部まで徹底的にこだわり、気持ちのいいインタラクションとアイデア満載のUIを備えた素晴らしいウェブサイトを紹介します。 画像の一部だけ動くシネマグラフを使ったコンテンツ、ペルソナを使ったユーザー中心のレイアウトなど、最新のトレンド情報もお見逃しなく！ VOTD.tv シンプルですっきりしたデザインだけでも素敵ですが、ロゴ、ナビゲーションやサムネイルやコンテンツな... 続きを読む

Photoshopの最近の気になるテクニックを身につけるチュートリアルのまとめ | コリス

2014/05/30 438 users コリス ジオメトリック Photoshop チュートリアル

ポリゴン、シェイプアート、ブラー、等高線、ジオメトリック、ラインアート、シネマグラフなど、最近の気になるデザインのテクニックを身につけるPhotoshopのチュートリアルを紹介します。 時間をつくって、一つずつじっくりと攻めていきたいですね。 Create a low-poly portrait 先日の記事「日本のウェブサイトのまとめ」でも紹介した「Midori Aoyama」のトップ画像でも使わ... 続きを読む

破壊的イノベーション。無限に注げるコップの開発に成功。【シネマグラフの作り方(PhotoshopCS5)】

2014/05/23 71 users イノベーション コップ PhotoshopCS5 KOP 成功

撮影・執筆：Daily GIF89a編集部(大野謙介) 画期的なハードウェアの開発に成功した。アートでクリエイティブなアプリケーションやハードウェアの開発を通して、世界に”おもしろい”を発信することがミッションである弊社が、「無限に注げるコップ – インフィニティコップ – 」を完成させた。コップをご存じ無い方のために解説をしよう。 コップとは コップ（オランダ語: kop）ガラス、プラスチック、... 続きを読む

超簡単にシネマグラフ（一部分だけが動いているgif画像）を作成できるアプリ「Cinemagram」が凄い！ | OZPAの表4

2014/03/23 53 users OZPA Cinemagram 一部分 静止画 ご存知

少し前から流行り出している、シネマグラフ（cinemagraph）と言うものをご存知でしょうか？静止画の中で一部分だけが動いていると言うgif画像なのですが、それが超簡単に作れてしまうアプリ「Cinemagram」が結構凄かったのでご紹介です。 Cinemagram – create and share moving photos 4.1 価格: 無料 (記事公開時) カテゴリ: 写真／ビデオGo... 続きを読む

フォトショ不要！話題のシネマグラフ（1部分だけ動くgif）を簡単につくれる無料アプリまとめ | BITA Blog - 株式会社ビットエー

2014/03/17 72 users Photoshop GIFアニメーション ぎさわ カメラマン

プロのカメラマンになるんだ！とかならないんだとか。まずは、カメラ買わなきゃ。どうも、BITA編集部のやな☆ぎさわです。 今回は、ちょっと前から流行っているシネマグラフ（1部分だけ動くgif）を簡単に作れる無料アプリをご紹介します。 一般的にはまだあんまり知られていない上に、Photoshopのようなツールがないと作れないと思われている特殊なGIFアニメーション。 実は意外とカンタンに作れちゃいます... 続きを読む

19,800円が1,500円！シネマグラフ作成アプリ「Cinemagraph Pro」が92.5%オフで販売中 | 男子ハック

2014/03/10 70 users 男子ハック シネマグラフ作成アプリ 一部分 JUNP_N 画像

@JUNP_Nです。写真なのに一部分だけが動くという画像「シネマグラフ」を作成することができるMacアプリ「Cinemagraph Pro」が通常19800円のところ1500円の激安になっています。 3月13日までの期間限定セール！こんなチャンスもうないかも！ 写真なのに一部分だけが動いている（アニメーション）になっている画像と言われてもわかりにくいかもしれませんが、「Cinemagraph Pr... 続きを読む

一部だけが動いてるgifって良いよな ぶる速-VIP

2014/02/11 1112 users gif 速-VIP VIP お前ら 名無し

一部だけが動いてるgifって良いよな 1: 以下、名無しにかわりましてVIPがお送りします 2014/02/11 02:43:28 ID:GGSaa8BR0 シネマグラフというらしい お前らのお気に入り下さい 5: 以下、名無しにかわりましてVIPがお送りします 2014/02/11 02:46:29 ID:GGSaa8BR0 見てて落ち着く 6: 以下、名無しにかわりましてVIPがお送りします ... 続きを読む

写真なのに動く！友達にウケる超簡単な写真の撮り方【シネマグラフ】| 写真上達・情報サイト　Photo力-フォトリョク-

2013/11/12 153 users 通行人 アンドロイド 東京丸の内 写真上達 雑誌

こちらの画像をじっと見てみてください・・・そう、動くんです！ 東京丸の内でがんばって撮ってきました。 通行人に雑誌の撮影と勘違いされちゃったぜ、うふふ。 動かない方は画像をクリックしてみると動くかも・・・。（アンドロイドなど一部ではサポートしてない可能性があります） これはシネマグラフといいます。 よく、写真以上、動画未満、なんて言われているオシャレなアニメーションgif画像です。 ちょっとせわし... 続きを読む

写真が動き出す?!お洒落なシネマグラフGIFアニメーションまとめPhotoshopVIP |

2013/10/07 125 users 一部分 視線 エントリー テクニック ご存知

シネマグラフをご存知でしょうでしょうか。まるで写真のように見えて、一部分だけを動かすことで、視線を一点に注目させる、ユニークなテクニックです。写真が動き出したような、不思議なアニメーション効果を作成することができます。 海外デザインブログCGFrog.comで、見ていると不思議な気分になってくる、シネマグラフGIFアニメーションをまとめたエントリー「Amazing Animated Gif’s f... 続きを読む

ミニチュア風の相撲写真に、シネマグラフを悪魔合体してみた | fladdict

2013/09/29 62 users fladdict 悪魔合体 ミニチュア風

新作TiltShiftGen2のサンプル写真を撮ろうと、両国国技館に行ったついでに作ってみたら、なんか新境地！自分の知る限り、TiltShift x Cinemagraphの組み合わせをやってる人はいないはず。 場所がら三脚は使えなかったんですが、わりとなんとかなるもんですね。 一眼レフでガチでミニチュア写真を撮ろうとすると、Canon EOS 5DMK3にTS-E90mmレンズで45万ぐらいかか... 続きを読む

Photoshopを使った独特なテイストのアニメーション「シネマグラフ」を作ってみよう : ライフハッカー［日本版］

2013/05/24 90 users Photoshop アニメーション テイスト ライフハッカー

DIY , オフにやること , ソフトウェア , 写真 , 動画 , 最新テック , 趣味 Photoshopを使った独特なテイストのアニメーション「シネマグラフ」を作ってみよう 2013.05.24 22:30 シネマグラフを知っていますか？　写真の一部だけを動かして、そこに注目を集める手法です。不思議で効果的なアニメーションが作れますよ。 シネマグラフはJamie Beck氏とKevin Bu... 続きを読む

写真が動きだす！？Photoshopで簡単にできるシネマグラフの作成方法 | 世界ろぐ

2011/10/05 522 users Photoshop 一部分 うち Mac Windows

シネマグラフというのはGIF画像で作られた 「一部分だけが動く写真」の名称となっています。 まずは説明するよりも実際に見て頂きましょう。 このように画像の一部分だけが動くという 不思議な写真を創り出すことができるのですが このシネマグラフ、意外と簡単に作ることが可能で WindowsでもMacでも今すぐに作成することが可能です。 ちなみに以下はウチの猫で作ってみたシネマグラフです。 今回はシネマグ... 続きを読む