NAGANO
KOTOHA

ドライブの時に流す音楽はいつもより沁みる。

Along the coast

初音ミクが海岸線を音楽を聴きながらドライブするアニメーション

Date : 2022.07

Along the coastの画面イメージ

Web Animation | アニメーション | チーム制作

レイヤーを重ねて動きを実現させたアニメーション

レイヤーを重ね、アニメーションを設定し、web上で表現致しました。
TextAlive APIのライブラリを使用しマジカルミライ2022楽曲コンテストで採用された6曲を再生でき、音楽とともに歌詞が道路に表示され一節ごとに切り替わるようになっております。
ドライブ時の音楽に浸る感覚に満たされながら楽曲を楽しんでもらえる作品です。車のカーナビ部をクリックすると楽曲が切り替わるWebアニメーションです。

コンセプト
アニメーションをWEB上で再現しよう
使用技術・ツール
HTML・CSS(SASS)・JavaScript(TextAlive API)
Photoshop・CLIPSTUDIO
制作
チーム制作【全3名】

作品動画

サビでミクが変化

曲のサビになるとミクがマジカルミライ10thバージョンのミクに変化します。

初音ミク「マジカルミライ」10th Anniversary 企画展にて入選作品紹介していただきました。

マジカルミライ2022大阪会場と東京会場の2会場の企画展ステージで初音ミク「マジカルミライ」プログラミングコンテスト入選10作品を現地とYouTubeライブでご紹介していただきました。

マジカルミライプログラミングコンテストURL
https://magicalmirai.com/10th/procon/entry.html
受賞
2022.09 初音ミク「マジカルミライ」プログラミングコンテスト 上位8選 入選
2022.10 HAL大阪 マジカルミライ学内コンテスト 銀賞 受賞
作品:れっつごーつみきくん

Web Application | 教育 | チーム制作

れっつごーつみきくん

2023.03

初音ミクが海岸線を音楽を聴きながらドライブするアニメーション

作品:ハル幼稚園

Web Site | Web Design | 個人制作

ハル幼稚園

2023.10

SI遊びを取り入れた次世代の幼稚園のサイト

作品:KENT HOUSE

Web Site | Web Design | 個人制作

KENT HOUSE

2024.01

大阪に店舗を持つケーキ屋さんのプロモーションサイト

作品:Tea Museum

Web Site | Web Design | 個人制作

Tea Museum

2023.06

マイナーな紅茶を販売するECサイト

作品:beauty art

Web Site | Web Design | 個人制作

beauty art

2022.03

日々の疲れた体を癒すエステサロンサイト