ついつい見続けてしまう！シネマグラフを取り入れたWebデザイン24選
シネマグラフ（Cinemagraphs）という手法をご存知でしょうか。シネマグラフとは、画像の一部にだけ動きを取り入れたGIFアニメーションのことです。GIFアニメーションを使ったホームページは以前からありましたが、最近では少し変わった形で使われています。 今回は、シネマグラフを活用したオシャレなサイトと画像をまとめてご紹介します。 GIF画像を使用するため、作り方や技術自体の難易度は高くありませんし、やる気次第では、ソフトを使って自分で作ることも可能ですので、ぜひチェックしましょう。 動くシネマグラフを使ったサイト、画像まとめ 株式会社 電通クリエーティブＸ http://www.dentsu-crx.co.jp/ 株式会社電通クリエーティブＸのホームページでは、社員や文具が永遠と回るシネマグラフをデザインに取り入れています。 トップページをはじめ、企業紹介から社員紹介、リクルートページ
The COCA-COLA + RIEDEL GLASS
ワイングラスの開発プロセスを活かした コカ･コーラ専用グラス 「コカ･コーラを味わうための究極のグラスを作ってほしい」ザ コカ･コーラ カンパニーから依頼を受けて始まったこのプロジェクトは、リーデルが ワイングラスで培ってきた開発プロセスに沿って、進められました。コカ･コーラ本社のメンバーテイスティングを重ねて決定されたこのグラスは、コカ･コーラの味わい方をどのように変化させるのか。ご自身の五感で感じてください。 Iconic taste + Exquisite glassIt's the real thing! AROMA 爽やかなフルーツの香り このボウル形状は、「コカ･コーラ」の複雑なアロマの中から爽やかなフルーツのような香りを強調します。 TASTE&TEXTURE 細かく滑らかな泡 甘さと酸味のバランスを絶妙に整え、さらにシャンパーニュのように細かく滑らかな泡を感じさせてくれます
ランディングページで効果的な動きを演出する jQueryエフェクト７つ＋１｜MarTechLab（マーテックラボ）
ランディングページに「ちょっとした動き」をつけたほうがいいんじゃないか・・・そう思ったことはありませんか。 まずは下記の事例をご覧ください。 これは弊社ランディングページ「最強LPO」で、「成功事例紹介」に動きをつけた箇所をヒートマップ解析ツール「クリックテール」で観測したものです。ご覧のとおり、動きがある箇所はそうでない箇所よりも明らかに注目度が高くなっていることがお分かりになるかと思います。 このように、JavaScriptで動きをつけることで伝えたい情報の注目度を高めて確実に伝える、あるいは雑多な情報を整理してスッキリと表現することができるため、構成作成の段階で一度は検討したいところです。 今回は、弊社のランディングページで採用している「ちょっとした動き」のうち、他のランディングページでも頻繁に使用されているものを７つ取り上げ、それを制御している jQueryとそのカスタマイズ方法を
ランディングページ（LP）はストーリー性のあるフレームワークを使って作ろう
本記事で学ぶ内容 ・LPにおけるストーリーの重要性を理解できる。 ・AIDAの法則とは何か、理解できる。 ・QUEST FORMULA とは何か、理解できる。 LPで重要なことは、ユーザーを引き込み成果を達成できる魅力です。ユーザーをぐいぐいと引き込む文章力＝ストーリー構成といってもよいでしょう。 本記事では、その重要性と定番のストーリー構成法をご紹介します。 LPではストーリーが重要 広告などからランディングページ（LP）に導かれたとき、ユーザーはどのような心理状態でしょうか。 「育毛剤が欲しいな・・・（広告を見て）あ、これいいかも！（ポチッ）」 たとえば、検索結果に表示される広告であれば、このようにぼんやりとしながらも目的をもって探しているユーザーは多いはずです。しかし、そこではまだ曖昧な状態です。 つまり、クリックされたとしても選択肢にあがっただけといえます。その商品の優位性や機能を
ランディングページとは〜LPOで成果の上がるページを作る方法〜｜ferret [フェレット]
この記事は2016年4月8日に更新しています このページを見ているあなたは何らかのWebマーケティングに関わる担当者でしょうか。 そうであれば、売上や問い合わせ数を上げなければいけない立場でしょうか。 実は日本の企業体のほとんどが中小企業ですが、はっきり言って中小企業の方が最初にやるべきWebでの集客施策はランディングページと言っても過言ではありません。 なぜランディングページを最初にやるべきなのでしょうか。 今回は、ランディングページを最初にやるべき理由と、そのランディングページの作り方など、ランディングページで売上や問い合わせ数を上げるために必要なことをまとめて解説します。 この記事が読み終わる頃には、ランディングページで成果を上げるための第一歩を踏み出しているはずです。それではいってみましょう。 目次 ランディングページとは ランディングページ最適化（LPO）が重要な理由 購入率を改
![ランディングページとは〜LPOで成果の上がるページを作る方法〜｜ferret [フェレット]](https://cdn-ak-scissors.b.st-hatena.com/image/square/aba10ed664a8032f16a839c451625bf1823a7800/height=288;version=1;width=512/https%3A%2F%2Fferret.akamaized.net%2Fuploads%2Farticle%2F2499%2Fog_image%2Fdefault-391b6bed0a5d20aaa50f6888dfb07ceb.jpg)
Apple Pencil
Apple Pencilは、絵を描いたり、メモを取ったり、書類に注釈を加える時の 使い心地に 基準を打ち立てました。それは直感的で、精密で、魔法のようです。ピクセルレベルの精度と低いレイテンシー。傾きを感知するセンサー。 パームリジェクションテクノロジー。 何をする時も驚くほど使いやすく、 アイデアが浮かんだ瞬間を逃しません。 すべてのApple Pencilの機能を見る Apple Pencilは、絵を描いたり、メモを取ったり、書類に注釈を加える時の使い心地に基準を打ち立てました。それは直感的で、精密で、魔法のようです。ピクセルレベルの精度と低いレイテンシー。傾きを感知するセンサー。パームリジェクションテクノロジー。何をする時も驚くほど使いやすく、アイデアが浮かんだ瞬間を逃しません。 すべてのApple Pencilの機能を見る Apple Pencil Pro 購入 魔法のようなことを
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
LINE
Log in | Tumblr