1.
To Make Things Clear
Coastal Trail Challenge
2023 @ Cheddar Media
Objectives
Annual hiking and trail-running event website serving as a central hub for event details, route introductions, and registration—targeting both leisure explorers and trail enthusiasts.
Challenge & Approach
Heavy use of varied images and text-based information required a clean, structured wireframe. Ideal user flow: Explore (Home) → Learn (Event Details) → Act (Apply).
Solution
Built clear information architecture with two user paths (leisure or race). Used interactive elements to turn text into visuals, keeping the layout engaging and uncluttered. Tabs, guiding buttons, and CTAs ensure easy navigation and smooth registration.
Results
Attracted 1,200+ individual participants in 2023.
#UXUI
#Webdesign
#EventWebsite
Note: The original project was created in Adobe XD in 2023, with later updates made by the client’s own developers. This version was renewed in Figma in 2025, so it may differ from the current live version.









The Problem-solving Process:
To Make Things Clear
Wireframe
Desktop

Laptop

Tablet

Mobile

To Make Journey More Efficient
Information Architecture

Client's Suggestions
Rules
Lesiure
Racing
Routes
Lesiure
Racing
Price
Lesiure
Racing
My Suggestions
Racing
Rules
Price
Routes
Leisure
Rules
Price
Routes
To Keep it Engaging and Clutterless
Interactive Features

To Maximise Flexibility & Usability
Tabs, Guiding Buttons, and CTAs




1.
To Make Things Clear
Coastal Trail Challenge
2023 @ Cheddar Media
Objectives
Annual hiking and trail-running event website serving as a central hub for event details, route introductions, and registration—targeting both leisure explorers and trail enthusiasts.
Challenge & Approach
Heavy use of varied images and text-based information required a clean, structured wireframe. Ideal user flow: Explore (Home) → Learn (Event Details) → Act (Apply).
Solution
Built clear information architecture with two user paths (leisure or race). Used interactive elements to turn text into visuals, keeping the layout engaging and uncluttered. Tabs, guiding buttons, and CTAs ensure easy navigation and smooth registration.
Results
Attracted 1,200+ individual participants in 2023.
#UXUI
#Webdesign
#EventWebsite
Note: The original project was created in Adobe XD in 2023, with later updates made by the client’s own developers. This version was renewed in Figma in 2025, so it may differ from the current live version.









The Problem-solving Process:
To Make Things Clear
Wireframe
Desktop

Laptop

Tablet

Mobile

To Make Journey More Efficient
Information Architecture

Client's Suggestions
Rules
Lesiure
Racing
Routes
Lesiure
Racing
Price
Lesiure
Racing
My Suggestions
Racing
Rules
Price
Routes
Leisure
Rules
Price
Routes
To Keep it Engaging and Clutterless
Interactive Features

To Maximise Flexibility & Usability
Tabs, Guiding Buttons, and CTAs




1.
To Make Things Clear
Coastal Trail Challenge
2023 @ Cheddar Media
Objectives
Annual hiking and trail-running event website serving as a central hub for event details, route introductions, and registration—targeting both leisure explorers and trail enthusiasts.
Challenge & Approach
Heavy use of varied images and text-based information required a clean, structured wireframe. Ideal user flow: Explore (Home) → Learn (Event Details) → Act (Apply).
Solution
Built clear information architecture with two user paths (leisure or race). Used interactive elements to turn text into visuals, keeping the layout engaging and uncluttered. Tabs, guiding buttons, and CTAs ensure easy navigation and smooth registration.
Results
Attracted 1,200+ individual participants in 2023.
#UXUI
#Webdesign
#EventWebsite
Note: The original project was created in Adobe XD in 2023, with later updates made by the client’s own developers. This version was renewed in Figma in 2025, so it may differ from the current live version.









The Problem-solving Process:
To Make Things Clear
Wireframe
Desktop

Laptop

Tablet

Mobile

To Make Journey More Efficient
Information Architecture

Client's Suggestions
Rules
Lesiure
Racing
Routes
Lesiure
Racing
Price
Lesiure
Racing
My Suggestions
Racing
Rules
Price
Routes
Leisure
Rules
Price
Routes
To Keep it Engaging and Clutterless
Interactive Features

To Maximise Flexibility & Usability
Tabs, Guiding Buttons, and CTAs




