見出し画像

webデザイン所感 2020/07/27

アニメ映画でまとめてみた

子供向けらしくアニメーションを使用してる
出現する向きをキャラクターに合わせるのは大事
フォントが比較的太めで見やすい
とりあえず予告を見せようとする

ここでも予告を見せようとする
レイアウト用紙をイメージさせつつグリッドにもなってる背景
星がやたら動くアニメーションが本編との関連性を感じさせる
わりと上段にTwitter埋め込みがあるのが気になる

同じく予告から始まる
トップに感想をテロップのように流れさせてるのも特徴的
タブで最新情報の項目を切り替えできるのはとてもユーザーフレンドリー
このサイトに限らないがメインヴィジュアルを拡大して背景にするのは簡単で映える
デジタルっぽく?ドットの意匠が印象的

予告を見せようとするが勝手に再生はされない
fvのイラストの質が非常に高い上に、効果的に使ってる
背景の壁紙の泡の配置もまるで潜ってるような効果を出させる良い位置にある(携帯版)
シンプルだけど活用出来そうな手法
枠内でスクロールは単純だが凝った印象を与えて良き
ただ気持ち狭く感じてしまうのは改善すべきだと思う

セクションタイトルのカラーにもなってるfvの空の色がとても爽やかな印象
丸みを帯びたフォントも可愛らしく、色も合わさって癒される内容であることを期待させる
文字情報の部分が透過されているのも同じく

予告を見せようとする
セクションのサムネの手書きフォントが時代を感じさせる
キャラクター・キャストの欄がスライドで、
サムネでキャラクターが表示されているのが非常に良いと思った

予告を見せない
青バックのキャッチコピーからタイトル表示は作品を彷彿とさせてとても良い
スクロールする必要がないのは好印象に感じる
他のと比べて圧倒的に売れてるからか宣伝の主張が控えめに感じる

半分に切れる大きく美麗なイラストでスクロールしたくなる
左側に宣伝用コンテンツがまとめて作品の雰囲気を壊さないようにしている?
個別ページも縁取りなどアニメにあった装丁をされていて閲覧者を期待させる

予告編を勝手に流すが、他のと違い透過させて背景として流している
背景の紙の質感も相まって非常にかっこいい
メインヴィジュアルを拡大して色を落として背景にする手法が、
紙の背景のせいで水墨画のようにも見える
最低限欲しい情報がページ遷移せず見れるのも良き

初回ロード重すぎるがアニメーションなどを多用して雰囲気を十分に伝えている
(特にintroduction)
スライドのフォーカスだけ拡大して他を暗くする演出はかっこいいが、
登場人物が多いので一覧で全て見れるようにして欲しかった

比較
当然だが予告を見せたがるサイトがとにかく多い
その中でも流しつつデザインにしてるニンジャバットマンのサイトはより好印象に感じた
映画のサイトを公開してる方からすれば、サイトを見て閲覧者やグッズを買う人1人でも増えるのが狙いだと思うが、
個人的に映画の公式サイトを見にいく場合、キャストやあらすじを確認したい場合だと思う
ユーザーのことを考えるなら簡潔にその項目にたどり着けるようにした方が親切かなと思った
簡素だったりテンプレのようなサイトが多いが、その中でも簡単な実装で大きい効果を出す演出もあるなと感じた
fvカッコ良すぎたのでニンジャバットマンをサムネにさせていただきました

この記事が気に入ったらサポートをしてみませんか?