デバイスを縦にしてください。
当サイトは縦画面での閲覧を推奨しています。

Please rotate your device.
This site is best viewed in portrait mode.

Tonami Komuro - Web Creator Portfolio

portfolio tonami komuro

portfolio tonami komuro

project

yoga in city festival

2024

[ information ]

Genre:
Website
Responsibility:
Design
Tools:
Figma, Photoshop, Firefly

[ description ]

- English -

Overview

This is a design proposal for an event website with the theme of "Yoga × Outdoor," created as practice for a fictional project. Designed as a landing page targeting women in their 20s and 30s, with the primary goal of ticket sales.

Overall Design Points

I built the visual world around images associated with the main theme of "yoga." Yoga evokes images of "flexibility," "relaxation," and "spirituality." The "irregular rounded shapes" used throughout the site represent flexibility and the elusive spiritual atmosphere.

Additionally, since "outdoor" is also a major theme, I expressed the sense of freedom associated with outdoor activities through generous use of whitespace, and adopted deep green as the main color to evoke nature.

Hero Section Points

I created the first view with the understanding that it serves as the section that determines the overall world view of the site and plays the crucial role of a summary for the landing page.

For the world view, with the theme of "Yoga × Outdoor," I used large images that convey a sense of freedom and relaxation, arranging elements with careful attention to whitespace to avoid creating a cramped impression. Since this is an urban event, I also incorporated city icons as part of the catchphrase to represent the "city" as a sub-theme.

From a summary perspective, I expressed through images and text that visitors can "enjoy not only yoga but also food and music." Since this is a landing page aimed at ticket purchases, I also included a call-to-action (CTA) button that emphasizes early-bird pricing.

Color Scheme

Based on the themes of "yoga," "outdoor," and the target demographic of "women in their 20s and 30s," I centered the palette around deep green and beige as natural, calming colors.

Since yoga has both relaxing effects and the ability to unlock dormant energy in the body, I chose orange as an accent color. I also added light blue, representing the sky color associated with freedom and nature.

By expanding the color palette, I incorporated the lively image of a "festival" while ensuring that color choices aligned with the main theme, being careful not to become too busy and compromise the "relaxation" image.

Notes

Some images were created using AI image generation tools.
This is a practice project for a fictional event and does not represent an actual event.

- Japanese -

概要

架空の案件として、練習のために制作したヨガ×アウトドアをテーマにしたイベントサイトのデザイン案です。 20~30代女性をメインターゲットに設定し、チケット購入を目的としたランディングページとして制作しました。

デザイン全体のポイント

メインテーマである「ヨガ」から連想されるイメージで世界観を構築しました。 ヨガには「柔軟性」「リラックス」「スピリチュアル」というイメージがあります。サイト全体で使用している「不規則な丸みのある図形」は、柔軟性や捉えどころのないスピリチュアルな雰囲気を表現しています。

加えて「アウトドア」も大きなテーマなので、アウトドアの解放感を余白の広さで表現し、自然をイメージした深緑をメインカラーとして採用しました。

ファーストビューのポイント

ファーストビューは、サイト全体の世界観を決定し、LPにおけるサマリの役割を果たす重要なセクションという認識のもと、制作しました。

世界観については「ヨガ×アウトドア」をテーマに、解放感とリラックスを感じられる画像を大きく使用し、窮屈な印象を与えないよう余白を意識して要素を配置しました。また、都会でのイベントというサブテーマから、キャッチコピーの一部として街を表すアイコンを使用しています。

サマリの観点では、「ヨガだけでなく、食や音楽も楽しめる」ことを画像とテキストで表現しました。 チケット購入が目的のLPなので、早割の価格訴求を含むCVボタンも設置しています。

配色について

「ヨガ」「アウトドア」「20~30代女性」というターゲット設定から、自然で落ち着きのある深緑とベージュを主軸にしました。

ヨガはリラックス効果とともに、身体に眠る力やエネルギーを発揮する効果もあるため、アクセントカラーとしてオレンジを選択しました。 さらに、解放感や自然からイメージされる空の色(水色)を加えています。

カラーを増やすことで「フェス」のにぎやかなイメージも組み込みつつ、メインテーマに沿った色選択により、うるさくなりすぎて「リラックス」のイメージが損なわれないよう配慮しました。

備考

一部の画像には画像生成AIを使用しております。

練習用の架空の案件であり、実在するイベントではありません。

Yoga In City Festival website - Desktop designs arranged in dynamic diagonal layout
Desktop size design

[ images ]

  • Yoga In City Festival website - Mobile design variations displayed side by side
    Mobile size design
  • The hero section of Yoga In City Festival LP
    Hero section of the website
  • Yoga In City Festival Tickets section
    In the Tickets section, "sold out" labels are displayed when tickets are unavailable
  • Yoga In City Festival FAQ section
    In the FAQ section, cards show "Q" on the front and reveal "A" on the back when clicked
  • Yoga In City Festival responsive preview - Tablet and smartphone mockups
    Image displayed on tablet and smartphone
©2025 Created by Tonami Komuro