1.
To Make Things Clear
Coastal Trail Challenge
2023 @ Cheddar Media
Objectives
Annual hiking and trail-running event website serving as a central hub for event details, route introductions, and registration—targeting both leisure explorers and trail enthusiasts.
Challenge & Approach
Heavy use of varied images and text-based information required a clean, structured wireframe. Ideal user flow: Explore (Home) → Learn (Event Details) → Act (Apply).
Solution
Built clear information architecture with two user paths (leisure or race). Used interactive elements to turn text into visuals, keeping the layout engaging and uncluttered. Tabs, guiding buttons, and CTAs ensure easy navigation and smooth registration.
Results
Attracted 1,200+ individual participants in 2023.
#UXUI
#Webdesign
#EventWebsite
Note: The original project was created in Adobe XD in 2023, with later updates made by the client’s own developers. This version was renewed in Figma in 2025, so it may differ from the current live version.









The Problem-solving Process:
To Make Things Clear
Wireframe
Desktop

Laptop

Tablet

Mobile

To Make Journey More Efficient
Information Architecture

Client's Suggestions
Rules
Lesiure
Racing
Routes
Lesiure
Racing
Price
Lesiure
Racing
My Suggestions
Racing
Rules
Price
Routes
Leisure
Rules
Price
Routes
To Keep it Engaging and Clutterless
Interactive Features

To Maximise Flexibility & Usability
Tabs, Guiding Buttons, and CTAs




1.
To Make Things Clear
Coastal Trail Challenge
2023 @ Cheddar Media
Objectives
Annual hiking and trail-running event website serving as a central hub for event details, route introductions, and registration—targeting both leisure explorers and trail enthusiasts.
Challenge & Approach
Heavy use of varied images and text-based information required a clean, structured wireframe. Ideal user flow: Explore (Home) → Learn (Event Details) → Act (Apply).
Solution
Built clear information architecture with two user paths (leisure or race). Used interactive elements to turn text into visuals, keeping the layout engaging and uncluttered. Tabs, guiding buttons, and CTAs ensure easy navigation and smooth registration.
Results
Attracted 1,200+ individual participants in 2023.
#UXUI
#Webdesign
#EventWebsite
Note: The original project was created in Adobe XD in 2023, with later updates made by the client’s own developers. This version was renewed in Figma in 2025, so it may differ from the current live version.









The Problem-solving Process:
To Make Things Clear
Wireframe
Desktop

Laptop

Tablet

Mobile

To Make Journey More Efficient
Information Architecture

Client's Suggestions
Rules
Lesiure
Racing
Routes
Lesiure
Racing
Price
Lesiure
Racing
My Suggestions
Racing
Rules
Price
Routes
Leisure
Rules
Price
Routes
To Keep it Engaging and Clutterless
Interactive Features

To Maximise Flexibility & Usability
Tabs, Guiding Buttons, and CTAs




1.
To Make Things Clear
Coastal Trail Challenge
2023 @ Cheddar Media
Objectives
Annual hiking and trail-running event website serving as a central hub for event details, route introductions, and registration—targeting both leisure explorers and trail enthusiasts.
Challenge & Approach
Heavy use of varied images and text-based information required a clean, structured wireframe. Ideal user flow: Explore (Home) → Learn (Event Details) → Act (Apply).
Solution
Built clear information architecture with two user paths (leisure or race). Used interactive elements to turn text into visuals, keeping the layout engaging and uncluttered. Tabs, guiding buttons, and CTAs ensure easy navigation and smooth registration.
Results
Attracted 1,200+ individual participants in 2023.
#UXUI
#Webdesign
#EventWebsite
Note: The original project was created in Adobe XD in 2023, with later updates made by the client’s own developers. This version was renewed in Figma in 2025, so it may differ from the current live version.









The Problem-solving Process:
To Make Things Clear
Wireframe
Desktop

Laptop

Tablet

Mobile

To Make Journey More Efficient
Information Architecture

Client's Suggestions
Rules
Lesiure
Racing
Routes
Lesiure
Racing
Price
Lesiure
Racing
My Suggestions
Racing
Rules
Price
Routes
Leisure
Rules
Price
Routes
To Keep it Engaging and Clutterless
Interactive Features

To Maximise Flexibility & Usability
Tabs, Guiding Buttons, and CTAs




