About the Project
Topo Athletic is an athletic footwear company with a mission to develop sneakers that honor the shape and bio-mechanics of the human foot. As the principal designer for Intente, I worked with the Topo Athletic team to redesign and improve the user experience of their existing e-commerce website and to craft an informative journey that provides their customers with a delightful shopping experience from beginning to end.
• Audit of Existing Site
• Restructured IA and Site Navigation
• Wireframes
• Prototypes
• Final Responsive Website Designs
• UI Style Guide
• Creative Content (image selection, banners)
• Production Artwork / Design Handoff
• Sketch
• Invision
• Photoshop
Flexible Home Page & Modular Components
Designed with flexibility in mind, the new home page offers multiple ways for users to delve deeper into the brand’s products, culture, and technological approach. The use of modular components was introduced, that can be easily updated based upon season, new product introductions, promotions, and brand/lifestyle content.
A Navigation Encouraging Discovery
The new site offers users various paths to both shopping & lifestyle content. In addition to distinct product lines for both men and women, Topo’s products are also categorized according to activity. We wanted to offer a clear, visually compelling way for users to land on the robust activity landing pages that were designed to present these unique collections and product features. The Explore section encourages users to delve deeper in the brand’s culture and history, community outreach, technological approach, and more.
Product List Pages With Room to Grow
Elegant, spacious, and image-driven product list pages were designed to take advantage of the fact that Topo has a relatively small number of total products. A simple and clean interface was also introduced that allows users to narrow down products on the basis of category and attributes. Swatches are provided for each item to allow the exploration of different color ways while remaining on the page.
Content Rich Product Pages with Comparative Specs and Features
Topo’s sneakers are specifically engineered to accommodate the needs of their runners with respect to intended activity and fit, and have many unique features in regards to the technology of their materials. We felt it was important to design a clear system for conveying this information to the user on the product page and thus incorporated Topo’s existing visual icons for core features, lifestyle photographs of the product in use, and relative fit measurements. Other helpful shopping elements were also incorporated such as size guides, a dealer locator, popovers pertaining to specs, and more.
Activity Landing Pages - More Than One Way to Shop
Topo’s footwear is specifically designed for three core activities: Road Running, Trail Running, and Gym Training. Expansive activity landing pages were designed to offer a robust experience for users who desire to explore what makes each activity collection unique, offering in-depth product information, strong imagery, and comparative product information and specs.
Engaging Lifestyle Content
The entire “Explore” section of the site was designed to integrate the Topo brand story and lifestyle content as part overall shopping experience. The Topo ambassadors and blog features were included as part of that effort.
Visit topoathletic.com
Related Projects
