おすすめ
WEBサイト

実案件制作HP　「Fusion of Gambit」（立命館大学ダブルダッチサークル）

Posted on by Tomoki Amahisa

■概要

立命館大学ダブルダッチサークル「Fusion of Gambit」の新入生宣伝用のホームページの作成

■リンク

https://fusionofgambit.com

■ターゲット

18～22歳の大学生

■使用ツール

項目ツール
企画、ワイヤーフレーム、デザインカンプfigma
撮影
写真加工、動画編集、ロゴ作成Illustrator / Photoshop / Premiere Pro / After Effects
コーディングHTML / CSS / JavaScript / Gsap

■サイト目的

  1. サークルの認知とダブルダッチの面白さの認知
  2. 新入生の体験誘導、サークル加入
  3. 所属しているメンバーの帰属意識

■デザイン

デザインテーマ

  • ストリート
  • グルーヴ
  • コネクション

ダブルダッチがストリート、音楽、ファッションといったサブカル的要素を含んでいる。
サークルという集団から、楽しさ、仲間といった要素を入れる。

アウトプット

  • アニメーションを多用し、楽しく見えるように
  • 再度の高い色を使う、画像をせてっかーっぽくすることで、ストリート感を
  • 画像、動画をたくさん使うことでサークルの楽しそうさを
  • ほバーアニメーションはスケールをいじることタイトルのオーディオバーで、リズム感を表現

ユーザビリティ配慮

  • CTAボタンを各ページに設置
  • ページ遷移の部分を大胆に見せ、わかりやすく
  • ナビゲーション、CTAを２重に見せない
  • ホバーをわかりやすく

■制作期間

項目期間
企画、ワイヤーフレーム、デザインカンプ1週間
撮影3日
写真加工、動画編集、ロゴ作成1週間
コーディング10日
レスポンシブル、微修正、ワードプレス導入進行中
WEBサイト

自主制作LP　「routine drama」（香水ブランド）

Posted on by Tomoki Amahisa

■概要

立命館大学ダブルダッチサークル「Fusion of Gambit」の新入生宣伝用のホームページの作成

■リンク

https://routine-drama.amahisa-tomoki.com

■ターゲット

10代後半～30代前半の男女

■使用ツール

項目ツール
企画、ワイヤーフレーム、デザインカンプfigma
写真加工、動画編集Illustrator / Photoshop / After Effects
コーディングHTML / CSS / JavaScript

■サイト目的

  1. 商品の認知とプロモーション
  2. 商品の購入

■デザイン

デザインテーマ

  • 時間経過
  • ユニセックス
  • シンプル

「日常は香りでドラマになる」をコンセプトにした、時間ごとにコンセプト分けした3種類のフレグランスを販売する香水の架空ブランド。おしゃれ志向の強い若者をターゲットにした、都会的でユニセックスな印象を与えたかった。

アウトプット

  • 余白を広く設定し、余計なデザインを加えないことで、ギャラリーチックな洗練された印象付けをする
  • 基本カラーを白と黒。アクセントをビビットカラー＋グラデーションにすることでユニセックスでドラマチックな時間経過を表現
  • 時間経過のコンセプトを影の変化により表現（hero部分）

ユーザビリティ配慮

  • CTAボタンを商品欄、サービス欄の二つに設置
  • ホバーアニメーションにより、ページ遷移をわかりやすく
  • レスポンシブルの導入

■制作期間

項目期間
企画、ワイヤーフレーム、デザインカンプ3日
写真加工、動画編集2日
コーディングレスポンシブル、微修正2日
動画作品

自主制作PV　「Success!」

Posted on by Tomoki Amahisa

■デザイン

学校課題にて、文字を使ったMV制作を行いました。歌詞のイメージから夢を追いかける少女をモチーフとしました。また見ている人を飽きさせないよう、歌詞わりごとにトランジションを用い動きをつける工夫と、転調部分での印象を変え、物語性を加えました。

■作成ツール

Adobe After Effects

■制作期間

企画、制作　4日