AUGUST 2024

担当範囲
Web Design / Web Development

制作期間
企画・情報設計：1週間
デザイン：1週間
コーディング：3週間
コンテンツを追加する：10日

使用したテックスタック
HTML / CSS / JavaScript

概要

2023年から、プログラミングを手段としてモーションビジュアル作品を多数制作してきました。これらの作品をまとめて「収納」するのに最適なのは個人サイトだと考え、自分自身を形にするような感覚で、自分のWebサイトをデザイン・制作しました。

ターゲット

他のデザイナーやクリエイティブコーディングに興味のある人々。

目的

• これまでとこれからのプログラミング作品を収納すること。
• 他の人にも自分の作品を体験してもらうこと。
• 自分自身の雰囲気を伝えること。

情報設計

「他人の目はあなたに長く留まらない」ことを実感し、サイト全体の構造をフラットにしました。サイトは1階層のみで、すべての作品を並列に配置し、クリックすると私が作成したプログラムが直接開くようになっています。私の構想としては、フォルダのような構造の他のサイトに比べて、私のサイトは一枚のポスターのような存在です。

デザイン

これは私が自分自身を存分に表現できる場面だと考え、好きなフォントやビジュアル要素を取り入れました。作品が「プログラム」であることを示すために、CDやカートリッジといったビジュアル要素を採用しています。各作品の個性を強調するため、それぞれのカードのデザインも一つひとつ制作しました。また、カードの種類に応じて異なるインタラクションアニメーションを取り入れています。今後作品を追加する際にも、その作品に合わせて新しいカードをデザインできます。