Works

制作実績

アニメーションキャラクターを使ったサイト

使用スキル

  • HTML5
  • CSS3
  • jQuery
  • php
  • Sass
  • WordPress
  • Photoshop
  • Illustrator
  • Atom

担当業務

  • ディレクション
  • コーディング
  • フロントエンド
  • バックエンド
  • デザイン
  • イラスト

キャラクターを使ったCSSアニメが開始します。メインで取り扱っている商材が動きゲートを開け、ドラゴンが舞います。

また、YouTubeチャンネルを取り扱っていらっしゃる為、YoTubeAからAPIを取得し最新動画をYoTubeにアップロードすると自動的にトップページに表示されます。

  • 完全CSSアニメーション

    全てCSSで制御しているのでレスポンシブに強い作りになっています。機械の種類が変わっても、HTMLやCSSを修正するばいいので変更なども容易。

    機械の画像を写真を加工してイラスト風に、ドラゴンはIllustratorでパーツごと制作し制御しています。

  • ランダムに表示される農機具

    下層ページのヘッダーにはJavaScriptを使ってランダムに画像と背景の色を表示させています。

  • APIを取得し最新動画を自動表示

    YoTubeAAPIを取得し最新動画をYoTubeにアップロードすると自動的にトップページに表示されます。再生リストを外部から読み込む手段の方が手軽ですが、動画タイトルやキャプションなどの情報を取得するにはAPIで取得するしか手段はありません。

  • SEOに強く!

    以前は同名の企業より検索結果が下に表示されていましたが、HTMLをSEOを意識した組み方にし、メタ情報を書き込んだところ見事検索の一番上に表示されるようになりました。