Concept Website "Harotama"
Building a concept website from the ground up through a full Information Architecture process.
Information Architecture
UX/UI Design
Harotama is a concept website for a new hybrid outdoor fitness event.
Created for an Information Architecture course, this project focused on defining the structure and early design for Harotama - a hybrid event blending functional fitness, endurance racing, and obstacle challenges.
This project was completed collaboratively, with all team members contributing equally across research, analysis, and design deliverables. Together we worked on:
Business goals & competitive analysis
User research, personas, scenarios, empathy maps, journey maps
Problem statements, navigation schemes, sitemaps, taxonomies
Interactive wireframes
In addition to shared tasks, I took full responsibility for:
User Flow: mapped the complete process from entry to interaction, ensuring clarity and usability
I did not directly contribute to:
Metadata
Card Sorting Evidence
Mind Map
Our goal was to design a site where athletes, spectators, and vendors can explore events, register, and get involved without friction.
The design aimed to simplify navigation for both athletes and spectators, reduce friction in discovering upcoming races, and streamline ticket purchasing and registration. By structuring content more intentionally and highlighting personal training options throughout the site, the goal was to guide users smoothly from event discovery to checkout with minimal effort.
Our information architecture work focused on organizing content, defining structure, and shaping a clear path from exploration to action.
To build a logical and user‑friendly foundation for the site, we developed a full IA system that included mind mapping, organizational schemes, a sitemap, card‑sorting insights, metadata and taxonomy definitions, user flows, and early mockups. This process helped us clarify how information should be grouped, labeled, and navigated to support a seamless event experience.
We created interactive wireframes to map out the site’s key pages and user flow.
After sketching our assigned pages, we built digital wireframes to shape the full site experience. I designed five key pages - including the homepage, events, and training, while teammates contributed the remaining sections, including login and account creation. For the interactive prototype, I kept the shared navigation but only linked the pages I designed, ensuring the prototype felt cohesive while highlighting my individual contributions.
This project reinforced how essential a structured, research-driven approach is to creating meaningful, user-centered design.
Working through each IA method showed me the value of slowing down and building a strong foundation before moving into screens. These steps made the final structure clearer, more intentional, and better aligned with both user needs and business goals. If given more time, I would extend this work into a high‑fidelity prototype to test the experience further and demonstrate how the information architecture translates into a polished, interactive design.
