Webサイト—架空プロオーケストラホームページ

架空のプロオーケストラ"Whirl Symphony Orchestra"のホームページです。
サイトを訪問する→Whirl Symphony Orchestra

PCレイアウト

スマートフォンレイアウト

サイトの対象とイメージ

クラシック音楽を愛好する若者（20-30代）を対象としています。団体の構成メンバーおよび団体の歴史も若いという設定であり、情熱的・エネルギッシュなイメージと、いまどきの洗練されたイメージが団体のイメージとして定着するようデザインしました。職業訓練校の個人制作課題として制作した作品です。

制作範囲

構想からワイヤーフレーム作成、ロゴ作成（Illustrator）、カンプ作成および画像加工・書き出し（Photoshop）、コーディング（HTML5/CSS3、jQuery）

制作時間

• 題材および作品のコンセプト決定からワイヤーフレーム作成：合計約12時間
• ロゴ制作：約1時間30分
• カンプ作成および画像書き出し：合計約18時間
• コーディング：合計約32時間

工夫点・アピールポイント

• 架空の団体であるため、その団体のコンセプトから構想を練り、団体名（Whirl=渦）とイメージに合致したロゴ（団体の頭文字をとったWSOと渦のイメージの掛け合わせ）を作成しました。
• シングルカラム、フラットデザインを採用し、実在する既存のプロオーケストラのホームページよりも今風なデザインにしました。
• 配色は赤・黒・グレーに限定。情熱的なイメージの赤を使用し、また黒との組み合わせでインパクトを出しました。一方、装飾は極力減らすことで、余計なものを排除したスタイリッシュなデザインとなるよう心掛けました。
• 若い層がスマートフォンで閲覧することを想定し、モバイルファーストでデザイン・コーディングしたレスポンシブ対応のWebサイトです。
• 各ページのタイトル部分にSVG画像とアニメーションを採用し、滑らかな曲線とアニメーションで目を引くようにしました。